@adyen/adyen-web 6.3.0 → 6.4.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/cjs/adyen.css +2 -2
- package/dist/cjs/adyen.css.map +1 -1
- package/dist/cjs/index.cjs +2 -2
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/cjs/index.d.cts +46 -10
- package/dist/es/adyen.css +2 -2
- package/dist/es/adyen.css.map +1 -1
- package/dist/es/components/ANCV/ANCV.js +1 -1
- package/dist/es/components/ANCV/ANCV.js.map +1 -1
- package/dist/es/components/Ach/Ach.js +1 -1
- package/dist/es/components/Ach/Ach.js.map +1 -1
- package/dist/es/components/Ach/components/AchInput/AchInput.js +1 -1
- package/dist/es/components/Ach/components/AchInput/AchInput.js.map +1 -1
- package/dist/es/components/BacsDD/BacsDD.js +1 -1
- package/dist/es/components/BacsDD/BacsDD.js.map +1 -1
- package/dist/es/components/BacsDD/components/BacsResult.js +1 -1
- package/dist/es/components/BacsDD/components/BacsResult.js.map +1 -1
- package/dist/es/components/BankTransfer/BankTransfer.js +1 -1
- package/dist/es/components/BankTransfer/BankTransfer.js.map +1 -1
- package/dist/es/components/BankTransfer/components/BankTransferResult/BankTransferResult.js +1 -1
- package/dist/es/components/BankTransfer/components/BankTransferResult/BankTransferResult.js.map +1 -1
- package/dist/es/components/Blik/Blik.js +1 -1
- package/dist/es/components/Blik/Blik.js.map +1 -1
- package/dist/es/components/Boleto/Boleto.js +1 -1
- package/dist/es/components/Boleto/Boleto.js.map +1 -1
- package/dist/es/components/Boleto/components/BoletoVoucherResult/BoletoVoucherResult.js +1 -1
- package/dist/es/components/Boleto/components/BoletoVoucherResult/BoletoVoucherResult.js.map +1 -1
- package/dist/es/components/Doku/Doku.js +1 -1
- package/dist/es/components/Doku/Doku.js.map +1 -1
- package/dist/es/components/Doku/components/DokuVoucherResult/DokuVoucherResult.js +1 -1
- package/dist/es/components/Doku/components/DokuVoucherResult/DokuVoucherResult.js.map +1 -1
- package/dist/es/components/Dragonpay/Dragonpay.js +1 -1
- package/dist/es/components/Dragonpay/Dragonpay.js.map +1 -1
- package/dist/es/components/Dragonpay/components/DragonpayVoucherResult/DragonpayVoucherResult.js +1 -1
- package/dist/es/components/Dragonpay/components/DragonpayVoucherResult/DragonpayVoucherResult.js.map +1 -1
- package/dist/es/components/Econtext/Econtext.js +1 -1
- package/dist/es/components/Econtext/Econtext.js.map +1 -1
- package/dist/es/components/Econtext/components/EcontextVoucherResult/EcontextVoucherResult.js +1 -1
- package/dist/es/components/Econtext/components/EcontextVoucherResult/EcontextVoucherResult.js.map +1 -1
- package/dist/es/components/Klarna/KlarnaPayments.js +1 -1
- package/dist/es/components/Klarna/KlarnaPayments.js.map +1 -1
- package/dist/es/components/Klarna/components/KlarnaContainer/KlarnaContainer.js +1 -1
- package/dist/es/components/Klarna/components/KlarnaContainer/KlarnaContainer.js.map +1 -1
- package/dist/es/components/MBWay/MBWay.js +1 -1
- package/dist/es/components/MBWay/MBWay.js.map +1 -1
- package/dist/es/components/Multibanco/Multibanco.js +1 -1
- package/dist/es/components/Multibanco/Multibanco.js.map +1 -1
- package/dist/es/components/Multibanco/components/MultibancoVoucherResult/MultibancoVoucherResult.js +1 -1
- package/dist/es/components/Multibanco/components/MultibancoVoucherResult/MultibancoVoucherResult.js.map +1 -1
- package/dist/es/components/Oxxo/Oxxo.js +1 -1
- package/dist/es/components/Oxxo/Oxxo.js.map +1 -1
- package/dist/es/components/Oxxo/components/OxxoVoucherResult/OxxoVoucherResult.js +1 -1
- package/dist/es/components/Oxxo/components/OxxoVoucherResult/OxxoVoucherResult.js.map +1 -1
- package/dist/es/components/PayPal/Paypal.js +1 -1
- package/dist/es/components/PayPal/Paypal.js.map +1 -1
- package/dist/es/components/Redirect/Redirect.js +1 -1
- package/dist/es/components/Redirect/Redirect.js.map +1 -1
- package/dist/es/components/Redirect/components/RedirectShopper/RedirectShopper.js +1 -1
- package/dist/es/components/Redirect/components/RedirectShopper/RedirectShopper.js.map +1 -1
- package/dist/es/components/ThreeDS2/ThreeDS2Challenge.js +1 -1
- package/dist/es/components/ThreeDS2/ThreeDS2Challenge.js.map +1 -1
- package/dist/es/components/ThreeDS2/ThreeDS2DeviceFingerprint.js +1 -1
- package/dist/es/components/ThreeDS2/ThreeDS2DeviceFingerprint.js.map +1 -1
- package/dist/es/components/ThreeDS2/components/Challenge/DoChallenge3DS2.js +1 -1
- package/dist/es/components/ThreeDS2/components/Challenge/DoChallenge3DS2.js.map +1 -1
- package/dist/es/components/ThreeDS2/components/Challenge/PrepareChallenge3DS2.js +1 -1
- package/dist/es/components/ThreeDS2/components/Challenge/PrepareChallenge3DS2.js.map +1 -1
- package/dist/es/components/ThreeDS2/components/DeviceFingerprint/DoFingerprint3DS2.js +1 -1
- package/dist/es/components/ThreeDS2/components/DeviceFingerprint/DoFingerprint3DS2.js.map +1 -1
- package/dist/es/components/ThreeDS2/components/DeviceFingerprint/PrepareFingerprint3DS2.js +1 -1
- package/dist/es/components/ThreeDS2/components/DeviceFingerprint/PrepareFingerprint3DS2.js.map +1 -1
- package/dist/es/components/UPI/UPI.js +1 -1
- package/dist/es/components/UPI/UPI.js.map +1 -1
- package/dist/es/components/helpers/QRLoaderContainer/QRLoaderContainer.js +1 -1
- package/dist/es/components/helpers/QRLoaderContainer/QRLoaderContainer.js.map +1 -1
- package/dist/es/components/internal/Await/Await.js +1 -1
- package/dist/es/components/internal/Await/Await.js.map +1 -1
- package/dist/es/components/internal/FormFields/RadioGroup/RadioGroup.js +1 -1
- package/dist/es/components/internal/FormFields/RadioGroup/RadioGroup.js.map +1 -1
- package/dist/es/components/internal/QRLoader/QRLoader.js.map +1 -1
- package/dist/es/components/internal/UIElement/UIElement.js +1 -1
- package/dist/es/components/internal/UIElement/UIElement.js.map +1 -1
- package/dist/es/components/internal/Voucher/Voucher.js +1 -1
- package/dist/es/components/internal/Voucher/Voucher.js.map +1 -1
- package/dist/es/components/internal/Voucher/utils.js +2 -0
- package/dist/es/components/internal/Voucher/utils.js.map +1 -0
- package/dist/es/core/Errors/CancelError.js +2 -0
- package/dist/es/core/Errors/CancelError.js.map +1 -0
- package/dist/es/core/Errors/SRPanel.js +1 -1
- package/dist/es/core/Errors/SRPanel.js.map +1 -1
- package/dist/es/core/ProcessResponse/PaymentAction/actionTypes.js +1 -1
- package/dist/es/core/ProcessResponse/PaymentAction/actionTypes.js.map +1 -1
- package/dist/es/core/Services/analytics/collect-id.js +1 -1
- package/dist/es/core/core.js +1 -1
- package/dist/es/index.d.ts +46 -10
- package/dist/es/utils/get-process-message-handler.js +1 -1
- package/dist/es/utils/get-process-message-handler.js.map +1 -1
- package/dist/es-legacy/adyen.css +2 -2
- package/dist/es-legacy/adyen.css.map +1 -1
- package/dist/es-legacy/components/ANCV/ANCV.js +1 -1
- package/dist/es-legacy/components/ANCV/ANCV.js.map +1 -1
- package/dist/es-legacy/components/Ach/Ach.js +1 -1
- package/dist/es-legacy/components/Ach/Ach.js.map +1 -1
- package/dist/es-legacy/components/Ach/components/AchInput/AchInput.js +1 -1
- package/dist/es-legacy/components/Ach/components/AchInput/AchInput.js.map +1 -1
- package/dist/es-legacy/components/BacsDD/BacsDD.js +1 -1
- package/dist/es-legacy/components/BacsDD/BacsDD.js.map +1 -1
- package/dist/es-legacy/components/BacsDD/components/BacsResult.js +1 -1
- package/dist/es-legacy/components/BacsDD/components/BacsResult.js.map +1 -1
- package/dist/es-legacy/components/BankTransfer/BankTransfer.js +1 -1
- package/dist/es-legacy/components/BankTransfer/BankTransfer.js.map +1 -1
- package/dist/es-legacy/components/BankTransfer/components/BankTransferResult/BankTransferResult.js +1 -1
- package/dist/es-legacy/components/BankTransfer/components/BankTransferResult/BankTransferResult.js.map +1 -1
- package/dist/es-legacy/components/Blik/Blik.js +1 -1
- package/dist/es-legacy/components/Blik/Blik.js.map +1 -1
- package/dist/es-legacy/components/Boleto/Boleto.js +1 -1
- package/dist/es-legacy/components/Boleto/Boleto.js.map +1 -1
- package/dist/es-legacy/components/Boleto/components/BoletoVoucherResult/BoletoVoucherResult.js +1 -1
- package/dist/es-legacy/components/Boleto/components/BoletoVoucherResult/BoletoVoucherResult.js.map +1 -1
- package/dist/es-legacy/components/Doku/Doku.js +1 -1
- package/dist/es-legacy/components/Doku/Doku.js.map +1 -1
- package/dist/es-legacy/components/Doku/components/DokuVoucherResult/DokuVoucherResult.js +1 -1
- package/dist/es-legacy/components/Doku/components/DokuVoucherResult/DokuVoucherResult.js.map +1 -1
- package/dist/es-legacy/components/Dragonpay/Dragonpay.js +1 -1
- package/dist/es-legacy/components/Dragonpay/Dragonpay.js.map +1 -1
- package/dist/es-legacy/components/Dragonpay/components/DragonpayVoucherResult/DragonpayVoucherResult.js +1 -1
- package/dist/es-legacy/components/Dragonpay/components/DragonpayVoucherResult/DragonpayVoucherResult.js.map +1 -1
- package/dist/es-legacy/components/Econtext/Econtext.js +1 -1
- package/dist/es-legacy/components/Econtext/Econtext.js.map +1 -1
- package/dist/es-legacy/components/Econtext/components/EcontextVoucherResult/EcontextVoucherResult.js +1 -1
- package/dist/es-legacy/components/Econtext/components/EcontextVoucherResult/EcontextVoucherResult.js.map +1 -1
- package/dist/es-legacy/components/Klarna/KlarnaPayments.js +1 -1
- package/dist/es-legacy/components/Klarna/KlarnaPayments.js.map +1 -1
- package/dist/es-legacy/components/Klarna/components/KlarnaContainer/KlarnaContainer.js +1 -1
- package/dist/es-legacy/components/Klarna/components/KlarnaContainer/KlarnaContainer.js.map +1 -1
- package/dist/es-legacy/components/MBWay/MBWay.js +1 -1
- package/dist/es-legacy/components/MBWay/MBWay.js.map +1 -1
- package/dist/es-legacy/components/Multibanco/Multibanco.js +1 -1
- package/dist/es-legacy/components/Multibanco/Multibanco.js.map +1 -1
- package/dist/es-legacy/components/Multibanco/components/MultibancoVoucherResult/MultibancoVoucherResult.js +1 -1
- package/dist/es-legacy/components/Multibanco/components/MultibancoVoucherResult/MultibancoVoucherResult.js.map +1 -1
- package/dist/es-legacy/components/Oxxo/Oxxo.js +1 -1
- package/dist/es-legacy/components/Oxxo/Oxxo.js.map +1 -1
- package/dist/es-legacy/components/Oxxo/components/OxxoVoucherResult/OxxoVoucherResult.js +1 -1
- package/dist/es-legacy/components/Oxxo/components/OxxoVoucherResult/OxxoVoucherResult.js.map +1 -1
- package/dist/es-legacy/components/PayPal/Paypal.js +1 -1
- package/dist/es-legacy/components/PayPal/Paypal.js.map +1 -1
- package/dist/es-legacy/components/Redirect/Redirect.js +1 -1
- package/dist/es-legacy/components/Redirect/Redirect.js.map +1 -1
- package/dist/es-legacy/components/Redirect/components/RedirectShopper/RedirectShopper.js +1 -1
- package/dist/es-legacy/components/Redirect/components/RedirectShopper/RedirectShopper.js.map +1 -1
- package/dist/es-legacy/components/ThreeDS2/ThreeDS2Challenge.js +1 -1
- package/dist/es-legacy/components/ThreeDS2/ThreeDS2Challenge.js.map +1 -1
- package/dist/es-legacy/components/ThreeDS2/ThreeDS2DeviceFingerprint.js +1 -1
- package/dist/es-legacy/components/ThreeDS2/ThreeDS2DeviceFingerprint.js.map +1 -1
- package/dist/es-legacy/components/ThreeDS2/components/Challenge/DoChallenge3DS2.js +1 -1
- package/dist/es-legacy/components/ThreeDS2/components/Challenge/DoChallenge3DS2.js.map +1 -1
- package/dist/es-legacy/components/ThreeDS2/components/Challenge/PrepareChallenge3DS2.js +1 -1
- package/dist/es-legacy/components/ThreeDS2/components/Challenge/PrepareChallenge3DS2.js.map +1 -1
- package/dist/es-legacy/components/ThreeDS2/components/DeviceFingerprint/DoFingerprint3DS2.js +1 -1
- package/dist/es-legacy/components/ThreeDS2/components/DeviceFingerprint/DoFingerprint3DS2.js.map +1 -1
- package/dist/es-legacy/components/ThreeDS2/components/DeviceFingerprint/PrepareFingerprint3DS2.js +1 -1
- package/dist/es-legacy/components/ThreeDS2/components/DeviceFingerprint/PrepareFingerprint3DS2.js.map +1 -1
- package/dist/es-legacy/components/UPI/UPI.js +1 -1
- package/dist/es-legacy/components/UPI/UPI.js.map +1 -1
- package/dist/es-legacy/components/helpers/QRLoaderContainer/QRLoaderContainer.js +1 -1
- package/dist/es-legacy/components/helpers/QRLoaderContainer/QRLoaderContainer.js.map +1 -1
- package/dist/es-legacy/components/internal/Await/Await.js +1 -1
- package/dist/es-legacy/components/internal/Await/Await.js.map +1 -1
- package/dist/es-legacy/components/internal/FormFields/RadioGroup/RadioGroup.js +1 -1
- package/dist/es-legacy/components/internal/FormFields/RadioGroup/RadioGroup.js.map +1 -1
- package/dist/es-legacy/components/internal/QRLoader/QRLoader.js.map +1 -1
- package/dist/es-legacy/components/internal/UIElement/UIElement.js +1 -1
- package/dist/es-legacy/components/internal/UIElement/UIElement.js.map +1 -1
- package/dist/es-legacy/components/internal/Voucher/Voucher.js +1 -1
- package/dist/es-legacy/components/internal/Voucher/Voucher.js.map +1 -1
- package/dist/es-legacy/components/internal/Voucher/utils.js +2 -0
- package/dist/es-legacy/components/internal/Voucher/utils.js.map +1 -0
- package/dist/es-legacy/core/Errors/CancelError.js +2 -0
- package/dist/es-legacy/core/Errors/CancelError.js.map +1 -0
- package/dist/es-legacy/core/Errors/SRPanel.js +1 -1
- package/dist/es-legacy/core/Errors/SRPanel.js.map +1 -1
- package/dist/es-legacy/core/ProcessResponse/PaymentAction/actionTypes.js +1 -1
- package/dist/es-legacy/core/ProcessResponse/PaymentAction/actionTypes.js.map +1 -1
- package/dist/es-legacy/core/Services/analytics/collect-id.js +1 -1
- package/dist/es-legacy/core/core.js +1 -1
- package/dist/es-legacy/utils/get-process-message-handler.js +1 -1
- package/dist/es-legacy/utils/get-process-message-handler.js.map +1 -1
- package/package.json +7 -7
- package/styles/adyen.css +2 -2
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as e}from"../../../external/preact/dist/preact.js";import{useState as t,useEffect as a}from"../../../external/preact/hooks/dist/hooks.js";import o from"../../../external/classnames/index.js";import r from"../../../core/Services/payment-status.js";import{processResponse as
|
|
1
|
+
import{createElement as e}from"../../../external/preact/dist/preact.js";import{useState as t,useEffect as a}from"../../../external/preact/hooks/dist/hooks.js";import o from"../../../external/classnames/index.js";import r from"../../../core/Services/payment-status.js";import{processResponse as s}from"../../../core/ProcessResponse/process-response.js";import n from"../Spinner/Spinner.js";import i from"../Countdown/index.js";import c from"../Button/Button.js";import{useCoreContext as l}from"../../../core/Context/CoreProvider.js";import d from"../../../core/Errors/AdyenCheckoutError.js";import m from"../ContentSeparator/ContentSeparator.js";import u from"../../../core/Context/useImage.js";function p(p){const{i18n:_,loadingContext:y}=l(),h=u(),[w,f]=t(!1),[k,g]=t(!1),[N,v]=t(!0),[C,T]=t(!1),[b,x]=t(p.delay),[R,j]=t(100),[E,A]=t(0),[D,S]=t(!1),[I,L]=t(null),P=e=>{if(e.props.payload){f(!0);const t={data:{details:{payload:e.props.payload},paymentData:p.paymentData}};return p.onComplete(t,this)}g(!0),p.onError(new d("ERROR","successful result, but no payload in response"))},M=e=>{if(g(!0),e.props.payload){const t={data:{details:{payload:e.props.payload},paymentData:p.paymentData}};return p.onComplete(t,this)}p.onError(new d("ERROR","error result with no payload in response"))},O=()=>{const{paymentData:e,clientKey:t,throttleInterval:a}=p;C||(p.onActionHandled?.({componentType:p.type,actionDescription:"polling-started"}),T(!0)),r(e,t,y,a).then(s).catch((({message:e,...t})=>({type:"network-error",props:{...e&&{message:_.get(e)},...t}}))).then((e=>{switch(e.type){case"success":P(e);break;case"error":M(e);break;default:v(!1)}}))},$=e=>{window.location.assign(e)};a((()=>{p.shouldRedirectAutomatically&&p.url&&$(p.url)}),[p.shouldRedirectAutomatically,p.url]),a((()=>(O(),()=>{clearTimeout(I)})),[]),a((()=>{if(k)return clearTimeout(I);if(w)return clearTimeout(I);if(!N){L(setTimeout((()=>{O();const e=E+b;A(e),e>=p.throttleTime&&!D&&(x(p.throttleInterval),S(!0))}),b))}}),[N,k,w,E]);const z=(t,a)=>e("div",{className:"adyen-checkout__await adyen-checkout__await--result"},e("img",{className:"adyen-checkout__await__icon adyen-checkout__await__icon--result",src:h({imageFolder:"components/"})(t),alt:_.get(a)}),e("div",{className:"adyen-checkout__await__subtitle adyen-checkout__await__subtitle--result"},_.get(a)));if(k)return z("error","error.subtitle.payment");if(w)return z("success","creditCard.success");if(N)return e("div",{className:"adyen-checkout__await"},p.brandLogo&&e("img",{src:p.brandLogo,alt:p.type,className:"adyen-checkout__await__brand-logo"}),e(n,{inline:!1,size:"large"}));const B=_.get("wechatpay.timetopay").split("%@");return e("div",{className:o("adyen-checkout__await",`adyen-checkout__await--${p.type}`,p.classNameModifiers.map((e=>`adyen-checkout__await--${e}`)))},p.brandLogo&&e("img",{src:p.brandLogo,alt:p.type,className:"adyen-checkout__await__brand-logo"}),e("div",{className:"adyen-checkout__await__subtitle"},p.messageText),e("div",{className:"adyen-checkout__await__indicator-holder"},e("div",{className:"adyen-checkout__await__indicator-spinner"},e(n,{inline:!1,size:"medium"})),e("div",{className:"adyen-checkout__await__indicator-text"},p.awaitText)),p.showCountdownTimer&&e("div",{className:"adyen-checkout__await__countdown-holder"},e("div",{className:"adyen-checkout__await__progress"},e("span",{className:"adyen-checkout__await__percentage",style:{width:`${R}%`}})),e("div",{className:"adyen-checkout__await__countdown"},B[0]," ",e(i,{minutesFromNow:p.countdownTime,onTick:e=>{j(e.percentage)},onCompleted:()=>{g(!0),clearTimeout(I),p.onError(new d("ERROR","Payment Expired"))}})," ",B[1])),p.url&&!p.shouldRedirectAutomatically&&e("div",{className:"adyen-checkout__await__app-link"},e(m,null),e(c,{classNameModifiers:["await"],onClick:()=>$(p.url),label:_.get("openApp")})))}p.defaultProps={countdownTime:15,onError:()=>{},onComplete:()=>{},delay:2e3,throttleTime:6e4,throttleInterval:1e4,showCountdownTimer:!0,classNameModifiers:[],url:null};export{p as default};
|
|
2
2
|
//# sourceMappingURL=Await.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Await.js","sources":["../../../../../src/components/internal/Await/Await.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useState, useEffect } from 'preact/hooks';\nimport classnames from 'classnames';\nimport checkPaymentStatus from '../../../core/Services/payment-status';\nimport processResponse from '../../../core/ProcessResponse';\n\nimport Spinner from '../../internal/Spinner';\nimport Countdown from '../Countdown';\nimport Button from '../Button';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { AwaitComponentProps, StatusObject } from './types';\nimport './Await.scss';\nimport AdyenCheckoutError from '../../../core/Errors/AdyenCheckoutError';\nimport ContentSeparator from '../ContentSeparator';\nimport useImage from '../../../core/Context/useImage';\n\nfunction Await(props: AwaitComponentProps) {\n const { i18n, loadingContext } = useCoreContext();\n const getImage = useImage();\n const [completed, setCompleted] = useState(false);\n const [expired, setExpired] = useState(false);\n const [loading, setLoading] = useState(true);\n const [hasCalledActionHandled, setHasCalledActionHandled] = useState(false);\n const [delay, setDelay] = useState(props.delay);\n const [percentage, setPercentage] = useState(100);\n const [timePassed, setTimePassed] = useState(0);\n const [hasAdjustedTime, setHasAdjustedTime] = useState(false);\n const [storedTimeout, setStoredTimeout] = useState(null);\n\n const onTimeUp = (): void => {\n setExpired(true);\n clearTimeout(storedTimeout);\n props.onError(new AdyenCheckoutError('ERROR', 'Payment Expired'));\n };\n\n const onTick = (time): void => {\n setPercentage(time.percentage);\n };\n\n const onComplete = (status: StatusObject): void => {\n // Only make details call if we have a payload\n if (status.props.payload) {\n setCompleted(true);\n const state = {\n data: {\n details: { payload: status.props.payload },\n paymentData: props.paymentData\n }\n };\n // Send success response to onAdditionalDetails\n return props.onComplete(state, this);\n }\n\n // Show error state & call merchant defined error callback if we do not have a payload\n setExpired(true);\n props.onError(new AdyenCheckoutError('ERROR', 'successful result, but no payload in response'));\n };\n\n const onError = (status: StatusObject): void => {\n setExpired(true);\n\n // Only make details call if we have a payload\n if (status.props.payload) {\n const state = {\n data: {\n details: { payload: status.props.payload },\n paymentData: props.paymentData\n }\n };\n // Send error response to onAdditionalDetails\n return props.onComplete(state, this);\n }\n\n // Call merchant defined error callback if we do not have a payload\n props.onError(new AdyenCheckoutError('ERROR', 'error result with no payload in response'));\n };\n\n const checkStatus = (): void => {\n const { paymentData, clientKey, throttleInterval } = props;\n\n if (!hasCalledActionHandled) {\n props.onActionHandled({ componentType: props.type, actionDescription: 'polling-started' });\n setHasCalledActionHandled(true);\n }\n\n void checkPaymentStatus(paymentData, clientKey, loadingContext, throttleInterval)\n .then(processResponse)\n .catch(({ message, ...response }) => ({\n type: 'network-error',\n props: {\n ...(message && { message: i18n.get(message) }),\n ...response\n }\n }))\n .then((status: StatusObject) => {\n switch (status.type) {\n case 'success':\n onComplete(status);\n break;\n\n case 'error':\n onError(status);\n break;\n\n default:\n setLoading(false);\n }\n });\n };\n\n const redirectToApp = (url): void => {\n window.location.assign(url);\n };\n\n useEffect(() => {\n if (props.shouldRedirectAutomatically && props.url) {\n redirectToApp(props.url);\n }\n }, [props.shouldRedirectAutomatically, props.url]);\n\n useEffect(() => {\n checkStatus();\n return (): void => {\n clearTimeout(storedTimeout);\n };\n }, []);\n\n useEffect(() => {\n if (expired) return clearTimeout(storedTimeout);\n\n if (completed) return clearTimeout(storedTimeout);\n\n if (!loading) {\n // Retry until getting a complete response from the server OR it times out\n // Changes setTimeout time to new value (throttleInterval) after a certain amount of time (throttleTime) has passed\n const statusInterval = (): void => {\n checkStatus();\n\n const actualTimePassed = timePassed + delay;\n // timePassed is the value that is the main \"engine\" that drives this useEffect/polling\n setTimePassed(actualTimePassed);\n\n if (actualTimePassed >= props.throttleTime && !hasAdjustedTime) {\n setDelay(props.throttleInterval);\n setHasAdjustedTime(true);\n }\n };\n\n // Create (another) interval to poll for a result\n setStoredTimeout(setTimeout(statusInterval, delay));\n }\n }, [loading, expired, completed, timePassed]);\n\n const finalState = (image, message) => (\n <div className=\"adyen-checkout__await adyen-checkout__await--result\">\n <img\n className=\"adyen-checkout__await__icon adyen-checkout__await__icon--result\"\n src={getImage({ imageFolder: 'components/' })(image)}\n alt={i18n.get(message)}\n />\n <div className=\"adyen-checkout__await__subtitle adyen-checkout__await__subtitle--result\">{i18n.get(message)}</div>\n </div>\n );\n\n if (expired) {\n return finalState('error', 'error.subtitle.payment');\n }\n\n if (completed) {\n return finalState('success', 'creditCard.success');\n }\n\n if (loading) {\n return (\n <div className=\"adyen-checkout__await\">\n {props.brandLogo && <img src={props.brandLogo} alt={props.type} className=\"adyen-checkout__await__brand-logo\" />}\n <Spinner inline={false} size=\"large\" />\n </div>\n );\n }\n\n const timeToPayString = i18n.get('wechatpay.timetopay').split('%@');\n\n return (\n <div\n className={classnames(\n 'adyen-checkout__await',\n `adyen-checkout__await--${props.type}`,\n props.classNameModifiers.map(m => `adyen-checkout__await--${m}`)\n )}\n >\n {props.brandLogo && <img src={props.brandLogo} alt={props.type} className=\"adyen-checkout__await__brand-logo\" />}\n\n <div className=\"adyen-checkout__await__subtitle\">{props.messageText}</div>\n\n <div className=\"adyen-checkout__await__indicator-holder\">\n <div className=\"adyen-checkout__await__indicator-spinner\">\n <Spinner inline={false} size=\"medium\" />\n </div>\n <div className=\"adyen-checkout__await__indicator-text\">{props.awaitText}</div>\n </div>\n\n {props.showCountdownTimer && (\n <div className=\"adyen-checkout__await__countdown-holder\">\n <div className=\"adyen-checkout__await__progress\">\n <span className=\"adyen-checkout__await__percentage\" style={{ width: `${percentage}%` }} />\n </div>\n\n <div className=\"adyen-checkout__await__countdown\">\n {timeToPayString[0]} \n <Countdown minutesFromNow={props.countdownTime} onTick={onTick} onCompleted={onTimeUp} />\n {timeToPayString[1]}\n </div>\n </div>\n )}\n\n {props.url && !props.shouldRedirectAutomatically && (\n <div className=\"adyen-checkout__await__app-link\">\n <ContentSeparator />\n <Button classNameModifiers={['await']} onClick={() => redirectToApp(props.url)} label={i18n.get('openApp')} />\n </div>\n )}\n </div>\n );\n}\n\nAwait.defaultProps = {\n countdownTime: 15,\n onError: () => {},\n onComplete: () => {},\n onActionHandled: () => {},\n delay: 2000,\n throttleTime: 60000,\n throttleInterval: 10000,\n showCountdownTimer: true,\n classNameModifiers: [],\n url: null\n};\n\nexport default Await;\n"],"names":["Await","props","i18n","loadingContext","useCoreContext","getImage","useImage","completed","setCompleted","useState","expired","setExpired","loading","setLoading","hasCalledActionHandled","setHasCalledActionHandled","delay","setDelay","percentage","setPercentage","timePassed","setTimePassed","hasAdjustedTime","setHasAdjustedTime","storedTimeout","setStoredTimeout","onComplete","status","payload","state","data","details","paymentData","this","onError","AdyenCheckoutError","checkStatus","clientKey","throttleInterval","onActionHandled","componentType","type","actionDescription","checkPaymentStatus","then","processResponse","catch","message","response","get","redirectToApp","url","window","location","assign","useEffect","shouldRedirectAutomatically","clearTimeout","setTimeout","actualTimePassed","throttleTime","finalState","image","h","div","className","img","src","imageFolder","alt","brandLogo","Spinner","inline","size","timeToPayString","split","classnames","classNameModifiers","map","m","messageText","awaitText","showCountdownTimer","span","style","width","Countdown","minutesFromNow","countdownTime","onTick","time","onCompleted","ContentSeparator","Button","onClick","label","defaultProps"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Await.js","sources":["../../../../../src/components/internal/Await/Await.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useState, useEffect } from 'preact/hooks';\nimport classnames from 'classnames';\nimport checkPaymentStatus from '../../../core/Services/payment-status';\nimport processResponse from '../../../core/ProcessResponse';\n\nimport Spinner from '../../internal/Spinner';\nimport Countdown from '../Countdown';\nimport Button from '../Button';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { AwaitComponentProps, StatusObject } from './types';\nimport './Await.scss';\nimport AdyenCheckoutError from '../../../core/Errors/AdyenCheckoutError';\nimport ContentSeparator from '../ContentSeparator';\nimport useImage from '../../../core/Context/useImage';\n\nfunction Await(props: AwaitComponentProps) {\n const { i18n, loadingContext } = useCoreContext();\n const getImage = useImage();\n const [completed, setCompleted] = useState(false);\n const [expired, setExpired] = useState(false);\n const [loading, setLoading] = useState(true);\n const [hasCalledActionHandled, setHasCalledActionHandled] = useState(false);\n const [delay, setDelay] = useState(props.delay);\n const [percentage, setPercentage] = useState(100);\n const [timePassed, setTimePassed] = useState(0);\n const [hasAdjustedTime, setHasAdjustedTime] = useState(false);\n const [storedTimeout, setStoredTimeout] = useState(null);\n\n const onTimeUp = (): void => {\n setExpired(true);\n clearTimeout(storedTimeout);\n props.onError(new AdyenCheckoutError('ERROR', 'Payment Expired'));\n };\n\n const onTick = (time): void => {\n setPercentage(time.percentage);\n };\n\n const onComplete = (status: StatusObject): void => {\n // Only make details call if we have a payload\n if (status.props.payload) {\n setCompleted(true);\n const state = {\n data: {\n details: { payload: status.props.payload },\n paymentData: props.paymentData\n }\n };\n // Send success response to onAdditionalDetails\n return props.onComplete(state, this);\n }\n\n // Show error state & call merchant defined error callback if we do not have a payload\n setExpired(true);\n props.onError(new AdyenCheckoutError('ERROR', 'successful result, but no payload in response'));\n };\n\n const onError = (status: StatusObject): void => {\n setExpired(true);\n\n // Only make details call if we have a payload\n if (status.props.payload) {\n const state = {\n data: {\n details: { payload: status.props.payload },\n paymentData: props.paymentData\n }\n };\n // Send error response to onAdditionalDetails\n return props.onComplete(state, this);\n }\n\n // Call merchant defined error callback if we do not have a payload\n props.onError(new AdyenCheckoutError('ERROR', 'error result with no payload in response'));\n };\n\n const checkStatus = (): void => {\n const { paymentData, clientKey, throttleInterval } = props;\n\n if (!hasCalledActionHandled) {\n props.onActionHandled?.({ componentType: props.type, actionDescription: 'polling-started' });\n setHasCalledActionHandled(true);\n }\n\n void checkPaymentStatus(paymentData, clientKey, loadingContext, throttleInterval)\n .then(processResponse)\n .catch(({ message, ...response }) => ({\n type: 'network-error',\n props: {\n ...(message && { message: i18n.get(message) }),\n ...response\n }\n }))\n .then((status: StatusObject) => {\n switch (status.type) {\n case 'success':\n onComplete(status);\n break;\n\n case 'error':\n onError(status);\n break;\n\n default:\n setLoading(false);\n }\n });\n };\n\n const redirectToApp = (url): void => {\n window.location.assign(url);\n };\n\n useEffect(() => {\n if (props.shouldRedirectAutomatically && props.url) {\n redirectToApp(props.url);\n }\n }, [props.shouldRedirectAutomatically, props.url]);\n\n useEffect(() => {\n checkStatus();\n return (): void => {\n clearTimeout(storedTimeout);\n };\n }, []);\n\n useEffect(() => {\n if (expired) return clearTimeout(storedTimeout);\n\n if (completed) return clearTimeout(storedTimeout);\n\n if (!loading) {\n // Retry until getting a complete response from the server OR it times out\n // Changes setTimeout time to new value (throttleInterval) after a certain amount of time (throttleTime) has passed\n const statusInterval = (): void => {\n checkStatus();\n\n const actualTimePassed = timePassed + delay;\n // timePassed is the value that is the main \"engine\" that drives this useEffect/polling\n setTimePassed(actualTimePassed);\n\n if (actualTimePassed >= props.throttleTime && !hasAdjustedTime) {\n setDelay(props.throttleInterval);\n setHasAdjustedTime(true);\n }\n };\n\n // Create (another) interval to poll for a result\n setStoredTimeout(setTimeout(statusInterval, delay));\n }\n }, [loading, expired, completed, timePassed]);\n\n const finalState = (image, message) => (\n <div className=\"adyen-checkout__await adyen-checkout__await--result\">\n <img\n className=\"adyen-checkout__await__icon adyen-checkout__await__icon--result\"\n src={getImage({ imageFolder: 'components/' })(image)}\n alt={i18n.get(message)}\n />\n <div className=\"adyen-checkout__await__subtitle adyen-checkout__await__subtitle--result\">{i18n.get(message)}</div>\n </div>\n );\n\n if (expired) {\n return finalState('error', 'error.subtitle.payment');\n }\n\n if (completed) {\n return finalState('success', 'creditCard.success');\n }\n\n if (loading) {\n return (\n <div className=\"adyen-checkout__await\">\n {props.brandLogo && <img src={props.brandLogo} alt={props.type} className=\"adyen-checkout__await__brand-logo\" />}\n <Spinner inline={false} size=\"large\" />\n </div>\n );\n }\n\n const timeToPayString = i18n.get('wechatpay.timetopay').split('%@');\n\n return (\n <div\n className={classnames(\n 'adyen-checkout__await',\n `adyen-checkout__await--${props.type}`,\n props.classNameModifiers.map(m => `adyen-checkout__await--${m}`)\n )}\n >\n {props.brandLogo && <img src={props.brandLogo} alt={props.type} className=\"adyen-checkout__await__brand-logo\" />}\n\n <div className=\"adyen-checkout__await__subtitle\">{props.messageText}</div>\n\n <div className=\"adyen-checkout__await__indicator-holder\">\n <div className=\"adyen-checkout__await__indicator-spinner\">\n <Spinner inline={false} size=\"medium\" />\n </div>\n <div className=\"adyen-checkout__await__indicator-text\">{props.awaitText}</div>\n </div>\n\n {props.showCountdownTimer && (\n <div className=\"adyen-checkout__await__countdown-holder\">\n <div className=\"adyen-checkout__await__progress\">\n <span className=\"adyen-checkout__await__percentage\" style={{ width: `${percentage}%` }} />\n </div>\n\n <div className=\"adyen-checkout__await__countdown\">\n {timeToPayString[0]} \n <Countdown minutesFromNow={props.countdownTime} onTick={onTick} onCompleted={onTimeUp} />\n {timeToPayString[1]}\n </div>\n </div>\n )}\n\n {props.url && !props.shouldRedirectAutomatically && (\n <div className=\"adyen-checkout__await__app-link\">\n <ContentSeparator />\n <Button classNameModifiers={['await']} onClick={() => redirectToApp(props.url)} label={i18n.get('openApp')} />\n </div>\n )}\n </div>\n );\n}\n\nAwait.defaultProps = {\n countdownTime: 15,\n onError: () => {},\n onComplete: () => {},\n delay: 2000,\n throttleTime: 60000,\n throttleInterval: 10000,\n showCountdownTimer: true,\n classNameModifiers: [],\n url: null\n};\n\nexport default Await;\n"],"names":["Await","props","i18n","loadingContext","useCoreContext","getImage","useImage","completed","setCompleted","useState","expired","setExpired","loading","setLoading","hasCalledActionHandled","setHasCalledActionHandled","delay","setDelay","percentage","setPercentage","timePassed","setTimePassed","hasAdjustedTime","setHasAdjustedTime","storedTimeout","setStoredTimeout","onComplete","status","payload","state","data","details","paymentData","this","onError","AdyenCheckoutError","checkStatus","clientKey","throttleInterval","onActionHandled","componentType","type","actionDescription","checkPaymentStatus","then","processResponse","catch","message","response","get","redirectToApp","url","window","location","assign","useEffect","shouldRedirectAutomatically","clearTimeout","setTimeout","actualTimePassed","throttleTime","finalState","image","h","div","className","img","src","imageFolder","alt","brandLogo","Spinner","inline","size","timeToPayString","split","classnames","classNameModifiers","map","m","messageText","awaitText","showCountdownTimer","span","style","width","Countdown","minutesFromNow","countdownTime","onTick","time","onCompleted","ContentSeparator","Button","onClick","label","defaultProps"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as e}from"../../../../external/preact/dist/preact.js";import a from"../../../../external/classnames/index.js";import{getUniqueId as r}from"../../../../utils/idGenerator.js";import{useCoreContext as o}from"../../../../core/Context/CoreProvider.js";function t(t){const{items:i,name:n,onChange:l,value:
|
|
1
|
+
import{createElement as e}from"../../../../external/preact/dist/preact.js";import a from"../../../../external/classnames/index.js";import{getUniqueId as r}from"../../../../utils/idGenerator.js";import{useCoreContext as o}from"../../../../core/Context/CoreProvider.js";function t(t){const{items:i,name:n,onChange:l,value:c,isInvalid:s,uniqueId:d,ariaLabel:_,style:u="classic"}=t,{i18n:p}=o(),m=d?.replace(/[0-9]/g,"").substring(0,d.lastIndexOf("-"));return e("div",{className:a(["adyen-checkout__radio_group",`adyen-checkout__radio_group--${u}`]),role:"radiogroup",..._&&{"aria-label":_}},i.map((o=>{const i=r(m);return e("div",{key:o.id,className:"adyen-checkout__radio_group__input-wrapper"},e("input",{id:i,type:"radio",checked:c===o.id,className:"adyen-checkout__radio_group__input",name:n,onChange:l,onClick:l,value:o.id}),e("label",{className:a(["adyen-checkout__label__text","adyen-checkout__radio_group__label",t.className,{"adyen-checkout__radio_group__label--invalid":s}]),htmlFor:i},p.get(o.name)))})))}t.defaultProps={onChange:()=>{},items:[]};export{t as default};
|
|
2
2
|
//# sourceMappingURL=RadioGroup.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioGroup.js","sources":["../../../../../../src/components/internal/FormFields/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { h } from 'preact';\nimport cx from 'classnames';\nimport './RadioGroup.scss';\nimport { RadioGroupProps } from './types';\nimport { getUniqueId } from '../../../../utils/idGenerator';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\n\nexport default function RadioGroup(props: RadioGroupProps) {\n const { items, name, onChange, value, isInvalid, uniqueId, ariaLabel } = props;\n\n const { i18n } = useCoreContext();\n const uniqueIdBase = uniqueId?.replace(/[0-9]/g, '').substring(0, uniqueId.lastIndexOf('-'));\n\n return (\n <div
|
|
1
|
+
{"version":3,"file":"RadioGroup.js","sources":["../../../../../../src/components/internal/FormFields/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { h } from 'preact';\nimport cx from 'classnames';\nimport './RadioGroup.scss';\nimport { RadioGroupProps } from './types';\nimport { getUniqueId } from '../../../../utils/idGenerator';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\n\nexport default function RadioGroup(props: RadioGroupProps) {\n const { items, name, onChange, value, isInvalid, uniqueId, ariaLabel, style = 'classic' } = props;\n\n const { i18n } = useCoreContext();\n const uniqueIdBase = uniqueId?.replace(/[0-9]/g, '').substring(0, uniqueId.lastIndexOf('-'));\n\n return (\n <div\n className={cx(['adyen-checkout__radio_group', `adyen-checkout__radio_group--${style}`])}\n role={'radiogroup'}\n {...(ariaLabel && { ['aria-label']: ariaLabel })}\n >\n {items.map(item => {\n const uniqueId = getUniqueId(uniqueIdBase);\n return (\n <div key={item.id} className=\"adyen-checkout__radio_group__input-wrapper\">\n <input\n id={uniqueId}\n type=\"radio\"\n checked={value === item.id}\n className=\"adyen-checkout__radio_group__input\"\n name={name}\n onChange={onChange}\n onClick={onChange}\n value={item.id}\n />\n <label\n className={cx([\n 'adyen-checkout__label__text',\n 'adyen-checkout__radio_group__label',\n props.className,\n { 'adyen-checkout__radio_group__label--invalid': isInvalid }\n ])}\n htmlFor={uniqueId}\n >\n {i18n.get(item.name)}\n </label>\n </div>\n );\n })}\n </div>\n );\n}\n\nRadioGroup.defaultProps = {\n onChange: () => {},\n items: []\n};\n"],"names":["RadioGroup","props","items","name","onChange","value","isInvalid","uniqueId","ariaLabel","style","i18n","useCoreContext","uniqueIdBase","replace","substring","lastIndexOf","h","div","className","cx","role","map","item","getUniqueId","key","id","input","type","checked","onClick","label","htmlFor","get","defaultProps"],"mappings":"4QAOe,SAASA,EAAWC,GAC/B,MAAMC,MAAEA,EAAKC,KAAEA,EAAIC,SAAEA,EAAQC,MAAEA,EAAKC,UAAEA,EAASC,SAAEA,EAAQC,UAAEA,EAASC,MAAEA,EAAQ,WAAcR,GAEtFS,KAAEA,GAASC,IACXC,EAAeL,GAAUM,QAAQ,SAAU,IAAIC,UAAU,EAAGP,EAASQ,YAAY,MAEvF,OACIC,EAACC,MAAAA,CACGC,UAAWC,EAAG,CAAC,8BAA+B,gCAAgCV,MAC9EW,KAAM,gBACDZ,GAAa,CAAE,aAAgBA,IAEnCN,EAAMmB,KAAIC,IACP,MAAMf,EAAWgB,EAAYX,GAC7B,OACII,EAACC,MAAAA,CAAIO,IAAKF,EAAKG,GAAIP,UAAU,8CACzBF,EAACU,QAAAA,CACGD,GAAIlB,EACJoB,KAAK,QACLC,QAASvB,IAAUiB,EAAKG,GACxBP,UAAU,qCACVf,KAAMA,EACNC,SAAUA,EACVyB,QAASzB,EACTC,MAAOiB,EAAKG,KAEhBT,EAACc,QAAAA,CACGZ,UAAWC,EAAG,CACV,8BACA,qCACAlB,EAAMiB,UACN,CAAE,8CAA+CZ,KAErDyB,QAASxB,GAERG,EAAKsB,IAAIV,EAAKnB,OAAI,IAO/C,CAEAH,EAAWiC,aAAe,CACtB7B,SAAU,OACVF,MAAO"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"QRLoader.js","sources":["../../../../../src/components/internal/QRLoader/QRLoader.tsx"],"sourcesContent":["import { Component, h } from 'preact';\nimport Countdown from '../Countdown';\nimport Button from '../Button';\nimport Spinner from '../Spinner';\nimport checkPaymentStatus from '../../../core/Services/payment-status';\nimport processResponse from '../../../core/ProcessResponse';\n\nimport './QRLoader.scss';\nimport { QRLoaderProps, QRLoaderState } from './types';\nimport copyToClipboard from '../../../utils/clipboard';\nimport AdyenCheckoutError from '../../../core/Errors/AdyenCheckoutError';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport ContentSeparator from '../ContentSeparator';\nimport { StatusObject } from '../Await/types';\nimport useImage from '../../../core/Context/useImage';\nimport { useA11yReporter } from '../../../core/Errors/useA11yReporter';\nimport useAutoFocus from '../../../utils/useAutoFocus';\nimport { ANALYTICS_DOWNLOAD_STR, ANALYTICS_QR_CODE_DOWNLOAD } from '../../../core/Analytics/constants';\nimport { PREFIX } from '../Icon/constants';\n\nconst QRCODE_URL = 'barcode.shtml?barcodeType=qrCode&fileType=png&data=';\n\nclass QRLoader extends Component<QRLoaderProps, QRLoaderState> {\n private timeoutId;\n\n constructor(props) {\n super(props);\n\n this.state = {\n buttonStatus: 'default',\n completed: false,\n delay: props.delay,\n expired: false,\n loading: true,\n percentage: 100,\n timePassed: 0\n };\n }\n\n public static defaultProps = {\n delay: 2000,\n countdownTime: 15,\n onError: () => {},\n onComplete: () => {},\n throttleTime: 60000,\n classNameModifiers: [],\n throttledInterval: 10000,\n introduction: 'wechatpay.scanqrcode',\n timeToPay: 'wechatpay.timetopay',\n buttonLabel: 'openApp'\n };\n\n componentDidMount() {\n this.statusInterval();\n }\n\n componentWillUnmount() {\n clearTimeout(this.timeoutId);\n }\n\n public redirectToApp = (url: string | URL) => {\n window.location.assign(url);\n };\n\n // Retry until getting a complete response from the server, or it times out\n public statusInterval = (responseTime = 0) => {\n // If we are already in the final statuses, do not poll!\n if (this.state.expired || this.state.completed) return;\n\n this.setState(previous => ({ timePassed: previous.timePassed + this.props.delay + responseTime }));\n // Changes interval time to 10 seconds after 1 minute (60 seconds)\n const newDelay = this.state.timePassed >= this.props.throttleTime ? this.props.throttledInterval : this.state.delay;\n this.pollStatus(newDelay);\n };\n\n private pollStatus(delay: number) {\n clearTimeout(this.timeoutId);\n\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n this.timeoutId = setTimeout(async () => {\n // Wait for previous status call to finish.\n // Also taking the server response time into the consideration to calculate timePassed.\n const start = performance.now();\n await this.checkStatus();\n const end = performance.now();\n this.statusInterval(Math.round(end - start));\n }, delay);\n }\n\n private onTick = (time): void => {\n this.setState({ percentage: time.percentage });\n };\n\n private onTimeUp = (): void => {\n this.setState({ expired: true });\n clearTimeout(this.timeoutId);\n this.props.onError(new AdyenCheckoutError('ERROR', 'Payment Expired'));\n };\n\n private onComplete = (status: StatusObject): void => {\n clearTimeout(this.timeoutId);\n this.setState({ completed: true, loading: false });\n\n const state = {\n data: {\n details: { payload: status.props.payload },\n paymentData: this.props.paymentData\n }\n };\n\n this.props.onComplete(state, this);\n };\n\n private onError = (status: StatusObject): void => {\n clearTimeout(this.timeoutId);\n this.setState({ expired: true, loading: false });\n\n if (status.props.payload) {\n const state = {\n data: {\n details: { payload: status.props.payload },\n paymentData: this.props.paymentData\n }\n };\n this.props.onComplete(state, this);\n }\n\n const error = new AdyenCheckoutError('ERROR', 'error result with no payload in response');\n return this.props.onError(error);\n };\n\n private checkStatus = () => {\n const { paymentData, clientKey, loadingContext, throttledInterval } = this.props;\n\n return checkPaymentStatus(paymentData, clientKey, loadingContext, throttledInterval)\n .then(processResponse)\n .catch(response => ({ type: 'network-error', props: response }))\n .then((status: StatusObject) => {\n switch (status.type) {\n case 'success':\n this.onComplete(status);\n break;\n case 'error':\n this.onError(status);\n break;\n default:\n this.setState({ loading: false });\n }\n return status;\n });\n };\n\n render({ amount, url, brandLogo, brandName, countdownTime, type, onActionHandled }: QRLoaderProps, { expired, completed, loading }) {\n const { i18n, loadingContext } = useCoreContext();\n const getImage = useImage();\n const qrCodeImage = this.props.qrCodeData ? `${loadingContext}${QRCODE_URL}${this.props.qrCodeData}` : this.props.qrCodeImage;\n const finalState = (image, message) => {\n const status = i18n.get(message);\n useA11yReporter(status);\n return (\n <div className=\"adyen-checkout__qr-loader adyen-checkout__qr-loader--result\">\n <img\n className=\"adyen-checkout__qr-loader__icon adyen-checkout__qr-loader__icon--result\"\n src={getImage({ imageFolder: 'components/' })(image)}\n alt={status}\n />\n <div className=\"adyen-checkout__qr-loader__subtitle adyen-checkout__qr-loader__subtitle--result\">{status}</div>\n </div>\n );\n };\n\n if (expired) {\n return finalState('error', 'error.subtitle.payment');\n }\n\n if (completed) {\n return finalState('success', 'creditCard.success');\n }\n\n if (loading) {\n return (\n <div className=\"adyen-checkout__qr-loader\">\n {brandLogo && <img alt={brandName} src={brandLogo} className=\"adyen-checkout__qr-loader__brand-logo\" />}\n <Spinner />\n </div>\n );\n }\n\n const timeToPayString = i18n.get(this.props.timeToPay).split('%@');\n\n const qrSubtitleRef = useAutoFocus();\n const classnames = this.props.classNameModifiers.map(m => `adyen-checkout__qr-loader--${m}`);\n\n return (\n <div className={`adyen-checkout__qr-loader adyen-checkout__qr-loader--${type} ${classnames.join(' ')}`}>\n {brandLogo && <img src={brandLogo} alt={brandName} className=\"adyen-checkout__qr-loader__brand-logo\" />}\n\n {amount && amount.value && amount.currency && (\n <div className=\"adyen-checkout__qr-loader__payment_amount\">{i18n.amount(amount.value, amount.currency)}</div>\n )}\n\n {url && (\n <div className=\"adyen-checkout__qr-loader__app-link\">\n {this.props.redirectIntroduction && (\n <div className=\"adyen-checkout__qr-loader__subtitle\">{i18n.get(this.props.redirectIntroduction)}</div>\n )}\n <Button classNameModifiers={['qr-loader']} onClick={() => this.redirectToApp(url)} label={i18n.get(this.props.buttonLabel)} />\n <ContentSeparator />\n </div>\n )}\n\n {/* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex */}\n <div ref={qrSubtitleRef} tabIndex={0} className=\"adyen-checkout__qr-loader__subtitle\">\n {i18n.get(this.props.introduction)}\n </div>\n\n <img\n src={qrCodeImage}\n alt={i18n.get('wechatpay.scanqrcode')}\n onLoad={() => {\n onActionHandled?.({ componentType: this.props.type, actionDescription: 'qr-code-loaded' });\n }}\n />\n\n <div className=\"adyen-checkout__qr-loader__progress\">\n <span className=\"adyen-checkout__qr-loader__percentage\" style={{ width: `${this.state.percentage}%` }} />\n </div>\n\n <div className=\"adyen-checkout__qr-loader__countdown\">\n {timeToPayString[0]} \n <Countdown minutesFromNow={countdownTime} onTick={this.onTick} onCompleted={this.onTimeUp} />\n {timeToPayString[1]}\n </div>\n\n {typeof this.props.instructions === 'string' ? (\n <div className=\"adyen-checkout__qr-loader__instructions\">{i18n.get(this.props.instructions)}</div>\n ) : (\n this.props.instructions?.()\n )}\n\n {this.props.copyBtn && (\n <div className=\"adyen-checkout__qr-loader__actions\">\n <Button\n inline\n variant=\"action\"\n onClick={(e, { complete }) => {\n copyToClipboard(this.props.qrCodeData);\n this.props.onSubmitAnalytics({\n type: ANALYTICS_DOWNLOAD_STR,\n target: ANALYTICS_QR_CODE_DOWNLOAD\n });\n complete();\n }}\n icon={getImage({ imageFolder: 'components/' })(`${PREFIX}copy`)}\n label={i18n.get('button.copy')}\n />\n </div>\n )}\n </div>\n );\n }\n}\n\nexport default QRLoader;\n"],"names":["QRLoader","Component","timeoutId","constructor","props","super","this","state","buttonStatus","completed","delay","expired","loading","percentage","timePassed","static","countdownTime","onError","onComplete","throttleTime","classNameModifiers","throttledInterval","introduction","timeToPay","buttonLabel","componentDidMount","statusInterval","componentWillUnmount","clearTimeout","redirectToApp","url","window","location","assign","responseTime","setState","previous","newDelay","pollStatus","setTimeout","async","start","performance","now","checkStatus","end","Math","round","onTick","time","onTimeUp","AdyenCheckoutError","status","data","details","payload","paymentData","error","clientKey","loadingContext","checkPaymentStatus","then","processResponse","catch","response","type","render","amount","brandLogo","brandName","onActionHandled","i18n","useCoreContext","getImage","useImage","qrCodeImage","qrCodeData","finalState","image","message","get","useA11yReporter","h","div","className","img","src","imageFolder","alt","Spinner","timeToPayString","split","qrSubtitleRef","useAutoFocus","classnames","map","m","join","value","currency","redirectIntroduction","Button","onClick","label","ContentSeparator","ref","tabIndex","onLoad","componentType","actionDescription","span","style","width","Countdown","minutesFromNow","onCompleted","instructions","copyBtn","inline","variant","e","complete","copyToClipboard","onSubmitAnalytics","ANALYTICS_DOWNLOAD_STR","target","ANALYTICS_QR_CODE_DOWNLOAD","icon","PREFIX"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"QRLoader.js","sources":["../../../../../src/components/internal/QRLoader/QRLoader.tsx"],"sourcesContent":["import { Component, h } from 'preact';\nimport Countdown from '../Countdown';\nimport Button from '../Button';\nimport Spinner from '../Spinner';\nimport checkPaymentStatus from '../../../core/Services/payment-status';\nimport processResponse from '../../../core/ProcessResponse';\n\nimport './QRLoader.scss';\nimport { QRLoaderProps, QRLoaderState } from './types';\nimport copyToClipboard from '../../../utils/clipboard';\nimport AdyenCheckoutError from '../../../core/Errors/AdyenCheckoutError';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport ContentSeparator from '../ContentSeparator';\nimport { StatusObject } from '../Await/types';\nimport useImage from '../../../core/Context/useImage';\nimport { useA11yReporter } from '../../../core/Errors/useA11yReporter';\nimport useAutoFocus from '../../../utils/useAutoFocus';\nimport { ANALYTICS_DOWNLOAD_STR, ANALYTICS_QR_CODE_DOWNLOAD } from '../../../core/Analytics/constants';\nimport { PREFIX } from '../Icon/constants';\n\nconst QRCODE_URL = 'barcode.shtml?barcodeType=qrCode&fileType=png&data=';\n\nclass QRLoader extends Component<QRLoaderProps, QRLoaderState> {\n private timeoutId;\n\n constructor(props) {\n super(props);\n\n this.state = {\n buttonStatus: 'default',\n completed: false,\n delay: props.delay,\n expired: false,\n loading: true,\n percentage: 100,\n timePassed: 0\n };\n }\n\n public static defaultProps = {\n delay: 2000,\n countdownTime: 15,\n onError: () => {},\n onComplete: () => {},\n throttleTime: 60000,\n classNameModifiers: [],\n throttledInterval: 10000,\n introduction: 'wechatpay.scanqrcode',\n timeToPay: 'wechatpay.timetopay',\n buttonLabel: 'openApp'\n };\n\n componentDidMount() {\n this.statusInterval();\n }\n\n componentWillUnmount() {\n clearTimeout(this.timeoutId);\n }\n\n public redirectToApp = (url: string | URL) => {\n window.location.assign(url);\n };\n\n // Retry until getting a complete response from the server, or it times out\n public statusInterval = (responseTime = 0) => {\n // If we are already in the final statuses, do not poll!\n if (this.state.expired || this.state.completed) return;\n\n this.setState(previous => ({ timePassed: previous.timePassed + this.props.delay + responseTime }));\n // Changes interval time to 10 seconds after 1 minute (60 seconds)\n const newDelay = this.state.timePassed >= this.props.throttleTime ? this.props.throttledInterval : this.state.delay;\n this.pollStatus(newDelay);\n };\n\n private pollStatus(delay: number) {\n clearTimeout(this.timeoutId);\n\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n this.timeoutId = setTimeout(async () => {\n // Wait for previous status call to finish.\n // Also taking the server response time into the consideration to calculate timePassed.\n const start = performance.now();\n await this.checkStatus();\n const end = performance.now();\n this.statusInterval(Math.round(end - start));\n }, delay);\n }\n\n private onTick = (time): void => {\n this.setState({ percentage: time.percentage });\n };\n\n private onTimeUp = (): void => {\n this.setState({ expired: true });\n clearTimeout(this.timeoutId);\n this.props.onError(new AdyenCheckoutError('ERROR', 'Payment Expired'));\n };\n\n private onComplete = (status: StatusObject): void => {\n clearTimeout(this.timeoutId);\n this.setState({ completed: true, loading: false });\n\n const state = {\n data: {\n details: { payload: status.props.payload },\n paymentData: this.props.paymentData\n }\n };\n\n this.props.onComplete(state, this);\n };\n\n private onError = (status: StatusObject): void => {\n clearTimeout(this.timeoutId);\n this.setState({ expired: true, loading: false });\n\n if (status.props.payload) {\n const state = {\n data: {\n details: { payload: status.props.payload },\n paymentData: this.props.paymentData\n }\n };\n this.props.onComplete(state, this);\n }\n\n const error = new AdyenCheckoutError('ERROR', 'error result with no payload in response');\n return this.props.onError(error);\n };\n\n private checkStatus = () => {\n const { paymentData, clientKey, loadingContext, throttledInterval } = this.props;\n\n return checkPaymentStatus(paymentData, clientKey, loadingContext, throttledInterval)\n .then(processResponse)\n .catch(response => ({ type: 'network-error', props: response }))\n .then((status: StatusObject) => {\n switch (status.type) {\n case 'success':\n this.onComplete(status);\n break;\n case 'error':\n this.onError(status);\n break;\n default:\n this.setState({ loading: false });\n }\n return status;\n });\n };\n\n render({ amount, url, brandLogo, brandName, countdownTime, type, onActionHandled }: QRLoaderProps, { expired, completed, loading }) {\n const { i18n, loadingContext } = useCoreContext();\n const getImage = useImage();\n const qrCodeImage = this.props.qrCodeData ? `${loadingContext}${QRCODE_URL}${this.props.qrCodeData}` : this.props.qrCodeImage;\n const finalState = (image, message) => {\n const status = i18n.get(message);\n useA11yReporter(status);\n return (\n <div className=\"adyen-checkout__qr-loader adyen-checkout__qr-loader--result\">\n <img\n className=\"adyen-checkout__qr-loader__icon adyen-checkout__qr-loader__icon--result\"\n src={getImage({ imageFolder: 'components/' })(image)}\n alt={status}\n />\n <div className=\"adyen-checkout__qr-loader__subtitle adyen-checkout__qr-loader__subtitle--result\">{status}</div>\n </div>\n );\n };\n\n if (expired) {\n return finalState('error', 'error.subtitle.payment');\n }\n\n if (completed) {\n return finalState('success', 'creditCard.success');\n }\n\n if (loading) {\n return (\n <div className=\"adyen-checkout__qr-loader\">\n {brandLogo && <img alt={brandName} src={brandLogo} className=\"adyen-checkout__qr-loader__brand-logo\" />}\n <Spinner />\n </div>\n );\n }\n\n const timeToPayString = i18n.get(this.props.timeToPay).split('%@');\n\n const qrSubtitleRef = useAutoFocus();\n const classnames = this.props.classNameModifiers.map(m => `adyen-checkout__qr-loader--${m}`);\n\n return (\n <div className={`adyen-checkout__qr-loader adyen-checkout__qr-loader--${type} ${classnames.join(' ')}`}>\n {brandLogo && <img src={brandLogo} alt={brandName} className=\"adyen-checkout__qr-loader__brand-logo\" />}\n\n {amount && amount.value && amount.currency && (\n <div className=\"adyen-checkout__qr-loader__payment_amount\">{i18n.amount(amount.value, amount.currency)}</div>\n )}\n\n {url && (\n <div className=\"adyen-checkout__qr-loader__app-link\">\n {this.props.redirectIntroduction && (\n <div className=\"adyen-checkout__qr-loader__subtitle\">{i18n.get(this.props.redirectIntroduction)}</div>\n )}\n <Button classNameModifiers={['qr-loader']} onClick={() => this.redirectToApp(url)} label={i18n.get(this.props.buttonLabel)} />\n <ContentSeparator />\n </div>\n )}\n\n {/* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex */}\n <div ref={qrSubtitleRef} tabIndex={0} className=\"adyen-checkout__qr-loader__subtitle\">\n {i18n.get(this.props.introduction)}\n </div>\n\n <img\n src={qrCodeImage}\n alt={i18n.get('wechatpay.scanqrcode')}\n onLoad={() => {\n onActionHandled?.({\n componentType: this.props.type,\n actionDescription: 'qr-code-loaded'\n });\n }}\n />\n\n <div className=\"adyen-checkout__qr-loader__progress\">\n <span className=\"adyen-checkout__qr-loader__percentage\" style={{ width: `${this.state.percentage}%` }} />\n </div>\n\n <div className=\"adyen-checkout__qr-loader__countdown\">\n {timeToPayString[0]} \n <Countdown minutesFromNow={countdownTime} onTick={this.onTick} onCompleted={this.onTimeUp} />\n {timeToPayString[1]}\n </div>\n\n {typeof this.props.instructions === 'string' ? (\n <div className=\"adyen-checkout__qr-loader__instructions\">{i18n.get(this.props.instructions)}</div>\n ) : (\n this.props.instructions?.()\n )}\n\n {this.props.copyBtn && (\n <div className=\"adyen-checkout__qr-loader__actions\">\n <Button\n inline\n variant=\"action\"\n onClick={(e, { complete }) => {\n copyToClipboard(this.props.qrCodeData);\n this.props.onSubmitAnalytics({\n type: ANALYTICS_DOWNLOAD_STR,\n target: ANALYTICS_QR_CODE_DOWNLOAD\n });\n complete();\n }}\n icon={getImage({ imageFolder: 'components/' })(`${PREFIX}copy`)}\n label={i18n.get('button.copy')}\n />\n </div>\n )}\n </div>\n );\n }\n}\n\nexport default QRLoader;\n"],"names":["QRLoader","Component","timeoutId","constructor","props","super","this","state","buttonStatus","completed","delay","expired","loading","percentage","timePassed","static","countdownTime","onError","onComplete","throttleTime","classNameModifiers","throttledInterval","introduction","timeToPay","buttonLabel","componentDidMount","statusInterval","componentWillUnmount","clearTimeout","redirectToApp","url","window","location","assign","responseTime","setState","previous","newDelay","pollStatus","setTimeout","async","start","performance","now","checkStatus","end","Math","round","onTick","time","onTimeUp","AdyenCheckoutError","status","data","details","payload","paymentData","error","clientKey","loadingContext","checkPaymentStatus","then","processResponse","catch","response","type","render","amount","brandLogo","brandName","onActionHandled","i18n","useCoreContext","getImage","useImage","qrCodeImage","qrCodeData","finalState","image","message","get","useA11yReporter","h","div","className","img","src","imageFolder","alt","Spinner","timeToPayString","split","qrSubtitleRef","useAutoFocus","classnames","map","m","join","value","currency","redirectIntroduction","Button","onClick","label","ContentSeparator","ref","tabIndex","onLoad","componentType","actionDescription","span","style","width","Countdown","minutesFromNow","onCompleted","instructions","copyBtn","inline","variant","e","complete","copyToClipboard","onSubmitAnalytics","ANALYTICS_DOWNLOAD_STR","target","ANALYTICS_QR_CODE_DOWNLOAD","icon","PREFIX"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as t}from"../../../external/preact/dist/preact.js";import e from"../BaseElement/BaseElement.js";import s from"../PayButton/PayButton.js";import{assertIsDropin as i,getRegulatoryDefaults as n,sanitizeResponse as o,verifyPaymentDidNotFail as r,cleanupFinalResult as a}from"./utils.js";import h from"../../../core/Errors/AdyenCheckoutError.js";import{hasOwnProperty as l}from"../../../utils/hasOwnProperty.js";import{ANALYTICS_SUBMIT_STR as d}from"../../../core/Analytics/constants.js";
|
|
1
|
+
import{createElement as t}from"../../../external/preact/dist/preact.js";import e from"../BaseElement/BaseElement.js";import s from"../PayButton/PayButton.js";import{assertIsDropin as i,getRegulatoryDefaults as n,sanitizeResponse as o,verifyPaymentDidNotFail as r,cleanupFinalResult as a}from"./utils.js";import h from"../../../core/Errors/AdyenCheckoutError.js";import{hasOwnProperty as l}from"../../../utils/hasOwnProperty.js";import{ANALYTICS_SUBMIT_STR as d}from"../../../core/Analytics/constants.js";import p from"../../../core/Errors/CancelError.js";class c extends e{componentRef;resources;elementRef;static type=void 0;static txVariants=[];constructor(t,e){super(t,e),this.core.register(this.constructor),this.submit=this.submit.bind(this),this.setState=this.setState.bind(this),this.onComplete=this.onComplete.bind(this),this.handleAction=this.handleAction.bind(this),this.handleOrder=this.handleOrder.bind(this),this.handleAdditionalDetails=this.handleAdditionalDetails.bind(this),this.handleResponse=this.handleResponse.bind(this),this.setElementStatus=this.setElementStatus.bind(this),this.submitAnalytics=this.submitAnalytics.bind(this),this.makePaymentsCall=this.makePaymentsCall.bind(this),this.makeAdditionalDetailsCall=this.makeAdditionalDetailsCall.bind(this),this.submitUsingSessionsFlow=this.submitUsingSessionsFlow.bind(this),this.elementRef=e&&e.elementRef||this,this.resources=this.props.modules?this.props.modules.resources:void 0,this.storeElementRefOnCore(this.props),this.onEnterKeyPressed=this.onEnterKeyPressed.bind(this),this.onActionHandled=this.onActionHandled.bind(this)}buildElementProps(t){const e={showPayButton:!0,...this.core.getCorePropsForComponent(),...!!t?.isStoredPaymentMethod?{}:this.core.paymentMethodsResponse.find(t?.type||this.constructor.type),...t},s=i(this);this.props=this.formatProps({...this.constructor.defaultProps,...n(this.core.options.countryCode,s),...e})}storeElementRefOnCore(t){t?.isDropin||this.core.storeElementReference(this)}isAvailable(){return Promise.resolve()}setState(t){this.state={...this.state,...t},this.onChange()}showValidation(){return this.componentRef&&this.componentRef.showValidation&&this.componentRef.showValidation(),this}setElementStatus(t,e){return this.elementRef?.setStatus(t,e),this}setStatus(t,e){return this.componentRef?.setStatus&&this.componentRef.setStatus(t,e),this}onChange(){this.props.onChange?.({data:this.data,isValid:this.isValid,errors:this.state.errors,valid:this.state.valid},this.elementRef)}setUpAnalytics(t){const e=this.props.session?.id;return this.props.modules.analytics.setUp({...t,...e&&{sessionId:e}})}submitAnalytics(t,e){try{let s=this.constructor.analyticsType;s||(s="scheme"===this.constructor.type||"bcmc"===this.constructor.type?this.constructor.type:this.props.type),this.props.modules.analytics.sendAnalytics(s,t,e)}catch(t){console.warn("Failed to submit the analytics event. Error:",t)}}submit(){this.isValid?this.makePaymentsCall().then(o).then(r).then(this.handleResponse).catch((t=>{t instanceof p?this.setElementStatus("ready"):this.handleFailedResult(t)})):this.showValidation()}makePaymentsCall(){if(this.setElementStatus("loading"),this.props.onSubmit)return this.submitUsingAdvancedFlow();if(this.core.session){return(this.props.beforeSubmit?new Promise(((t,e)=>this.props.beforeSubmit(this.data,this.elementRef,{resolve:t,reject:()=>e(new p("beforeSubmitRejected"))}))):Promise.resolve(this.data)).then(this.submitUsingSessionsFlow)}this.handleError(new h("IMPLEMENTATION_ERROR",'It can not perform /payments call. Callback "onSubmit" is missing or Checkout session is not available'))}async submitUsingAdvancedFlow(){return new Promise(((t,e)=>{this.submitAnalytics({type:d}),this.props.onSubmit({data:this.data,isValid:this.isValid},this.elementRef,{resolve:t,reject:e})}))}async submitUsingSessionsFlow(t){this.submitAnalytics({type:d});try{return await this.core.session.submitPayment(t)}catch(t){return t instanceof h?this.handleError(t):this.handleError(new h("ERROR","Error when making /payments call",{cause:t})),Promise.reject(t)}}onComplete(t){this.props.onComplete&&this.props.onComplete(t,this.elementRef)}handleError=t=>{this.setElementStatus("ready"),this.props.onError&&this.props.onError(t,this.elementRef)};handleAdditionalDetails(t){this.makeAdditionalDetailsCall(t).then(o).then(r).then(this.handleResponse).catch(this.handleFailedResult)}makeAdditionalDetailsCall(t){return this.props.onAdditionalDetails?new Promise(((e,s)=>{this.props.onAdditionalDetails(t,this.elementRef,{resolve:e,reject:s})})):this.core.session?this.submitAdditionalDetailsUsingSessionsFlow(t.data):void this.handleError(new h("IMPLEMENTATION_ERROR",'It can not perform /payments/details call. Callback "onAdditionalDetails" is missing or Checkout session is not available'))}async submitAdditionalDetailsUsingSessionsFlow(t){try{return await this.core.session.submitDetails(t)}catch(t){return t instanceof h?this.handleError(t):this.handleError(new h("ERROR","Error when making /details call",{cause:t})),Promise.reject(t)}}handleAction(t,e={}){if(!t||!t.type){if(l(t,"action")&&l(t,"resultCode"))throw new Error('handleAction::Invalid Action - the passed action object itself has an "action" property and a "resultCode": have you passed in the whole response object by mistake?');throw new Error('handleAction::Invalid Action - the passed action object does not have a "type" property')}const s=this.core.createFromAction(t,{...this.elementRef.props,...e,onAdditionalDetails:this.handleAdditionalDetails});return s?(this.unmount(),s.mount(this._node)):null}onActionHandled(t){this.props?.onActionHandled?.({originalAction:this.props.originalAction,...t})}handleOrder=t=>{const{order:e}=t;(this.core.session?this.core.update({order:e}):this.handleAdvanceFlowPaymentMethodsUpdate(e)).then((()=>{this.props.onOrderUpdated?.({order:e})}))};handleFailedResult=t=>{i(this.elementRef)&&this.elementRef.displayFinalAnimation("error"),a(t),this.props.onPaymentFailed?.(t,this.elementRef)};handleSuccessResult=t=>{i(this.elementRef)&&this.elementRef.displayFinalAnimation("success"),a(t),this.props.onPaymentCompleted?.(t,this.elementRef)};handleResponse(t){const e=o(t);e.action?this.elementRef.handleAction(e.action):e.order?.remainingAmount?.value>0?this.handleOrder(e):this.handleSuccessResult(e)}handleKeyPress(t){"Enter"!==t.key&&"Enter"!==t.code||(t.preventDefault(),this.onEnterKeyPressed(document?.activeElement,this))}onEnterKeyPressed(t,e){this.props.onEnterKeyPressed?this.props.onEnterKeyPressed(t,e):(t.blur(),this.submit())}updateParent(t={}){return this.elementRef.core.update(t)}setComponentRef=t=>{this.componentRef=t};get isValid(){return!1}get icon(){const t=this.props.paymentMethodType||this.type;return this.props.icon??this.resources.getImage()(t)}get displayName(){const t=this.core.paymentMethodsResponse?.paymentMethods?.find((t=>t.type===this.type));return this.props.name||t?.name||this.type}get accessibleName(){return this.displayName}get additionalInfo(){return null}get type(){return this.props.type||this.constructor.type}payButton=e=>t(s,{...e,amount:this.props.amount,secondaryAmount:this.props.secondaryAmount,onClick:this.submit});async handleAdvanceFlowPaymentMethodsUpdate(t,e){return new Promise(((e,s)=>{if(!this.props.onPaymentMethodsRequest)return e();this.props.onPaymentMethodsRequest({...t&&{order:{orderData:t.orderData,pspReference:t.pspReference}},locale:this.core.options.locale},{resolve:e,reject:s})})).catch((t=>{this.handleError(new h("IMPLEMENTATION_ERROR","Something failed during payment methods update or onPaymentMethodsRequest was not implemented",{cause:t}))})).then((s=>this.core.update({...s&&{paymentMethodsResponse:s},order:t,amount:t?t.remainingAmount:e})))}}export{c as UIElement,c as default};
|
|
2
2
|
//# sourceMappingURL=UIElement.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UIElement.js","sources":["../../../../../src/components/internal/UIElement/UIElement.tsx"],"sourcesContent":["import { h } from 'preact';\nimport BaseElement from '../BaseElement/BaseElement';\nimport PayButton from '../PayButton';\nimport { assertIsDropin, cleanupFinalResult, getRegulatoryDefaults, sanitizeResponse, verifyPaymentDidNotFail } from './utils';\nimport AdyenCheckoutError from '../../../core/Errors/AdyenCheckoutError';\nimport { hasOwnProperty } from '../../../utils/hasOwnProperty';\nimport { Resources } from '../../../core/Context/Resources';\nimport { ANALYTICS_SUBMIT_STR } from '../../../core/Analytics/constants';\n\nimport type { AnalyticsInitialEvent, SendAnalyticsObject } from '../../../core/Analytics/types';\nimport type { CoreConfiguration, ICore, AdditionalDetailsData } from '../../../core/types';\nimport type { ComponentMethodsRef, PayButtonFunctionProps, UIElementProps, UIElementStatus } from './types';\nimport type { CheckoutSessionDetailsResponse, CheckoutSessionPaymentResponse } from '../../../core/CheckoutSession/types';\nimport type {\n CheckoutAdvancedFlowResponse,\n Order,\n PaymentAction,\n PaymentAmount,\n PaymentData,\n PaymentMethodsResponse,\n PaymentResponseData,\n RawPaymentResponse\n} from '../../../types/global-types';\nimport type { IDropin } from '../../Dropin/types';\nimport type { NewableComponent } from '../../../core/core.registry';\n\nimport './UIElement.scss';\n\nexport abstract class UIElement<P extends UIElementProps = UIElementProps> extends BaseElement<P> {\n protected componentRef: any;\n\n protected resources: Resources;\n\n public elementRef: UIElement;\n\n public static type = undefined;\n\n /**\n * Defines all txVariants that the Component supports (in case it support multiple ones besides the 'type' one)\n */\n public static txVariants: string[] = [];\n\n constructor(checkout: ICore, props?: P) {\n super(checkout, props);\n\n this.core.register(this.constructor as NewableComponent);\n\n this.submit = this.submit.bind(this);\n this.setState = this.setState.bind(this);\n this.onComplete = this.onComplete.bind(this);\n this.handleAction = this.handleAction.bind(this);\n this.handleOrder = this.handleOrder.bind(this);\n this.handleAdditionalDetails = this.handleAdditionalDetails.bind(this);\n this.handleResponse = this.handleResponse.bind(this);\n this.setElementStatus = this.setElementStatus.bind(this);\n this.submitAnalytics = this.submitAnalytics.bind(this);\n this.makePaymentsCall = this.makePaymentsCall.bind(this);\n this.makeAdditionalDetailsCall = this.makeAdditionalDetailsCall.bind(this);\n this.submitUsingSessionsFlow = this.submitUsingSessionsFlow.bind(this);\n\n this.elementRef = (props && props.elementRef) || this;\n this.resources = this.props.modules ? this.props.modules.resources : undefined;\n\n this.storeElementRefOnCore(this.props);\n\n this.onEnterKeyPressed = this.onEnterKeyPressed.bind(this);\n }\n\n protected override buildElementProps(componentProps?: P) {\n const globalCoreProps = this.core.getCorePropsForComponent();\n const isStoredPaymentMethod = !!componentProps?.isStoredPaymentMethod;\n const paymentMethodsResponseProps = isStoredPaymentMethod\n ? {}\n : this.core.paymentMethodsResponse.find(componentProps?.type || this.constructor['type']);\n\n const finalProps = {\n showPayButton: true,\n ...globalCoreProps,\n ...paymentMethodsResponseProps,\n ...componentProps\n };\n\n const isDropin = assertIsDropin(this as unknown as IDropin);\n\n this.props = this.formatProps({\n ...this.constructor['defaultProps'], // component defaults\n ...getRegulatoryDefaults(this.core.options.countryCode, isDropin), // regulatory defaults\n ...finalProps // the rest (inc. merchant defined config)\n });\n }\n\n protected storeElementRefOnCore(props?: P) {\n if (!props?.isDropin) {\n this.core.storeElementReference(this);\n }\n }\n\n public isAvailable(): Promise<void> {\n return Promise.resolve();\n }\n\n public setState(newState: object): void {\n this.state = { ...this.state, ...newState };\n this.onChange();\n }\n\n public showValidation(): this {\n if (this.componentRef && this.componentRef.showValidation) this.componentRef.showValidation();\n return this;\n }\n\n public setElementStatus(status: UIElementStatus, props?: any): this {\n this.elementRef?.setStatus(status, props);\n return this;\n }\n\n public setStatus(status: UIElementStatus, props?): this {\n if (this.componentRef?.setStatus) {\n this.componentRef.setStatus(status, props);\n }\n return this;\n }\n\n protected onChange(): void {\n this.props.onChange?.(\n {\n data: this.data,\n isValid: this.isValid,\n errors: this.state.errors,\n valid: this.state.valid\n },\n this.elementRef\n );\n }\n\n // Only called once, for UIElements (including Dropin), as they are being mounted\n protected setUpAnalytics(setUpAnalyticsObj: AnalyticsInitialEvent) {\n const sessionId = this.props.session?.id;\n\n return this.props.modules.analytics.setUp({\n ...setUpAnalyticsObj,\n ...(sessionId && { sessionId })\n });\n }\n\n /**\n * A function for all UIElements, or BaseElement, to use to create an analytics action for when it's been:\n * - mounted,\n * - a PM has been selected\n * - onSubmit has been called (as a result of the pay button being pressed)\n *\n * In some other cases e.g. 3DS2 components, this function is overridden to allow more specific analytics actions to be created\n */\n\n protected submitAnalytics(analyticsObj: SendAnalyticsObject, uiElementProps?) {\n /** Work out what the component's \"type\" is:\n * - first check for a dedicated \"analyticsType\" (currently only applies to custom-cards)\n * - otherwise, distinguish cards from non-cards: cards will use their static type property, everything else will use props.type\n */\n try {\n let component = this.constructor['analyticsType'];\n if (!component) {\n component = this.constructor['type'] === 'scheme' || this.constructor['type'] === 'bcmc' ? this.constructor['type'] : this.props.type;\n }\n\n this.props.modules.analytics.sendAnalytics(component, analyticsObj, uiElementProps);\n } catch (error) {\n console.warn('Failed to submit the analytics event. Error:', error);\n }\n }\n\n public submit(): void {\n if (!this.isValid) {\n this.showValidation();\n return;\n }\n\n this.makePaymentsCall().then(sanitizeResponse).then(verifyPaymentDidNotFail).then(this.handleResponse).catch(this.handleFailedResult);\n }\n\n protected makePaymentsCall(): Promise<CheckoutAdvancedFlowResponse | CheckoutSessionPaymentResponse> {\n this.setElementStatus('loading');\n\n if (this.props.onSubmit) {\n return this.submitUsingAdvancedFlow();\n }\n\n if (this.core.session) {\n const beforeSubmitEvent: Promise<PaymentData> = this.props.beforeSubmit\n ? new Promise((resolve, reject) =>\n this.props.beforeSubmit(this.data, this.elementRef, {\n resolve,\n reject\n })\n )\n : Promise.resolve(this.data);\n\n return beforeSubmitEvent.then(this.submitUsingSessionsFlow);\n }\n\n this.handleError(\n new AdyenCheckoutError(\n 'IMPLEMENTATION_ERROR',\n 'It can not perform /payments call. Callback \"onSubmit\" is missing or Checkout session is not available'\n )\n );\n }\n\n private async submitUsingAdvancedFlow(): Promise<CheckoutAdvancedFlowResponse> {\n return new Promise<CheckoutAdvancedFlowResponse>((resolve, reject) => {\n // Call analytics endpoint\n this.submitAnalytics({ type: ANALYTICS_SUBMIT_STR });\n\n this.props.onSubmit(\n {\n data: this.data,\n isValid: this.isValid\n },\n this.elementRef,\n { resolve, reject }\n );\n });\n }\n\n private async submitUsingSessionsFlow(data: PaymentData): Promise<CheckoutSessionPaymentResponse> {\n this.submitAnalytics({ type: ANALYTICS_SUBMIT_STR });\n\n try {\n return await this.core.session.submitPayment(data);\n } catch (error: unknown) {\n if (error instanceof AdyenCheckoutError) this.handleError(error);\n else this.handleError(new AdyenCheckoutError('ERROR', 'Error when making /payments call', { cause: error }));\n\n return Promise.reject(error);\n }\n\n // // Uncomment to simulate failed\n // return {\n // resultCode: 'Refused',\n // sessionData:\n // 'Ab02b4c0!BQABAgBKGgqfEz8uQlU4yCIOWjA8bkEwmbJ7Qt4r+x5IPXREu1rMjwNk5MDoHFNlv+MWvinS6nXIDniXgRzXCdSC4ksw9CNDBAjOa+B88wRoj/rLTieuWh/0leR88qkV24vtIkjsIsbJTDB78Pd8wX8MEDsXhaAdEIyX9E8eqxuQ3bwPbvLs1Dlgo1ZrfkQRzaNiuVM8ejRG0IWE1bGThJzY+sJvZZHvlDMXIlxhZcDoQvsMj/WwE6+nFJxBiC3oRzmvVn3AbkLQGtvwq16UUSfYbPzG9dXypJMtcrZAQYq2g/2+BSibCcmee9AXq/wij11BERrYmjbDt5NkkdUnDVgAB7pdqbnWX0A2sxBKeYtLSP2kxp+5LoU/Wty3fmcVA3VKVkHfgmIihkeL8lY++5hvHjnkzOE4tyx/sheiKS4zqoWE43TD6n8mpFskAzwMHq4G2o6vkXqvaKFEq7y/R2fVrCypenmRhkPASizpM265rKLU+L4E/C+LMHfN0LYKRMCrLr0gI2GAp+1PZLHgh0tCtiJC/zcJJtJs6sHNQxLUN+kxJuELUHOcuL3ivjG+mWteUnBENZu7KqOSZYetiWYRiyLOXDiBHqbxuQwTuO54L15VLkS/mYB20etibM1nn+fRmbo+1IJkCSalhwi5D7fSrpjbQTmAsOpJT1N8lC1MSNmAvAwG1kWL4JxYwXDKYyYASnsia2V5IjoiQUYwQUFBMTAzQ0E1MzdFQUVEODdDMjRERDUzOTA5QjgwQTc4QTkyM0UzODIzRDY4REFDQzk0QjlGRjgzMDVEQyJ98uZI4thGveOByYbomCeeP2Gy2rzs99FOBoDYVeWIUjyM+gfnW89DdJZAhxe74Tv0TnL5DRQYPCTRQPOoLbQ21NaeSho70FNE+n8XYKlVK5Ore6BoB6IVCaal5MkM27VmZPMmGflgcPx+pakx+EmRsYGdvYNImYxJYrRk3CI+l3T3ZiVpPPqebaVSLaSkEfu0iOFPjjLUhWN6QW6c18heE5vq/pcoeBf7p0Jgr9I5aBFY0avYG57BDGHzU1ZiQ9LLMTis2BA7Ap9pdNq8FVXL4fnoVHNZiiANOf3uvSknPKBID8sdOXUStA0crmO322FYjDqh1n6FG+D7+OJSayNsXIz6Zoy0eFn4HbT8nt8L2X2tdzkMayCYHXRwKh13Xyleqxt4WoEZmhwTmB3p9d1F0SylWnjcC6o/DnshJ9mMW/8D3oWS30Z7BwRODqKGVahRD0YGRzwMbVnEe5JFRfNvJZdLGl35L9632DVmuFQ0lr/8WNL/NrAJNtI6PXrZMNiza0/omPwPfe5ZYuD1Jgq59TX4h9d+3fdkArcJYL7AdoMZON1YEiWY5EzazQwtHd9yzdty9ZHPxAfuOfCh4OhbhFNp+v5YQ+PzKZ+UpM1VxV863+9XgWEURPNvX7qq1cpUSRzrSGq01QBBM3MKzRh5mAgqIdXgtl7L0EXAep0MECc7QY0/o3tW3VR8eEJGsSzrNxpFItqj0SEaIWo25dRfkl5zuw47GQrN9Qzxl2WV3A38MQPUqFtIr/71Rjkphgg49ZGWEYCwgFmm8jJc2/5qTabSGk4bzwiETCTzeydq30bUGqCwglj8CrFViAuQeTJm7dp+PYKMkUNvQRpnSXMj6Kz7rvAMzhzJgK62ltN2idqKxLC7WtivCUgejuQUvNreCYBQCaKwTwP02lZsJpGF9yw8gbyuoB+2aB7IZmgIB8GP4qVQ/ht5B9z/FLohK/8cSPV/4i32SNNdcwhV',\n // sessionResult:\n // 'X3XtfGC7!H4sIAAAAAAAA/6tWykxRslJyDjaxNDMyM3E2MXIyNDUys3RU0lHKTS1KzkjMK3FMTs4vzSsBKgtJLS7xhYo6Z6QmZ+eXlgAVFpcklpQWA+WLUtNKi1NTlGoBMEEbz1cAAAA=iMsCaEJ5LcnsqIUtmNxjm8HtfQ8gZW8JewEU3wHz4qg='\n // };\n }\n\n protected onComplete(state): void {\n if (this.props.onComplete) this.props.onComplete(state, this.elementRef);\n }\n\n protected handleError = (error: AdyenCheckoutError): void => {\n /**\n * Set status using elementRef, which:\n * - If Drop-in, will set status for Dropin component, and then it will propagate the new status for the active payment method component\n * - If Component, it will set its own status\n */\n this.setElementStatus('ready');\n\n if (this.props.onError) {\n this.props.onError(error, this.elementRef);\n }\n };\n\n protected handleAdditionalDetails(state: AdditionalDetailsData): void {\n this.makeAdditionalDetailsCall(state)\n .then(sanitizeResponse)\n .then(verifyPaymentDidNotFail)\n .then(this.handleResponse)\n .catch(this.handleFailedResult);\n }\n\n private makeAdditionalDetailsCall(state: AdditionalDetailsData): Promise<CheckoutSessionDetailsResponse | CheckoutAdvancedFlowResponse> {\n if (this.props.onAdditionalDetails) {\n return new Promise<CheckoutAdvancedFlowResponse>((resolve, reject) => {\n this.props.onAdditionalDetails(state, this.elementRef, { resolve, reject });\n });\n }\n\n if (this.core.session) {\n return this.submitAdditionalDetailsUsingSessionsFlow(state.data);\n }\n\n this.handleError(\n new AdyenCheckoutError(\n 'IMPLEMENTATION_ERROR',\n 'It can not perform /payments/details call. Callback \"onAdditionalDetails\" is missing or Checkout session is not available'\n )\n );\n }\n\n private async submitAdditionalDetailsUsingSessionsFlow(data: any): Promise<CheckoutSessionDetailsResponse> {\n try {\n return await this.core.session.submitDetails(data);\n } catch (error: unknown) {\n if (error instanceof AdyenCheckoutError) this.handleError(error);\n else this.handleError(new AdyenCheckoutError('ERROR', 'Error when making /details call', { cause: error }));\n\n return Promise.reject(error);\n }\n }\n\n public handleAction(action: PaymentAction, props = {}): UIElement | null {\n if (!action || !action.type) {\n if (hasOwnProperty(action, 'action') && hasOwnProperty(action, 'resultCode')) {\n throw new Error(\n 'handleAction::Invalid Action - the passed action object itself has an \"action\" property and ' +\n 'a \"resultCode\": have you passed in the whole response object by mistake?'\n );\n }\n throw new Error('handleAction::Invalid Action - the passed action object does not have a \"type\" property');\n }\n\n const paymentAction = this.core.createFromAction(action, {\n ...this.elementRef.props,\n ...props,\n onAdditionalDetails: this.handleAdditionalDetails\n });\n\n if (paymentAction) {\n this.unmount();\n return paymentAction.mount(this._node);\n }\n\n return null;\n }\n\n protected handleOrder = (response: PaymentResponseData): void => {\n const { order } = response;\n\n const updateCorePromise = this.core.session ? this.core.update({ order }) : this.handleAdvanceFlowPaymentMethodsUpdate(order);\n\n void updateCorePromise.then(() => {\n this.props.onOrderUpdated?.({ order });\n });\n };\n\n /**\n * Handles when the payment fails. The payment fails when:\n * - adv flow: the merchant rejects the payment due to a critical error\n * - adv flow: the merchant resolves the payment with a failed resultCode\n * - sessions: a network error occurs when making the payment\n * - sessions: the payment fails with a failed resultCode\n *\n * @param result\n */\n protected handleFailedResult = (result?: PaymentResponseData): void => {\n if (assertIsDropin(this.elementRef)) {\n this.elementRef.displayFinalAnimation('error');\n }\n\n cleanupFinalResult(result);\n this.props.onPaymentFailed?.(result, this.elementRef);\n };\n\n protected handleSuccessResult = (result: PaymentResponseData): void => {\n if (assertIsDropin(this.elementRef)) {\n this.elementRef.displayFinalAnimation('success');\n }\n\n cleanupFinalResult(result);\n this.props.onPaymentCompleted?.(result, this.elementRef);\n };\n\n /**\n * Handles a session /payments or /payments/details response.\n * The component will handle automatically actions, orders, and final results.\n *\n * @param rawResponse -\n */\n protected handleResponse(rawResponse: RawPaymentResponse): void {\n const response = sanitizeResponse(rawResponse);\n\n if (response.action) {\n this.elementRef.handleAction(response.action);\n return;\n }\n\n if (response.order?.remainingAmount?.value > 0) {\n // we don't want to call elementRef here, use the component handler\n // we do this way so the logic on handlingOrder is associated with payment method\n this.handleOrder(response);\n return;\n }\n\n this.handleSuccessResult(response);\n }\n\n protected handleKeyPress(e: h.JSX.TargetedKeyboardEvent<HTMLInputElement> | KeyboardEvent) {\n if (e.key === 'Enter' || e.code === 'Enter') {\n e.preventDefault(); // Prevent <form> submission if Component is placed inside a form\n\n this.onEnterKeyPressed(document?.activeElement, this);\n }\n }\n\n /**\n * Handle Enter key pressed from a UIElement (called via handleKeyPress)\n * @param obj\n */\n protected onEnterKeyPressed(activeElement: Element, component: UIElement) {\n if (this.props.onEnterKeyPressed) {\n this.props.onEnterKeyPressed(activeElement, component);\n } else {\n (activeElement as HTMLElement).blur();\n this.submit();\n }\n }\n\n /**\n * Call update on parent instance\n * This function exist to make safe access to the protected _parentInstance\n * @param options - CoreOptions\n */\n public updateParent(options: CoreConfiguration = {}): Promise<ICore> {\n return this.elementRef.core.update(options);\n }\n\n public setComponentRef = (ref: ComponentMethodsRef) => {\n this.componentRef = ref;\n };\n\n /**\n * Get the current validation status of the element\n */\n public get isValid(): boolean {\n return false;\n }\n\n /**\n * Get the element icon URL for the current environment\n */\n\n public get icon(): string {\n const type = this.props.paymentMethodType || this.type;\n return this.props.icon ?? this.resources.getImage()(type);\n }\n\n /**\n * Get the element's displayable name\n */\n public get displayName(): string {\n const paymentMethodFromResponse = this.core.paymentMethodsResponse?.paymentMethods?.find(pm => pm.type === this.type);\n return this.props.name || paymentMethodFromResponse?.name || this.type;\n }\n\n /**\n * Get the element accessible name, used in the aria-label of the button that controls selected payment method\n */\n public get accessibleName(): string {\n return this.displayName;\n }\n\n /**\n * Used to display the second line of a payment method item\n */\n get additionalInfo(): string {\n return null;\n }\n\n /**\n * Return the type of an element\n */\n public get type(): string {\n return this.props.type || this.constructor['type'];\n }\n\n /**\n * Get the payButton component for the current element\n */\n protected payButton = (props: PayButtonFunctionProps) => {\n return <PayButton {...props} amount={this.props.amount} secondaryAmount={this.props.secondaryAmount} onClick={this.submit} />;\n };\n\n /**\n * Used in the Partial Orders flow.\n * When the Order is updated, the merchant can request new payment methods based on the new remaining amount\n *\n * @private\n */\n protected async handleAdvanceFlowPaymentMethodsUpdate(order: Order | null, amount?: PaymentAmount) {\n return new Promise<void | PaymentMethodsResponse>((resolve, reject) => {\n if (!this.props.onPaymentMethodsRequest) {\n return resolve();\n }\n\n this.props.onPaymentMethodsRequest(\n {\n ...(order && {\n order: {\n orderData: order.orderData,\n pspReference: order.pspReference\n }\n }),\n locale: this.core.options.locale\n },\n { resolve, reject }\n );\n })\n .catch(error => {\n this.handleError(\n new AdyenCheckoutError(\n 'IMPLEMENTATION_ERROR',\n 'Something failed during payment methods update or onPaymentMethodsRequest was not implemented',\n {\n cause: error\n }\n )\n );\n })\n .then(paymentMethodsResponse => {\n // in the case of the session flow we get order, amount, countryCode and shopperLocale from initialize()\n // apply the same logic here for order and amount\n // in the future it might be worth moving this logic to be performed by the core on update()\n // it would make this more consistent\n return this.core.update({\n ...(paymentMethodsResponse && { paymentMethodsResponse }),\n order,\n amount: order ? order.remainingAmount : amount\n });\n });\n }\n}\n\nexport default UIElement;\n"],"names":["UIElement","BaseElement","componentRef","resources","elementRef","static","undefined","constructor","checkout","props","super","this","core","register","submit","bind","setState","onComplete","handleAction","handleOrder","handleAdditionalDetails","handleResponse","setElementStatus","submitAnalytics","makePaymentsCall","makeAdditionalDetailsCall","submitUsingSessionsFlow","modules","storeElementRefOnCore","onEnterKeyPressed","buildElementProps","componentProps","finalProps","showPayButton","getCorePropsForComponent","isStoredPaymentMethod","paymentMethodsResponse","find","type","isDropin","assertIsDropin","formatProps","getRegulatoryDefaults","options","countryCode","storeElementReference","isAvailable","Promise","resolve","newState","state","onChange","showValidation","status","setStatus","data","isValid","errors","valid","setUpAnalytics","setUpAnalyticsObj","sessionId","session","id","analytics","setUp","analyticsObj","uiElementProps","component","sendAnalytics","error","console","warn","then","sanitizeResponse","verifyPaymentDidNotFail","catch","handleFailedResult","onSubmit","submitUsingAdvancedFlow","beforeSubmit","reject","handleError","AdyenCheckoutError","ANALYTICS_SUBMIT_STR","submitPayment","cause","onError","onAdditionalDetails","submitAdditionalDetailsUsingSessionsFlow","submitDetails","action","hasOwnProperty","Error","paymentAction","createFromAction","unmount","mount","_node","response","order","update","handleAdvanceFlowPaymentMethodsUpdate","onOrderUpdated","result","displayFinalAnimation","cleanupFinalResult","onPaymentFailed","handleSuccessResult","onPaymentCompleted","rawResponse","remainingAmount","value","handleKeyPress","e","key","code","preventDefault","document","activeElement","blur","updateParent","setComponentRef","ref","icon","paymentMethodType","getImage","displayName","paymentMethodFromResponse","paymentMethods","pm","name","accessibleName","additionalInfo","payButton","h","PayButton","amount","secondaryAmount","onClick","onPaymentMethodsRequest","orderData","pspReference","locale"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"UIElement.js","sources":["../../../../../src/components/internal/UIElement/UIElement.tsx"],"sourcesContent":["import { h } from 'preact';\nimport BaseElement from '../BaseElement/BaseElement';\nimport PayButton from '../PayButton';\nimport { assertIsDropin, cleanupFinalResult, getRegulatoryDefaults, sanitizeResponse, verifyPaymentDidNotFail } from './utils';\nimport AdyenCheckoutError from '../../../core/Errors/AdyenCheckoutError';\nimport { hasOwnProperty } from '../../../utils/hasOwnProperty';\nimport { Resources } from '../../../core/Context/Resources';\nimport { ANALYTICS_SUBMIT_STR } from '../../../core/Analytics/constants';\n\nimport type { AnalyticsInitialEvent, SendAnalyticsObject } from '../../../core/Analytics/types';\nimport type { CoreConfiguration, ICore, AdditionalDetailsData } from '../../../core/types';\nimport type { ComponentMethodsRef, PayButtonFunctionProps, UIElementProps, UIElementStatus } from './types';\nimport type { CheckoutSessionDetailsResponse, CheckoutSessionPaymentResponse } from '../../../core/CheckoutSession/types';\nimport type {\n ActionHandledReturnObject,\n CheckoutAdvancedFlowResponse,\n Order,\n PaymentAction,\n PaymentAmount,\n PaymentData,\n PaymentMethodsResponse,\n PaymentResponseData,\n RawPaymentResponse\n} from '../../../types/global-types';\nimport type { IDropin } from '../../Dropin/types';\nimport type { NewableComponent } from '../../../core/core.registry';\nimport CancelError from '../../../core/Errors/CancelError';\n\nimport './UIElement.scss';\n\nexport abstract class UIElement<P extends UIElementProps = UIElementProps> extends BaseElement<P> {\n protected componentRef: any;\n\n protected resources: Resources;\n\n public elementRef: UIElement;\n\n public static type = undefined;\n\n /**\n * Defines all txVariants that the Component supports (in case it support multiple ones besides the 'type' one)\n */\n public static txVariants: string[] = [];\n\n constructor(checkout: ICore, props?: P) {\n super(checkout, props);\n\n this.core.register(this.constructor as NewableComponent);\n\n this.submit = this.submit.bind(this);\n this.setState = this.setState.bind(this);\n this.onComplete = this.onComplete.bind(this);\n this.handleAction = this.handleAction.bind(this);\n this.handleOrder = this.handleOrder.bind(this);\n this.handleAdditionalDetails = this.handleAdditionalDetails.bind(this);\n this.handleResponse = this.handleResponse.bind(this);\n this.setElementStatus = this.setElementStatus.bind(this);\n this.submitAnalytics = this.submitAnalytics.bind(this);\n this.makePaymentsCall = this.makePaymentsCall.bind(this);\n this.makeAdditionalDetailsCall = this.makeAdditionalDetailsCall.bind(this);\n this.submitUsingSessionsFlow = this.submitUsingSessionsFlow.bind(this);\n\n this.elementRef = (props && props.elementRef) || this;\n this.resources = this.props.modules ? this.props.modules.resources : undefined;\n\n this.storeElementRefOnCore(this.props);\n\n this.onEnterKeyPressed = this.onEnterKeyPressed.bind(this);\n this.onActionHandled = this.onActionHandled.bind(this);\n }\n\n protected override buildElementProps(componentProps?: P) {\n const globalCoreProps = this.core.getCorePropsForComponent();\n const isStoredPaymentMethod = !!componentProps?.isStoredPaymentMethod;\n const paymentMethodsResponseProps = isStoredPaymentMethod\n ? {}\n : this.core.paymentMethodsResponse.find(componentProps?.type || this.constructor['type']);\n\n const finalProps = {\n showPayButton: true,\n ...globalCoreProps,\n ...paymentMethodsResponseProps,\n ...componentProps\n };\n\n const isDropin = assertIsDropin(this as unknown as IDropin);\n\n this.props = this.formatProps({\n ...this.constructor['defaultProps'], // component defaults\n ...getRegulatoryDefaults(this.core.options.countryCode, isDropin), // regulatory defaults\n ...finalProps // the rest (inc. merchant defined config)\n });\n }\n\n protected storeElementRefOnCore(props?: P) {\n if (!props?.isDropin) {\n this.core.storeElementReference(this);\n }\n }\n\n public isAvailable(): Promise<void> {\n return Promise.resolve();\n }\n\n public setState(newState: object): void {\n this.state = { ...this.state, ...newState };\n this.onChange();\n }\n\n public showValidation(): this {\n if (this.componentRef && this.componentRef.showValidation) this.componentRef.showValidation();\n return this;\n }\n\n public setElementStatus(status: UIElementStatus, props?: any): this {\n this.elementRef?.setStatus(status, props);\n return this;\n }\n\n public setStatus(status: UIElementStatus, props?): this {\n if (this.componentRef?.setStatus) {\n this.componentRef.setStatus(status, props);\n }\n return this;\n }\n\n protected onChange(): void {\n this.props.onChange?.(\n {\n data: this.data,\n isValid: this.isValid,\n errors: this.state.errors,\n valid: this.state.valid\n },\n this.elementRef\n );\n }\n\n // Only called once, for UIElements (including Dropin), as they are being mounted\n protected setUpAnalytics(setUpAnalyticsObj: AnalyticsInitialEvent) {\n const sessionId = this.props.session?.id;\n\n return this.props.modules.analytics.setUp({\n ...setUpAnalyticsObj,\n ...(sessionId && { sessionId })\n });\n }\n\n /**\n * A function for all UIElements, or BaseElement, to use to create an analytics action for when it's been:\n * - mounted,\n * - a PM has been selected\n * - onSubmit has been called (as a result of the pay button being pressed)\n *\n * In some other cases e.g. 3DS2 components, this function is overridden to allow more specific analytics actions to be created\n */\n\n protected submitAnalytics(analyticsObj: SendAnalyticsObject, uiElementProps?) {\n /** Work out what the component's \"type\" is:\n * - first check for a dedicated \"analyticsType\" (currently only applies to custom-cards)\n * - otherwise, distinguish cards from non-cards: cards will use their static type property, everything else will use props.type\n */\n try {\n let component = this.constructor['analyticsType'];\n if (!component) {\n component = this.constructor['type'] === 'scheme' || this.constructor['type'] === 'bcmc' ? this.constructor['type'] : this.props.type;\n }\n\n this.props.modules.analytics.sendAnalytics(component, analyticsObj, uiElementProps);\n } catch (error) {\n console.warn('Failed to submit the analytics event. Error:', error);\n }\n }\n\n public submit(): void {\n if (!this.isValid) {\n this.showValidation();\n return;\n }\n\n this.makePaymentsCall()\n .then(sanitizeResponse)\n .then(verifyPaymentDidNotFail)\n .then(this.handleResponse)\n .catch((e: PaymentResponseData | Error) => {\n if (e instanceof CancelError) {\n this.setElementStatus('ready');\n return;\n }\n this.handleFailedResult(e as PaymentResponseData);\n });\n }\n\n protected makePaymentsCall(): Promise<CheckoutAdvancedFlowResponse | CheckoutSessionPaymentResponse> {\n this.setElementStatus('loading');\n\n if (this.props.onSubmit) {\n return this.submitUsingAdvancedFlow();\n }\n\n if (this.core.session) {\n const beforeSubmitEvent: Promise<PaymentData> = this.props.beforeSubmit\n ? new Promise((resolve, reject) =>\n this.props.beforeSubmit(this.data, this.elementRef, {\n resolve,\n reject: () => reject(new CancelError('beforeSubmitRejected'))\n })\n )\n : Promise.resolve(this.data);\n\n return beforeSubmitEvent.then(this.submitUsingSessionsFlow);\n }\n\n this.handleError(\n new AdyenCheckoutError(\n 'IMPLEMENTATION_ERROR',\n 'It can not perform /payments call. Callback \"onSubmit\" is missing or Checkout session is not available'\n )\n );\n }\n\n private async submitUsingAdvancedFlow(): Promise<CheckoutAdvancedFlowResponse> {\n return new Promise<CheckoutAdvancedFlowResponse>((resolve, reject) => {\n // Call analytics endpoint\n this.submitAnalytics({ type: ANALYTICS_SUBMIT_STR });\n\n this.props.onSubmit(\n {\n data: this.data,\n isValid: this.isValid\n },\n this.elementRef,\n { resolve, reject }\n );\n });\n }\n\n private async submitUsingSessionsFlow(data: PaymentData): Promise<CheckoutSessionPaymentResponse> {\n this.submitAnalytics({ type: ANALYTICS_SUBMIT_STR });\n\n try {\n return await this.core.session.submitPayment(data);\n } catch (error: unknown) {\n if (error instanceof AdyenCheckoutError) this.handleError(error);\n else this.handleError(new AdyenCheckoutError('ERROR', 'Error when making /payments call', { cause: error }));\n\n return Promise.reject(error);\n }\n\n // // Uncomment to simulate failed\n // return {\n // resultCode: 'Refused',\n // sessionData:\n // 'Ab02b4c0!BQABAgBKGgqfEz8uQlU4yCIOWjA8bkEwmbJ7Qt4r+x5IPXREu1rMjwNk5MDoHFNlv+MWvinS6nXIDniXgRzXCdSC4ksw9CNDBAjOa+B88wRoj/rLTieuWh/0leR88qkV24vtIkjsIsbJTDB78Pd8wX8MEDsXhaAdEIyX9E8eqxuQ3bwPbvLs1Dlgo1ZrfkQRzaNiuVM8ejRG0IWE1bGThJzY+sJvZZHvlDMXIlxhZcDoQvsMj/WwE6+nFJxBiC3oRzmvVn3AbkLQGtvwq16UUSfYbPzG9dXypJMtcrZAQYq2g/2+BSibCcmee9AXq/wij11BERrYmjbDt5NkkdUnDVgAB7pdqbnWX0A2sxBKeYtLSP2kxp+5LoU/Wty3fmcVA3VKVkHfgmIihkeL8lY++5hvHjnkzOE4tyx/sheiKS4zqoWE43TD6n8mpFskAzwMHq4G2o6vkXqvaKFEq7y/R2fVrCypenmRhkPASizpM265rKLU+L4E/C+LMHfN0LYKRMCrLr0gI2GAp+1PZLHgh0tCtiJC/zcJJtJs6sHNQxLUN+kxJuELUHOcuL3ivjG+mWteUnBENZu7KqOSZYetiWYRiyLOXDiBHqbxuQwTuO54L15VLkS/mYB20etibM1nn+fRmbo+1IJkCSalhwi5D7fSrpjbQTmAsOpJT1N8lC1MSNmAvAwG1kWL4JxYwXDKYyYASnsia2V5IjoiQUYwQUFBMTAzQ0E1MzdFQUVEODdDMjRERDUzOTA5QjgwQTc4QTkyM0UzODIzRDY4REFDQzk0QjlGRjgzMDVEQyJ98uZI4thGveOByYbomCeeP2Gy2rzs99FOBoDYVeWIUjyM+gfnW89DdJZAhxe74Tv0TnL5DRQYPCTRQPOoLbQ21NaeSho70FNE+n8XYKlVK5Ore6BoB6IVCaal5MkM27VmZPMmGflgcPx+pakx+EmRsYGdvYNImYxJYrRk3CI+l3T3ZiVpPPqebaVSLaSkEfu0iOFPjjLUhWN6QW6c18heE5vq/pcoeBf7p0Jgr9I5aBFY0avYG57BDGHzU1ZiQ9LLMTis2BA7Ap9pdNq8FVXL4fnoVHNZiiANOf3uvSknPKBID8sdOXUStA0crmO322FYjDqh1n6FG+D7+OJSayNsXIz6Zoy0eFn4HbT8nt8L2X2tdzkMayCYHXRwKh13Xyleqxt4WoEZmhwTmB3p9d1F0SylWnjcC6o/DnshJ9mMW/8D3oWS30Z7BwRODqKGVahRD0YGRzwMbVnEe5JFRfNvJZdLGl35L9632DVmuFQ0lr/8WNL/NrAJNtI6PXrZMNiza0/omPwPfe5ZYuD1Jgq59TX4h9d+3fdkArcJYL7AdoMZON1YEiWY5EzazQwtHd9yzdty9ZHPxAfuOfCh4OhbhFNp+v5YQ+PzKZ+UpM1VxV863+9XgWEURPNvX7qq1cpUSRzrSGq01QBBM3MKzRh5mAgqIdXgtl7L0EXAep0MECc7QY0/o3tW3VR8eEJGsSzrNxpFItqj0SEaIWo25dRfkl5zuw47GQrN9Qzxl2WV3A38MQPUqFtIr/71Rjkphgg49ZGWEYCwgFmm8jJc2/5qTabSGk4bzwiETCTzeydq30bUGqCwglj8CrFViAuQeTJm7dp+PYKMkUNvQRpnSXMj6Kz7rvAMzhzJgK62ltN2idqKxLC7WtivCUgejuQUvNreCYBQCaKwTwP02lZsJpGF9yw8gbyuoB+2aB7IZmgIB8GP4qVQ/ht5B9z/FLohK/8cSPV/4i32SNNdcwhV',\n // sessionResult:\n // 'X3XtfGC7!H4sIAAAAAAAA/6tWykxRslJyDjaxNDMyM3E2MXIyNDUys3RU0lHKTS1KzkjMK3FMTs4vzSsBKgtJLS7xhYo6Z6QmZ+eXlgAVFpcklpQWA+WLUtNKi1NTlGoBMEEbz1cAAAA=iMsCaEJ5LcnsqIUtmNxjm8HtfQ8gZW8JewEU3wHz4qg='\n // };\n }\n\n protected onComplete(state): void {\n if (this.props.onComplete) this.props.onComplete(state, this.elementRef);\n }\n\n protected handleError = (error: AdyenCheckoutError): void => {\n /**\n * Set status using elementRef, which:\n * - If Drop-in, will set status for Dropin component, and then it will propagate the new status for the active payment method component\n * - If Component, it will set its own status\n */\n this.setElementStatus('ready');\n\n if (this.props.onError) {\n this.props.onError(error, this.elementRef);\n }\n };\n\n protected handleAdditionalDetails(state: AdditionalDetailsData): void {\n this.makeAdditionalDetailsCall(state)\n .then(sanitizeResponse)\n .then(verifyPaymentDidNotFail)\n .then(this.handleResponse)\n .catch(this.handleFailedResult);\n }\n\n private makeAdditionalDetailsCall(state: AdditionalDetailsData): Promise<CheckoutSessionDetailsResponse | CheckoutAdvancedFlowResponse> {\n if (this.props.onAdditionalDetails) {\n return new Promise<CheckoutAdvancedFlowResponse>((resolve, reject) => {\n this.props.onAdditionalDetails(state, this.elementRef, { resolve, reject });\n });\n }\n\n if (this.core.session) {\n return this.submitAdditionalDetailsUsingSessionsFlow(state.data);\n }\n\n this.handleError(\n new AdyenCheckoutError(\n 'IMPLEMENTATION_ERROR',\n 'It can not perform /payments/details call. Callback \"onAdditionalDetails\" is missing or Checkout session is not available'\n )\n );\n }\n\n private async submitAdditionalDetailsUsingSessionsFlow(data: any): Promise<CheckoutSessionDetailsResponse> {\n try {\n return await this.core.session.submitDetails(data);\n } catch (error: unknown) {\n if (error instanceof AdyenCheckoutError) this.handleError(error);\n else this.handleError(new AdyenCheckoutError('ERROR', 'Error when making /details call', { cause: error }));\n\n return Promise.reject(error);\n }\n }\n\n public handleAction(action: PaymentAction, props = {}): UIElement | null {\n if (!action || !action.type) {\n if (hasOwnProperty(action, 'action') && hasOwnProperty(action, 'resultCode')) {\n throw new Error(\n 'handleAction::Invalid Action - the passed action object itself has an \"action\" property and ' +\n 'a \"resultCode\": have you passed in the whole response object by mistake?'\n );\n }\n throw new Error('handleAction::Invalid Action - the passed action object does not have a \"type\" property');\n }\n\n const paymentAction = this.core.createFromAction(action, {\n ...this.elementRef.props,\n ...props,\n onAdditionalDetails: this.handleAdditionalDetails\n });\n\n if (paymentAction) {\n this.unmount();\n return paymentAction.mount(this._node);\n }\n\n return null;\n }\n\n protected onActionHandled(actionHandledObj: ActionHandledReturnObject) {\n this.props?.onActionHandled?.({ originalAction: this.props.originalAction, ...actionHandledObj });\n }\n\n protected handleOrder = (response: PaymentResponseData): void => {\n const { order } = response;\n\n const updateCorePromise = this.core.session ? this.core.update({ order }) : this.handleAdvanceFlowPaymentMethodsUpdate(order);\n\n void updateCorePromise.then(() => {\n this.props.onOrderUpdated?.({ order });\n });\n };\n\n /**\n * Handles when the payment fails. The payment fails when:\n * - adv flow: the merchant rejects the payment due to a critical error\n * - adv flow: the merchant resolves the payment with a failed resultCode\n * - sessions: a network error occurs when making the payment\n * - sessions: the payment fails with a failed resultCode\n *\n * @param result\n */\n protected handleFailedResult = (result?: PaymentResponseData): void => {\n if (assertIsDropin(this.elementRef)) {\n this.elementRef.displayFinalAnimation('error');\n }\n\n cleanupFinalResult(result);\n this.props.onPaymentFailed?.(result, this.elementRef);\n };\n\n protected handleSuccessResult = (result: PaymentResponseData): void => {\n if (assertIsDropin(this.elementRef)) {\n this.elementRef.displayFinalAnimation('success');\n }\n\n cleanupFinalResult(result);\n this.props.onPaymentCompleted?.(result, this.elementRef);\n };\n\n /**\n * Handles a /payments or /payments/details response.\n * The component will handle automatically actions, orders, and final results.\n *\n * @param rawResponse -\n */\n protected handleResponse(rawResponse: RawPaymentResponse): void {\n const response = sanitizeResponse(rawResponse);\n\n if (response.action) {\n this.elementRef.handleAction(response.action);\n return;\n }\n\n if (response.order?.remainingAmount?.value > 0) {\n // we don't want to call elementRef here, use the component handler\n // we do this way so the logic on handlingOrder is associated with payment method\n this.handleOrder(response);\n return;\n }\n\n this.handleSuccessResult(response);\n }\n\n protected handleKeyPress(e: h.JSX.TargetedKeyboardEvent<HTMLInputElement> | KeyboardEvent) {\n if (e.key === 'Enter' || e.code === 'Enter') {\n e.preventDefault(); // Prevent <form> submission if Component is placed inside a form\n\n this.onEnterKeyPressed(document?.activeElement, this);\n }\n }\n\n /**\n * Handle Enter key pressed from a UIElement (called via handleKeyPress)\n * @param obj\n */\n protected onEnterKeyPressed(activeElement: Element, component: UIElement) {\n if (this.props.onEnterKeyPressed) {\n this.props.onEnterKeyPressed(activeElement, component);\n } else {\n (activeElement as HTMLElement).blur();\n this.submit();\n }\n }\n\n /**\n * Call update on parent instance\n * This function exist to make safe access to the protected _parentInstance\n * @param options - CoreOptions\n */\n public updateParent(options: CoreConfiguration = {}): Promise<ICore> {\n return this.elementRef.core.update(options);\n }\n\n public setComponentRef = (ref: ComponentMethodsRef) => {\n this.componentRef = ref;\n };\n\n /**\n * Get the current validation status of the element\n */\n public get isValid(): boolean {\n return false;\n }\n\n /**\n * Get the element icon URL for the current environment\n */\n\n public get icon(): string {\n const type = this.props.paymentMethodType || this.type;\n return this.props.icon ?? this.resources.getImage()(type);\n }\n\n /**\n * Get the element's displayable name\n */\n public get displayName(): string {\n const paymentMethodFromResponse = this.core.paymentMethodsResponse?.paymentMethods?.find(pm => pm.type === this.type);\n return this.props.name || paymentMethodFromResponse?.name || this.type;\n }\n\n /**\n * Get the element accessible name, used in the aria-label of the button that controls selected payment method\n */\n public get accessibleName(): string {\n return this.displayName;\n }\n\n /**\n * Used to display the second line of a payment method item\n */\n get additionalInfo(): string {\n return null;\n }\n\n /**\n * Return the type of an element\n */\n public get type(): string {\n return this.props.type || this.constructor['type'];\n }\n\n /**\n * Get the payButton component for the current element\n */\n protected payButton = (props: PayButtonFunctionProps) => {\n return <PayButton {...props} amount={this.props.amount} secondaryAmount={this.props.secondaryAmount} onClick={this.submit} />;\n };\n\n /**\n * Used in the Partial Orders flow.\n * When the Order is updated, the merchant can request new payment methods based on the new remaining amount\n *\n * @private\n */\n protected async handleAdvanceFlowPaymentMethodsUpdate(order: Order | null, amount?: PaymentAmount) {\n return new Promise<void | PaymentMethodsResponse>((resolve, reject) => {\n if (!this.props.onPaymentMethodsRequest) {\n return resolve();\n }\n\n this.props.onPaymentMethodsRequest(\n {\n ...(order && {\n order: {\n orderData: order.orderData,\n pspReference: order.pspReference\n }\n }),\n locale: this.core.options.locale\n },\n { resolve, reject }\n );\n })\n .catch(error => {\n this.handleError(\n new AdyenCheckoutError(\n 'IMPLEMENTATION_ERROR',\n 'Something failed during payment methods update or onPaymentMethodsRequest was not implemented',\n {\n cause: error\n }\n )\n );\n })\n .then(paymentMethodsResponse => {\n // in the case of the session flow we get order, amount, countryCode and shopperLocale from initialize()\n // apply the same logic here for order and amount\n // in the future it might be worth moving this logic to be performed by the core on update()\n // it would make this more consistent\n return this.core.update({\n ...(paymentMethodsResponse && { paymentMethodsResponse }),\n order,\n amount: order ? order.remainingAmount : amount\n });\n });\n }\n}\n\nexport default UIElement;\n"],"names":["UIElement","BaseElement","componentRef","resources","elementRef","static","undefined","constructor","checkout","props","super","this","core","register","submit","bind","setState","onComplete","handleAction","handleOrder","handleAdditionalDetails","handleResponse","setElementStatus","submitAnalytics","makePaymentsCall","makeAdditionalDetailsCall","submitUsingSessionsFlow","modules","storeElementRefOnCore","onEnterKeyPressed","onActionHandled","buildElementProps","componentProps","finalProps","showPayButton","getCorePropsForComponent","isStoredPaymentMethod","paymentMethodsResponse","find","type","isDropin","assertIsDropin","formatProps","getRegulatoryDefaults","options","countryCode","storeElementReference","isAvailable","Promise","resolve","newState","state","onChange","showValidation","status","setStatus","data","isValid","errors","valid","setUpAnalytics","setUpAnalyticsObj","sessionId","session","id","analytics","setUp","analyticsObj","uiElementProps","component","sendAnalytics","error","console","warn","then","sanitizeResponse","verifyPaymentDidNotFail","catch","e","CancelError","handleFailedResult","onSubmit","submitUsingAdvancedFlow","beforeSubmit","reject","handleError","AdyenCheckoutError","ANALYTICS_SUBMIT_STR","submitPayment","cause","onError","onAdditionalDetails","submitAdditionalDetailsUsingSessionsFlow","submitDetails","action","hasOwnProperty","Error","paymentAction","createFromAction","unmount","mount","_node","actionHandledObj","originalAction","response","order","update","handleAdvanceFlowPaymentMethodsUpdate","onOrderUpdated","result","displayFinalAnimation","cleanupFinalResult","onPaymentFailed","handleSuccessResult","onPaymentCompleted","rawResponse","remainingAmount","value","handleKeyPress","key","code","preventDefault","document","activeElement","blur","updateParent","setComponentRef","ref","icon","paymentMethodType","getImage","displayName","paymentMethodFromResponse","paymentMethods","pm","name","accessibleName","additionalInfo","payButton","h","PayButton","amount","secondaryAmount","onClick","onPaymentMethodsRequest","orderData","pspReference","locale"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as e}from"../../../external/preact/dist/preact.js";import a from"../../../external/classnames/index.js";import c from"../Button/Button.js";import{copyToClipboard as r}from"../../../utils/clipboard.js";import{useCoreContext as t}from"../../../core/Context/CoreProvider.js";import o from"../../../core/Context/useImage.js";import{PREFIX as s}from"../Icon/constants.js";function
|
|
1
|
+
import{createElement as e}from"../../../external/preact/dist/preact.js";import a from"../../../external/classnames/index.js";import c from"../Button/Button.js";import{copyToClipboard as r}from"../../../utils/clipboard.js";import{useCoreContext as t}from"../../../core/Context/CoreProvider.js";import o from"../../../core/Context/useImage.js";import{PREFIX as s}from"../Icon/constants.js";function n({voucherDetails:n=[],className:_="",...l}){const{i18n:u}=t(),i=o();return l.onActionHandled?.({componentType:l.paymentMethodType,actionDescription:"voucher-presented"}),e("div",{className:a("adyen-checkout__voucher-result",`adyen-checkout__voucher-result--${l.paymentMethodType}`,_)},e("div",{className:"adyen-checkout__voucher-result__top"},e("div",{className:"adyen-checkout__voucher-result__image"},!!l.imageUrl&&e("span",{className:"adyen-checkout__voucher-result__image__wrapper"},e("img",{alt:l.paymentMethodType,className:"adyen-checkout__voucher-result__image__brand",src:l.imageUrl})),!!l.issuerImageUrl&&e("span",{className:"adyen-checkout__voucher-result__image__wrapper"},e("img",{alt:l.paymentMethodType,className:"adyen-checkout__voucher-result__image__issuer",src:l.issuerImageUrl}))),e("div",{className:"adyen-checkout__voucher-result__introduction"},l.introduction," ",l.instructionsUrl&&e("a",{className:"adyen-checkout-link adyen-checkout-link--voucher-result-instructions",href:l.instructionsUrl,target:"_blank",rel:"noopener noreferrer"},u.get("voucher.readInstructions")," ›")),l.amount&&e("div",{className:"adyen-checkout__voucher-result__amount"},l.amount,l.surcharge&&e("span",{className:"adyen-checkout__voucher-result__surcharge"},"(",u.get("voucher.surcharge").replace("%@",l.surcharge),")"))),l.reference&&e("div",{className:"adyen-checkout__voucher-result__separator"},e("div",{className:"adyen-checkout__voucher-result__separator__inner"}),e("div",{className:"adyen-checkout__voucher-result__code__label"},e("span",{className:"adyen-checkout__voucher-result__code__label__text"},u.get("voucher.paymentReferenceLabel")))),e("div",{className:"adyen-checkout__voucher-result__bottom"},l.reference&&e("div",{className:"adyen-checkout__voucher-result__code"},l.barcode&&e("img",{alt:u.get("voucher.paymentReferenceLabel"),className:"adyen-checkout__voucher-result__code__barcode",src:l.barcode}),e("span",null,l.reference)),(!!l.downloadUrl||!!l.copyBtn)&&e("ul",{className:"adyen-checkout__voucher-result__actions"},!!l.copyBtn&&e("li",{className:"adyen-checkout__voucher-result__actions__item"},e(c,{inline:!0,variant:"action",onClick:(e,{complete:a})=>{r(l.reference),a()},icon:i({imageFolder:"components/"})(`${s}copy`),label:u.get("button.copy")})),!!l.downloadUrl&&e("li",{className:"adyen-checkout__voucher-result__actions__item"},e(c,{inline:!0,variant:"action",href:l.downloadUrl,icon:i({imageFolder:"components/"})(`${s}download`),label:l.downloadButtonText||u.get("button.download"),target:"_blank",rel:"noopener noreferrer"}))),e("ul",{className:"adyen-checkout__voucher-result__details"},n.filter((({label:e,value:a})=>!!e&&!!a)).map((({label:a,value:c},r)=>e("li",{key:r,className:"adyen-checkout__voucher-result__details__item"},e("span",{className:"adyen-checkout__voucher-result__details__label"},a),e("span",{className:"adyen-checkout__voucher-result__details__value"},c)))))))}export{n as default};
|
|
2
2
|
//# sourceMappingURL=Voucher.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Voucher.js","sources":["../../../../../src/components/internal/Voucher/Voucher.tsx"],"sourcesContent":["import { h } from 'preact';\nimport classNames from 'classnames';\nimport Button from '../Button';\nimport { copyToClipboard } from '../../../utils/clipboard';\n\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport './Voucher.scss';\nimport { VoucherProps } from './types';\nimport useImage from '../../../core/Context/useImage';\nimport { PREFIX } from '../Icon/constants';\n\nexport default function Voucher({ voucherDetails = [], className = '', ...props }: VoucherProps) {\n const { i18n } = useCoreContext();\n const getImage = useImage();\n\n return (\n <div className={classNames('adyen-checkout__voucher-result', `adyen-checkout__voucher-result--${props.paymentMethodType}`, className)}>\n <div className=\"adyen-checkout__voucher-result__top\">\n <div className=\"adyen-checkout__voucher-result__image\">\n {!!props.imageUrl && (\n <span className=\"adyen-checkout__voucher-result__image__wrapper\">\n <img alt={props.paymentMethodType} className=\"adyen-checkout__voucher-result__image__brand\" src={props.imageUrl} />\n </span>\n )}\n\n {!!props.issuerImageUrl && (\n <span className=\"adyen-checkout__voucher-result__image__wrapper\">\n <img alt={props.paymentMethodType} className=\"adyen-checkout__voucher-result__image__issuer\" src={props.issuerImageUrl} />\n </span>\n )}\n </div>\n\n <div className=\"adyen-checkout__voucher-result__introduction\">\n {props.introduction}{' '}\n {props.instructionsUrl && (\n <a\n className=\"adyen-checkout-link adyen-checkout-link--voucher-result-instructions\"\n href={props.instructionsUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n {i18n.get('voucher.readInstructions')} ›\n </a>\n )}\n </div>\n\n {props.amount && (\n <div className=\"adyen-checkout__voucher-result__amount\">\n {props.amount}\n\n {props.surcharge && (\n <span className=\"adyen-checkout__voucher-result__surcharge\">\n ({i18n.get('voucher.surcharge').replace('%@', props.surcharge)})\n </span>\n )}\n </div>\n )}\n </div>\n\n {props.reference && (\n <div className=\"adyen-checkout__voucher-result__separator\">\n <div className=\"adyen-checkout__voucher-result__separator__inner\" />\n <div className=\"adyen-checkout__voucher-result__code__label\">\n <span className=\"adyen-checkout__voucher-result__code__label__text\">{i18n.get('voucher.paymentReferenceLabel')}</span>\n </div>\n </div>\n )}\n\n <div className=\"adyen-checkout__voucher-result__bottom\">\n {props.reference && (\n <div className=\"adyen-checkout__voucher-result__code\">\n {props.barcode && (\n <img\n alt={i18n.get('voucher.paymentReferenceLabel')}\n className=\"adyen-checkout__voucher-result__code__barcode\"\n src={props.barcode}\n />\n )}\n <span>{props.reference}</span>\n </div>\n )}\n\n {(!!props.downloadUrl || !!props.copyBtn) && (\n <ul className=\"adyen-checkout__voucher-result__actions\">\n {!!props.copyBtn && (\n <li className=\"adyen-checkout__voucher-result__actions__item\">\n <Button\n inline\n variant=\"action\"\n onClick={(e, { complete }) => {\n copyToClipboard(props.reference);\n complete();\n }}\n icon={getImage({ imageFolder: 'components/' })(`${PREFIX}copy`)}\n label={i18n.get('button.copy')}\n />\n </li>\n )}\n\n {!!props.downloadUrl && (\n <li className=\"adyen-checkout__voucher-result__actions__item\">\n <Button\n inline\n variant=\"action\"\n href={props.downloadUrl}\n icon={getImage({ imageFolder: 'components/' })(`${PREFIX}download`)}\n label={props.downloadButtonText || i18n.get('button.download')}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n />\n </li>\n )}\n </ul>\n )}\n\n <ul className=\"adyen-checkout__voucher-result__details\">\n {voucherDetails\n .filter(({ label, value }) => !!label && !!value)\n .map(({ label, value }, index) => (\n <li key={index} className=\"adyen-checkout__voucher-result__details__item\">\n <span className=\"adyen-checkout__voucher-result__details__label\">{label}</span>\n <span className=\"adyen-checkout__voucher-result__details__value\">{value}</span>\n </li>\n ))}\n </ul>\n </div>\n </div>\n );\n}\n"],"names":["Voucher","voucherDetails","className","props","i18n","useCoreContext","getImage","useImage","h","div","classNames","
|
|
1
|
+
{"version":3,"file":"Voucher.js","sources":["../../../../../src/components/internal/Voucher/Voucher.tsx"],"sourcesContent":["import { h } from 'preact';\nimport classNames from 'classnames';\nimport Button from '../Button';\nimport { copyToClipboard } from '../../../utils/clipboard';\n\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport './Voucher.scss';\nimport { VoucherProps } from './types';\nimport useImage from '../../../core/Context/useImage';\nimport { PREFIX } from '../Icon/constants';\n\nexport default function Voucher({ voucherDetails = [], className = '', ...props }: VoucherProps) {\n const { i18n } = useCoreContext();\n const getImage = useImage();\n\n props.onActionHandled?.({ componentType: props.paymentMethodType, actionDescription: 'voucher-presented' });\n\n return (\n <div className={classNames('adyen-checkout__voucher-result', `adyen-checkout__voucher-result--${props.paymentMethodType}`, className)}>\n <div className=\"adyen-checkout__voucher-result__top\">\n <div className=\"adyen-checkout__voucher-result__image\">\n {!!props.imageUrl && (\n <span className=\"adyen-checkout__voucher-result__image__wrapper\">\n <img alt={props.paymentMethodType} className=\"adyen-checkout__voucher-result__image__brand\" src={props.imageUrl} />\n </span>\n )}\n\n {!!props.issuerImageUrl && (\n <span className=\"adyen-checkout__voucher-result__image__wrapper\">\n <img alt={props.paymentMethodType} className=\"adyen-checkout__voucher-result__image__issuer\" src={props.issuerImageUrl} />\n </span>\n )}\n </div>\n\n <div className=\"adyen-checkout__voucher-result__introduction\">\n {props.introduction}{' '}\n {props.instructionsUrl && (\n <a\n className=\"adyen-checkout-link adyen-checkout-link--voucher-result-instructions\"\n href={props.instructionsUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n {i18n.get('voucher.readInstructions')} ›\n </a>\n )}\n </div>\n\n {props.amount && (\n <div className=\"adyen-checkout__voucher-result__amount\">\n {props.amount}\n\n {props.surcharge && (\n <span className=\"adyen-checkout__voucher-result__surcharge\">\n ({i18n.get('voucher.surcharge').replace('%@', props.surcharge)})\n </span>\n )}\n </div>\n )}\n </div>\n\n {props.reference && (\n <div className=\"adyen-checkout__voucher-result__separator\">\n <div className=\"adyen-checkout__voucher-result__separator__inner\" />\n <div className=\"adyen-checkout__voucher-result__code__label\">\n <span className=\"adyen-checkout__voucher-result__code__label__text\">{i18n.get('voucher.paymentReferenceLabel')}</span>\n </div>\n </div>\n )}\n\n <div className=\"adyen-checkout__voucher-result__bottom\">\n {props.reference && (\n <div className=\"adyen-checkout__voucher-result__code\">\n {props.barcode && (\n <img\n alt={i18n.get('voucher.paymentReferenceLabel')}\n className=\"adyen-checkout__voucher-result__code__barcode\"\n src={props.barcode}\n />\n )}\n <span>{props.reference}</span>\n </div>\n )}\n\n {(!!props.downloadUrl || !!props.copyBtn) && (\n <ul className=\"adyen-checkout__voucher-result__actions\">\n {!!props.copyBtn && (\n <li className=\"adyen-checkout__voucher-result__actions__item\">\n <Button\n inline\n variant=\"action\"\n onClick={(e, { complete }) => {\n copyToClipboard(props.reference);\n complete();\n }}\n icon={getImage({ imageFolder: 'components/' })(`${PREFIX}copy`)}\n label={i18n.get('button.copy')}\n />\n </li>\n )}\n\n {!!props.downloadUrl && (\n <li className=\"adyen-checkout__voucher-result__actions__item\">\n <Button\n inline\n variant=\"action\"\n href={props.downloadUrl}\n icon={getImage({ imageFolder: 'components/' })(`${PREFIX}download`)}\n label={props.downloadButtonText || i18n.get('button.download')}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n />\n </li>\n )}\n </ul>\n )}\n\n <ul className=\"adyen-checkout__voucher-result__details\">\n {voucherDetails\n .filter(({ label, value }) => !!label && !!value)\n .map(({ label, value }, index) => (\n <li key={index} className=\"adyen-checkout__voucher-result__details__item\">\n <span className=\"adyen-checkout__voucher-result__details__label\">{label}</span>\n <span className=\"adyen-checkout__voucher-result__details__value\">{value}</span>\n </li>\n ))}\n </ul>\n </div>\n </div>\n );\n}\n"],"names":["Voucher","voucherDetails","className","props","i18n","useCoreContext","getImage","useImage","onActionHandled","componentType","paymentMethodType","actionDescription","h","div","classNames","imageUrl","span","img","alt","src","issuerImageUrl","introduction","instructionsUrl","a","href","target","rel","get","amount","surcharge","replace","reference","barcode","downloadUrl","copyBtn","ul","li","Button","inline","variant","onClick","e","complete","copyToClipboard","icon","imageFolder","PREFIX","label","downloadButtonText","filter","value","map","index","key"],"mappings":"oYAWe,SAASA,GAAQC,eAAEA,EAAiB,GAAEC,UAAEA,EAAY,MAAOC,IACtE,MAAMC,KAAEA,GAASC,IACXC,EAAWC,IAIjB,OAFAJ,EAAMK,kBAAkB,CAAEC,cAAeN,EAAMO,kBAAmBC,kBAAmB,sBAGjFC,EAACC,MAAAA,CAAIX,UAAWY,EAAW,iCAAkC,mCAAmCX,EAAMO,oBAAqBR,IACvHU,EAACC,MAAAA,CAAIX,UAAU,uCACXU,EAACC,MAAAA,CAAIX,UAAU,2CACRC,EAAMY,UACLH,EAACI,OAAAA,CAAKd,UAAU,kDACZU,EAACK,MAAAA,CAAIC,IAAKf,EAAMO,kBAAmBR,UAAU,+CAA+CiB,IAAKhB,EAAMY,cAI5GZ,EAAMiB,gBACLR,EAACI,OAAAA,CAAKd,UAAU,kDACZU,EAACK,MAAAA,CAAIC,IAAKf,EAAMO,kBAAmBR,UAAU,gDAAgDiB,IAAKhB,EAAMiB,mBAKpHR,EAACC,MAAAA,CAAIX,UAAU,gDACVC,EAAMkB,aAAc,IACpBlB,EAAMmB,iBACHV,EAACW,IAAAA,CACGrB,UAAU,uEACVsB,KAAMrB,EAAMmB,gBACZG,OAAO,SACPC,IAAI,uBAEHtB,EAAKuB,IAAI,4BAA4B,OAKjDxB,EAAMyB,QACHhB,EAACC,MAAAA,CAAIX,UAAU,0CACVC,EAAMyB,OAENzB,EAAM0B,WACHjB,EAACI,OAAAA,CAAKd,UAAU,6CAA4C,IACtDE,EAAKuB,IAAI,qBAAqBG,QAAQ,KAAM3B,EAAM0B,WAAW,OAOlF1B,EAAM4B,WACHnB,EAACC,MAAAA,CAAIX,UAAU,6CACXU,EAACC,MAAAA,CAAIX,UAAU,qDACfU,EAACC,MAAAA,CAAIX,UAAU,+CACXU,EAACI,OAAAA,CAAKd,UAAU,qDAAqDE,EAAKuB,IAAI,oCAK1Ff,EAACC,MAAAA,CAAIX,UAAU,0CACVC,EAAM4B,WACHnB,EAACC,MAAAA,CAAIX,UAAU,wCACVC,EAAM6B,SACHpB,EAACK,MAAAA,CACGC,IAAKd,EAAKuB,IAAI,iCACdzB,UAAU,gDACViB,IAAKhB,EAAM6B,UAGnBpB,EAACI,YAAMb,EAAM4B,eAIjB5B,EAAM8B,eAAiB9B,EAAM+B,UAC7BtB,EAACuB,KAAAA,CAAGjC,UAAU,6CACPC,EAAM+B,SACLtB,EAACwB,KAAAA,CAAGlC,UAAU,iDACVU,EAACyB,EAAAA,CACGC,QAAAA,EACAC,QAAQ,SACRC,QAAS,CAACC,GAAKC,eACXC,EAAgBxC,EAAM4B,WACtBW,GAAAA,EAEJE,KAAMtC,EAAS,CAAEuC,YAAa,eAAxBvC,CAAyC,GAAGwC,SAClDC,MAAO3C,EAAKuB,IAAI,oBAKzBxB,EAAM8B,aACLrB,EAACwB,KAAAA,CAAGlC,UAAU,iDACVU,EAACyB,EAAAA,CACGC,QAAAA,EACAC,QAAQ,SACRf,KAAMrB,EAAM8B,YACZW,KAAMtC,EAAS,CAAEuC,YAAa,eAAxBvC,CAAyC,GAAGwC,aAClDC,MAAO5C,EAAM6C,oBAAsB5C,EAAKuB,IAAI,mBAC5CF,OAAO,SACPC,IAAI,0BAOxBd,EAACuB,KAAAA,CAAGjC,UAAU,2CACTD,EACIgD,QAAO,EAAGF,QAAOG,aAAcH,KAAWG,IAC1CC,KAAI,EAAGJ,QAAOG,SAASE,IACpBxC,EAACwB,KAAAA,CAAGiB,IAAKD,EAAOlD,UAAU,iDACtBU,EAACI,OAAAA,CAAKd,UAAU,kDAAkD6C,GAClEnC,EAACI,OAAAA,CAAKd,UAAU,kDAAkDgD,QAOlG"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
const e=({props:e,i18n:n,introKey:t,getImage:o})=>{const{paymentMethodType:r,onActionHandled:a,totalAmount:c,reference:d}=e;return{paymentMethodType:r,introduction:n.get(t),imageUrl:o(r),onActionHandled:a,...c?{amount:n.amount(c.value,c.currency)}:{},...d?{reference:d}:{}}};export{e as extractCommonPropsForVoucher};
|
|
2
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../../../../src/components/internal/Voucher/utils.ts"],"sourcesContent":["import { CommonVoucherProps } from './types';\n\nexport const extractCommonPropsForVoucher = ({ props, i18n, introKey, getImage }): CommonVoucherProps => {\n const { paymentMethodType, onActionHandled, totalAmount, reference } = props;\n\n return {\n // occur in all vouchers\n paymentMethodType,\n introduction: i18n.get(introKey),\n imageUrl: getImage(paymentMethodType),\n onActionHandled,\n // occurs in 7/8 vouchers\n ...(totalAmount ? { amount: i18n.amount(totalAmount.value, totalAmount.currency) } : {}),\n // occurs in 6/8 vouchers\n ...(reference ? { reference } : {})\n };\n};\n"],"names":["extractCommonPropsForVoucher","props","i18n","introKey","getImage","paymentMethodType","onActionHandled","totalAmount","reference","introduction","get","imageUrl","amount","value","currency"],"mappings":"AAEO,MAAMA,EAA+B,EAAGC,QAAOC,OAAMC,WAAUC,eAClE,MAAMC,kBAAEA,EAAiBC,gBAAEA,EAAeC,YAAEA,EAAWC,UAAEA,GAAcP,EAEvE,MAAO,CAEHI,oBACAI,aAAcP,EAAKQ,IAAIP,GACvBQ,SAAUP,EAASC,GACnBC,qBAEIC,EAAc,CAAEK,OAAQV,EAAKU,OAAOL,EAAYM,MAAON,EAAYO,WAAc,CAAE,KAEnFN,EAAY,CAAEA,aAAc,CAAE,EACtC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CancelError.js","sources":["../../../../src/core/Errors/CancelError.ts"],"sourcesContent":["class CancelError extends Error {\n constructor(message?: string) {\n super(message);\n }\n}\n\nexport default CancelError;\n"],"names":["CancelError","Error","constructor","message","super"],"mappings":"AAAA,MAAMA,UAAoBC,MACtBC,WAAAA,CAAYC,GACRC,MAAMD,EACV"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as e}from"../../external/preact/dist/preact.js";import t from"../../components/internal/BaseElement/BaseElement.js";import{SRMessages as s}from"./SRMessages.js";class
|
|
1
|
+
import{createElement as e}from"../../external/preact/dist/preact.js";import t from"../../components/internal/BaseElement/BaseElement.js";import{SRMessages as s}from"./SRMessages.js";class n extends t{static type="srPanel";static defaultProps={enabled:!0,node:"body",showPanel:!1,id:"ariaLiveSRPanel",ariaAttributes:{"aria-relevant":"all","aria-live":"polite","aria-atomic":"true"}};srPanelContainer=null;id;showPanel;_enabled;_moveFocus;componentRef;constructor(e,t){if(super(e,t),this.id=this.props.id,this.showPanel=!1,this._enabled=!1,this._moveFocus=this.props.moveFocus??!0,this.props.enabled){this._enabled=!0;const e=document.querySelector(this.props.node);if(!e)throw new Error("Component could not mount. Root node was not found.");{const t=document.getElementById(this.id);t&&e.removeChild(t),this.srPanelContainer=document.createElement("div"),this.srPanelContainer.className="sr-panel-holder",this.srPanelContainer.id=this.id,e.appendChild(this.srPanelContainer),this.mount(this.srPanelContainer)}}}setComponentRef=e=>{this.componentRef=e};get enabled(){return this._enabled}get moveFocus(){return this._moveFocus}setAriaProps(e){const t=document.querySelector('[class^="adyen-checkout-sr-panel"]');for(const[s,n]of Object.entries(e))t.setAttribute(s,n);this.props={...this.props,ariaAttributes:{...this.props.ariaAttributes,...e}}}setMessages=e=>{if(!this.props.enabled)return;let t=null;e&&(t=Array.isArray(e)?e:[e]),this.componentRef.setMessages(t)};render(){return this.props.enabled?e("div",{className:this.showPanel?"adyen-checkout-sr-panel":"adyen-checkout-sr-panel--sr-only",role:"log",...this.props.ariaAttributes},e(s,{setComponentRef:this.setComponentRef})):null}}export{n as SRPanel};
|
|
2
2
|
//# sourceMappingURL=SRPanel.js.map
|