@alipay/ams-checkout 0.0.1751254427-dev.1 → 0.0.1751254427-dev.2
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 +8 -7
- package/esm/config/index.js +8 -7
- package/esm/constant/index.d.ts +14 -0
- package/esm/constant/index.js +16 -0
- package/esm/core/component/index.d.ts +4 -1
- package/esm/core/component/index.js +105 -2
- 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 +44 -8
- package/esm/plugin/paypal/index.js +5 -2
- package/esm/types/index.d.ts +4 -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
|
@@ -4,11 +4,12 @@ export declare const v2AppMarmotMap: Record<string, string>;
|
|
|
4
4
|
export declare const sdkVersion: string;
|
|
5
5
|
/**
|
|
6
6
|
* @description: 目前应用层分为v1和v2,会存在两个应用版本号不是同步发布的情况。所以需要把默认的应用版本号配置抽离出来。
|
|
7
|
+
* TODO 这里考虑直接换成packagejson.version
|
|
7
8
|
*/
|
|
8
|
-
export declare const AMSCheckoutAppVersion = "1.
|
|
9
|
-
export declare const AMSAutoDebitAppVersion = "1.
|
|
10
|
-
export declare const AMSEasyPayAppVersion = "1.
|
|
11
|
-
export declare const AMSCashierPaymentAppVersion = "1.
|
|
12
|
-
export declare const AMSVaultingAppVersion = "1.
|
|
13
|
-
export declare const AMSPaymentElementAppVersion = "1.
|
|
14
|
-
export declare const ADDRESSElementAppVersion = "1.
|
|
9
|
+
export declare const AMSCheckoutAppVersion = "1.43.1";
|
|
10
|
+
export declare const AMSAutoDebitAppVersion = "1.43.1";
|
|
11
|
+
export declare const AMSEasyPayAppVersion = "1.43.1";
|
|
12
|
+
export declare const AMSCashierPaymentAppVersion = "1.43.1";
|
|
13
|
+
export declare const AMSVaultingAppVersion = "1.43.1";
|
|
14
|
+
export declare const AMSPaymentElementAppVersion = "1.43.1";
|
|
15
|
+
export declare const ADDRESSElementAppVersion = "1.43.1";
|
package/esm/config/index.js
CHANGED
|
@@ -34,11 +34,12 @@ export var sdkVersion = json.version;
|
|
|
34
34
|
|
|
35
35
|
/**
|
|
36
36
|
* @description: 目前应用层分为v1和v2,会存在两个应用版本号不是同步发布的情况。所以需要把默认的应用版本号配置抽离出来。
|
|
37
|
+
* TODO 这里考虑直接换成packagejson.version
|
|
37
38
|
*/
|
|
38
|
-
export var AMSCheckoutAppVersion = '1.
|
|
39
|
-
export var AMSAutoDebitAppVersion = '1.
|
|
40
|
-
export var AMSEasyPayAppVersion = '1.
|
|
41
|
-
export var AMSCashierPaymentAppVersion = '1.
|
|
42
|
-
export var AMSVaultingAppVersion = '1.
|
|
43
|
-
export var AMSPaymentElementAppVersion = '1.
|
|
44
|
-
export var ADDRESSElementAppVersion = '1.
|
|
39
|
+
export var AMSCheckoutAppVersion = '1.43.1'; // 兜底版本号
|
|
40
|
+
export var AMSAutoDebitAppVersion = '1.43.1'; // 代扣
|
|
41
|
+
export var AMSEasyPayAppVersion = '1.43.1'; // easypay
|
|
42
|
+
export var AMSCashierPaymentAppVersion = '1.43.1'; // 收银台(卡、apm)
|
|
43
|
+
export var AMSVaultingAppVersion = '1.43.1'; // 绑卡
|
|
44
|
+
export var AMSPaymentElementAppVersion = '1.43.1'; // payment element
|
|
45
|
+
export var ADDRESSElementAppVersion = '1.43.1'; // address element
|
package/esm/constant/index.d.ts
CHANGED
|
@@ -66,6 +66,10 @@ export declare const ERRORMESSAGE: {
|
|
|
66
66
|
code: eventCodeEnum;
|
|
67
67
|
message: string;
|
|
68
68
|
};
|
|
69
|
+
NETWORK_REQUEST_ERROR: {
|
|
70
|
+
code: eventCodeEnum;
|
|
71
|
+
message: string;
|
|
72
|
+
};
|
|
69
73
|
};
|
|
70
74
|
SDK_LAUNCH_PAYMENT_APP_ERROR: {
|
|
71
75
|
code: eventCodeEnum;
|
|
@@ -245,6 +249,16 @@ export declare const EVENT: {
|
|
|
245
249
|
messageForward: {
|
|
246
250
|
name: string;
|
|
247
251
|
};
|
|
252
|
+
validateFieldsResult: {
|
|
253
|
+
name: string;
|
|
254
|
+
forwardName: string;
|
|
255
|
+
uniqueKey: string;
|
|
256
|
+
};
|
|
257
|
+
};
|
|
258
|
+
export declare const SENDEVENT: {
|
|
259
|
+
validateFields: {
|
|
260
|
+
name: string;
|
|
261
|
+
};
|
|
248
262
|
};
|
|
249
263
|
export declare const COMPONENT_CONTAINER_ID = "ams-component-container";
|
|
250
264
|
export declare const COMPONENT_SECTION_ID = "ams-component-section";
|
package/esm/constant/index.js
CHANGED
|
@@ -65,6 +65,10 @@ export var ERRORMESSAGE = {
|
|
|
65
65
|
LOAD_APP_TIMEOUT: {
|
|
66
66
|
code: eventCodeEnum.SDK_CREATECOMPONENT_ERROR,
|
|
67
67
|
message: 'Load resource timeout'
|
|
68
|
+
},
|
|
69
|
+
NETWORK_REQUEST_ERROR: {
|
|
70
|
+
code: eventCodeEnum.SDK_CREATECOMPONENT_ERROR,
|
|
71
|
+
message: 'Network request error'
|
|
68
72
|
}
|
|
69
73
|
},
|
|
70
74
|
SDK_LAUNCH_PAYMENT_APP_ERROR: {
|
|
@@ -246,6 +250,18 @@ export var EVENT = {
|
|
|
246
250
|
*/
|
|
247
251
|
messageForward: {
|
|
248
252
|
name: 'onMessageForward'
|
|
253
|
+
},
|
|
254
|
+
validateFieldsResult: {
|
|
255
|
+
name: 'validateFieldsResult',
|
|
256
|
+
forwardName: 'validateFieldsResultForward',
|
|
257
|
+
uniqueKey: 'uservalidateFieldsResult'
|
|
258
|
+
}
|
|
259
|
+
};
|
|
260
|
+
|
|
261
|
+
// 2025.09新增,非全量SDK发送事件码
|
|
262
|
+
export var SENDEVENT = {
|
|
263
|
+
validateFields: {
|
|
264
|
+
name: 'validateFields'
|
|
249
265
|
}
|
|
250
266
|
};
|
|
251
267
|
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];
|
|
@@ -15,6 +15,7 @@ export declare class AMSComponent extends CoreInstance {
|
|
|
15
15
|
channelType: ComponentSignEnum[];
|
|
16
16
|
productSceneVersion: string;
|
|
17
17
|
timer: any;
|
|
18
|
+
private _validateResolveMap;
|
|
18
19
|
constructor(options: IAMSComponentOptions);
|
|
19
20
|
private parameterInitAndCheck;
|
|
20
21
|
private pluginAppendIframe;
|
|
@@ -52,4 +53,6 @@ export declare class AMSComponent extends CoreInstance {
|
|
|
52
53
|
* @param data - Transfer information in the submission interface according to your requirements (optional)
|
|
53
54
|
*/
|
|
54
55
|
submit(data?: Isubmit): Promise<unknown>;
|
|
56
|
+
protected _validateFields(): Promise<ValidationResult>;
|
|
57
|
+
protected _sendMessageToAPP(eventContext: EventPayloadContext): void;
|
|
55
58
|
}
|
|
@@ -35,7 +35,8 @@ 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
|
+
import PreloadHelper from "../../foundation/utils/preload_helper";
|
|
39
40
|
import { ApplePayBusSubscriber } from "../../plugin/applepay";
|
|
40
41
|
import ComponentApp from "../../plugin/component";
|
|
41
42
|
import { ExtendPlugin } from "../../plugin/const";
|
|
@@ -50,7 +51,6 @@ import { SecurityBusSubscriber } from "../bus/ability/security";
|
|
|
50
51
|
import { TrackerBusSubscriber } from "../bus/ability/tracker";
|
|
51
52
|
import CoreInstance from "../instance/index";
|
|
52
53
|
import { loadChannelPneumaticControl } from "./appPreloadProcessing";
|
|
53
|
-
import PreloadHelper from "../../foundation/utils/preload_helper";
|
|
54
54
|
export var getComponentSign = function getComponentSign(params) {
|
|
55
55
|
var _params$paymentSessio = params.paymentSessionConfig,
|
|
56
56
|
_params$paymentSessio2 = _params$paymentSessio === void 0 ? {} : _params$paymentSessio,
|
|
@@ -140,6 +140,7 @@ export var AMSComponent = /*#__PURE__*/function (_CoreInstance) {
|
|
|
140
140
|
_defineProperty(_assertThisInitialized(_this2), "channelType", void 0);
|
|
141
141
|
_defineProperty(_assertThisInitialized(_this2), "productSceneVersion", void 0);
|
|
142
142
|
_defineProperty(_assertThisInitialized(_this2), "timer", void 0);
|
|
143
|
+
_defineProperty(_assertThisInitialized(_this2), "_validateResolveMap", new Map());
|
|
143
144
|
var ComponentPlugin = new ComponentApp({
|
|
144
145
|
appVersion: options.appVersion
|
|
145
146
|
});
|
|
@@ -526,6 +527,108 @@ export var AMSComponent = /*#__PURE__*/function (_CoreInstance) {
|
|
|
526
527
|
}
|
|
527
528
|
});
|
|
528
529
|
}
|
|
530
|
+
|
|
531
|
+
// 预留给AMSVaulting复用
|
|
532
|
+
}, {
|
|
533
|
+
key: "_validateFields",
|
|
534
|
+
value: function _validateFields() {
|
|
535
|
+
var _this9 = this;
|
|
536
|
+
return new Promise(function (resolve) {
|
|
537
|
+
// 收银台应用渲染表单后,才允许发送校验消息,三端约定一致
|
|
538
|
+
if (!_this9._componentApp.shouldValidateFields()) {
|
|
539
|
+
resolve({
|
|
540
|
+
isValid: false
|
|
541
|
+
});
|
|
542
|
+
_this9.logger.logInfo({
|
|
543
|
+
title: 'sdk_event_validateFields'
|
|
544
|
+
}, {
|
|
545
|
+
processResult: 'notRenderComponent'
|
|
546
|
+
});
|
|
547
|
+
return;
|
|
548
|
+
}
|
|
549
|
+
var timeoutId;
|
|
550
|
+
var validationPromise = new Promise(function (validationResolve) {
|
|
551
|
+
var eventCallbackId = uuid();
|
|
552
|
+
_this9._validateResolveMap.set(eventCallbackId, validationResolve);
|
|
553
|
+
// 发送validateFields消息
|
|
554
|
+
_this9._sendMessageToAPP({
|
|
555
|
+
event: SENDEVENT.validateFields.name,
|
|
556
|
+
data: {},
|
|
557
|
+
eventCallbackId: eventCallbackId
|
|
558
|
+
});
|
|
559
|
+
var isValidationResult = function isValidationResult(data) {
|
|
560
|
+
return _typeof(data) === 'object' && data !== null && typeof data.isValid === 'boolean';
|
|
561
|
+
};
|
|
562
|
+
var callback = /*#__PURE__*/function () {
|
|
563
|
+
var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(payload) {
|
|
564
|
+
var currentEventCallbackId, currentResolve, result;
|
|
565
|
+
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
566
|
+
while (1) switch (_context2.prev = _context2.next) {
|
|
567
|
+
case 0:
|
|
568
|
+
currentEventCallbackId = (payload === null || payload === void 0 ? void 0 : payload.eventCallbackId) || ''; // 事件一一对应,处理异步商户调用多次可能导致乱序的问题
|
|
569
|
+
currentResolve = _this9._validateResolveMap.get(currentEventCallbackId);
|
|
570
|
+
result = {
|
|
571
|
+
isValid: false
|
|
572
|
+
};
|
|
573
|
+
if (isValidationResult(payload === null || payload === void 0 ? void 0 : payload.data)) {
|
|
574
|
+
result = payload === null || payload === void 0 ? void 0 : payload.data;
|
|
575
|
+
}
|
|
576
|
+
_this9.logger.logInfo({
|
|
577
|
+
title: 'sdk_event_validateFields'
|
|
578
|
+
}, {
|
|
579
|
+
processResult: result.isValid ? 'true' : 'false'
|
|
580
|
+
});
|
|
581
|
+
// 收银台应用保证数据格式,三端SDK负责透传
|
|
582
|
+
if (!!currentResolve) {
|
|
583
|
+
currentResolve(result);
|
|
584
|
+
_this9._validateResolveMap.delete(currentEventCallbackId);
|
|
585
|
+
}
|
|
586
|
+
case 6:
|
|
587
|
+
case "end":
|
|
588
|
+
return _context2.stop();
|
|
589
|
+
}
|
|
590
|
+
}, _callee2);
|
|
591
|
+
}));
|
|
592
|
+
return function callback(_x2) {
|
|
593
|
+
return _ref5.apply(this, arguments);
|
|
594
|
+
};
|
|
595
|
+
}();
|
|
596
|
+
// 接收收银台应用的返回validateFieldsResult消息
|
|
597
|
+
// validateFieldsResultForward处理订阅eventCallbackId为空的问题
|
|
598
|
+
_this9._overrideSubscription(EVENT.validateFieldsResult.forwardName, callback, EVENT.validateFieldsResult.uniqueKey);
|
|
599
|
+
});
|
|
600
|
+
|
|
601
|
+
// 兜底场景,三端约定超时时间15秒,兼容cpf网络校验超时场景
|
|
602
|
+
var timeoutPromise = new Promise(function (timeoutResolve) {
|
|
603
|
+
timeoutId = setTimeout(function () {
|
|
604
|
+
_this9.logger.logInfo({
|
|
605
|
+
title: 'sdk_event_validateFields'
|
|
606
|
+
}, {
|
|
607
|
+
processResult: 'timeout'
|
|
608
|
+
});
|
|
609
|
+
timeoutResolve({
|
|
610
|
+
isValid: false
|
|
611
|
+
});
|
|
612
|
+
}, 15000);
|
|
613
|
+
});
|
|
614
|
+
Promise.race([validationPromise, timeoutPromise]).then(function (result) {
|
|
615
|
+
clearTimeout(timeoutId);
|
|
616
|
+
resolve(result);
|
|
617
|
+
}).catch(function () {
|
|
618
|
+
clearTimeout(timeoutId);
|
|
619
|
+
resolve({
|
|
620
|
+
isValid: false
|
|
621
|
+
});
|
|
622
|
+
});
|
|
623
|
+
});
|
|
624
|
+
}
|
|
625
|
+
}, {
|
|
626
|
+
key: "_sendMessageToAPP",
|
|
627
|
+
value: function _sendMessageToAPP(eventContext) {
|
|
628
|
+
this._componentApp.dispatchToApp({
|
|
629
|
+
context: eventContext
|
|
630
|
+
});
|
|
631
|
+
}
|
|
529
632
|
}]);
|
|
530
633
|
return AMSComponent;
|
|
531
634
|
}(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({
|
|
@@ -447,6 +448,7 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
447
448
|
}, loadTimeLimit !== null && loadTimeLimit !== void 0 ? loadTimeLimit : LOADTIME_LIMIT);
|
|
448
449
|
}).catch(function (error) {
|
|
449
450
|
_this4.dispatchToSDK(EVENT.error.name, ERRORMESSAGE.CREATECOMPONENT_ERROR.LOAD_APP_TIMEOUT);
|
|
451
|
+
_this4.dispatchToSDK(EVENT.eventCallback.name, ERRORMESSAGE.CREATECOMPONENT_ERROR.LOAD_APP_TIMEOUT);
|
|
450
452
|
_this4.AMSSDK.logger.logError({
|
|
451
453
|
title: 'sdk_error_web_app_timeout'
|
|
452
454
|
}).send();
|
|
@@ -658,13 +660,34 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
658
660
|
key: 'sdk_action_query_end',
|
|
659
661
|
value: Date.now()
|
|
660
662
|
});
|
|
661
|
-
resolve(res);
|
|
662
663
|
_this5.AMSSDK.logger.logInfo({
|
|
663
664
|
title: 'sdk_event_sdkQueryEnd'
|
|
664
665
|
}, {
|
|
665
666
|
paymentSessionConfig: JSON.stringify(params.paymentSessionConfig)
|
|
666
667
|
}).send();
|
|
668
|
+
// fix: 泡泡玛特CVV场景,actionQuery报错会进入错误兜底页,导致CVV页面占用大幅空间
|
|
669
|
+
if (ComponentSignEnum.CASHIER_PAYMENT_CARD === _this5._componentSign && !(res !== null && res !== void 0 && res.success)) {
|
|
670
|
+
var _res$errorActions;
|
|
671
|
+
// 通用操作:抛CREATECOMPONENT_ERROR错误码给商户,商户升级到新版本需要处理CREATECOMPONENT_ERROR逻辑
|
|
672
|
+
var createComponentError = {
|
|
673
|
+
code: ERRORMESSAGE.CREATECOMPONENT_ERROR.code,
|
|
674
|
+
message: res === null || res === void 0 ? void 0 : res.errorMessage
|
|
675
|
+
};
|
|
676
|
+
_this5.dispatchToSDK(EVENT.error.name, createComponentError);
|
|
677
|
+
_this5.dispatchToSDK(EVENT.eventCallback.name, createComponentError);
|
|
678
|
+
if ((res === null || res === void 0 || (_res$errorActions = res.errorActions) === null || _res$errorActions === void 0 ? void 0 : _res$errorActions.showType) === 'NONE') {
|
|
679
|
+
// 抛错销毁SDK,不展示错误页面
|
|
680
|
+
reject(createComponentError);
|
|
681
|
+
return;
|
|
682
|
+
}
|
|
683
|
+
}
|
|
684
|
+
resolve(res);
|
|
667
685
|
}).catch(function (err) {
|
|
686
|
+
if (ComponentSignEnum.CASHIER_PAYMENT_CARD === _this5._componentSign) {
|
|
687
|
+
// 通用操作:抛CREATECOMPONENT_ERROR错误码给商户,商户升级到新版本需要处理CREATECOMPONENT_ERROR逻辑
|
|
688
|
+
_this5.dispatchToSDK(EVENT.error.name, ERRORMESSAGE.CREATECOMPONENT_ERROR.NETWORK_REQUEST_ERROR);
|
|
689
|
+
_this5.dispatchToSDK(EVENT.eventCallback.name, ERRORMESSAGE.CREATECOMPONENT_ERROR.NETWORK_REQUEST_ERROR);
|
|
690
|
+
}
|
|
668
691
|
if ([ComponentSignEnum.CASHIER_PAYMENT_CARD, ComponentSignEnum.VAULTING_CARD, ComponentSignEnum.CASHIER_PAYMENT_APM].includes(_this5._componentSign)) {
|
|
669
692
|
return resolve({
|
|
670
693
|
success: false
|
|
@@ -1387,6 +1410,12 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
1387
1410
|
});
|
|
1388
1411
|
return;
|
|
1389
1412
|
}
|
|
1413
|
+
if (data.context.event === EVENT.validateFieldsResult.name) {
|
|
1414
|
+
// 将validateFieldsResult事件转发到subsribe处理,解决subsribe拿不到eventCallbackId的问题
|
|
1415
|
+
this.AMSSDK._eventCenter.emit(EVENT.validateFieldsResult.forwardName, data.context);
|
|
1416
|
+
return;
|
|
1417
|
+
}
|
|
1418
|
+
|
|
1390
1419
|
// log event before sending the callback
|
|
1391
1420
|
this.logEventCallback(data, 'sdk_event_event_callback');
|
|
1392
1421
|
try {
|
|
@@ -1822,6 +1851,7 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
1822
1851
|
return this._actionSubmitPromise;
|
|
1823
1852
|
case 9:
|
|
1824
1853
|
submitRes = _context8.sent;
|
|
1854
|
+
this._hasRenderComponent = true;
|
|
1825
1855
|
this._performanceData.push({
|
|
1826
1856
|
key: 'sdk_render_component',
|
|
1827
1857
|
value: Date.now()
|
|
@@ -1877,16 +1907,16 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
1877
1907
|
}
|
|
1878
1908
|
});
|
|
1879
1909
|
// eslint-disable-next-line no-empty
|
|
1880
|
-
_context8.next =
|
|
1910
|
+
_context8.next = 19;
|
|
1881
1911
|
break;
|
|
1882
|
-
case
|
|
1883
|
-
_context8.prev =
|
|
1912
|
+
case 17:
|
|
1913
|
+
_context8.prev = 17;
|
|
1884
1914
|
_context8.t0 = _context8["catch"](0);
|
|
1885
|
-
case
|
|
1915
|
+
case 19:
|
|
1886
1916
|
case "end":
|
|
1887
1917
|
return _context8.stop();
|
|
1888
1918
|
}
|
|
1889
|
-
}, _callee8, this, [[0,
|
|
1919
|
+
}, _callee8, this, [[0, 17]]);
|
|
1890
1920
|
}));
|
|
1891
1921
|
function sendRenderEvent() {
|
|
1892
1922
|
return _sendRenderEvent.apply(this, arguments);
|
|
@@ -1913,6 +1943,7 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
1913
1943
|
this._performanceData = [];
|
|
1914
1944
|
this._isInitComponent = false;
|
|
1915
1945
|
this.app = null;
|
|
1946
|
+
this._hasRenderComponent = false;
|
|
1916
1947
|
if (immediately) this.cleanElement();else {
|
|
1917
1948
|
setTimeout(function () {
|
|
1918
1949
|
_this10.cleanElement();
|
|
@@ -1999,6 +2030,11 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
1999
2030
|
form.submit();
|
|
2000
2031
|
}, 0);
|
|
2001
2032
|
}
|
|
2033
|
+
}, {
|
|
2034
|
+
key: "shouldValidateFields",
|
|
2035
|
+
value: function shouldValidateFields() {
|
|
2036
|
+
return this._hasRenderComponent;
|
|
2037
|
+
}
|
|
2002
2038
|
}]);
|
|
2003
2039
|
return ComponentApp;
|
|
2004
2040
|
}();
|
|
@@ -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';
|
|
@@ -590,6 +593,7 @@ export interface CashierSdkActionQueryResult {
|
|
|
590
593
|
extendInfo?: {
|
|
591
594
|
channelOrderId?: string;
|
|
592
595
|
};
|
|
596
|
+
errorActions?: Record<string, string>;
|
|
593
597
|
}
|
|
594
598
|
export interface CashierSdkActionQuerySessionResult extends IPaymentSessionMetaData {
|
|
595
599
|
success: boolean;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@alipay/ams-checkout",
|
|
3
|
-
"version": "0.0.1751254427-dev.
|
|
3
|
+
"version": "0.0.1751254427-dev.2",
|
|
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": {
|