@adyen/adyen-web 6.0.0-beta.0 → 6.0.0-beta.1
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/README.md +123 -182
- package/dist/cjs/adyen.css +6 -6
- 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 +57 -23
- package/dist/es/adyen.css +6 -6
- package/dist/es/adyen.css.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/AmazonPay/components/AmazonPayButton.js.map +1 -1
- package/dist/es/components/AmazonPay/components/AmazonPayComponent.js.map +1 -1
- package/dist/es/components/AmazonPay/components/SignOutButton.js.map +1 -1
- package/dist/es/components/ApplePay/ApplePayService.js.map +1 -1
- package/dist/es/components/ApplePay/components/ApplePayButton.js.map +1 -1
- package/dist/es/components/Card/Card.js +1 -1
- package/dist/es/components/Card/Card.js.map +1 -1
- package/dist/es/components/Card/components/CardInput/components/CVCHint.js.map +1 -1
- package/dist/es/components/Card/components/CardInput/components/DualBrandingIcon/DualBrandingIcon.js.map +1 -1
- package/dist/es/components/Card/components/CardInput/handlers.js.map +1 -1
- package/dist/es/components/Card/components/CardInput/types.js.map +1 -1
- package/dist/es/components/Card/components/CardInput/utils.js +1 -1
- package/dist/es/components/Card/components/CardInput/utils.js.map +1 -1
- package/dist/es/components/CashAppPay/components/CashAppComponent.js.map +1 -1
- package/dist/es/components/CustomCard/CustomCard.js +1 -1
- package/dist/es/components/CustomCard/CustomCard.js.map +1 -1
- package/dist/es/components/CustomCard/CustomCardInput/CustomCardInput.js +1 -1
- package/dist/es/components/CustomCard/CustomCardInput/CustomCardInput.js.map +1 -1
- package/dist/es/components/Dropin/Dropin.js +1 -1
- package/dist/es/components/Dropin/Dropin.js.map +1 -1
- package/dist/es/components/Dropin/components/DropinComponent.js +1 -1
- package/dist/es/components/Dropin/components/DropinComponent.js.map +1 -1
- package/dist/es/components/Dropin/components/PaymentMethod/PaymentMethodItem/PaymentMethodItem.js.map +1 -1
- package/dist/es/components/Dropin/components/PaymentMethod/PaymentMethodsContainer.js.map +1 -1
- package/dist/es/components/Giftcard/Giftcard.js +1 -1
- package/dist/es/components/Giftcard/Giftcard.js.map +1 -1
- package/dist/es/components/Giftcard/components/GiftcardComponent.js +1 -1
- package/dist/es/components/Giftcard/components/GiftcardComponent.js.map +1 -1
- package/dist/es/components/GooglePay/GooglePay.js.map +1 -1
- package/dist/es/components/GooglePay/GooglePayService.js.map +1 -1
- package/dist/es/components/GooglePay/components/GooglePayButton.js.map +1 -1
- package/dist/es/components/GooglePay/requests.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/KlarnaWidget/KlarnaWidget.js +1 -1
- package/dist/es/components/Klarna/components/KlarnaWidget/KlarnaWidget.js.map +1 -1
- package/dist/es/components/Oxxo/Oxxo.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/components/RedirectShopper/RedirectShopper.js +1 -1
- package/dist/es/components/Redirect/components/RedirectShopper/RedirectShopper.js.map +1 -1
- package/dist/es/components/ThreeDS2/components/Challenge/DoChallenge3DS2.js.map +1 -1
- package/dist/es/components/ThreeDS2/components/DeviceFingerprint/DoFingerprint3DS2.js.map +1 -1
- package/dist/es/components/components-name-map.js +1 -1
- package/dist/es/components/components-name-map.js.map +1 -1
- package/dist/es/components/internal/Address/components/AddressSearch.js +1 -1
- package/dist/es/components/internal/Address/components/AddressSearch.js.map +1 -1
- package/dist/es/components/internal/Await/Await.js.map +1 -1
- package/dist/es/components/internal/BaseElement/BaseElement.js +1 -1
- package/dist/es/components/internal/BaseElement/BaseElement.js.map +1 -1
- package/dist/es/components/internal/ClickToPay/ClickToPayComponent.js.map +1 -1
- package/dist/es/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePasswordInput/CtPOneTimePasswordInput.js.map +1 -1
- package/dist/es/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePasswordInput/CtPResendOtpLink.js.map +1 -1
- package/dist/es/components/internal/ClickToPay/components/CtPSection/CtPLogoutLink.js.map +1 -1
- package/dist/es/components/internal/ClickToPay/errors/TimeoutError.js +1 -1
- package/dist/es/components/internal/ClickToPay/errors/TimeoutError.js.map +1 -1
- package/dist/es/components/internal/ClickToPay/services/ClickToPayService.js.map +1 -1
- package/dist/es/components/internal/ClickToPay/services/sdks/SrcSdkLoader.js.map +1 -1
- package/dist/es/components/internal/DisclaimerMessage/DisclaimerMessage.js.map +1 -1
- package/dist/es/components/internal/FormFields/InputBase.js.map +1 -1
- package/dist/es/components/internal/FormFields/Select/Select.js.map +1 -1
- package/dist/es/components/internal/FormFields/Select/components/SelectList.js.map +1 -1
- package/dist/es/components/internal/FormFields/Select/components/SelectListItem.js.map +1 -1
- package/dist/es/components/internal/Modal/Modal.js.map +1 -1
- package/dist/es/components/internal/QRLoader/QRLoader.js +1 -1
- package/dist/es/components/internal/QRLoader/QRLoader.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/SFP/SecuredFieldsProvider.js +1 -1
- package/dist/es/components/internal/SecuredFields/SFP/SecuredFieldsProvider.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/SFP/SecuredFieldsProviderHandlers.js +1 -1
- package/dist/es/components/internal/SecuredFields/SFP/SecuredFieldsProviderHandlers.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/SFP/defaultProps.js +1 -1
- package/dist/es/components/internal/SecuredFields/SFP/defaultProps.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/binLookup/triggerBinLookUp.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/lib/CSF/CSF.js +1 -1
- package/dist/es/components/internal/SecuredFields/lib/CSF/CSF.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/lib/CSF/extensions/configureCallbacks.js +1 -1
- package/dist/es/components/internal/SecuredFields/lib/CSF/extensions/configureCallbacks.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/lib/CSF/extensions/createSecuredFields.js +1 -1
- package/dist/es/components/internal/SecuredFields/lib/CSF/extensions/createSecuredFields.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/lib/CSF/extensions/handleIOSTouchEvents.js +1 -1
- package/dist/es/components/internal/SecuredFields/lib/CSF/extensions/handleIOSTouchEvents.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/lib/CSF/utils/cardType.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/lib/CSF/utils/iframes/postMessageValidation.js +1 -1
- package/dist/es/components/internal/SecuredFields/lib/CSF/utils/iframes/postMessageValidation.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/lib/constants.js +1 -1
- package/dist/es/components/internal/SecuredFields/lib/constants.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/lib/securedField/AbstractSecuredField.js +1 -1
- package/dist/es/components/internal/SecuredFields/lib/securedField/AbstractSecuredField.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/lib/securedField/SecuredField.js +1 -1
- package/dist/es/components/internal/SecuredFields/lib/securedField/SecuredField.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/lib/utilities/commonUtils.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/lib/utilities/dom.js +1 -1
- package/dist/es/components/internal/SecuredFields/lib/utilities/dom.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/lib/utilities/logger.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/utils.js.map +1 -1
- package/dist/es/components/internal/SocialSecurityNumberBrazil/SocialSecurityNumberBrazil.js +1 -1
- package/dist/es/components/internal/SocialSecurityNumberBrazil/SocialSecurityNumberBrazil.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/tx-variants.js +1 -1
- package/dist/es/components/tx-variants.js.map +1 -1
- package/dist/es/core/Analytics/Analytics.js +1 -1
- package/dist/es/core/Analytics/Analytics.js.map +1 -1
- package/dist/es/core/Environment/Environment.js +1 -1
- package/dist/es/core/Environment/Environment.js.map +1 -1
- package/dist/es/core/RiskModule/components/DeviceFingerprint/GetDeviceFingerprint.js.map +1 -1
- package/dist/es/core/Services/analytics/collect-id.js +1 -1
- package/dist/es/core/Services/http.js.map +1 -1
- package/dist/es/core/config.js +1 -1
- package/dist/es/core/config.js.map +1 -1
- package/dist/es/core/core.js +1 -1
- package/dist/es/core/core.js.map +1 -1
- package/dist/es/core/utils.js +1 -1
- package/dist/es/core/utils.js.map +1 -1
- package/dist/es/index.d.ts +57 -23
- package/dist/es/utils/browserInfo.js +1 -1
- package/dist/es/utils/browserInfo.js.map +1 -1
- package/dist/es/utils/listenerUtils.js +2 -0
- package/dist/es/utils/listenerUtils.js.map +1 -0
- package/dist/es/utils/regex.js.map +1 -1
- package/dist/es-legacy/adyen.css +6 -6
- package/dist/es-legacy/adyen.css.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/AmazonPay/components/AmazonPayButton.js.map +1 -1
- package/dist/es-legacy/components/AmazonPay/components/AmazonPayComponent.js.map +1 -1
- package/dist/es-legacy/components/AmazonPay/components/SignOutButton.js.map +1 -1
- package/dist/es-legacy/components/ApplePay/ApplePayService.js.map +1 -1
- package/dist/es-legacy/components/ApplePay/components/ApplePayButton.js.map +1 -1
- package/dist/es-legacy/components/Card/Card.js +1 -1
- package/dist/es-legacy/components/Card/Card.js.map +1 -1
- package/dist/es-legacy/components/Card/components/CardInput/components/CVCHint.js.map +1 -1
- package/dist/es-legacy/components/Card/components/CardInput/components/DualBrandingIcon/DualBrandingIcon.js.map +1 -1
- package/dist/es-legacy/components/Card/components/CardInput/handlers.js.map +1 -1
- package/dist/es-legacy/components/Card/components/CardInput/types.js.map +1 -1
- package/dist/es-legacy/components/Card/components/CardInput/utils.js +1 -1
- package/dist/es-legacy/components/Card/components/CardInput/utils.js.map +1 -1
- package/dist/es-legacy/components/CashAppPay/components/CashAppComponent.js.map +1 -1
- package/dist/es-legacy/components/CustomCard/CustomCard.js +1 -1
- package/dist/es-legacy/components/CustomCard/CustomCard.js.map +1 -1
- package/dist/es-legacy/components/CustomCard/CustomCardInput/CustomCardInput.js +1 -1
- package/dist/es-legacy/components/CustomCard/CustomCardInput/CustomCardInput.js.map +1 -1
- package/dist/es-legacy/components/Dropin/Dropin.js +1 -1
- package/dist/es-legacy/components/Dropin/Dropin.js.map +1 -1
- package/dist/es-legacy/components/Dropin/components/DropinComponent.js +1 -1
- package/dist/es-legacy/components/Dropin/components/DropinComponent.js.map +1 -1
- package/dist/es-legacy/components/Dropin/components/PaymentMethod/PaymentMethodItem/PaymentMethodItem.js.map +1 -1
- package/dist/es-legacy/components/Dropin/components/PaymentMethod/PaymentMethodsContainer.js.map +1 -1
- package/dist/es-legacy/components/Giftcard/Giftcard.js +1 -1
- package/dist/es-legacy/components/Giftcard/Giftcard.js.map +1 -1
- package/dist/es-legacy/components/Giftcard/components/GiftcardComponent.js +1 -1
- package/dist/es-legacy/components/Giftcard/components/GiftcardComponent.js.map +1 -1
- package/dist/es-legacy/components/GooglePay/GooglePay.js.map +1 -1
- package/dist/es-legacy/components/GooglePay/GooglePayService.js.map +1 -1
- package/dist/es-legacy/components/GooglePay/components/GooglePayButton.js.map +1 -1
- package/dist/es-legacy/components/GooglePay/requests.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/KlarnaWidget/KlarnaWidget.js +1 -1
- package/dist/es-legacy/components/Klarna/components/KlarnaWidget/KlarnaWidget.js.map +1 -1
- package/dist/es-legacy/components/Oxxo/Oxxo.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/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/components/Challenge/DoChallenge3DS2.js.map +1 -1
- package/dist/es-legacy/components/ThreeDS2/components/DeviceFingerprint/DoFingerprint3DS2.js.map +1 -1
- package/dist/es-legacy/components/components-name-map.js +1 -1
- package/dist/es-legacy/components/components-name-map.js.map +1 -1
- package/dist/es-legacy/components/internal/Address/components/AddressSearch.js +1 -1
- package/dist/es-legacy/components/internal/Address/components/AddressSearch.js.map +1 -1
- package/dist/es-legacy/components/internal/Await/Await.js.map +1 -1
- package/dist/es-legacy/components/internal/BaseElement/BaseElement.js +1 -1
- package/dist/es-legacy/components/internal/BaseElement/BaseElement.js.map +1 -1
- package/dist/es-legacy/components/internal/ClickToPay/ClickToPayComponent.js.map +1 -1
- package/dist/es-legacy/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePasswordInput/CtPOneTimePasswordInput.js.map +1 -1
- package/dist/es-legacy/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePasswordInput/CtPResendOtpLink.js.map +1 -1
- package/dist/es-legacy/components/internal/ClickToPay/components/CtPSection/CtPLogoutLink.js.map +1 -1
- package/dist/es-legacy/components/internal/ClickToPay/errors/TimeoutError.js +1 -1
- package/dist/es-legacy/components/internal/ClickToPay/errors/TimeoutError.js.map +1 -1
- package/dist/es-legacy/components/internal/ClickToPay/services/ClickToPayService.js.map +1 -1
- package/dist/es-legacy/components/internal/ClickToPay/services/sdks/SrcSdkLoader.js.map +1 -1
- package/dist/es-legacy/components/internal/DisclaimerMessage/DisclaimerMessage.js.map +1 -1
- package/dist/es-legacy/components/internal/FormFields/InputBase.js.map +1 -1
- package/dist/es-legacy/components/internal/FormFields/Select/Select.js.map +1 -1
- package/dist/es-legacy/components/internal/FormFields/Select/components/SelectList.js.map +1 -1
- package/dist/es-legacy/components/internal/FormFields/Select/components/SelectListItem.js.map +1 -1
- package/dist/es-legacy/components/internal/Modal/Modal.js.map +1 -1
- package/dist/es-legacy/components/internal/QRLoader/QRLoader.js +1 -1
- package/dist/es-legacy/components/internal/QRLoader/QRLoader.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/SFP/SecuredFieldsProvider.js +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/SFP/SecuredFieldsProvider.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/SFP/SecuredFieldsProviderHandlers.js +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/SFP/SecuredFieldsProviderHandlers.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/SFP/defaultProps.js +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/SFP/defaultProps.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/binLookup/triggerBinLookUp.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/CSF/CSF.js +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/CSF/CSF.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/CSF/extensions/configureCallbacks.js +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/CSF/extensions/configureCallbacks.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/CSF/extensions/createSecuredFields.js +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/CSF/extensions/createSecuredFields.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/CSF/extensions/handleIOSTouchEvents.js +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/CSF/extensions/handleIOSTouchEvents.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/CSF/utils/cardType.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/CSF/utils/iframes/postMessageValidation.js +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/CSF/utils/iframes/postMessageValidation.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/constants.js +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/constants.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/securedField/AbstractSecuredField.js +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/securedField/AbstractSecuredField.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/securedField/SecuredField.js +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/securedField/SecuredField.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/utilities/commonUtils.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/utilities/dom.js +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/utilities/dom.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/utilities/logger.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/utils.js.map +1 -1
- package/dist/es-legacy/components/internal/SocialSecurityNumberBrazil/SocialSecurityNumberBrazil.js +1 -1
- package/dist/es-legacy/components/internal/SocialSecurityNumberBrazil/SocialSecurityNumberBrazil.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/tx-variants.js +1 -1
- package/dist/es-legacy/components/tx-variants.js.map +1 -1
- package/dist/es-legacy/core/Analytics/Analytics.js +1 -1
- package/dist/es-legacy/core/Analytics/Analytics.js.map +1 -1
- package/dist/es-legacy/core/Environment/Environment.js +1 -1
- package/dist/es-legacy/core/Environment/Environment.js.map +1 -1
- package/dist/es-legacy/core/RiskModule/components/DeviceFingerprint/GetDeviceFingerprint.js.map +1 -1
- package/dist/es-legacy/core/Services/analytics/collect-id.js +1 -1
- package/dist/es-legacy/core/Services/http.js.map +1 -1
- package/dist/es-legacy/core/config.js +1 -1
- package/dist/es-legacy/core/config.js.map +1 -1
- package/dist/es-legacy/core/core.js +1 -1
- package/dist/es-legacy/core/core.js.map +1 -1
- package/dist/es-legacy/core/utils.js +1 -1
- package/dist/es-legacy/core/utils.js.map +1 -1
- package/dist/es-legacy/utils/browserInfo.js +1 -1
- package/dist/es-legacy/utils/browserInfo.js.map +1 -1
- package/dist/es-legacy/utils/listenerUtils.js +2 -0
- package/dist/es-legacy/utils/listenerUtils.js.map +1 -0
- package/dist/es-legacy/utils/regex.js.map +1 -1
- package/package.json +8 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sources":["../../../../../../src/components/Card/components/CardInput/types.ts"],"sourcesContent":["import Language from '../../../../language/Language';\nimport { BinLookupResponse, BrandConfiguration, CardBrandsConfiguration, CardBackendConfiguration, DualBrandSelectElement } from '../../types';\nimport { InstallmentOptions } from './components/types';\nimport { ValidationResult } from '../../../internal/PersonalDetails/types';\nimport { CVCPolicyType, DatePolicyType } from '../../../internal/SecuredFields/lib/types';\nimport Specifications from '../../../internal/Address/Specifications';\nimport { AddressSchema } from '../../../internal/Address/types';\nimport { CbObjOnError, StylesObject } from '../../../internal/SecuredFields/lib/types';\nimport { Resources } from '../../../../core/Context/Resources';\nimport { SRPanel } from '../../../../core/Errors/SRPanel';\nimport RiskElement from '../../../../core/RiskModule';\nimport { DisclaimerMsgObject } from '../../../internal/DisclaimerMessage/DisclaimerMessage';\nimport { OnAddressLookupType, OnAddressSelectedType } from '../../../internal/Address/components/AddressSearch';\nimport { ComponentMethodsRef } from '../../../internal/UIElement/types';\nimport { AddressData, PaymentAmount } from '../../../../types/global-types';\nimport { AnalyticsModule } from '../../../../types/global-types';\nimport { FieldErrorAnalyticsObject } from '../../../../core/Analytics/types';\n\nexport interface CardInputValidState {\n holderName?: boolean;\n billingAddress?: boolean;\n socialSecurityNumber?: boolean;\n encryptedCardNumber?: boolean;\n encryptedExpiryMonth?: boolean;\n encryptedExpiryYear?: boolean;\n encryptedSecurityCode?: boolean;\n taxNumber?: boolean;\n encryptedPassword?: boolean;\n}\n\nexport interface CardInputErrorState {\n holderName?: ValidationResult;\n billingAddress?: ValidationResult;\n socialSecurityNumber?: ValidationResult;\n encryptedCardNumber?: boolean;\n encryptedExpiryDate?: boolean;\n encryptedSecurityCode?: boolean;\n taxNumber?: ValidationResult;\n encryptedPassword?: boolean;\n}\n\nexport interface CardInputDataState {\n holderName?: string;\n billingAddress?: AddressData;\n socialSecurityNumber?: string;\n taxNumber?: string;\n}\n\ntype PlaceholderKeys =\n | 'holderName'\n | 'cardNumber'\n | 'expiryDate'\n | 'expiryMonth'\n | 'expiryYear'\n | 'securityCodeThreeDigits'\n | 'securityCodeFourDigits'\n | 'password';\nexport type Placeholders = Partial<Record<PlaceholderKeys, string>>;\n\n/**\n * Should be the subset of the props sent to CardInput that are *actually* used by CardInput\n * - either in the comp itself or are passed on to its children\n */\nexport interface CardInputProps {\n amount?: PaymentAmount;\n isPayButtonPrimaryVariant?: boolean;\n autoFocus?: boolean;\n billingAddressAllowedCountries?: string[];\n billingAddressRequired?: boolean;\n billingAddressRequiredFields?: string[];\n billingAddressMode?: AddressModeOptions;\n brand?: string;\n brands?: string[];\n brandsConfiguration?: CardBrandsConfiguration;\n brandsIcons: Array<BrandConfiguration>;\n clientKey: string;\n configuration?: CardBackendConfiguration;\n countryCode?: string;\n cvcPolicy?: CVCPolicyType;\n data?: CardInputDataState;\n disableIOSArrowKeys?: boolean;\n enableStoreDetails?: boolean;\n expiryMonth?: string;\n expiryYear?: string;\n forceCompat?: boolean;\n fundingSource?: 'debit' | 'credit';\n hasCVC?: boolean;\n hasHolderName?: boolean;\n holderNameRequired?: boolean;\n i18n?: Language;\n implementationType?: string;\n installmentOptions?: InstallmentOptions;\n keypadFix?: boolean;\n lastFour?: string;\n loadingContext: string;\n legacyInputMode?: boolean;\n minimumExpiryDate?: string;\n modules?: {\n srPanel: SRPanel;\n analytics: AnalyticsModule;\n risk: RiskElement;\n resources: Resources;\n };\n onAdditionalSFConfig?: () => {};\n onAdditionalSFRemoved?: () => {};\n onAllValid?: () => {};\n onAutoComplete?: () => {};\n onBinValue?: () => {};\n onBlur?: (e) => {};\n onBrand?: () => {};\n onConfigSuccess?: () => {};\n onChange?: (state) => {};\n onError?: () => {};\n onFieldValid?: () => {};\n onFocus?: (e) => {};\n onLoad?: () => {};\n onAddressLookup?: OnAddressLookupType;\n onAddressSelected?: OnAddressSelectedType;\n addressSearchDebounceMs?: number;\n payButton?: (obj) => {};\n placeholders?: Placeholders;\n positionHolderNameOnTop?: boolean;\n resources: Resources;\n setComponentRef?: (ref) => void;\n showBrandIcon?: boolean;\n showInstallmentAmounts?: boolean;\n showPayButton: boolean;\n showStoreDetailsCheckbox?: boolean;\n showWarnings?: boolean;\n showContextualElement?: boolean;\n specifications?: Specifications;\n storedPaymentMethodId?: string;\n styles?: StylesObject;\n trimTrailingSeparator?: boolean;\n type?: string;\n maskSecurityCode?: boolean;\n exposeExpiryDate?: boolean;\n disclaimerMessage?: DisclaimerMsgObject;\n onValidationErrorAnalytics?: (obj: FieldErrorAnalyticsObject) => {};\n}\n\nexport interface CardInputState {\n dualBrandSelectElements: DualBrandSelectElement[];\n selectedBrandValue: string;\n billingAddress: object;\n brand?: string;\n data?: object;\n errors?: object;\n focusedElement: string;\n cvcPolicy: CVCPolicyType;\n expiryDatePolicy: DatePolicyType;\n isValid: boolean;\n status: string;\n valid?: object;\n issuingCountryCode: string;\n showSocialSecurityNumber?: boolean;\n}\n\n// An interface for the members exposed by CardInput to its parent Card/UIElement\nexport interface CardInputRef extends ComponentMethodsRef {\n sfp?: any;\n setFocusOn?: (who) => void;\n processBinLookupResponse?: (binLookupResponse: BinLookupResponse, isReset: boolean) => void;\n updateStyles?: (stylesObj: StylesObject) => void;\n handleUnsupportedCard?: (errObj: CbObjOnError) => boolean;\n}\n\nexport interface FieldError {\n errorMessage?: string;\n errorI18n?: string;\n}\n\nexport interface SFError {\n isValid?: boolean;\n errorMessage?: string;\n errorI18n?: string;\n error: string;\n rootNode: HTMLElement;\n detectedBrands?: string[];\n}\n\nexport interface SFStateErrorObj {\n [key: string]: SFError;\n}\n\nexport interface LayoutObj {\n props: CardInputProps;\n showKCP: boolean;\n showBrazilianSSN: boolean;\n countrySpecificSchemas: AddressSchema;\n billingAddressRequiredFields?: string[];\n}\n\nexport enum AddressModeOptions {\n full = 'full',\n partial = 'partial',\n none = 'none'\n}\n"],"names":["AddressModeOptions"],"mappings":"
|
|
1
|
+
{"version":3,"file":"types.js","sources":["../../../../../../src/components/Card/components/CardInput/types.ts"],"sourcesContent":["import Language from '../../../../language/Language';\nimport { BinLookupResponse, BrandConfiguration, CardBrandsConfiguration, CardBackendConfiguration, DualBrandSelectElement } from '../../types';\nimport { InstallmentOptions } from './components/types';\nimport { ValidationResult } from '../../../internal/PersonalDetails/types';\nimport { CVCPolicyType, DatePolicyType } from '../../../internal/SecuredFields/lib/types';\nimport Specifications from '../../../internal/Address/Specifications';\nimport { AddressSchema } from '../../../internal/Address/types';\nimport { CbObjOnError, StylesObject } from '../../../internal/SecuredFields/lib/types';\nimport { Resources } from '../../../../core/Context/Resources';\nimport { SRPanel } from '../../../../core/Errors/SRPanel';\nimport RiskElement from '../../../../core/RiskModule';\nimport { DisclaimerMsgObject } from '../../../internal/DisclaimerMessage/DisclaimerMessage';\nimport { OnAddressLookupType, OnAddressSelectedType } from '../../../internal/Address/components/AddressSearch';\nimport { ComponentMethodsRef } from '../../../internal/UIElement/types';\nimport { AddressData, PaymentAmount } from '../../../../types/global-types';\nimport { AnalyticsModule } from '../../../../types/global-types';\nimport { FieldErrorAnalyticsObject } from '../../../../core/Analytics/types';\n\nexport interface CardInputValidState {\n holderName?: boolean;\n billingAddress?: boolean;\n socialSecurityNumber?: boolean;\n encryptedCardNumber?: boolean;\n encryptedExpiryMonth?: boolean;\n encryptedExpiryYear?: boolean;\n encryptedSecurityCode?: boolean;\n taxNumber?: boolean;\n encryptedPassword?: boolean;\n}\n\nexport interface CardInputErrorState {\n holderName?: ValidationResult;\n billingAddress?: ValidationResult;\n socialSecurityNumber?: ValidationResult;\n encryptedCardNumber?: boolean;\n encryptedExpiryDate?: boolean;\n encryptedSecurityCode?: boolean;\n taxNumber?: ValidationResult;\n encryptedPassword?: boolean;\n}\n\nexport interface CardInputDataState {\n holderName?: string;\n billingAddress?: AddressData;\n socialSecurityNumber?: string;\n taxNumber?: string;\n}\n\ntype PlaceholderKeys =\n | 'holderName'\n | 'cardNumber'\n | 'expiryDate'\n | 'expiryMonth'\n | 'expiryYear'\n | 'securityCodeThreeDigits'\n | 'securityCodeFourDigits'\n | 'password';\nexport type Placeholders = Partial<Record<PlaceholderKeys, string>>;\n\n/**\n * Should be the subset of the props sent to CardInput that are *actually* used by CardInput\n * - either in the comp itself or are passed on to its children\n */\nexport interface CardInputProps {\n amount?: PaymentAmount;\n isPayButtonPrimaryVariant?: boolean;\n autoFocus?: boolean;\n billingAddressAllowedCountries?: string[];\n billingAddressRequired?: boolean;\n billingAddressRequiredFields?: string[];\n billingAddressMode?: AddressModeOptions;\n brand?: string;\n brands?: string[];\n brandsConfiguration?: CardBrandsConfiguration;\n brandsIcons: Array<BrandConfiguration>;\n clientKey: string;\n configuration?: CardBackendConfiguration;\n countryCode?: string;\n cvcPolicy?: CVCPolicyType;\n data?: CardInputDataState;\n disableIOSArrowKeys?: boolean;\n enableStoreDetails?: boolean;\n expiryMonth?: string;\n expiryYear?: string;\n forceCompat?: boolean;\n fundingSource?: 'debit' | 'credit';\n hasCVC?: boolean;\n hasHolderName?: boolean;\n holderNameRequired?: boolean;\n i18n?: Language;\n implementationType?: string;\n installmentOptions?: InstallmentOptions;\n keypadFix?: boolean;\n lastFour?: string;\n loadingContext: string;\n legacyInputMode?: boolean;\n minimumExpiryDate?: string;\n modules?: {\n srPanel: SRPanel;\n analytics: AnalyticsModule;\n risk: RiskElement;\n resources: Resources;\n };\n onAdditionalSFConfig?: () => {};\n onAdditionalSFRemoved?: () => {};\n onAllValid?: () => {};\n onAutoComplete?: () => {};\n onBinValue?: () => {};\n onBlur?: (e) => {};\n onBrand?: () => {};\n onConfigSuccess?: () => {};\n onChange?: (state) => {};\n onError?: () => {};\n onFieldValid?: () => {};\n onFocus?: (e) => {};\n onLoad?: () => {};\n handleKeyPress?: (obj: KeyboardEvent) => void;\n onAddressLookup?: OnAddressLookupType;\n onAddressSelected?: OnAddressSelectedType;\n addressSearchDebounceMs?: number;\n payButton?: (obj) => {};\n placeholders?: Placeholders;\n positionHolderNameOnTop?: boolean;\n resources: Resources;\n setComponentRef?: (ref) => void;\n showBrandIcon?: boolean;\n showInstallmentAmounts?: boolean;\n showPayButton: boolean;\n showStoreDetailsCheckbox?: boolean;\n showWarnings?: boolean;\n showContextualElement?: boolean;\n specifications?: Specifications;\n storedPaymentMethodId?: string;\n styles?: StylesObject;\n trimTrailingSeparator?: boolean;\n type?: string;\n maskSecurityCode?: boolean;\n exposeExpiryDate?: boolean;\n disclaimerMessage?: DisclaimerMsgObject;\n onValidationErrorAnalytics?: (obj: FieldErrorAnalyticsObject) => {};\n}\n\nexport interface CardInputState {\n dualBrandSelectElements: DualBrandSelectElement[];\n selectedBrandValue: string;\n billingAddress: object;\n brand?: string;\n data?: object;\n errors?: object;\n focusedElement: string;\n cvcPolicy: CVCPolicyType;\n expiryDatePolicy: DatePolicyType;\n isValid: boolean;\n status: string;\n valid?: object;\n issuingCountryCode: string;\n showSocialSecurityNumber?: boolean;\n}\n\n// An interface for the members exposed by CardInput to its parent Card/UIElement\nexport interface CardInputRef extends ComponentMethodsRef {\n sfp?: any;\n setFocusOn?: (who) => void;\n processBinLookupResponse?: (binLookupResponse: BinLookupResponse, isReset: boolean) => void;\n updateStyles?: (stylesObj: StylesObject) => void;\n handleUnsupportedCard?: (errObj: CbObjOnError) => boolean;\n}\n\nexport interface FieldError {\n errorMessage?: string;\n errorI18n?: string;\n}\n\nexport interface SFError {\n isValid?: boolean;\n errorMessage?: string;\n errorI18n?: string;\n error: string;\n rootNode: HTMLElement;\n detectedBrands?: string[];\n}\n\nexport interface SFStateErrorObj {\n [key: string]: SFError;\n}\n\nexport interface LayoutObj {\n props: CardInputProps;\n showKCP: boolean;\n showBrazilianSSN: boolean;\n countrySpecificSchemas: AddressSchema;\n billingAddressRequiredFields?: string[];\n}\n\nexport enum AddressModeOptions {\n full = 'full',\n partial = 'partial',\n none = 'none'\n}\n"],"names":["AddressModeOptions"],"mappings":"OAkMYA,SAAAA,mDAAAA,CAAAA,IAAAA,EAAAA,CAAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{AddressModeOptions as e}from"./types.js";import{CREDIT_CARD_NAME_TOP as o,CREDIT_CARD_NAME_BOTTOM as n,KCP_CARD_NAME_TOP as i,KCP_CARD_NAME_BOTTOM as r,SSN_CARD_NAME_TOP as t,SSN_CARD_NAME_BOTTOM as
|
|
1
|
+
import{AddressModeOptions as e}from"./types.js";import{CREDIT_CARD_NAME_TOP as o,CREDIT_CARD_NAME_BOTTOM as n,KCP_CARD_NAME_TOP as i,KCP_CARD_NAME_BOTTOM as r,SSN_CARD_NAME_TOP as t,SSN_CARD_NAME_BOTTOM as s,CREDIT_CARD as a,KCP_CARD as l,SSN_CARD as d}from"./layouts.js";import{PARTIAL_ADDRESS_SCHEMA as u}from"../../../internal/Address/constants.js";import{BRAND_READABLE_NAME_MAP as c}from"../../../internal/SecuredFields/lib/constants.js";import{SF_ErrorCodes as m}from"../../../../core/Errors/constants.js";const p=(e,o)=>o({type:"card"===e?"nocard":e||"nocard",extension:"svg"})(e),C=e=>"revolving"===e?.plan||e?.value>1,h=({props:e,showKCP:u,showBrazilianSSN:c,countrySpecificSchemas:m=null,billingAddressRequiredFields:p=null})=>{let C=a;const h=e.hasHolderName&&e.holderNameRequired;if(h&&(C=e.positionHolderNameOnTop?o:n),u&&(C=l,h&&(C=e.positionHolderNameOnTop?i:r)),c&&(C=d,h&&(C=e.positionHolderNameOnTop?t:s)),m){const i=m.flat(2).filter((e=>"number"!=typeof e));let r=i;p&&(r=i.filter((e=>p.includes(e)))),C=a.concat(r),h&&(C=e.positionHolderNameOnTop?o.concat(r):n.concat(r))}return C},R=(e,o,n)=>{switch(e){case"socialSecurityNumber":return o.get(`boleto.${e}`);case"street":case"houseNumberOrName":case"postalCode":case"stateOrProvince":case"city":case"country":return n?.[e]?o.get(n?.[e]):o.get(e);default:return null}},g=e=>({amount:e.amount,billingAddressRequired:e.billingAddressRequired,billingAddressRequiredFields:e.billingAddressRequiredFields,billingAddressAllowedCountries:e.billingAddressAllowedCountries,brandsConfiguration:e.brandsConfiguration,showStoreDetailsCheckbox:e.showStoreDetailsCheckbox,hasCVC:e.hasCVC,hasHolderName:e.hasHolderName,holderNameRequired:e.holderNameRequired,installmentOptions:e.installmentOptions,placeholders:e.placeholders,positionHolderNameOnTop:e.positionHolderNameOnTop,showBrandIcon:e.showBrandIcon,showContextualElement:e.showContextualElement,lastFour:e.lastFour,expiryMonth:e.expiryMonth,expiryYear:e.expiryYear,disclaimerMessage:e.disclaimerMessage}),y=e=>({autoFocus:e.autoFocus,brands:e.brands,brandsConfiguration:e.brandsConfiguration,clientKey:e.clientKey,countryCode:e.countryCode,forceCompat:e.forceCompat,i18n:e.i18n,implementationType:e.implementationType,keypadFix:e.keypadFix,legacyInputMode:e.legacyInputMode,loadingContext:e.loadingContext,maskSecurityCode:e.maskSecurityCode,exposeExpiryDate:e.exposeExpiryDate,minimumExpiryDate:e.minimumExpiryDate,onAdditionalSFConfig:e.onAdditionalSFConfig,onAdditionalSFRemoved:e.onAdditionalSFRemoved,onAllValid:e.onAllValid,onAutoComplete:e.onAutoComplete,onBinValue:e.onBinValue,onConfigSuccess:e.onConfigSuccess,handleKeyPress:e.handleKeyPress,onError:e.onError,onFieldValid:e.onFieldValid,onLoad:e.onLoad,placeholders:e.placeholders,resources:e.resources,showContextualElement:e.showContextualElement,showWarnings:e.showWarnings,trimTrailingSeparator:e.trimTrailingSeparator}),S=o=>o==e.partial?u:null;function f(e){return![m.ERROR_MSG_UNSUPPORTED_CARD_ENTERED,m.ERROR_MSG_CARD_TOO_OLD,m.ERROR_MSG_CARD_TOO_FAR_IN_FUTURE,m.ERROR_MSG_CARD_EXPIRES_TOO_SOON].includes(e)}function O(e){return c[e]??e}export{g as extractPropsForCardFields,y as extractPropsForSFP,p as getCardImageUrl,O as getFullBrandName,h as getLayout,S as handlePartialAddressMode,C as hasValidInstallmentsObject,f as lookupBlurBasedErrors,R as mapFieldKey};
|
|
2
2
|
//# sourceMappingURL=utils.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","sources":["../../../../../../src/components/Card/components/CardInput/utils.ts"],"sourcesContent":["import Language from '../../../../language/Language';\nimport { AddressModeOptions, CardInputProps, LayoutObj } from './types';\nimport {\n CREDIT_CARD,\n CREDIT_CARD_NAME_BOTTOM,\n CREDIT_CARD_NAME_TOP,\n KCP_CARD,\n KCP_CARD_NAME_BOTTOM,\n KCP_CARD_NAME_TOP,\n SSN_CARD,\n SSN_CARD_NAME_BOTTOM,\n SSN_CARD_NAME_TOP\n} from './layouts';\nimport { AddressSpecifications, StringObject } from '../../../internal/Address/types';\nimport { PARTIAL_ADDRESS_SCHEMA } from '../../../internal/Address/constants';\nimport { InstallmentsObj } from './components/Installments/Installments';\nimport { SFPProps } from '../../../internal/SecuredFields/SFP/types';\nimport { BRAND_READABLE_NAME_MAP } from '../../../internal/SecuredFields/lib/constants';\nimport { UseImageHookType } from '../../../../core/Context/useImage';\nimport { SF_ErrorCodes } from '../../../../core/Errors/constants';\n\nexport const getCardImageUrl = (brand: string, getImage: UseImageHookType): string => {\n const imageOptions = {\n type: brand === 'card' ? 'nocard' : brand || 'nocard',\n extension: 'svg'\n };\n\n return getImage(imageOptions)(brand);\n};\n\n/**\n * Verifies that installment object is valid to send to the Backend.\n * Valid means that it has 'revolving' plan set, or the number of installments is bigger than one\n */\nexport const hasValidInstallmentsObject = (installments?: InstallmentsObj) => {\n return installments?.plan === 'revolving' || installments?.value > 1;\n};\n\nexport const getLayout = ({\n props,\n showKCP,\n showBrazilianSSN,\n countrySpecificSchemas = null,\n billingAddressRequiredFields = null\n}: LayoutObj): string[] => {\n let layout = CREDIT_CARD;\n const hasRequiredHolderName = props.hasHolderName && props.holderNameRequired;\n\n if (hasRequiredHolderName) {\n layout = props.positionHolderNameOnTop ? CREDIT_CARD_NAME_TOP : CREDIT_CARD_NAME_BOTTOM;\n }\n\n if (showKCP) {\n layout = KCP_CARD;\n if (hasRequiredHolderName) {\n layout = props.positionHolderNameOnTop ? KCP_CARD_NAME_TOP : KCP_CARD_NAME_BOTTOM;\n }\n }\n\n if (showBrazilianSSN) {\n layout = SSN_CARD;\n if (hasRequiredHolderName) {\n layout = props.positionHolderNameOnTop ? SSN_CARD_NAME_TOP : SSN_CARD_NAME_BOTTOM;\n }\n }\n\n // w. Billing address\n if (countrySpecificSchemas) {\n // Flatten array and remove any numbers that describe how fields should be aligned\n const countrySpecificSchemasFlat: string[] = countrySpecificSchemas['flat'](2).filter(item => typeof item !== 'number') as string[];\n\n let countryBasedAddressLayout = countrySpecificSchemasFlat;\n\n if (billingAddressRequiredFields) {\n // Get intersection of the 2 arrays\n countryBasedAddressLayout = countrySpecificSchemasFlat.filter(x => billingAddressRequiredFields.includes(x));\n }\n\n layout = CREDIT_CARD.concat(countryBasedAddressLayout);\n if (hasRequiredHolderName) {\n layout = props.positionHolderNameOnTop\n ? CREDIT_CARD_NAME_TOP.concat(countryBasedAddressLayout)\n : CREDIT_CARD_NAME_BOTTOM.concat(countryBasedAddressLayout);\n }\n // TODO we are not yet creating a layout for AVS + SSN field (w. or w/o holderName) - is AVS + SSN a real world scenario?\n }\n return layout;\n};\n\n/**\n * Lookup service to map local (CardInput) field refs to a key, possibly region specific, by which to retrieve the translation\n */\nexport const mapFieldKey = (key: string, i18n: Language, countrySpecificLabels: StringObject): string => {\n // console.log('### utils::mapFieldKey:: key', key);\n switch (key) {\n case 'socialSecurityNumber':\n return i18n.get(`boleto.${key}`);\n // Address related - if we have a country specific key for the field - use that to get the translation\n case 'street':\n case 'houseNumberOrName':\n case 'postalCode':\n case 'stateOrProvince':\n case 'city':\n case 'country':\n return countrySpecificLabels?.[key] ? i18n.get(countrySpecificLabels?.[key]) : i18n.get(key);\n // We know that the translated error messages do contain a reference to the field they refer to, so we won't need to map them (currently applies mostly to SecuredFields related errors)\n default:\n return null;\n }\n};\n\nexport const extractPropsForCardFields = (props: CardInputProps) => {\n return {\n // Extract props for CardFieldsWrapper & StoredCardFieldsWrapper(just needs amount, hasCVC, installmentOptions)\n amount: props.amount,\n billingAddressRequired: props.billingAddressRequired,\n billingAddressRequiredFields: props.billingAddressRequiredFields,\n billingAddressAllowedCountries: props.billingAddressAllowedCountries,\n brandsConfiguration: props.brandsConfiguration,\n showStoreDetailsCheckbox: props.showStoreDetailsCheckbox,\n hasCVC: props.hasCVC,\n hasHolderName: props.hasHolderName,\n holderNameRequired: props.holderNameRequired,\n installmentOptions: props.installmentOptions,\n placeholders: props.placeholders,\n positionHolderNameOnTop: props.positionHolderNameOnTop,\n // Extract props for CardFields > CardNumber\n showBrandIcon: props.showBrandIcon,\n showContextualElement: props.showContextualElement,\n // Extract props for StoredCardFields\n lastFour: props.lastFour,\n expiryMonth: props.expiryMonth,\n expiryYear: props.expiryYear,\n disclaimerMessage: props.disclaimerMessage\n };\n};\n\nexport const extractPropsForSFP = (props: CardInputProps) => {\n return {\n autoFocus: props.autoFocus,\n brands: props.brands,\n brandsConfiguration: props.brandsConfiguration,\n clientKey: props.clientKey,\n countryCode: props.countryCode,\n forceCompat: props.forceCompat,\n i18n: props.i18n,\n implementationType: props.implementationType,\n keypadFix: props.keypadFix,\n legacyInputMode: props.legacyInputMode,\n loadingContext: props.loadingContext,\n maskSecurityCode: props.maskSecurityCode,\n exposeExpiryDate: props.exposeExpiryDate,\n minimumExpiryDate: props.minimumExpiryDate,\n onAdditionalSFConfig: props.onAdditionalSFConfig,\n onAdditionalSFRemoved: props.onAdditionalSFRemoved,\n onAllValid: props.onAllValid,\n onAutoComplete: props.onAutoComplete,\n onBinValue: props.onBinValue,\n onConfigSuccess: props.onConfigSuccess,\n onError: props.onError,\n onFieldValid: props.onFieldValid,\n onLoad: props.onLoad,\n placeholders: props.placeholders,\n resources: props.resources,\n showContextualElement: props.showContextualElement,\n showWarnings: props.showWarnings,\n trimTrailingSeparator: props.trimTrailingSeparator\n } as SFPProps; // Can't set as return type on fn or it will complain about missing, mandatory, props\n};\n\nexport const handlePartialAddressMode = (addressMode: AddressModeOptions): AddressSpecifications | null => {\n return addressMode == AddressModeOptions.partial ? PARTIAL_ADDRESS_SCHEMA : null;\n};\n\n// Almost all errors are blur based, but some SF ones are not i.e. when an unsupported card is entered or the expiry date is out of range\nexport function lookupBlurBasedErrors(errorCode) {\n return ![\n SF_ErrorCodes.ERROR_MSG_UNSUPPORTED_CARD_ENTERED,\n SF_ErrorCodes.ERROR_MSG_CARD_TOO_OLD,\n SF_ErrorCodes.ERROR_MSG_CARD_TOO_FAR_IN_FUTURE,\n SF_ErrorCodes.ERROR_MSG_CARD_EXPIRES_TOO_SOON\n ].includes(errorCode);\n}\n\nexport function getFullBrandName(brand) {\n return BRAND_READABLE_NAME_MAP[brand] ?? brand;\n}\n"],"names":["getCardImageUrl","brand","getImage","type","extension","hasValidInstallmentsObject","installments","plan","value","getLayout","props","showKCP","showBrazilianSSN","countrySpecificSchemas","billingAddressRequiredFields","layout","CREDIT_CARD","hasRequiredHolderName","hasHolderName","holderNameRequired","positionHolderNameOnTop","CREDIT_CARD_NAME_TOP","CREDIT_CARD_NAME_BOTTOM","KCP_CARD","KCP_CARD_NAME_TOP","KCP_CARD_NAME_BOTTOM","SSN_CARD","SSN_CARD_NAME_TOP","SSN_CARD_NAME_BOTTOM","countrySpecificSchemasFlat","filter","item","countryBasedAddressLayout","x","includes","concat","mapFieldKey","key","i18n","countrySpecificLabels","get","extractPropsForCardFields","amount","billingAddressRequired","billingAddressAllowedCountries","brandsConfiguration","showStoreDetailsCheckbox","hasCVC","installmentOptions","placeholders","showBrandIcon","showContextualElement","lastFour","expiryMonth","expiryYear","disclaimerMessage","extractPropsForSFP","autoFocus","brands","clientKey","countryCode","forceCompat","implementationType","keypadFix","legacyInputMode","loadingContext","maskSecurityCode","exposeExpiryDate","minimumExpiryDate","onAdditionalSFConfig","onAdditionalSFRemoved","onAllValid","onAutoComplete","onBinValue","onConfigSuccess","onError","onFieldValid","onLoad","resources","showWarnings","trimTrailingSeparator","handlePartialAddressMode","addressMode","AddressModeOptions","partial","PARTIAL_ADDRESS_SCHEMA","lookupBlurBasedErrors","errorCode","SF_ErrorCodes","ERROR_MSG_UNSUPPORTED_CARD_ENTERED","ERROR_MSG_CARD_TOO_OLD","ERROR_MSG_CARD_TOO_FAR_IN_FUTURE","ERROR_MSG_CARD_EXPIRES_TOO_SOON","getFullBrandName","BRAND_READABLE_NAME_MAP"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../../../../../src/components/Card/components/CardInput/utils.ts"],"sourcesContent":["import Language from '../../../../language/Language';\nimport { AddressModeOptions, CardInputProps, LayoutObj } from './types';\nimport {\n CREDIT_CARD,\n CREDIT_CARD_NAME_BOTTOM,\n CREDIT_CARD_NAME_TOP,\n KCP_CARD,\n KCP_CARD_NAME_BOTTOM,\n KCP_CARD_NAME_TOP,\n SSN_CARD,\n SSN_CARD_NAME_BOTTOM,\n SSN_CARD_NAME_TOP\n} from './layouts';\nimport { AddressSpecifications, StringObject } from '../../../internal/Address/types';\nimport { PARTIAL_ADDRESS_SCHEMA } from '../../../internal/Address/constants';\nimport { InstallmentsObj } from './components/Installments/Installments';\nimport { SFPProps } from '../../../internal/SecuredFields/SFP/types';\nimport { BRAND_READABLE_NAME_MAP } from '../../../internal/SecuredFields/lib/constants';\nimport { UseImageHookType } from '../../../../core/Context/useImage';\nimport { SF_ErrorCodes } from '../../../../core/Errors/constants';\n\nexport const getCardImageUrl = (brand: string, getImage: UseImageHookType): string => {\n const imageOptions = {\n type: brand === 'card' ? 'nocard' : brand || 'nocard',\n extension: 'svg'\n };\n\n return getImage(imageOptions)(brand);\n};\n\n/**\n * Verifies that installment object is valid to send to the Backend.\n * Valid means that it has 'revolving' plan set, or the number of installments is bigger than one\n */\nexport const hasValidInstallmentsObject = (installments?: InstallmentsObj) => {\n return installments?.plan === 'revolving' || installments?.value > 1;\n};\n\nexport const getLayout = ({\n props,\n showKCP,\n showBrazilianSSN,\n countrySpecificSchemas = null,\n billingAddressRequiredFields = null\n}: LayoutObj): string[] => {\n let layout = CREDIT_CARD;\n const hasRequiredHolderName = props.hasHolderName && props.holderNameRequired;\n\n if (hasRequiredHolderName) {\n layout = props.positionHolderNameOnTop ? CREDIT_CARD_NAME_TOP : CREDIT_CARD_NAME_BOTTOM;\n }\n\n if (showKCP) {\n layout = KCP_CARD;\n if (hasRequiredHolderName) {\n layout = props.positionHolderNameOnTop ? KCP_CARD_NAME_TOP : KCP_CARD_NAME_BOTTOM;\n }\n }\n\n if (showBrazilianSSN) {\n layout = SSN_CARD;\n if (hasRequiredHolderName) {\n layout = props.positionHolderNameOnTop ? SSN_CARD_NAME_TOP : SSN_CARD_NAME_BOTTOM;\n }\n }\n\n // w. Billing address\n if (countrySpecificSchemas) {\n // Flatten array and remove any numbers that describe how fields should be aligned\n const countrySpecificSchemasFlat: string[] = countrySpecificSchemas['flat'](2).filter(item => typeof item !== 'number') as string[];\n\n let countryBasedAddressLayout = countrySpecificSchemasFlat;\n\n if (billingAddressRequiredFields) {\n // Get intersection of the 2 arrays\n countryBasedAddressLayout = countrySpecificSchemasFlat.filter(x => billingAddressRequiredFields.includes(x));\n }\n\n layout = CREDIT_CARD.concat(countryBasedAddressLayout);\n if (hasRequiredHolderName) {\n layout = props.positionHolderNameOnTop\n ? CREDIT_CARD_NAME_TOP.concat(countryBasedAddressLayout)\n : CREDIT_CARD_NAME_BOTTOM.concat(countryBasedAddressLayout);\n }\n // TODO we are not yet creating a layout for AVS + SSN field (w. or w/o holderName) - is AVS + SSN a real world scenario?\n }\n return layout;\n};\n\n/**\n * Lookup service to map local (CardInput) field refs to a key, possibly region specific, by which to retrieve the translation\n */\nexport const mapFieldKey = (key: string, i18n: Language, countrySpecificLabels: StringObject): string => {\n // console.log('### utils::mapFieldKey:: key', key);\n switch (key) {\n case 'socialSecurityNumber':\n return i18n.get(`boleto.${key}`);\n // Address related - if we have a country specific key for the field - use that to get the translation\n case 'street':\n case 'houseNumberOrName':\n case 'postalCode':\n case 'stateOrProvince':\n case 'city':\n case 'country':\n return countrySpecificLabels?.[key] ? i18n.get(countrySpecificLabels?.[key]) : i18n.get(key);\n // We know that the translated error messages do contain a reference to the field they refer to, so we won't need to map them (currently applies mostly to SecuredFields related errors)\n default:\n return null;\n }\n};\n\nexport const extractPropsForCardFields = (props: CardInputProps) => {\n return {\n // Extract props for CardFieldsWrapper & StoredCardFieldsWrapper(just needs amount, hasCVC, installmentOptions)\n amount: props.amount,\n billingAddressRequired: props.billingAddressRequired,\n billingAddressRequiredFields: props.billingAddressRequiredFields,\n billingAddressAllowedCountries: props.billingAddressAllowedCountries,\n brandsConfiguration: props.brandsConfiguration,\n showStoreDetailsCheckbox: props.showStoreDetailsCheckbox,\n hasCVC: props.hasCVC,\n hasHolderName: props.hasHolderName,\n holderNameRequired: props.holderNameRequired,\n installmentOptions: props.installmentOptions,\n placeholders: props.placeholders,\n positionHolderNameOnTop: props.positionHolderNameOnTop,\n // Extract props for CardFields > CardNumber\n showBrandIcon: props.showBrandIcon,\n showContextualElement: props.showContextualElement,\n // Extract props for StoredCardFields\n lastFour: props.lastFour,\n expiryMonth: props.expiryMonth,\n expiryYear: props.expiryYear,\n disclaimerMessage: props.disclaimerMessage\n };\n};\n\nexport const extractPropsForSFP = (props: CardInputProps) => {\n return {\n autoFocus: props.autoFocus,\n brands: props.brands,\n brandsConfiguration: props.brandsConfiguration,\n clientKey: props.clientKey,\n countryCode: props.countryCode,\n forceCompat: props.forceCompat,\n i18n: props.i18n,\n implementationType: props.implementationType,\n keypadFix: props.keypadFix,\n legacyInputMode: props.legacyInputMode,\n loadingContext: props.loadingContext,\n maskSecurityCode: props.maskSecurityCode,\n exposeExpiryDate: props.exposeExpiryDate,\n minimumExpiryDate: props.minimumExpiryDate,\n onAdditionalSFConfig: props.onAdditionalSFConfig,\n onAdditionalSFRemoved: props.onAdditionalSFRemoved,\n onAllValid: props.onAllValid,\n onAutoComplete: props.onAutoComplete,\n onBinValue: props.onBinValue,\n onConfigSuccess: props.onConfigSuccess,\n handleKeyPress: props.handleKeyPress,\n onError: props.onError,\n onFieldValid: props.onFieldValid,\n onLoad: props.onLoad,\n placeholders: props.placeholders,\n resources: props.resources,\n showContextualElement: props.showContextualElement,\n showWarnings: props.showWarnings,\n trimTrailingSeparator: props.trimTrailingSeparator\n } as SFPProps; // Can't set as return type on fn or it will complain about missing, mandatory, props\n};\n\nexport const handlePartialAddressMode = (addressMode: AddressModeOptions): AddressSpecifications | null => {\n return addressMode == AddressModeOptions.partial ? PARTIAL_ADDRESS_SCHEMA : null;\n};\n\n// Almost all errors are blur based, but some SF ones are not i.e. when an unsupported card is entered or the expiry date is out of range\nexport function lookupBlurBasedErrors(errorCode) {\n return ![\n SF_ErrorCodes.ERROR_MSG_UNSUPPORTED_CARD_ENTERED,\n SF_ErrorCodes.ERROR_MSG_CARD_TOO_OLD,\n SF_ErrorCodes.ERROR_MSG_CARD_TOO_FAR_IN_FUTURE,\n SF_ErrorCodes.ERROR_MSG_CARD_EXPIRES_TOO_SOON\n ].includes(errorCode);\n}\n\nexport function getFullBrandName(brand) {\n return BRAND_READABLE_NAME_MAP[brand] ?? brand;\n}\n"],"names":["getCardImageUrl","brand","getImage","type","extension","hasValidInstallmentsObject","installments","plan","value","getLayout","props","showKCP","showBrazilianSSN","countrySpecificSchemas","billingAddressRequiredFields","layout","CREDIT_CARD","hasRequiredHolderName","hasHolderName","holderNameRequired","positionHolderNameOnTop","CREDIT_CARD_NAME_TOP","CREDIT_CARD_NAME_BOTTOM","KCP_CARD","KCP_CARD_NAME_TOP","KCP_CARD_NAME_BOTTOM","SSN_CARD","SSN_CARD_NAME_TOP","SSN_CARD_NAME_BOTTOM","countrySpecificSchemasFlat","filter","item","countryBasedAddressLayout","x","includes","concat","mapFieldKey","key","i18n","countrySpecificLabels","get","extractPropsForCardFields","amount","billingAddressRequired","billingAddressAllowedCountries","brandsConfiguration","showStoreDetailsCheckbox","hasCVC","installmentOptions","placeholders","showBrandIcon","showContextualElement","lastFour","expiryMonth","expiryYear","disclaimerMessage","extractPropsForSFP","autoFocus","brands","clientKey","countryCode","forceCompat","implementationType","keypadFix","legacyInputMode","loadingContext","maskSecurityCode","exposeExpiryDate","minimumExpiryDate","onAdditionalSFConfig","onAdditionalSFRemoved","onAllValid","onAutoComplete","onBinValue","onConfigSuccess","handleKeyPress","onError","onFieldValid","onLoad","resources","showWarnings","trimTrailingSeparator","handlePartialAddressMode","addressMode","AddressModeOptions","partial","PARTIAL_ADDRESS_SCHEMA","lookupBlurBasedErrors","errorCode","SF_ErrorCodes","ERROR_MSG_UNSUPPORTED_CARD_ENTERED","ERROR_MSG_CARD_TOO_OLD","ERROR_MSG_CARD_TOO_FAR_IN_FUTURE","ERROR_MSG_CARD_EXPIRES_TOO_SOON","getFullBrandName","BRAND_READABLE_NAME_MAP"],"mappings":"ggBAqBO,MAAMA,EAAkB,CAACC,EAAeC,IAMpCA,EALc,CACjBC,KAAgB,SAAVF,EAAmB,SAAWA,GAAS,SAC7CG,UAAW,OAGRF,CAAuBD,GAOrBI,EAA8BC,GACT,cAAvBA,GAAcC,MAAwBD,GAAcE,MAAQ,EAG1DC,EAAY,EACrBC,QACAC,UACAC,mBACAC,yBAAyB,KACzBC,+BAA+B,SAE/B,IAAIC,EAASC,EACb,MAAMC,EAAwBP,EAAMQ,eAAiBR,EAAMS,mBAqB3D,GAnBIF,IACAF,EAASL,EAAMU,wBAA0BC,EAAuBC,GAGhEX,IACAI,EAASQ,EACLN,IACAF,EAASL,EAAMU,wBAA0BI,EAAoBC,IAIjEb,IACAG,EAASW,EACLT,IACAF,EAASL,EAAMU,wBAA0BO,EAAoBC,IAKjEf,EAAwB,CAExB,MAAMgB,EAAuChB,EAA8B,KAAC,GAAGiB,QAAOC,GAAwB,iBAATA,IAErG,IAAIC,EAA4BH,EAE5Bf,IAEAkB,EAA4BH,EAA2BC,QAAOG,GAAKnB,EAA6BoB,SAASD,MAG7GlB,EAASC,EAAYmB,OAAOH,GACxBf,IACAF,EAASL,EAAMU,wBACTC,EAAqBc,OAAOH,GAC5BV,EAAwBa,OAAOH,GAG7C,CACA,OAAOjB,CAAAA,EAMEqB,EAAc,CAACC,EAAaC,EAAgBC,KAErD,OAAQF,GACJ,IAAK,uBACD,OAAOC,EAAKE,IAAI,UAAUH,KAE9B,IAAK,SACL,IAAK,oBACL,IAAK,aACL,IAAK,kBACL,IAAK,OACL,IAAK,UACD,OAAOE,IAAwBF,GAAOC,EAAKE,IAAID,IAAwBF,IAAQC,EAAKE,IAAIH,GAE5F,QACI,OAAO,KACf,EAGSI,EAA6B/B,IAC/B,CAEHgC,OAAQhC,EAAMgC,OACdC,uBAAwBjC,EAAMiC,uBAC9B7B,6BAA8BJ,EAAMI,6BACpC8B,+BAAgClC,EAAMkC,+BACtCC,oBAAqBnC,EAAMmC,oBAC3BC,yBAA0BpC,EAAMoC,yBAChCC,OAAQrC,EAAMqC,OACd7B,cAAeR,EAAMQ,cACrBC,mBAAoBT,EAAMS,mBAC1B6B,mBAAoBtC,EAAMsC,mBAC1BC,aAAcvC,EAAMuC,aACpB7B,wBAAyBV,EAAMU,wBAE/B8B,cAAexC,EAAMwC,cACrBC,sBAAuBzC,EAAMyC,sBAE7BC,SAAU1C,EAAM0C,SAChBC,YAAa3C,EAAM2C,YACnBC,WAAY5C,EAAM4C,WAClBC,kBAAmB7C,EAAM6C,oBAIpBC,EAAsB9C,IACxB,CACH+C,UAAW/C,EAAM+C,UACjBC,OAAQhD,EAAMgD,OACdb,oBAAqBnC,EAAMmC,oBAC3Bc,UAAWjD,EAAMiD,UACjBC,YAAalD,EAAMkD,YACnBC,YAAanD,EAAMmD,YACnBvB,KAAM5B,EAAM4B,KACZwB,mBAAoBpD,EAAMoD,mBAC1BC,UAAWrD,EAAMqD,UACjBC,gBAAiBtD,EAAMsD,gBACvBC,eAAgBvD,EAAMuD,eACtBC,iBAAkBxD,EAAMwD,iBACxBC,iBAAkBzD,EAAMyD,iBACxBC,kBAAmB1D,EAAM0D,kBACzBC,qBAAsB3D,EAAM2D,qBAC5BC,sBAAuB5D,EAAM4D,sBAC7BC,WAAY7D,EAAM6D,WAClBC,eAAgB9D,EAAM8D,eACtBC,WAAY/D,EAAM+D,WAClBC,gBAAiBhE,EAAMgE,gBACvBC,eAAgBjE,EAAMiE,eACtBC,QAASlE,EAAMkE,QACfC,aAAcnE,EAAMmE,aACpBC,OAAQpE,EAAMoE,OACd7B,aAAcvC,EAAMuC,aACpB8B,UAAWrE,EAAMqE,UACjB5B,sBAAuBzC,EAAMyC,sBAC7B6B,aAActE,EAAMsE,aACpBC,sBAAuBvE,EAAMuE,wBAIxBC,EAA4BC,GAC9BA,GAAeC,EAAmBC,QAAUC,EAAyB,KAIzE,SAASC,EAAsBC,GAClC,OAAQ,CACJC,EAAcC,mCACdD,EAAcE,uBACdF,EAAcG,iCACdH,EAAcI,iCAChB3D,SAASsD,EACf,CAEO,SAASM,EAAiB7F,GAC7B,OAAO8F,EAAwB9F,IAAUA,CAC7C"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CashAppComponent.js","sources":["../../../../../src/components/CashAppPay/components/CashAppComponent.tsx"],"sourcesContent":["import { h, RefObject } from 'preact';\nimport { useCallback, useEffect, useRef, useState } from 'preact/hooks';\nimport AdyenCheckoutError from '../../../core/Errors/AdyenCheckoutError';\nimport Spinner from '../../internal/Spinner';\nimport { CashAppPayEvents, ICashAppService } from '../services/types';\nimport { CashAppPayEventData } from '../types';\nimport StoreDetails from '../../internal/StoreDetails';\nimport './CashAppComponent.scss';\nimport { UIElementStatus } from '../../internal/UIElement/types';\n\ninterface CashAppComponentProps {\n enableStoreDetails?: boolean;\n cashAppService: ICashAppService;\n onClick(): void;\n onChangeStoreDetails(data: any): void;\n onAuthorize(payEventData: CashAppPayEventData): void;\n onError(error: AdyenCheckoutError): void;\n ref(ref: RefObject<typeof CashAppComponent>): void;\n}\n\nexport function CashAppComponent({\n enableStoreDetails,\n cashAppService,\n onClick,\n onChangeStoreDetails,\n onAuthorize,\n onError\n}: CashAppComponentProps): h.JSX.Element {\n const cashAppRef = useRef<HTMLDivElement>(null);\n const [status, setStatus] = useState<UIElementStatus>('loading');\n const subscriptions = useRef<Function[]>([]);\n const [storePaymentMethod, setStorePaymentMethod] = useState<boolean>(false);\n\n this.setStatus = setStatus;\n\n const initializeCashAppSdk = useCallback(async () => {\n try {\n await cashAppService.initialize();\n\n subscriptions.current = [\n cashAppService.subscribeToEvent(CashAppPayEvents.CustomerDismissed, () => {\n onError(new AdyenCheckoutError('CANCEL', 'Customer dismissed the modal'));\n }),\n cashAppService.subscribeToEvent(CashAppPayEvents.CustomerRequestDeclined, async () => {\n onError(new AdyenCheckoutError('ERROR', 'Payment declined by CashAppPay'));\n await cashAppService.restart();\n await cashAppService.renderButton(cashAppRef.current);\n }),\n\n cashAppService.subscribeToEvent(CashAppPayEvents.CustomerRequestApproved, ({ customerProfile, grants }) => {\n const cashAppPaymentData: CashAppPayEventData = {\n ...(customerProfile?.id && { customerId: customerProfile.id }),\n ...(customerProfile?.cashtag && { cashTag: customerProfile.cashtag }),\n ...(grants?.payment?.grantId && { grantId: grants.payment.grantId }),\n ...(grants?.onFile?.grantId && { onFileGrantId: grants.onFile.grantId })\n };\n\n onAuthorize(cashAppPaymentData);\n }),\n cashAppService.subscribeToEvent(CashAppPayEvents.CustomerRequestFailed, () => {\n onError(new AdyenCheckoutError('ERROR', 'Customer request failed'));\n })\n ];\n\n await cashAppService.renderButton(cashAppRef.current);\n\n setStatus('ready');\n } catch (error) {\n if (error instanceof AdyenCheckoutError) onError(error);\n else onError(new AdyenCheckoutError('ERROR', 'Error when initializing CashAppPay', { cause: error }));\n }\n }, [cashAppService, onError, onAuthorize]);\n\n useEffect(() => {\n if (enableStoreDetails) {\n cashAppService.setStorePaymentMethod(storePaymentMethod);\n onChangeStoreDetails(storePaymentMethod);\n }\n }, [enableStoreDetails, storePaymentMethod]);\n\n useEffect(() => {\n initializeCashAppSdk();\n return () => {\n cashAppService.restart();\n subscriptions.current.forEach(unsubscribeFn => unsubscribeFn());\n };\n }, [cashAppService, initializeCashAppSdk]);\n\n return (\n <div className=\"adyen-checkout__cashapp\" aria-live=\"polite\" aria-busy={status === 'loading'}>\n {status === 'loading' && <Spinner />}\n {status !== 'loading' && enableStoreDetails && <StoreDetails storeDetails={storePaymentMethod} onChange={setStorePaymentMethod} />}\n\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <div onClick={onClick} className={'adyen-checkout__cashapp-button'} ref={cashAppRef}></div>\n </div>\n );\n}\n"],"names":["CashAppComponent","enableStoreDetails","cashAppService","onClick","onChangeStoreDetails","onAuthorize","onError","cashAppRef","useRef","status","setStatus","useState","subscriptions","storePaymentMethod","setStorePaymentMethod","this","initializeCashAppSdk","useCallback","async","initialize","current","subscribeToEvent","CashAppPayEvents","CustomerDismissed","AdyenCheckoutError","CustomerRequestDeclined","restart","renderButton","CustomerRequestApproved","customerProfile","grants","cashAppPaymentData","id","customerId","cashtag","cashTag","payment","grantId","onFile","onFileGrantId","CustomerRequestFailed","error","cause","useEffect","forEach","unsubscribeFn","h","div","className","aria-live","aria-busy","Spinner","StoreDetails","storeDetails","onChange","ref"],"mappings":"0ZAoBO,SAASA,GAAiBC,mBAC7BA,EAAkBC,eAClBA,EAAcC,QACdA,EAAOC,qBACPA,EAAoBC,YACpBA,EAAWC,QACXA,IAEA,MAAMC,EAAaC,EAAuB,OACnCC,EAAQC,GAAaC,EAA0B,WAChDC,EAAgBJ,EAAmB,KAClCK,EAAoBC,GAAyBH,GAAkB,GAEtEI,KAAKL,UAAYA,EAEjB,MAAMM,EAAuBC,GAAYC,UACrC,UACUhB,EAAeiB,aAErBP,EAAcQ,QAAU,CACpBlB,EAAemB,iBAAiBC,EAAiBC,mBAAmB,KAChEjB,EAAQ,IAAIkB,EAAmB,SAAU,gCAAA,IAE7CtB,EAAemB,iBAAiBC,EAAiBG,yBAAyBP,UACtEZ,EAAQ,IAAIkB,EAAmB,QAAS,yCAClCtB,EAAewB,gBACfxB,EAAeyB,aAAapB,EAAWa,QAAO,IAGxDlB,EAAemB,iBAAiBC,EAAiBM,yBAAyB,EAAGC,kBAAiBC,aAC1F,MAAMC,EAA0C,IACxCF,GAAiBG,IAAM,CAAEC,WAAYJ,EAAgBG,OACrDH,GAAiBK,SAAW,CAAEC,QAASN,EAAgBK,YACvDJ,GAAQM,SAASC,SAAW,CAAEA,QAASP,EAAOM,QAAQC,YACtDP,GAAQQ,QAAQD,SAAW,CAAEE,cAAeT,EAAOQ,OAAOD,UAGlEhC,EAAY0B,EAAAA,IAEhB7B,EAAemB,iBAAiBC,EAAiBkB,uBAAuB,KACpElC,EAAQ,IAAIkB,EAAmB,QAAS,2BAAA,WAI1CtB,EAAeyB,aAAapB,EAAWa,SAE7CV,EAAU,QACd,CAAE,MAAO+B,GACoCnC,EAArCmC,aAAiBjB,EAA4BiB,EACpC,IAAIjB,EAAmB,QAAS,qCAAsC,CAAEkB,MAAOD,IAChG,IACD,CAACvC,EAAgBI,EAASD,IAiB7B,OAfAsC,GAAU,KACF1C,IACAC,EAAeY,sBAAsBD,GACrCT,EAAqBS,GACzB,GACD,CAACZ,EAAoBY,IAExB8B,GAAU,
|
|
1
|
+
{"version":3,"file":"CashAppComponent.js","sources":["../../../../../src/components/CashAppPay/components/CashAppComponent.tsx"],"sourcesContent":["import { h, RefObject } from 'preact';\nimport { useCallback, useEffect, useRef, useState } from 'preact/hooks';\nimport AdyenCheckoutError from '../../../core/Errors/AdyenCheckoutError';\nimport Spinner from '../../internal/Spinner';\nimport { CashAppPayEvents, ICashAppService } from '../services/types';\nimport { CashAppPayEventData } from '../types';\nimport StoreDetails from '../../internal/StoreDetails';\nimport './CashAppComponent.scss';\nimport { UIElementStatus } from '../../internal/UIElement/types';\n\ninterface CashAppComponentProps {\n enableStoreDetails?: boolean;\n cashAppService: ICashAppService;\n onClick(): void;\n onChangeStoreDetails(data: any): void;\n onAuthorize(payEventData: CashAppPayEventData): void;\n onError(error: AdyenCheckoutError): void;\n ref(ref: RefObject<typeof CashAppComponent>): void;\n}\n\nexport function CashAppComponent({\n enableStoreDetails,\n cashAppService,\n onClick,\n onChangeStoreDetails,\n onAuthorize,\n onError\n}: CashAppComponentProps): h.JSX.Element {\n const cashAppRef = useRef<HTMLDivElement>(null);\n const [status, setStatus] = useState<UIElementStatus>('loading');\n const subscriptions = useRef<Function[]>([]);\n const [storePaymentMethod, setStorePaymentMethod] = useState<boolean>(false);\n\n this.setStatus = setStatus;\n\n const initializeCashAppSdk = useCallback(async () => {\n try {\n await cashAppService.initialize();\n\n subscriptions.current = [\n cashAppService.subscribeToEvent(CashAppPayEvents.CustomerDismissed, () => {\n onError(new AdyenCheckoutError('CANCEL', 'Customer dismissed the modal'));\n }),\n cashAppService.subscribeToEvent(CashAppPayEvents.CustomerRequestDeclined, async () => {\n onError(new AdyenCheckoutError('ERROR', 'Payment declined by CashAppPay'));\n await cashAppService.restart();\n await cashAppService.renderButton(cashAppRef.current);\n }),\n\n cashAppService.subscribeToEvent(CashAppPayEvents.CustomerRequestApproved, ({ customerProfile, grants }) => {\n const cashAppPaymentData: CashAppPayEventData = {\n ...(customerProfile?.id && { customerId: customerProfile.id }),\n ...(customerProfile?.cashtag && { cashTag: customerProfile.cashtag }),\n ...(grants?.payment?.grantId && { grantId: grants.payment.grantId }),\n ...(grants?.onFile?.grantId && { onFileGrantId: grants.onFile.grantId })\n };\n\n onAuthorize(cashAppPaymentData);\n }),\n cashAppService.subscribeToEvent(CashAppPayEvents.CustomerRequestFailed, () => {\n onError(new AdyenCheckoutError('ERROR', 'Customer request failed'));\n })\n ];\n\n await cashAppService.renderButton(cashAppRef.current);\n\n setStatus('ready');\n } catch (error) {\n if (error instanceof AdyenCheckoutError) onError(error);\n else onError(new AdyenCheckoutError('ERROR', 'Error when initializing CashAppPay', { cause: error }));\n }\n }, [cashAppService, onError, onAuthorize]);\n\n useEffect(() => {\n if (enableStoreDetails) {\n cashAppService.setStorePaymentMethod(storePaymentMethod);\n onChangeStoreDetails(storePaymentMethod);\n }\n }, [enableStoreDetails, storePaymentMethod]);\n\n useEffect(() => {\n void initializeCashAppSdk();\n return () => {\n void cashAppService.restart();\n subscriptions.current.forEach(unsubscribeFn => unsubscribeFn());\n };\n }, [cashAppService, initializeCashAppSdk]);\n\n return (\n <div className=\"adyen-checkout__cashapp\" aria-live=\"polite\" aria-busy={status === 'loading'}>\n {status === 'loading' && <Spinner />}\n {status !== 'loading' && enableStoreDetails && <StoreDetails storeDetails={storePaymentMethod} onChange={setStorePaymentMethod} />}\n\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions,jsx-a11y/click-events-have-key-events */}\n <div onClick={onClick} className={'adyen-checkout__cashapp-button'} ref={cashAppRef}></div>\n </div>\n );\n}\n"],"names":["CashAppComponent","enableStoreDetails","cashAppService","onClick","onChangeStoreDetails","onAuthorize","onError","cashAppRef","useRef","status","setStatus","useState","subscriptions","storePaymentMethod","setStorePaymentMethod","this","initializeCashAppSdk","useCallback","async","initialize","current","subscribeToEvent","CashAppPayEvents","CustomerDismissed","AdyenCheckoutError","CustomerRequestDeclined","restart","renderButton","CustomerRequestApproved","customerProfile","grants","cashAppPaymentData","id","customerId","cashtag","cashTag","payment","grantId","onFile","onFileGrantId","CustomerRequestFailed","error","cause","useEffect","forEach","unsubscribeFn","h","div","className","aria-live","aria-busy","Spinner","StoreDetails","storeDetails","onChange","ref"],"mappings":"0ZAoBO,SAASA,GAAiBC,mBAC7BA,EAAkBC,eAClBA,EAAcC,QACdA,EAAOC,qBACPA,EAAoBC,YACpBA,EAAWC,QACXA,IAEA,MAAMC,EAAaC,EAAuB,OACnCC,EAAQC,GAAaC,EAA0B,WAChDC,EAAgBJ,EAAmB,KAClCK,EAAoBC,GAAyBH,GAAkB,GAEtEI,KAAKL,UAAYA,EAEjB,MAAMM,EAAuBC,GAAYC,UACrC,UACUhB,EAAeiB,aAErBP,EAAcQ,QAAU,CACpBlB,EAAemB,iBAAiBC,EAAiBC,mBAAmB,KAChEjB,EAAQ,IAAIkB,EAAmB,SAAU,gCAAA,IAE7CtB,EAAemB,iBAAiBC,EAAiBG,yBAAyBP,UACtEZ,EAAQ,IAAIkB,EAAmB,QAAS,yCAClCtB,EAAewB,gBACfxB,EAAeyB,aAAapB,EAAWa,QAAO,IAGxDlB,EAAemB,iBAAiBC,EAAiBM,yBAAyB,EAAGC,kBAAiBC,aAC1F,MAAMC,EAA0C,IACxCF,GAAiBG,IAAM,CAAEC,WAAYJ,EAAgBG,OACrDH,GAAiBK,SAAW,CAAEC,QAASN,EAAgBK,YACvDJ,GAAQM,SAASC,SAAW,CAAEA,QAASP,EAAOM,QAAQC,YACtDP,GAAQQ,QAAQD,SAAW,CAAEE,cAAeT,EAAOQ,OAAOD,UAGlEhC,EAAY0B,EAAAA,IAEhB7B,EAAemB,iBAAiBC,EAAiBkB,uBAAuB,KACpElC,EAAQ,IAAIkB,EAAmB,QAAS,2BAAA,WAI1CtB,EAAeyB,aAAapB,EAAWa,SAE7CV,EAAU,QACd,CAAE,MAAO+B,GACoCnC,EAArCmC,aAAiBjB,EAA4BiB,EACpC,IAAIjB,EAAmB,QAAS,qCAAsC,CAAEkB,MAAOD,IAChG,IACD,CAACvC,EAAgBI,EAASD,IAiB7B,OAfAsC,GAAU,KACF1C,IACAC,EAAeY,sBAAsBD,GACrCT,EAAqBS,GACzB,GACD,CAACZ,EAAoBY,IAExB8B,GAAU,KACD3B,IACE,KACEd,EAAewB,UACpBd,EAAcQ,QAAQwB,SAAQC,GAAiBA,KAAAA,IAEpD,CAAC3C,EAAgBc,IAGhB8B,EAACC,MAAAA,CAAIC,UAAU,0BAA0BC,YAAU,SAASC,YAAsB,YAAXzC,GACvD,YAAXA,GAAwBqC,EAACK,EAAAA,MACd,YAAX1C,GAAwBR,GAAsB6C,EAACM,EAAAA,CAAaC,aAAcxC,EAAoByC,SAAUxC,IAGzGgC,EAACC,MAAAA,CAAI5C,QAASA,EAAS6C,UAAW,iCAAkCO,IAAKhD,IAGrF"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as
|
|
1
|
+
import{createElement as e}from"../../external/preact/dist/preact.js";import{UIElement as t}from"../internal/UIElement/UIElement.js";import s from"./CustomCardInput/CustomCardInput.js";import{CoreProvider as o}from"../../core/Context/CoreProvider.js";import n from"../../utils/browserInfo.js";import r from"../internal/SecuredFields/binLookup/triggerBinLookUp.js";import{getCardImageUrl as i,fieldTypeToSnakeCase as a}from"../internal/SecuredFields/utils.js";import{TxVariants as p}from"../tx-variants.js";import{ANALYTICS_FOCUS_STR as d,ANALYTICS_UNFOCUS_STR as u}from"../../core/Analytics/constants.js";class c extends t{static type=p.customCard;static analyticsType="custom-scheme";static defaultProps={onBinLookup:()=>{},brandsConfiguration:{}};formatProps(e){return{...e,type:p.customCard,brand:p.card}}formatData(){const e=this.state.selectedBrandValue;return{paymentMethod:{type:"scheme",...this.state.data,...e&&{brand:e}},browserInfo:this.browserInfo}}updateStyles(e){return this.componentRef?.updateStyles&&this.componentRef.updateStyles(e),this}setFocusOn(e){return this.componentRef?.setFocusOn&&this.componentRef.setFocusOn(e),this}processBinLookupResponse(e){return this.componentRef?.processBinLookupResponse&&this.componentRef.processBinLookupResponse(e),this}dualBrandingChangeHandler(e){return this.componentRef?.dualBrandingChangeHandler&&this.componentRef.dualBrandingChangeHandler(e),this}handleUnsupportedCard(e){return this.componentRef?.handleUnsupportedCard&&this.componentRef.handleUnsupportedCard(e),this}onBinLookup(e){const t={...e};t.rootNode=this._node,t.isReset||(t.supportedBrandsRaw=e.supportedBrandsRaw?.map((e=>(e.brandImageUrl=this.props.brandsConfiguration[e.brand]?.icon??i(e.brand,this.resources),e)))),this.props.onBinLookup(t)}onBinValue=r(this);get isValid(){return!!this.state.isValid}get browserInfo(){return n()}onFocus=e=>{this.submitAnalytics({type:!0===e.focus?d:u,target:a(e.fieldType)}),this.props.onFocus?.(e)};onEnterKeyPressed=(e,t)=>{this.props.onEnterKeyPressed?.(e,t)};render(){return e(o,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},e(s,{ref:e=>{this.componentRef=e},...this.props,...this.state,handleKeyPress:this.handleKeyPress,rootNode:this._node,onChange:this.setState,onBinValue:this.onBinValue,implementationType:"custom",resources:this.resources,brand:this.props.brand,onFocus:this.onFocus}))}}export{c as CustomCard,c as default};
|
|
2
2
|
//# sourceMappingURL=CustomCard.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CustomCard.js","sources":["../../../../src/components/CustomCard/CustomCard.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement';\nimport CustomCardInput from './CustomCardInput';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport collectBrowserInfo from '../../utils/browserInfo';\nimport triggerBinLookUp from '../internal/SecuredFields/binLookup/triggerBinLookUp';\nimport { CbObjOnBinLookup, CbObjOnFocus } from '../internal/SecuredFields/lib/types';\nimport { BrandObject } from '../Card/types';\nimport { getCardImageUrl } from '../internal/SecuredFields/utils';\nimport { TxVariants } from '../tx-variants';\nimport { CustomCardConfiguration } from './types';\nimport { fieldTypeToSnakeCase } from '../internal/SecuredFields/utils';\nimport { ANALYTICS_FOCUS_STR, ANALYTICS_UNFOCUS_STR } from '../../core/Analytics/constants';\n\n// TODO questions about\n// brand - does a merchant ever make a custom stored card?\n// type\n// countryCode\n\nexport class CustomCard extends UIElement<CustomCardConfiguration> {\n public static type = TxVariants.customCard;\n\n public static analyticsType = 'custom-scheme';\n\n protected static defaultProps = {\n onBinLookup: () => {},\n brandsConfiguration: {}\n };\n\n formatProps(props: CustomCardConfiguration) {\n return {\n ...props,\n type: TxVariants.customCard,\n brand: TxVariants.card\n };\n }\n\n /**\n * Formats the component data output\n */\n formatData() {\n const sfBrand = this.state.selectedBrandValue;\n return {\n paymentMethod: {\n type: 'scheme',\n ...this.state.data,\n ...(sfBrand && { brand: sfBrand })\n },\n browserInfo: this.browserInfo\n };\n }\n\n updateStyles(stylesObj) {\n if (this.componentRef?.updateStyles) this.componentRef.updateStyles(stylesObj);\n return this;\n }\n\n setFocusOn(frame) {\n if (this.componentRef?.setFocusOn) this.componentRef.setFocusOn(frame);\n return this;\n }\n\n processBinLookupResponse(binLookupResponse) {\n if (this.componentRef?.processBinLookupResponse) this.componentRef.processBinLookupResponse(binLookupResponse);\n return this;\n }\n\n dualBrandingChangeHandler(e: Event | string) {\n if (this.componentRef?.dualBrandingChangeHandler) this.componentRef.dualBrandingChangeHandler(e);\n return this;\n }\n\n handleUnsupportedCard(errObj) {\n if (this.componentRef?.handleUnsupportedCard) this.componentRef.handleUnsupportedCard(errObj);\n return this;\n }\n\n onBinLookup(obj: CbObjOnBinLookup) {\n const nuObj = { ...obj };\n nuObj.rootNode = this._node;\n\n if (!nuObj.isReset) {\n // Add brandImage urls, first checking if the merchant has configured their own one for the brand\n nuObj.supportedBrandsRaw = obj.supportedBrandsRaw?.map((item: BrandObject) => {\n item.brandImageUrl = this.props.brandsConfiguration[item.brand]?.icon ?? getCardImageUrl(item.brand, this.resources);\n return item;\n });\n }\n\n this.props.onBinLookup(nuObj);\n }\n\n public onBinValue = triggerBinLookUp(this);\n\n get isValid() {\n return !!this.state.isValid;\n }\n\n get browserInfo() {\n return collectBrowserInfo();\n }\n\n private onFocus = (obj: CbObjOnFocus) => {\n this.submitAnalytics({\n type: obj.focus === true ? ANALYTICS_FOCUS_STR : ANALYTICS_UNFOCUS_STR,\n target: fieldTypeToSnakeCase(obj.fieldType)\n });\n\n // Call merchant defined callback\n this.props.onFocus?.(obj);\n };\n\n render() {\n return (\n <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n <CustomCardInput\n ref={ref => {\n this.componentRef = ref;\n }}\n {...this.props}\n {...this.state}\n rootNode={this._node}\n onChange={this.setState}\n onBinValue={this.onBinValue}\n implementationType={'custom'}\n resources={this.resources}\n brand={this.props.brand}\n onFocus={this.onFocus}\n />\n </CoreProvider>\n );\n }\n}\n\nexport default CustomCard;\n"],"names":["CustomCard","UIElement","static","TxVariants","customCard","onBinLookup","brandsConfiguration","formatProps","props","type","brand","card","formatData","sfBrand","this","state","selectedBrandValue","paymentMethod","data","browserInfo","updateStyles","stylesObj","componentRef","setFocusOn","frame","processBinLookupResponse","binLookupResponse","dualBrandingChangeHandler","e","handleUnsupportedCard","errObj","obj","nuObj","rootNode","_node","isReset","supportedBrandsRaw","map","item","brandImageUrl","icon","getCardImageUrl","resources","onBinValue","triggerBinLookUp","isValid","collectBrowserInfo","onFocus","submitAnalytics","focus","ANALYTICS_FOCUS_STR","ANALYTICS_UNFOCUS_STR","target","fieldTypeToSnakeCase","fieldType","render","h","CoreProvider","i18n","loadingContext","CustomCardInput","ref","onChange","setState","implementationType"],"mappings":"4lBAmBO,MAAMA,UAAmBC,EAC5BC,YAAqBC,EAAWC,WAEhCF,qBAA8B,gBAE9BA,oBAAgC,CAC5BG,YAAa,OACbC,oBAAqB,CAAC,GAG1BC,WAAAA,CAAYC,GACR,MAAO,IACAA,EACHC,KAAMN,EAAWC,WACjBM,MAAOP,EAAWQ,KAE1B,CAKAC,UAAAA,GACI,MAAMC,EAAUC,KAAKC,MAAMC,mBAC3B,MAAO,CACHC,cAAe,CACXR,KAAM,YACHK,KAAKC,MAAMG,QACVL,GAAW,CAAEH,MAAOG,IAE5BM,YAAaL,KAAKK,YAE1B,CAEAC,YAAAA,CAAaC,GAET,OADIP,KAAKQ,cAAcF,cAAcN,KAAKQ,aAAaF,aAAaC,GAC7DP,IACX,CAEAS,UAAAA,CAAWC,GAEP,OADIV,KAAKQ,cAAcC,YAAYT,KAAKQ,aAAaC,WAAWC,GACzDV,IACX,CAEAW,wBAAAA,CAAyBC,GAErB,OADIZ,KAAKQ,cAAcG,0BAA0BX,KAAKQ,aAAaG,yBAAyBC,GACrFZ,IACX,CAEAa,yBAAAA,CAA0BC,GAEtB,OADId,KAAKQ,cAAcK,2BAA2Bb,KAAKQ,aAAaK,0BAA0BC,GACvFd,IACX,CAEAe,qBAAAA,CAAsBC,GAElB,OADIhB,KAAKQ,cAAcO,uBAAuBf,KAAKQ,aAAaO,sBAAsBC,GAC/EhB,IACX,CAEAT,WAAAA,CAAY0B,GACR,MAAMC,EAAQ,IAAKD,GACnBC,EAAMC,SAAWnB,KAAKoB,MAEjBF,EAAMG,UAEPH,EAAMI,mBAAqBL,EAAIK,oBAAoBC,KAAKC,IACpDA,EAAKC,cAAgBzB,KAAKN,MAAMF,oBAAoBgC,EAAK5B,QAAQ8B,MAAQC,EAAgBH,EAAK5B,MAAOI,KAAK4B,WACnGJ,MAIfxB,KAAKN,MAAMH,YAAY2B,EAC3B,CAEOW,WAAaC,EAAiB9B,MAErC,WAAI+B,GACA,QAAS/B,KAAKC,MAAM8B,OACxB,CAEA,eAAI1B,GACA,OAAO2B,GACX,CAEQC,QAAWhB,IACfjB,KAAKkC,gBAAgB,CACjBvC,MAAoB,IAAdsB,EAAIkB,MAAiBC,EAAsBC,EACjDC,OAAQC,EAAqBtB,EAAIuB,aAIrCxC,KAAKN,MAAMuC,UAAUhB,EAAAA,
|
|
1
|
+
{"version":3,"file":"CustomCard.js","sources":["../../../../src/components/CustomCard/CustomCard.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement';\nimport CustomCardInput from './CustomCardInput';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport collectBrowserInfo from '../../utils/browserInfo';\nimport triggerBinLookUp from '../internal/SecuredFields/binLookup/triggerBinLookUp';\nimport { CbObjOnBinLookup, CbObjOnFocus } from '../internal/SecuredFields/lib/types';\nimport { BrandObject } from '../Card/types';\nimport { getCardImageUrl } from '../internal/SecuredFields/utils';\nimport { TxVariants } from '../tx-variants';\nimport { CustomCardConfiguration } from './types';\nimport { fieldTypeToSnakeCase } from '../internal/SecuredFields/utils';\nimport { ANALYTICS_FOCUS_STR, ANALYTICS_UNFOCUS_STR } from '../../core/Analytics/constants';\n\n// TODO questions about\n// brand - does a merchant ever make a custom stored card?\n// type\n// countryCode\n\nexport class CustomCard extends UIElement<CustomCardConfiguration> {\n public static type = TxVariants.customCard;\n\n public static analyticsType = 'custom-scheme';\n\n protected static defaultProps = {\n onBinLookup: () => {},\n brandsConfiguration: {}\n };\n\n formatProps(props: CustomCardConfiguration) {\n return {\n ...props,\n type: TxVariants.customCard,\n brand: TxVariants.card\n };\n }\n\n /**\n * Formats the component data output\n */\n formatData() {\n const sfBrand = this.state.selectedBrandValue;\n return {\n paymentMethod: {\n type: 'scheme',\n ...this.state.data,\n ...(sfBrand && { brand: sfBrand })\n },\n browserInfo: this.browserInfo\n };\n }\n\n updateStyles(stylesObj) {\n if (this.componentRef?.updateStyles) this.componentRef.updateStyles(stylesObj);\n return this;\n }\n\n setFocusOn(frame) {\n if (this.componentRef?.setFocusOn) this.componentRef.setFocusOn(frame);\n return this;\n }\n\n processBinLookupResponse(binLookupResponse) {\n if (this.componentRef?.processBinLookupResponse) this.componentRef.processBinLookupResponse(binLookupResponse);\n return this;\n }\n\n dualBrandingChangeHandler(e: Event | string) {\n if (this.componentRef?.dualBrandingChangeHandler) this.componentRef.dualBrandingChangeHandler(e);\n return this;\n }\n\n handleUnsupportedCard(errObj) {\n if (this.componentRef?.handleUnsupportedCard) this.componentRef.handleUnsupportedCard(errObj);\n return this;\n }\n\n onBinLookup(obj: CbObjOnBinLookup) {\n const nuObj = { ...obj };\n nuObj.rootNode = this._node;\n\n if (!nuObj.isReset) {\n // Add brandImage urls, first checking if the merchant has configured their own one for the brand\n nuObj.supportedBrandsRaw = obj.supportedBrandsRaw?.map((item: BrandObject) => {\n item.brandImageUrl = this.props.brandsConfiguration[item.brand]?.icon ?? getCardImageUrl(item.brand, this.resources);\n return item;\n });\n }\n\n this.props.onBinLookup(nuObj);\n }\n\n public onBinValue = triggerBinLookUp(this);\n\n get isValid() {\n return !!this.state.isValid;\n }\n\n get browserInfo() {\n return collectBrowserInfo();\n }\n\n private onFocus = (obj: CbObjOnFocus) => {\n this.submitAnalytics({\n type: obj.focus === true ? ANALYTICS_FOCUS_STR : ANALYTICS_UNFOCUS_STR,\n target: fieldTypeToSnakeCase(obj.fieldType)\n });\n\n // Call merchant defined callback\n this.props.onFocus?.(obj);\n };\n\n protected onEnterKeyPressed = (activeElement: Element, component: UIElement) => {\n this.props.onEnterKeyPressed?.(activeElement, component);\n };\n\n render() {\n return (\n <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n <CustomCardInput\n ref={ref => {\n this.componentRef = ref;\n }}\n {...this.props}\n {...this.state}\n handleKeyPress={this.handleKeyPress}\n rootNode={this._node}\n onChange={this.setState}\n onBinValue={this.onBinValue}\n implementationType={'custom'}\n resources={this.resources}\n brand={this.props.brand}\n onFocus={this.onFocus}\n />\n </CoreProvider>\n );\n }\n}\n\nexport default CustomCard;\n"],"names":["CustomCard","UIElement","static","TxVariants","customCard","onBinLookup","brandsConfiguration","formatProps","props","type","brand","card","formatData","sfBrand","this","state","selectedBrandValue","paymentMethod","data","browserInfo","updateStyles","stylesObj","componentRef","setFocusOn","frame","processBinLookupResponse","binLookupResponse","dualBrandingChangeHandler","e","handleUnsupportedCard","errObj","obj","nuObj","rootNode","_node","isReset","supportedBrandsRaw","map","item","brandImageUrl","icon","getCardImageUrl","resources","onBinValue","triggerBinLookUp","isValid","collectBrowserInfo","onFocus","submitAnalytics","focus","ANALYTICS_FOCUS_STR","ANALYTICS_UNFOCUS_STR","target","fieldTypeToSnakeCase","fieldType","onEnterKeyPressed","activeElement","component","render","h","CoreProvider","i18n","loadingContext","CustomCardInput","ref","handleKeyPress","onChange","setState","implementationType"],"mappings":"4lBAmBO,MAAMA,UAAmBC,EAC5BC,YAAqBC,EAAWC,WAEhCF,qBAA8B,gBAE9BA,oBAAgC,CAC5BG,YAAa,OACbC,oBAAqB,CAAC,GAG1BC,WAAAA,CAAYC,GACR,MAAO,IACAA,EACHC,KAAMN,EAAWC,WACjBM,MAAOP,EAAWQ,KAE1B,CAKAC,UAAAA,GACI,MAAMC,EAAUC,KAAKC,MAAMC,mBAC3B,MAAO,CACHC,cAAe,CACXR,KAAM,YACHK,KAAKC,MAAMG,QACVL,GAAW,CAAEH,MAAOG,IAE5BM,YAAaL,KAAKK,YAE1B,CAEAC,YAAAA,CAAaC,GAET,OADIP,KAAKQ,cAAcF,cAAcN,KAAKQ,aAAaF,aAAaC,GAC7DP,IACX,CAEAS,UAAAA,CAAWC,GAEP,OADIV,KAAKQ,cAAcC,YAAYT,KAAKQ,aAAaC,WAAWC,GACzDV,IACX,CAEAW,wBAAAA,CAAyBC,GAErB,OADIZ,KAAKQ,cAAcG,0BAA0BX,KAAKQ,aAAaG,yBAAyBC,GACrFZ,IACX,CAEAa,yBAAAA,CAA0BC,GAEtB,OADId,KAAKQ,cAAcK,2BAA2Bb,KAAKQ,aAAaK,0BAA0BC,GACvFd,IACX,CAEAe,qBAAAA,CAAsBC,GAElB,OADIhB,KAAKQ,cAAcO,uBAAuBf,KAAKQ,aAAaO,sBAAsBC,GAC/EhB,IACX,CAEAT,WAAAA,CAAY0B,GACR,MAAMC,EAAQ,IAAKD,GACnBC,EAAMC,SAAWnB,KAAKoB,MAEjBF,EAAMG,UAEPH,EAAMI,mBAAqBL,EAAIK,oBAAoBC,KAAKC,IACpDA,EAAKC,cAAgBzB,KAAKN,MAAMF,oBAAoBgC,EAAK5B,QAAQ8B,MAAQC,EAAgBH,EAAK5B,MAAOI,KAAK4B,WACnGJ,MAIfxB,KAAKN,MAAMH,YAAY2B,EAC3B,CAEOW,WAAaC,EAAiB9B,MAErC,WAAI+B,GACA,QAAS/B,KAAKC,MAAM8B,OACxB,CAEA,eAAI1B,GACA,OAAO2B,GACX,CAEQC,QAAWhB,IACfjB,KAAKkC,gBAAgB,CACjBvC,MAAoB,IAAdsB,EAAIkB,MAAiBC,EAAsBC,EACjDC,OAAQC,EAAqBtB,EAAIuB,aAIrCxC,KAAKN,MAAMuC,UAAUhB,EAAAA,EAGfwB,kBAAoB,CAACC,EAAwBC,KACnD3C,KAAKN,MAAM+C,oBAAoBC,EAAeC,EAAAA,EAGlDC,MAAAA,GACI,OACIC,EAACC,EAAAA,CAAaC,KAAM/C,KAAKN,MAAMqD,KAAMC,eAAgBhD,KAAKN,MAAMsD,eAAgBpB,UAAW5B,KAAK4B,WAC5FiB,EAACI,EAAAA,CACGC,IAAKA,IACDlD,KAAKQ,aAAe0C,CAAAA,KAEpBlD,KAAKN,SACLM,KAAKC,MACTkD,eAAgBnD,KAAKmD,eACrBhC,SAAUnB,KAAKoB,MACfgC,SAAUpD,KAAKqD,SACfxB,WAAY7B,KAAK6B,WACjByB,mBAAoB,SACpB1B,UAAW5B,KAAK4B,UAChBhC,MAAOI,KAAKN,MAAME,MAClBqC,QAASjC,KAAKiC,UAI9B"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as e}from"../../../external/preact/dist/preact.js";import{useRef as o,useState as n,useMemo as r,useEffect as t}from"../../../external/preact/hooks/dist/hooks.js";import a from"../../internal/SecuredFields/SFP/SecuredFieldsProvider.js";import s from"../../internal/SecuredFields/binLookup/extensions.js";function i(i){const l=o(null),[u,c]=n({}),[p,m]=n({}),[h,
|
|
1
|
+
import{createElement as e}from"../../../external/preact/dist/preact.js";import{useRef as o,useState as n,useMemo as r,useEffect as t}from"../../../external/preact/hooks/dist/hooks.js";import a from"../../internal/SecuredFields/SFP/SecuredFieldsProvider.js";import s from"../../internal/SecuredFields/binLookup/extensions.js";function i(i){const l=o(null),[u,c]=n({}),[p,m]=n({}),[h,y]=n({}),[g,C]=n(!1),[S,f]=n(null),[F,V]=n([]),[B,E]=n(""),k=r((()=>s(i,{sfp:l},{dualBrandSelectElements:F,setDualBrandSelectElements:V,setSelectedBrandValue:E,issuingCountryCode:S,setIssuingCountryCode:f})),[F,S]);return this.processBinLookupResponse=(e,o)=>{k.processBinLookup(e,o)},this.dualBrandingChangeHandler=k.handleDualBrandSelection,t((()=>(this.setFocusOn=l.current.setFocusOn,this.updateStyles=l.current.updateStyles,this.showValidation=l.current.showValidation,this.handleUnsupportedCard=l.current.handleUnsupportedCard,()=>{l.current.destroy()})),[]),t((()=>{const e=l.current.mapErrorsToValidationRuleResult(),o={...u,...e};if(i.onChange({data:h,valid:p,errors:o,isValid:g,selectedBrandValue:B}),Object.keys(o).length){const e=Object.entries(o).map((([e,o])=>({fieldType:e,...o||{error:"",rootNode:this.props.rootNode}})));this.props.onValidationError?.(e)}}),[h,p,u,B]),e(a,{ref:l,...d(i),type:i.brand,onChange:e=>{y({...h,...e.data}),c({...u,...e.errors}),m({...p,...e.valid}),C(e.isSfpValid)},render:()=>null})}i.defaultProps={onChange:()=>{},onError:()=>{},onValidationError:()=>{}};const d=e=>({autoFocus:e.autoFocus,brands:e.brands,brandsConfiguration:e.brandsConfiguration,clientKey:e.clientKey,i18n:e.i18n,implementationType:e.implementationType,keypadFix:e.keypadFix,legacyInputMode:e.legacyInputMode,loadingContext:e.loadingContext,minimumExpiryDate:e.minimumExpiryDate,onAdditionalSFConfig:e.onAdditionalSFConfig,onAdditionalSFRemoved:e.onAdditionalSFRemoved,onAllValid:e.onAllValid,onAutoComplete:e.onAutoComplete,onBinValue:e.onBinValue,onBrand:e.onBrand,onConfigSuccess:e.onConfigSuccess,handleKeyPress:e.handleKeyPress,onError:e.onError,onFieldValid:e.onFieldValid,onFocus:e.onFocus,onLoad:e.onLoad,rootNode:e.rootNode,showWarnings:e.showWarnings,styles:e.styles,trimTrailingSeparator:e.trimTrailingSeparator,resources:e.resources,maskSecurityCode:e.maskSecurityCode,placeholders:e.placeholders});export{i as default};
|
|
2
2
|
//# sourceMappingURL=CustomCardInput.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CustomCardInput.js","sources":["../../../../../src/components/CustomCard/CustomCardInput/CustomCardInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useState, useEffect, useRef, useMemo } from 'preact/hooks';\nimport Language from '../../../language/Language';\nimport SecuredFieldsProvider from '../../internal/SecuredFields/SFP/SecuredFieldsProvider';\nimport { SFPState } from '../../internal/SecuredFields/SFP/types';\nimport { BinLookupResponse, CardBrandsConfiguration } from '../../Card/types';\nimport SFExtensions from '../../internal/SecuredFields/binLookup/extensions';\nimport { StylesObject } from '../../internal/SecuredFields/lib/types';\nimport { Resources } from '../../../core/Context/Resources';\nimport { Placeholders, SFError } from '../../Card/components/CardInput/types';\nimport { ValidationError } from '../types';\n\ninterface SecuredFieldsProps {\n autoFocus?: boolean;\n brand?: string;\n brands?: string[];\n brandsConfiguration?: CardBrandsConfiguration;\n clientKey?: string;\n countryCode?: string;\n i18n: Language;\n implementationType?: string;\n keypadFix?: boolean;\n loadingContext?: string;\n legacyInputMode?: boolean;\n minimumExpiryDate?: string;\n onAdditionalSFConfig?: () => {};\n onAdditionalSFRemoved?: () => {};\n onAllValid?: () => {};\n onAutoComplete?: () => {};\n onBinValue?: () => {};\n onBrand?: () => {};\n onConfigSuccess?: () => {};\n onChange: (data) => void;\n onError?: () => {};\n onFieldValid?: () => {};\n onFocus?: (e) => {};\n onLoad?: () => {};\n placeholders?: Placeholders;\n rootNode: HTMLElement;\n resources: Resources;\n showWarnings?: boolean;\n styles?: StylesObject;\n trimTrailingSeparator?: boolean;\n type: string;\n maskSecurityCode?: boolean;\n}\n\nconst defaultProps = {\n onChange: () => {},\n onError: () => {},\n onValidationError: () => {}\n};\n\nfunction CustomCardInput(props: SecuredFieldsProps) {\n const sfp = useRef(null);\n\n const [errors, setErrors] = useState({});\n const [valid, setValid] = useState({});\n const [data, setData] = useState({});\n\n const [isSfpValid, setIsSfpValid] = useState(false);\n\n const [issuingCountryCode, setIssuingCountryCode] = useState(null);\n\n const [dualBrandSelectElements, setDualBrandSelectElements] = useState([]);\n const [selectedBrandValue, setSelectedBrandValue] = useState('');\n\n const handleSecuredFieldsChange = (sfState: SFPState): void => {\n setData({ ...data, ...sfState.data });\n setErrors({ ...errors, ...sfState.errors });\n setValid({ ...valid, ...sfState.valid });\n\n setIsSfpValid(sfState.isSfpValid);\n };\n\n // Farm the handlers for binLookup related functionality out to another 'extensions' file\n const extensions = useMemo(\n () =>\n SFExtensions(\n props,\n { sfp },\n { dualBrandSelectElements, setDualBrandSelectElements, setSelectedBrandValue, issuingCountryCode, setIssuingCountryCode }\n ),\n [dualBrandSelectElements, issuingCountryCode]\n );\n\n /**\n * EXPECTED METHODS ON SecuredFields.this\n */\n this.processBinLookupResponse = (binLookupResponse: BinLookupResponse, isReset: boolean) => {\n extensions.processBinLookup(binLookupResponse, isReset);\n };\n\n this.dualBrandingChangeHandler = extensions.handleDualBrandSelection;\n\n /**\n * EFFECT HOOKS\n */\n useEffect(() => {\n // componentDidMount\n this.setFocusOn = sfp.current.setFocusOn;\n this.updateStyles = sfp.current.updateStyles;\n this.showValidation = sfp.current.showValidation;\n this.handleUnsupportedCard = sfp.current.handleUnsupportedCard;\n\n // componentWillUnmount\n return () => {\n sfp.current.destroy();\n };\n }, []);\n\n /**\n * Main 'componentDidUpdate' handler\n */\n useEffect(() => {\n const sfStateErrorsObj = sfp.current.mapErrorsToValidationRuleResult();\n\n const mappedErrors = { ...errors, ...sfStateErrorsObj }; // maps sfErrors\n\n props.onChange({\n data,\n valid,\n errors: mappedErrors,\n isValid: isSfpValid,\n selectedBrandValue\n });\n\n // Create an array of Validation error objects and send to callback\n if (Object.keys(mappedErrors).length) {\n const validationErrors: ValidationError[] = Object.entries(mappedErrors).map(([fieldType, error]) => {\n const valErr: ValidationError = {\n fieldType,\n ...(error ? (error as SFError) : { error: '', rootNode: this.props.rootNode })\n };\n return valErr;\n });\n this.props.onValidationError?.(validationErrors);\n }\n }, [data, valid, errors, selectedBrandValue]);\n\n /**\n * RENDER\n */\n // prettier-ignore\n return (\n <SecuredFieldsProvider\n ref={sfp}\n {...extractPropsForSFP(props)}\n type={props.brand}\n onChange={handleSecuredFieldsChange}\n render={() => null}\n />\n );\n}\n\nCustomCardInput.defaultProps = defaultProps;\n\nexport default CustomCardInput;\n\nconst extractPropsForSFP = (props: SecuredFieldsProps) => {\n return {\n autoFocus: props.autoFocus,\n brands: props.brands,\n brandsConfiguration: props.brandsConfiguration,\n clientKey: props.clientKey,\n // countryCode: props.countryCode, // only used for korean cards when koreanAuthenticationRequired is true\n i18n: props.i18n,\n implementationType: props.implementationType,\n keypadFix: props.keypadFix,\n legacyInputMode: props.legacyInputMode,\n loadingContext: props.loadingContext,\n minimumExpiryDate: props.minimumExpiryDate,\n onAdditionalSFConfig: props.onAdditionalSFConfig,\n onAdditionalSFRemoved: props.onAdditionalSFRemoved,\n onAllValid: props.onAllValid,\n onAutoComplete: props.onAutoComplete,\n onBinValue: props.onBinValue,\n onBrand: props.onBrand,\n // onChange // set directly\n onConfigSuccess: props.onConfigSuccess,\n onError: props.onError,\n onFieldValid: props.onFieldValid,\n onFocus: props.onFocus,\n onLoad: props.onLoad,\n // render // set directly\n rootNode: props.rootNode,\n showWarnings: props.showWarnings,\n styles: props.styles,\n trimTrailingSeparator: props.trimTrailingSeparator,\n resources: props.resources,\n maskSecurityCode: props.maskSecurityCode,\n placeholders: props.placeholders\n };\n};\n"],"names":["CustomCardInput","props","sfp","useRef","errors","setErrors","useState","valid","setValid","data","setData","isSfpValid","setIsSfpValid","issuingCountryCode","setIssuingCountryCode","dualBrandSelectElements","setDualBrandSelectElements","selectedBrandValue","setSelectedBrandValue","extensions","useMemo","SFExtensions","this","processBinLookupResponse","binLookupResponse","isReset","processBinLookup","dualBrandingChangeHandler","handleDualBrandSelection","useEffect","setFocusOn","current","updateStyles","showValidation","handleUnsupportedCard","destroy","sfStateErrorsObj","mapErrorsToValidationRuleResult","mappedErrors","onChange","isValid","Object","keys","length","validationErrors","entries","map","fieldType","error","rootNode","onValidationError","h","SecuredFieldsProvider","ref","extractPropsForSFP","type","brand","sfState","render","defaultProps","onError","autoFocus","brands","brandsConfiguration","clientKey","i18n","implementationType","keypadFix","legacyInputMode","loadingContext","minimumExpiryDate","onAdditionalSFConfig","onAdditionalSFRemoved","onAllValid","onAutoComplete","onBinValue","onBrand","onConfigSuccess","onFieldValid","onFocus","onLoad","showWarnings","styles","trimTrailingSeparator","resources","maskSecurityCode","placeholders"],"mappings":"qUAqDA,SAASA,EAAgBC,GACrB,MAAMC,EAAMC,EAAO,OAEZC,EAAQC,GAAaC,EAAS,CAAC,IAC/BC,EAAOC,GAAYF,EAAS,CAAC,IAC7BG,EAAMC,GAAWJ,EAAS,CAAC,IAE3BK,EAAYC,GAAiBN,GAAS,IAEtCO,EAAoBC,GAAyBR,EAAS,OAEtDS,EAAyBC,GAA8BV,EAAS,KAChEW,EAAoBC,GAAyBZ,EAAS,IAWvDa,EAAaC,GACf,IACIC,EACIpB,EACA,CAAEC,OACF,CAAEa,0BAAyBC,6BAA4BE,wBAAuBL,qBAAoBC,2BAE1G,CAACC,EAAyBF,IA6D9B,OAvDAS,KAAKC,yBAA2B,CAACC,EAAsCC,KACnEN,EAAWO,iBAAiBF,EAAmBC,EAAAA,EAGnDH,KAAKK,0BAA4BR,EAAWS,yBAK5CC,GAAU,KAENP,KAAKQ,WAAa5B,EAAI6B,QAAQD,WAC9BR,KAAKU,aAAe9B,EAAI6B,QAAQC,aAChCV,KAAKW,eAAiB/B,EAAI6B,QAAQE,eAClCX,KAAKY,sBAAwBhC,EAAI6B,QAAQG,sBAGlC,KACHhC,EAAI6B,QAAQI,SAAO,IAExB,IAKHN,GAAU,KACN,MAAMO,EAAmBlC,EAAI6B,QAAQM,kCAE/BC,EAAe,IAAKlC,KAAWgC,GAWrC,GATAnC,EAAMsC,SAAS,CACX9B,OACAF,QACAH,OAAQkC,EACRE,QAAS7B,EACTM,uBAIAwB,OAAOC,KAAKJ,GAAcK,OAAQ,CAClC,MAAMC,EAAsCH,OAAOI,QAAQP,GAAcQ,KAAI,EAAEC,EAAWC,MACtD,CAC5BD,eACIC,GAA6B,CAAEA,MAAO,GAAIC,SAAU3B,KAAKrB,MAAMgD,cAI3E3B,KAAKrB,MAAMiD,oBAAoBN,EACnC,IACD,CAACnC,EAAMF,EAAOH,EAAQa,IAOrBkC,EAACC,EAAAA,CACGC,IAAKnD,KACDoD,EAAmBrD,GACvBsD,KAAMtD,EAAMuD,MACZjB,SAlF2BkB,IAC/B/C,EAAQ,IAAKD,KAASgD,EAAQhD,OAC9BJ,EAAU,IAAKD,KAAWqD,EAAQrD,SAClCI,EAAS,IAAKD,KAAUkD,EAAQlD,QAEhCK,EAAc6C,EAAQ9C,WAAU,EA8E5B+C,OAAQ,IAAM,MAG1B,CAEA1D,EAAgB2D,aA5GK,CACjBpB,SAAU,OACVqB,QAAS,OACTV,kBAAmB,QA6GvB,MAAMI,EAAsBrD,IACjB,CACH4D,UAAW5D,EAAM4D,UACjBC,OAAQ7D,EAAM6D,OACdC,oBAAqB9D,EAAM8D,oBAC3BC,UAAW/D,EAAM+D,UAEjBC,KAAMhE,EAAMgE,KACZC,mBAAoBjE,EAAMiE,mBAC1BC,UAAWlE,EAAMkE,UACjBC,gBAAiBnE,EAAMmE,gBACvBC,eAAgBpE,EAAMoE,eACtBC,kBAAmBrE,EAAMqE,kBACzBC,qBAAsBtE,EAAMsE,qBAC5BC,sBAAuBvE,EAAMuE,sBAC7BC,WAAYxE,EAAMwE,WAClBC,eAAgBzE,EAAMyE,eACtBC,WAAY1E,EAAM0E,WAClBC,QAAS3E,EAAM2E,QAEfC,gBAAiB5E,EAAM4E,gBACvBjB,QAAS3D,EAAM2D,QACfkB,aAAc7E,EAAM6E,aACpBC,QAAS9E,EAAM8E,QACfC,OAAQ/E,EAAM+E,OAEd/B,SAAUhD,EAAMgD,SAChBgC,aAAchF,EAAMgF,aACpBC,OAAQjF,EAAMiF,OACdC,sBAAuBlF,EAAMkF,sBAC7BC,UAAWnF,EAAMmF,UACjBC,iBAAkBpF,EAAMoF,iBACxBC,aAAcrF,EAAMqF"}
|
|
1
|
+
{"version":3,"file":"CustomCardInput.js","sources":["../../../../../src/components/CustomCard/CustomCardInput/CustomCardInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useState, useEffect, useRef, useMemo } from 'preact/hooks';\nimport Language from '../../../language/Language';\nimport SecuredFieldsProvider from '../../internal/SecuredFields/SFP/SecuredFieldsProvider';\nimport { SFPState } from '../../internal/SecuredFields/SFP/types';\nimport { BinLookupResponse, CardBrandsConfiguration } from '../../Card/types';\nimport SFExtensions from '../../internal/SecuredFields/binLookup/extensions';\nimport { StylesObject } from '../../internal/SecuredFields/lib/types';\nimport { Resources } from '../../../core/Context/Resources';\nimport { Placeholders, SFError } from '../../Card/components/CardInput/types';\nimport { ValidationError } from '../types';\n\ninterface SecuredFieldsProps {\n autoFocus?: boolean;\n brand?: string;\n brands?: string[];\n brandsConfiguration?: CardBrandsConfiguration;\n clientKey?: string;\n countryCode?: string;\n i18n: Language;\n implementationType?: string;\n keypadFix?: boolean;\n loadingContext?: string;\n legacyInputMode?: boolean;\n minimumExpiryDate?: string;\n onAdditionalSFConfig?: () => {};\n onAdditionalSFRemoved?: () => {};\n onAllValid?: () => {};\n onAutoComplete?: () => {};\n onBinValue?: () => {};\n onBrand?: () => {};\n onConfigSuccess?: () => {};\n onChange: (data) => void;\n handleKeyPress?: (obj: KeyboardEvent) => void;\n onError?: () => {};\n onFieldValid?: () => {};\n onFocus?: (e) => {};\n onLoad?: () => {};\n placeholders?: Placeholders;\n rootNode: HTMLElement;\n resources: Resources;\n showWarnings?: boolean;\n styles?: StylesObject;\n trimTrailingSeparator?: boolean;\n type: string;\n maskSecurityCode?: boolean;\n}\n\nconst defaultProps = {\n onChange: () => {},\n onError: () => {},\n onValidationError: () => {}\n};\n\nfunction CustomCardInput(props: SecuredFieldsProps) {\n const sfp = useRef(null);\n\n const [errors, setErrors] = useState({});\n const [valid, setValid] = useState({});\n const [data, setData] = useState({});\n\n const [isSfpValid, setIsSfpValid] = useState(false);\n\n const [issuingCountryCode, setIssuingCountryCode] = useState(null);\n\n const [dualBrandSelectElements, setDualBrandSelectElements] = useState([]);\n const [selectedBrandValue, setSelectedBrandValue] = useState('');\n\n const handleSecuredFieldsChange = (sfState: SFPState): void => {\n setData({ ...data, ...sfState.data });\n setErrors({ ...errors, ...sfState.errors });\n setValid({ ...valid, ...sfState.valid });\n\n setIsSfpValid(sfState.isSfpValid);\n };\n\n // Farm the handlers for binLookup related functionality out to another 'extensions' file\n const extensions = useMemo(\n () =>\n SFExtensions(\n props,\n { sfp },\n { dualBrandSelectElements, setDualBrandSelectElements, setSelectedBrandValue, issuingCountryCode, setIssuingCountryCode }\n ),\n [dualBrandSelectElements, issuingCountryCode]\n );\n\n /**\n * EXPECTED METHODS ON SecuredFields.this\n */\n this.processBinLookupResponse = (binLookupResponse: BinLookupResponse, isReset: boolean) => {\n extensions.processBinLookup(binLookupResponse, isReset);\n };\n\n this.dualBrandingChangeHandler = extensions.handleDualBrandSelection;\n\n /**\n * EFFECT HOOKS\n */\n useEffect(() => {\n // componentDidMount\n this.setFocusOn = sfp.current.setFocusOn;\n this.updateStyles = sfp.current.updateStyles;\n this.showValidation = sfp.current.showValidation;\n this.handleUnsupportedCard = sfp.current.handleUnsupportedCard;\n\n // componentWillUnmount\n return () => {\n sfp.current.destroy();\n };\n }, []);\n\n /**\n * Main 'componentDidUpdate' handler\n */\n useEffect(() => {\n const sfStateErrorsObj = sfp.current.mapErrorsToValidationRuleResult();\n\n const mappedErrors = { ...errors, ...sfStateErrorsObj }; // maps sfErrors\n\n props.onChange({\n data,\n valid,\n errors: mappedErrors,\n isValid: isSfpValid,\n selectedBrandValue\n });\n\n // Create an array of Validation error objects and send to callback\n if (Object.keys(mappedErrors).length) {\n const validationErrors: ValidationError[] = Object.entries(mappedErrors).map(([fieldType, error]) => {\n const valErr: ValidationError = {\n fieldType,\n ...(error ? (error as SFError) : { error: '', rootNode: this.props.rootNode })\n };\n return valErr;\n });\n this.props.onValidationError?.(validationErrors);\n }\n }, [data, valid, errors, selectedBrandValue]);\n\n /**\n * RENDER\n */\n // prettier-ignore\n return (\n <SecuredFieldsProvider\n ref={sfp}\n {...extractPropsForSFP(props)}\n type={props.brand}\n onChange={handleSecuredFieldsChange}\n render={() => null}\n />\n );\n}\n\nCustomCardInput.defaultProps = defaultProps;\n\nexport default CustomCardInput;\n\nconst extractPropsForSFP = (props: SecuredFieldsProps) => {\n return {\n autoFocus: props.autoFocus,\n brands: props.brands,\n brandsConfiguration: props.brandsConfiguration,\n clientKey: props.clientKey,\n // countryCode: props.countryCode, // only used for korean cards when koreanAuthenticationRequired is true\n i18n: props.i18n,\n implementationType: props.implementationType,\n keypadFix: props.keypadFix,\n legacyInputMode: props.legacyInputMode,\n loadingContext: props.loadingContext,\n minimumExpiryDate: props.minimumExpiryDate,\n onAdditionalSFConfig: props.onAdditionalSFConfig,\n onAdditionalSFRemoved: props.onAdditionalSFRemoved,\n onAllValid: props.onAllValid,\n onAutoComplete: props.onAutoComplete,\n onBinValue: props.onBinValue,\n onBrand: props.onBrand,\n // onChange // set directly\n onConfigSuccess: props.onConfigSuccess,\n handleKeyPress: props.handleKeyPress,\n onError: props.onError,\n onFieldValid: props.onFieldValid,\n onFocus: props.onFocus,\n onLoad: props.onLoad,\n // render // set directly\n rootNode: props.rootNode,\n showWarnings: props.showWarnings,\n styles: props.styles,\n trimTrailingSeparator: props.trimTrailingSeparator,\n resources: props.resources,\n maskSecurityCode: props.maskSecurityCode,\n placeholders: props.placeholders\n };\n};\n"],"names":["CustomCardInput","props","sfp","useRef","errors","setErrors","useState","valid","setValid","data","setData","isSfpValid","setIsSfpValid","issuingCountryCode","setIssuingCountryCode","dualBrandSelectElements","setDualBrandSelectElements","selectedBrandValue","setSelectedBrandValue","extensions","useMemo","SFExtensions","this","processBinLookupResponse","binLookupResponse","isReset","processBinLookup","dualBrandingChangeHandler","handleDualBrandSelection","useEffect","setFocusOn","current","updateStyles","showValidation","handleUnsupportedCard","destroy","sfStateErrorsObj","mapErrorsToValidationRuleResult","mappedErrors","onChange","isValid","Object","keys","length","validationErrors","entries","map","fieldType","error","rootNode","onValidationError","h","SecuredFieldsProvider","ref","extractPropsForSFP","type","brand","sfState","render","defaultProps","onError","autoFocus","brands","brandsConfiguration","clientKey","i18n","implementationType","keypadFix","legacyInputMode","loadingContext","minimumExpiryDate","onAdditionalSFConfig","onAdditionalSFRemoved","onAllValid","onAutoComplete","onBinValue","onBrand","onConfigSuccess","handleKeyPress","onFieldValid","onFocus","onLoad","showWarnings","styles","trimTrailingSeparator","resources","maskSecurityCode","placeholders"],"mappings":"qUAsDA,SAASA,EAAgBC,GACrB,MAAMC,EAAMC,EAAO,OAEZC,EAAQC,GAAaC,EAAS,CAAC,IAC/BC,EAAOC,GAAYF,EAAS,CAAC,IAC7BG,EAAMC,GAAWJ,EAAS,CAAC,IAE3BK,EAAYC,GAAiBN,GAAS,IAEtCO,EAAoBC,GAAyBR,EAAS,OAEtDS,EAAyBC,GAA8BV,EAAS,KAChEW,EAAoBC,GAAyBZ,EAAS,IAWvDa,EAAaC,GACf,IACIC,EACIpB,EACA,CAAEC,OACF,CAAEa,0BAAyBC,6BAA4BE,wBAAuBL,qBAAoBC,2BAE1G,CAACC,EAAyBF,IA6D9B,OAvDAS,KAAKC,yBAA2B,CAACC,EAAsCC,KACnEN,EAAWO,iBAAiBF,EAAmBC,EAAAA,EAGnDH,KAAKK,0BAA4BR,EAAWS,yBAK5CC,GAAU,KAENP,KAAKQ,WAAa5B,EAAI6B,QAAQD,WAC9BR,KAAKU,aAAe9B,EAAI6B,QAAQC,aAChCV,KAAKW,eAAiB/B,EAAI6B,QAAQE,eAClCX,KAAKY,sBAAwBhC,EAAI6B,QAAQG,sBAGlC,KACHhC,EAAI6B,QAAQI,SAAO,IAExB,IAKHN,GAAU,KACN,MAAMO,EAAmBlC,EAAI6B,QAAQM,kCAE/BC,EAAe,IAAKlC,KAAWgC,GAWrC,GATAnC,EAAMsC,SAAS,CACX9B,OACAF,QACAH,OAAQkC,EACRE,QAAS7B,EACTM,uBAIAwB,OAAOC,KAAKJ,GAAcK,OAAQ,CAClC,MAAMC,EAAsCH,OAAOI,QAAQP,GAAcQ,KAAI,EAAEC,EAAWC,MACtD,CAC5BD,eACIC,GAA6B,CAAEA,MAAO,GAAIC,SAAU3B,KAAKrB,MAAMgD,cAI3E3B,KAAKrB,MAAMiD,oBAAoBN,EACnC,IACD,CAACnC,EAAMF,EAAOH,EAAQa,IAOrBkC,EAACC,EAAAA,CACGC,IAAKnD,KACDoD,EAAmBrD,GACvBsD,KAAMtD,EAAMuD,MACZjB,SAlF2BkB,IAC/B/C,EAAQ,IAAKD,KAASgD,EAAQhD,OAC9BJ,EAAU,IAAKD,KAAWqD,EAAQrD,SAClCI,EAAS,IAAKD,KAAUkD,EAAQlD,QAEhCK,EAAc6C,EAAQ9C,WAAU,EA8E5B+C,OAAQ,IAAM,MAG1B,CAEA1D,EAAgB2D,aA5GK,CACjBpB,SAAU,OACVqB,QAAS,OACTV,kBAAmB,QA6GvB,MAAMI,EAAsBrD,IACjB,CACH4D,UAAW5D,EAAM4D,UACjBC,OAAQ7D,EAAM6D,OACdC,oBAAqB9D,EAAM8D,oBAC3BC,UAAW/D,EAAM+D,UAEjBC,KAAMhE,EAAMgE,KACZC,mBAAoBjE,EAAMiE,mBAC1BC,UAAWlE,EAAMkE,UACjBC,gBAAiBnE,EAAMmE,gBACvBC,eAAgBpE,EAAMoE,eACtBC,kBAAmBrE,EAAMqE,kBACzBC,qBAAsBtE,EAAMsE,qBAC5BC,sBAAuBvE,EAAMuE,sBAC7BC,WAAYxE,EAAMwE,WAClBC,eAAgBzE,EAAMyE,eACtBC,WAAY1E,EAAM0E,WAClBC,QAAS3E,EAAM2E,QAEfC,gBAAiB5E,EAAM4E,gBACvBC,eAAgB7E,EAAM6E,eACtBlB,QAAS3D,EAAM2D,QACfmB,aAAc9E,EAAM8E,aACpBC,QAAS/E,EAAM+E,QACfC,OAAQhF,EAAMgF,OAEdhC,SAAUhD,EAAMgD,SAChBiC,aAAcjF,EAAMiF,aACpBC,OAAQlF,EAAMkF,OACdC,sBAAuBnF,EAAMmF,sBAC7BC,UAAWpF,EAAMoF,UACjBC,iBAAkBrF,EAAMqF,iBACxBC,aAActF,EAAMsF"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as e}from"../internal/UIElement/UIElement.js";import o from"./defaultProps.js";import{DropinComponent as s}from"./components/DropinComponent.js";import{CoreProvider as
|
|
1
|
+
import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as e}from"../internal/UIElement/UIElement.js";import o from"./defaultProps.js";import{DropinComponent as s}from"./components/DropinComponent.js";import{CoreProvider as n}from"../../core/Context/CoreProvider.js";import{getCommonProps as i}from"./components/utils.js";import r from"./elements/createElements.js";import a from"./elements/createStoredElements.js";import h from"./elements/createInstantPaymentElements.js";import{hasOwnProperty as d}from"../../utils/hasOwnProperty.js";import m from"../../core/Errors/SRPanelProvider.js";import p from"./elements/splitPaymentMethods.js";import{TxVariants as c}from"../tx-variants.js";const l=["paywithgoogle","googlepay","applepay"];class y extends e{static type=c.dropin;static defaultProps=o;dropinRef=null;paymentMethodsConfiguration;componentFromAction;constructor(t,e){super(t,e),this.submit=this.submit.bind(this),this.handleAction=this.handleAction.bind(this),this.props.paymentMethodComponents.forEach((t=>this.core.register(t))),this.paymentMethodsConfiguration=this.props.paymentMethodsConfiguration||{}}storeElementRefOnCore(){this.core.storeElementReference(this)}formatProps(t){return{type:"dropin",...super.formatProps(t),instantPaymentTypes:Array.from(new Set(t.instantPaymentTypes)).filter((t=>l.includes(t)))}}get isValid(){return!!this.dropinRef&&!!this.dropinRef.state.activePaymentMethod&&!!this.dropinRef.state.activePaymentMethod.isValid}showValidation(){return this.dropinRef.state.activePaymentMethod&&this.dropinRef.state.activePaymentMethod.showValidation(),this}setStatus(t,e={}){return this.dropinRef?.setStatus(t,e),this}get activePaymentMethod(){return this.dropinRef?.state||this.dropinRef?.state.activePaymentMethod?this.dropinRef.state.activePaymentMethod:null}get data(){return this.activePaymentMethod?this.dropinRef.state.activePaymentMethod.data:null}displayFinalAnimation(t){this.props.disableFinalAnimation||this.dropinRef.setStatus(t)}submit(){if(!this.activePaymentMethod)throw new Error("No active payment method.");this.activePaymentMethod.isValid||this.activePaymentMethod.showValidation(),this.activePaymentMethod.isInstantPayment&&this.closeActivePaymentMethod(),this.activePaymentMethod.submit()}handleCreate=()=>{const{paymentMethodsConfiguration:t,showStoredPaymentMethods:e,showPaymentMethods:o,instantPaymentTypes:s}=this.props,{paymentMethods:n,storedPaymentMethods:d,instantPaymentMethods:m}=p(this.core.paymentMethodsResponse,s),c=i({...this.props,elementRef:this.elementRef});return[e?a(d,t,c,this.core):[],o?r(n,t,c,this.core):[],h(m,t,c,this.core)]};handleAction(t,e={}){if(!t||!t.type){if(d(t,"action")&&d(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')}if("redirect"!==t.type&&this.activePaymentMethod?.updateWithAction)return this.activePaymentMethod.updateWithAction(t);this.elementRef instanceof y&&(e={...this.elementRef.activePaymentMethod?.props,...e});const o=this.core.createFromAction(t,{...e,elementRef:this.elementRef,onAdditionalDetails:this.handleAdditionalDetails,isDropin:!0});return o?(this.setStatus(o.props.statusType,{component:o}),this.componentFromAction=o,this):null}handleOrder=({order:t})=>{this.updateParent({order:t})};closeActivePaymentMethod(){this.dropinRef.closeActivePaymentMethod()}handleKeyPress(t){if("Enter"===t.key||"Enter"===t.code){if("radio"===document?.activeElement?.getAttribute("role"))return;super.handleKeyPress(t)}}onEnterKeyPressed(t,e){const o=this.activePaymentMethod??e;this.activePaymentMethod?.onEnterKeyPressed(t,o)}render(){return t(n,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},t(m,{srPanel:this.props.modules.srPanel},t(s,{...this.props,core:this.core,elementRef:this.elementRef,onCreateElements:this.handleCreate,ref:t=>{this.dropinRef=t}})))}}export{y as default};
|
|
2
2
|
//# sourceMappingURL=Dropin.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dropin.js","sources":["../../../../src/components/Dropin/Dropin.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport defaultProps from './defaultProps';\nimport DropinComponent from '../../components/Dropin/components/DropinComponent';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport { getCommonProps } from './components/utils';\nimport { createElements, createStoredElements } from './elements';\nimport createInstantPaymentElements from './elements/createInstantPaymentElements';\nimport { hasOwnProperty } from '../../utils/hasOwnProperty';\nimport SRPanelProvider from '../../core/Errors/SRPanelProvider';\nimport splitPaymentMethods from './elements/splitPaymentMethods';\nimport { TxVariants } from '../tx-variants';\n\nimport type { DropinConfiguration, InstantPaymentTypes, PaymentMethodsConfiguration } from './types';\nimport type { PaymentAction, PaymentResponseData } from '../../types/global-types';\nimport type { ICore } from '../../core/types';\nimport type { IDropin } from './types';\n\nconst SUPPORTED_INSTANT_PAYMENTS = ['paywithgoogle', 'googlepay', 'applepay'];\n\nclass DropinElement extends UIElement<DropinConfiguration> implements IDropin {\n public static type = TxVariants.dropin;\n\n protected static defaultProps = defaultProps;\n\n public dropinRef = null;\n\n private paymentMethodsConfiguration: PaymentMethodsConfiguration;\n /**\n * Reference to the component created from `handleAction` (Ex.: ThreeDS2Challenge)\n */\n public componentFromAction?: UIElement;\n\n constructor(checkout: ICore, props?: DropinConfiguration) {\n super(checkout, props);\n this.submit = this.submit.bind(this);\n this.handleAction = this.handleAction.bind(this);\n\n this.props.paymentMethodComponents.forEach(PaymentMethod => this.core.register(PaymentMethod));\n this.paymentMethodsConfiguration = this.props.paymentMethodsConfiguration || {};\n }\n\n protected override storeElementRefOnCore() {\n this.core.storeElementReference(this);\n }\n\n formatProps(props) {\n return {\n type: 'dropin', // for analytics\n ...super.formatProps(props),\n instantPaymentTypes: Array.from<InstantPaymentTypes>(new Set(props.instantPaymentTypes)).filter(value =>\n SUPPORTED_INSTANT_PAYMENTS.includes(value)\n )\n };\n }\n\n get isValid() {\n return !!this.dropinRef && !!this.dropinRef.state.activePaymentMethod && !!this.dropinRef.state.activePaymentMethod.isValid;\n }\n\n showValidation() {\n if (this.dropinRef.state.activePaymentMethod) {\n this.dropinRef.state.activePaymentMethod.showValidation();\n }\n\n return this;\n }\n\n public setStatus(status, props = {}): this {\n this.dropinRef?.setStatus(status, props);\n return this;\n }\n\n get activePaymentMethod() {\n if (!this.dropinRef?.state && !this.dropinRef?.state.activePaymentMethod) {\n return null;\n }\n\n return this.dropinRef.state.activePaymentMethod;\n }\n\n get data() {\n if (!this.activePaymentMethod) {\n return null;\n }\n\n return this.dropinRef.state.activePaymentMethod.data;\n }\n\n public displayFinalAnimation(type: 'success' | 'error') {\n if (this.props.disableFinalAnimation) return;\n\n this.dropinRef.setStatus(type);\n }\n\n /**\n * Calls the onSubmit event with the state of the activePaymentMethod\n */\n public override submit(): void {\n if (!this.activePaymentMethod) {\n throw new Error('No active payment method.');\n }\n\n if (!this.activePaymentMethod.isValid) {\n this.activePaymentMethod.showValidation();\n }\n\n if (this.activePaymentMethod.isInstantPayment) {\n this.closeActivePaymentMethod();\n }\n\n this.activePaymentMethod.submit();\n }\n\n /**\n * Creates the Drop-in elements\n */\n private handleCreate = () => {\n const { paymentMethodsConfiguration, showStoredPaymentMethods, showPaymentMethods, instantPaymentTypes } = this.props;\n\n const { paymentMethods, storedPaymentMethods, instantPaymentMethods } = splitPaymentMethods(\n this.core.paymentMethodsResponse,\n instantPaymentTypes\n );\n\n const commonProps = getCommonProps({ ...this.props, elementRef: this.elementRef });\n\n const storedElements = showStoredPaymentMethods\n ? createStoredElements(storedPaymentMethods, paymentMethodsConfiguration, commonProps, this.core)\n : [];\n const elements = showPaymentMethods ? createElements(paymentMethods, paymentMethodsConfiguration, commonProps, this.core) : [];\n const instantPaymentElements = createInstantPaymentElements(instantPaymentMethods, paymentMethodsConfiguration, commonProps, this.core);\n\n return [storedElements, elements, instantPaymentElements];\n };\n\n public handleAction(action: PaymentAction, props = {}): this | 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 if (action.type !== 'redirect' && this.activePaymentMethod?.updateWithAction) {\n return this.activePaymentMethod.updateWithAction(action);\n }\n\n if (this.elementRef instanceof DropinElement) {\n props = {\n ...this.elementRef.activePaymentMethod?.props,\n ...props\n };\n }\n\n const paymentAction: UIElement = this.core.createFromAction(action, {\n ...props,\n elementRef: this.elementRef, // maintain elementRef for 3DS2 flow\n onAdditionalDetails: this.handleAdditionalDetails,\n isDropin: true\n });\n\n if (paymentAction) {\n this.setStatus(paymentAction.props.statusType, { component: paymentAction });\n this.componentFromAction = paymentAction;\n return this;\n }\n\n return null;\n }\n\n /**\n * handleOrder is implemented so we don't trigger a callback like in the components\n * @param response - PaymentResponse\n */\n protected handleOrder = ({ order }: PaymentResponseData): void => {\n this.updateParent({ order });\n };\n\n closeActivePaymentMethod() {\n this.dropinRef.closeActivePaymentMethod();\n }\n\n render() {\n return (\n <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n <SRPanelProvider srPanel={this.props.modules.srPanel}>\n <DropinComponent\n {...this.props}\n core={this.core}\n elementRef={this.elementRef}\n onCreateElements={this.handleCreate}\n ref={dropinRef => {\n this.dropinRef = dropinRef;\n }}\n />\n </SRPanelProvider>\n </CoreProvider>\n );\n }\n}\n\nexport default DropinElement;\n"],"names":["SUPPORTED_INSTANT_PAYMENTS","DropinElement","UIElement","static","TxVariants","dropin","defaultProps","dropinRef","paymentMethodsConfiguration","componentFromAction","constructor","checkout","props","super","this","submit","bind","handleAction","paymentMethodComponents","forEach","PaymentMethod","core","register","storeElementRefOnCore","storeElementReference","formatProps","type","instantPaymentTypes","Array","from","Set","filter","value","includes","isValid","state","activePaymentMethod","showValidation","setStatus","status","data","displayFinalAnimation","disableFinalAnimation","Error","isInstantPayment","closeActivePaymentMethod","handleCreate","showStoredPaymentMethods","showPaymentMethods","paymentMethods","storedPaymentMethods","instantPaymentMethods","splitPaymentMethods","paymentMethodsResponse","commonProps","getCommonProps","elementRef","createStoredElements","createElements","createInstantPaymentElements","action","hasOwnProperty","updateWithAction","paymentAction","createFromAction","onAdditionalDetails","handleAdditionalDetails","isDropin","statusType","component","handleOrder","order","updateParent","render","h","CoreProvider","i18n","loadingContext","resources","SRPanelProvider","srPanel","modules","DropinComponent","onCreateElements","ref"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Dropin.js","sources":["../../../../src/components/Dropin/Dropin.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport defaultProps from './defaultProps';\nimport DropinComponent from '../../components/Dropin/components/DropinComponent';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport { getCommonProps } from './components/utils';\nimport { createElements, createStoredElements } from './elements';\nimport createInstantPaymentElements from './elements/createInstantPaymentElements';\nimport { hasOwnProperty } from '../../utils/hasOwnProperty';\nimport SRPanelProvider from '../../core/Errors/SRPanelProvider';\nimport splitPaymentMethods from './elements/splitPaymentMethods';\nimport { TxVariants } from '../tx-variants';\n\nimport type { DropinConfiguration, InstantPaymentTypes, PaymentMethodsConfiguration } from './types';\nimport type { PaymentAction, PaymentResponseData } from '../../types/global-types';\nimport type { ICore } from '../../core/types';\nimport type { IDropin } from './types';\n\nconst SUPPORTED_INSTANT_PAYMENTS = ['paywithgoogle', 'googlepay', 'applepay'];\n\nclass DropinElement extends UIElement<DropinConfiguration> implements IDropin {\n public static type = TxVariants.dropin;\n\n protected static defaultProps = defaultProps;\n\n public dropinRef = null;\n\n private paymentMethodsConfiguration: PaymentMethodsConfiguration;\n /**\n * Reference to the component created from `handleAction` (Ex.: ThreeDS2Challenge)\n */\n public componentFromAction?: UIElement;\n\n constructor(checkout: ICore, props?: DropinConfiguration) {\n super(checkout, props);\n this.submit = this.submit.bind(this);\n this.handleAction = this.handleAction.bind(this);\n\n this.props.paymentMethodComponents.forEach(PaymentMethod => this.core.register(PaymentMethod));\n this.paymentMethodsConfiguration = this.props.paymentMethodsConfiguration || {};\n }\n\n protected override storeElementRefOnCore() {\n this.core.storeElementReference(this);\n }\n\n formatProps(props) {\n return {\n type: 'dropin', // for analytics\n ...super.formatProps(props),\n instantPaymentTypes: Array.from<InstantPaymentTypes>(new Set(props.instantPaymentTypes)).filter(value =>\n SUPPORTED_INSTANT_PAYMENTS.includes(value)\n )\n };\n }\n\n get isValid() {\n return !!this.dropinRef && !!this.dropinRef.state.activePaymentMethod && !!this.dropinRef.state.activePaymentMethod.isValid;\n }\n\n showValidation() {\n if (this.dropinRef.state.activePaymentMethod) {\n this.dropinRef.state.activePaymentMethod.showValidation();\n }\n\n return this;\n }\n\n public setStatus(status, props = {}): this {\n this.dropinRef?.setStatus(status, props);\n return this;\n }\n\n get activePaymentMethod() {\n if (!this.dropinRef?.state && !this.dropinRef?.state.activePaymentMethod) {\n return null;\n }\n\n return this.dropinRef.state.activePaymentMethod;\n }\n\n get data() {\n if (!this.activePaymentMethod) {\n return null;\n }\n\n return this.dropinRef.state.activePaymentMethod.data;\n }\n\n public displayFinalAnimation(type: 'success' | 'error') {\n if (this.props.disableFinalAnimation) return;\n\n this.dropinRef.setStatus(type);\n }\n\n /**\n * Calls the onSubmit event with the state of the activePaymentMethod\n */\n public override submit(): void {\n if (!this.activePaymentMethod) {\n throw new Error('No active payment method.');\n }\n\n if (!this.activePaymentMethod.isValid) {\n this.activePaymentMethod.showValidation();\n }\n\n if (this.activePaymentMethod.isInstantPayment) {\n this.closeActivePaymentMethod();\n }\n\n this.activePaymentMethod.submit();\n }\n\n /**\n * Creates the Drop-in elements\n */\n private handleCreate = () => {\n const { paymentMethodsConfiguration, showStoredPaymentMethods, showPaymentMethods, instantPaymentTypes } = this.props;\n\n const { paymentMethods, storedPaymentMethods, instantPaymentMethods } = splitPaymentMethods(\n this.core.paymentMethodsResponse,\n instantPaymentTypes\n );\n\n const commonProps = getCommonProps({ ...this.props, elementRef: this.elementRef });\n\n const storedElements = showStoredPaymentMethods\n ? createStoredElements(storedPaymentMethods, paymentMethodsConfiguration, commonProps, this.core)\n : [];\n const elements = showPaymentMethods ? createElements(paymentMethods, paymentMethodsConfiguration, commonProps, this.core) : [];\n const instantPaymentElements = createInstantPaymentElements(instantPaymentMethods, paymentMethodsConfiguration, commonProps, this.core);\n\n return [storedElements, elements, instantPaymentElements];\n };\n\n public handleAction(action: PaymentAction, props = {}): this | 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 if (action.type !== 'redirect' && this.activePaymentMethod?.updateWithAction) {\n return this.activePaymentMethod.updateWithAction(action);\n }\n\n if (this.elementRef instanceof DropinElement) {\n props = {\n ...this.elementRef.activePaymentMethod?.props,\n ...props\n };\n }\n\n const paymentAction: UIElement = this.core.createFromAction(action, {\n ...props,\n elementRef: this.elementRef, // maintain elementRef for 3DS2 flow\n onAdditionalDetails: this.handleAdditionalDetails,\n isDropin: true\n });\n\n if (paymentAction) {\n this.setStatus(paymentAction.props.statusType, { component: paymentAction });\n this.componentFromAction = paymentAction;\n return this;\n }\n\n return null;\n }\n\n /**\n * handleOrder is implemented so we don't trigger a callback like in the components\n * @param response - PaymentResponse\n */\n protected handleOrder = ({ order }: PaymentResponseData): void => {\n void this.updateParent({ order });\n };\n\n closeActivePaymentMethod() {\n this.dropinRef.closeActivePaymentMethod();\n }\n\n protected handleKeyPress(e: h.JSX.TargetedKeyboardEvent<HTMLInputElement> | KeyboardEvent) {\n if (e.key === 'Enter' || e.code === 'Enter') {\n // If the active element has role=\"radio\", we're on a header in the PMList, in which case we don't want to validate the form, or, prevent the default behaviour\n const isPMHeader = document?.activeElement?.getAttribute('role') === 'radio';\n if (isPMHeader) {\n return;\n }\n super.handleKeyPress(e);\n }\n }\n\n protected onEnterKeyPressed(activeElement: Element, component: UIElement) {\n // We want to have a ref to the activePM, if we can; not a ref to the Dropin\n const pmComponent = this.activePaymentMethod ?? component;\n this.activePaymentMethod?.onEnterKeyPressed(activeElement, pmComponent);\n }\n\n render() {\n return (\n <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n <SRPanelProvider srPanel={this.props.modules.srPanel}>\n <DropinComponent\n {...this.props}\n core={this.core}\n elementRef={this.elementRef}\n onCreateElements={this.handleCreate}\n ref={dropinRef => {\n this.dropinRef = dropinRef;\n }}\n />\n </SRPanelProvider>\n </CoreProvider>\n );\n }\n}\n\nexport default DropinElement;\n"],"names":["SUPPORTED_INSTANT_PAYMENTS","DropinElement","UIElement","static","TxVariants","dropin","defaultProps","dropinRef","paymentMethodsConfiguration","componentFromAction","constructor","checkout","props","super","this","submit","bind","handleAction","paymentMethodComponents","forEach","PaymentMethod","core","register","storeElementRefOnCore","storeElementReference","formatProps","type","instantPaymentTypes","Array","from","Set","filter","value","includes","isValid","state","activePaymentMethod","showValidation","setStatus","status","data","displayFinalAnimation","disableFinalAnimation","Error","isInstantPayment","closeActivePaymentMethod","handleCreate","showStoredPaymentMethods","showPaymentMethods","paymentMethods","storedPaymentMethods","instantPaymentMethods","splitPaymentMethods","paymentMethodsResponse","commonProps","getCommonProps","elementRef","createStoredElements","createElements","createInstantPaymentElements","action","hasOwnProperty","updateWithAction","paymentAction","createFromAction","onAdditionalDetails","handleAdditionalDetails","isDropin","statusType","component","handleOrder","order","updateParent","handleKeyPress","e","key","code","document","activeElement","getAttribute","onEnterKeyPressed","pmComponent","render","h","CoreProvider","i18n","loadingContext","resources","SRPanelProvider","srPanel","modules","DropinComponent","onCreateElements","ref"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Component as
|
|
1
|
+
import{Component as t,createElement as e}from"../../../external/preact/dist/preact.js";import s from"./PaymentMethod/PaymentMethodList.js";import o from"./status/index.js";import n from"../../../core/Services/order-status.js";import{sanitizeOrder as a}from"../../internal/UIElement/utils.js";import{ANALYTICS_RENDERED_STR as r}from"../../../core/Analytics/constants.js";import i from"../../../core/Errors/AdyenCheckoutError.js";class d extends t{state={elements:[],instantPaymentElements:[],storedPaymentElements:[],orderStatus:null,isDisabling:!1,status:{type:"loading",props:void 0},activePaymentMethod:null,cachedPaymentMethods:{}};componentDidMount(){this.prepareDropinData()}prepareDropinData=()=>{const{order:t,clientKey:e,loadingContext:s}=this.props,[o,a,i]=this.props.onCreateElements(),d=t?n({clientKey:e,loadingContext:s},t):null;Promise.all([o,a,i,d]).then((([t,e,s,o])=>{this.setState({instantPaymentElements:s,elements:e,storedPaymentElements:t,orderStatus:o}),this.setStatus("ready"),this.props.modules?.analytics.sendAnalytics("dropin",{type:r})})),this.onOrderCancel=this.getOnOrderCancel()};setStatus=(t,e={})=>{this.setState({status:{type:t,props:e}})};setActivePaymentMethod=t=>{this.setState((e=>({activePaymentMethod:t,cachedPaymentMethods:{...e.cachedPaymentMethods,[t._id]:!0}})))};componentDidUpdate(t,e){e.status.type!==this.state.status.type&&this.state.activePaymentMethod&&this.state.activePaymentMethod.setStatus(this.state.status.type),"ready"===this.state.status.type&&"ready"!==e.status.type&&this.props.onReady&&this.props.onReady()}handleOnSelectPaymentMethod=t=>{const{activePaymentMethod:e}=this.state;this.setActivePaymentMethod(t),(e&&e._id!==t._id||!e)&&(this.props.onSelect?.(t),t.submitAnalytics({type:r}))};handleDisableStoredPaymentMethod=t=>{this.setState({isDisabling:!0}),new Promise(((e,s)=>this.props.onDisableStoredPaymentMethod(t.props.storedPaymentMethodId,e,s))).then((()=>{this.setState((e=>({storedPaymentElements:e.storedPaymentElements.filter((e=>e._id!==t._id))}))),this.setState({isDisabling:!1})})).catch((()=>{this.setState({isDisabling:!1})}))};closeActivePaymentMethod(){this.setState({activePaymentMethod:null})}getOnOrderCancel=()=>this.props.onOrderCancel?t=>{const e=a(t.order);new Promise(((t,s)=>{this.props.onOrderCancel({order:e},{resolve:t,reject:s})})).then((({amount:t})=>this.props.elementRef.handleAdvanceFlowPaymentMethodsUpdate(null,t))).catch((t=>{throw new i("NETWORK_ERROR",t)}))}:this.props.session?t=>this.props.session.cancelOrder(t).then((()=>this.props.core.update({order:null}))).catch((t=>{console.error(t),this.setStatus(t?.message||"error")})):null;onOrderCancel;render(t,{elements:n,instantPaymentElements:a,storedPaymentElements:r,status:i,activePaymentMethod:d,cachedPaymentMethods:h}){const p="loading"===i.type,m="redirect"===i.type,c=n?.length||a?.length||r?.length;switch(i.type){case"success":return e(o.Success,{message:0===t?.amount?.value?"resultMessages.preauthorized":i.props?.message});case"error":return e(o.Error,{message:i.props?.message});case"custom":return i.props?.component?.render();default:return e("div",{className:`adyen-checkout__dropin adyen-checkout__dropin--${i.type}`},m&&i.props.component&&i.props.component.render(),p&&i.props&&i.props.component&&i.props.component.render(),!!c&&e(s,{isLoading:p||m,isDisablingPaymentMethod:this.state.isDisabling,paymentMethods:n,instantPaymentMethods:a,storedPaymentMethods:r,activePaymentMethod:d,cachedPaymentMethods:h,order:this.props.order,orderStatus:this.state.orderStatus,onOrderCancel:this.onOrderCancel,onSelect:this.handleOnSelectPaymentMethod,openPaymentMethod:this.props.openPaymentMethod,openFirstPaymentMethod:this.props.openFirstPaymentMethod,openFirstStoredPaymentMethod:this.props.openFirstStoredPaymentMethod,onDisableStoredPaymentMethod:this.handleDisableStoredPaymentMethod,showRemovePaymentMethodButton:this.props.showRemovePaymentMethodButton,showRadioButton:this.props.showRadioButton}))}}}export{d as DropinComponent,d as default};
|
|
2
2
|
//# sourceMappingURL=DropinComponent.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropinComponent.js","sources":["../../../../../src/components/Dropin/components/DropinComponent.tsx"],"sourcesContent":["import { Component, h } from 'preact';\nimport PaymentMethodList from './PaymentMethod/PaymentMethodList';\nimport Status from './status';\nimport getOrderStatus from '../../../core/Services/order-status';\nimport { DropinComponentProps, DropinComponentState, DropinStatusProps, onOrderCancelData } from '../types';\nimport './DropinComponent.scss';\nimport { UIElementStatus } from '../../internal/UIElement/types';\nimport { sanitizeOrder } from '../../internal/UIElement/utils';\nimport { PaymentAmount } from '../../../types/global-types';\nimport { ANALYTICS_RENDERED_STR } from '../../../core/Analytics/constants';\nimport AdyenCheckoutError from '../../../core/Errors/AdyenCheckoutError';\n\nexport class DropinComponent extends Component<DropinComponentProps, DropinComponentState> {\n public state: DropinComponentState = {\n elements: [],\n instantPaymentElements: [],\n storedPaymentElements: [],\n orderStatus: null,\n isDisabling: false,\n status: { type: 'loading', props: undefined },\n activePaymentMethod: null,\n cachedPaymentMethods: {}\n };\n\n componentDidMount() {\n this.prepareDropinData();\n }\n\n public prepareDropinData = () => {\n const { order, clientKey, loadingContext } = this.props;\n const [storedElementsPromises, elementsPromises, instantPaymentsPromises] = this.props.onCreateElements();\n const orderStatusPromise = order ? getOrderStatus({ clientKey, loadingContext }, order) : null;\n\n Promise.all([storedElementsPromises, elementsPromises, instantPaymentsPromises, orderStatusPromise]).then(\n ([storedPaymentElements, elements, instantPaymentElements, orderStatus]) => {\n this.setState({ instantPaymentElements, elements, storedPaymentElements, orderStatus });\n this.setStatus('ready');\n\n this.props.modules?.analytics.sendAnalytics('dropin', { type: ANALYTICS_RENDERED_STR });\n }\n );\n\n this.onOrderCancel = this.getOnOrderCancel();\n };\n\n public setStatus = (status: UIElementStatus, props: DropinStatusProps = {}) => {\n this.setState({ status: { type: status, props } });\n };\n\n private setActivePaymentMethod = paymentMethod => {\n this.setState(prevState => ({\n activePaymentMethod: paymentMethod,\n cachedPaymentMethods: { ...prevState.cachedPaymentMethods, [paymentMethod._id]: true }\n }));\n };\n\n componentDidUpdate(prevProps, prevState) {\n if (prevState.status.type !== this.state.status.type && this.state.activePaymentMethod) {\n this.state.activePaymentMethod.setStatus(this.state.status.type);\n }\n\n if (this.state.status.type === 'ready' && prevState.status.type !== 'ready' && this.props.onReady) {\n this.props.onReady();\n }\n }\n\n private handleOnSelectPaymentMethod = paymentMethod => {\n const { activePaymentMethod } = this.state;\n\n this.setActivePaymentMethod(paymentMethod);\n\n // onSelect event\n if ((activePaymentMethod && activePaymentMethod._id !== paymentMethod._id) || !activePaymentMethod) {\n this.props.onSelect?.(paymentMethod);\n\n paymentMethod.submitAnalytics({ type: ANALYTICS_RENDERED_STR });\n }\n };\n\n private handleDisableStoredPaymentMethod = storedPaymentMethod => {\n this.setState({ isDisabling: true });\n\n new Promise((resolve, reject) => this.props.onDisableStoredPaymentMethod(storedPaymentMethod.props.storedPaymentMethodId, resolve, reject))\n .then(() => {\n this.setState(prevState => ({ elements: prevState.elements.filter(pm => pm._id !== storedPaymentMethod._id) }));\n this.setState({ isDisabling: false });\n })\n .catch(() => {\n this.setState({ isDisabling: false });\n });\n };\n\n closeActivePaymentMethod() {\n this.setState({ activePaymentMethod: null });\n }\n\n /**\n * getOnOrderCancel decides which onOrderCancel logic should be used, manual or sessions\n */\n private getOnOrderCancel = () => {\n if (this.props.onOrderCancel) {\n return (data: onOrderCancelData) => {\n const order = sanitizeOrder(data.order);\n new Promise<{ amount: PaymentAmount }>((resolve, reject) => {\n this.props.onOrderCancel({ order }, { resolve, reject });\n })\n .then(({ amount }) => this.props.elementRef.handleAdvanceFlowPaymentMethodsUpdate(null, amount))\n .catch(error => {\n throw new AdyenCheckoutError('NETWORK_ERROR', error);\n });\n };\n }\n if (this.props.session) {\n return (data: onOrderCancelData) =>\n this.props.session\n .cancelOrder(data)\n .then(() => this.props.core.update({ order: null }))\n .catch(error => {\n console.error(error);\n this.setStatus(error?.message || 'error');\n });\n }\n return null;\n };\n\n private onOrderCancel: (data: onOrderCancelData) => void;\n\n render(props, { elements, instantPaymentElements, storedPaymentElements, status, activePaymentMethod, cachedPaymentMethods }) {\n const isLoading = status.type === 'loading';\n const isRedirecting = status.type === 'redirect';\n const hasPaymentMethodsToBeDisplayed = elements?.length || instantPaymentElements?.length || storedPaymentElements?.length;\n\n switch (status.type) {\n case 'success':\n return <Status.Success message={props?.amount?.value === 0 ? 'resultMessages.preauthorized' : status.props?.message} />;\n\n case 'error':\n return <Status.Error message={status.props?.message} />;\n\n case 'custom':\n return status.props?.component?.render();\n\n default:\n return (\n <div className={`adyen-checkout__dropin adyen-checkout__dropin--${status.type}`}>\n {isRedirecting && status.props.component && status.props.component.render()}\n {isLoading && status.props && status.props.component && status.props.component.render()}\n {!!hasPaymentMethodsToBeDisplayed && (\n <PaymentMethodList\n isLoading={isLoading || isRedirecting}\n isDisablingPaymentMethod={this.state.isDisabling}\n paymentMethods={elements}\n instantPaymentMethods={instantPaymentElements}\n storedPaymentMethods={storedPaymentElements}\n activePaymentMethod={activePaymentMethod}\n cachedPaymentMethods={cachedPaymentMethods}\n order={this.props.order}\n orderStatus={this.state.orderStatus}\n onOrderCancel={this.onOrderCancel}\n onSelect={this.handleOnSelectPaymentMethod}\n openPaymentMethod={this.props.openPaymentMethod}\n openFirstPaymentMethod={this.props.openFirstPaymentMethod}\n openFirstStoredPaymentMethod={this.props.openFirstStoredPaymentMethod}\n onDisableStoredPaymentMethod={this.handleDisableStoredPaymentMethod}\n showRemovePaymentMethodButton={this.props.showRemovePaymentMethodButton}\n showRadioButton={this.props.showRadioButton}\n />\n )}\n </div>\n );\n }\n }\n}\n\nexport default DropinComponent;\n"],"names":["DropinComponent","Component","state","elements","instantPaymentElements","storedPaymentElements","orderStatus","isDisabling","status","type","props","undefined","activePaymentMethod","cachedPaymentMethods","componentDidMount","this","prepareDropinData","order","clientKey","loadingContext","storedElementsPromises","elementsPromises","instantPaymentsPromises","onCreateElements","orderStatusPromise","getOrderStatus","Promise","all","then","setState","setStatus","modules","analytics","sendAnalytics","ANALYTICS_RENDERED_STR","onOrderCancel","getOnOrderCancel","setActivePaymentMethod","paymentMethod","prevState","_id","componentDidUpdate","prevProps","onReady","handleOnSelectPaymentMethod","onSelect","submitAnalytics","handleDisableStoredPaymentMethod","storedPaymentMethod","resolve","reject","onDisableStoredPaymentMethod","storedPaymentMethodId","filter","pm","catch","closeActivePaymentMethod","data","sanitizeOrder","amount","elementRef","handleAdvanceFlowPaymentMethodsUpdate","error","AdyenCheckoutError","session","cancelOrder","core","update","console","message","render","isLoading","isRedirecting","hasPaymentMethodsToBeDisplayed","length","h","Status","Success","value","Error","component","div","className","PaymentMethodList","isDisablingPaymentMethod","paymentMethods","instantPaymentMethods","storedPaymentMethods","openPaymentMethod","openFirstPaymentMethod","openFirstStoredPaymentMethod","showRemovePaymentMethodButton","showRadioButton"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DropinComponent.js","sources":["../../../../../src/components/Dropin/components/DropinComponent.tsx"],"sourcesContent":["import { Component, h } from 'preact';\nimport PaymentMethodList from './PaymentMethod/PaymentMethodList';\nimport Status from './status';\nimport getOrderStatus from '../../../core/Services/order-status';\nimport { DropinComponentProps, DropinComponentState, DropinStatusProps, onOrderCancelData } from '../types';\nimport './DropinComponent.scss';\nimport { UIElementStatus } from '../../internal/UIElement/types';\nimport { sanitizeOrder } from '../../internal/UIElement/utils';\nimport { PaymentAmount } from '../../../types/global-types';\nimport { ANALYTICS_RENDERED_STR } from '../../../core/Analytics/constants';\nimport AdyenCheckoutError from '../../../core/Errors/AdyenCheckoutError';\n\nexport class DropinComponent extends Component<DropinComponentProps, DropinComponentState> {\n public state: DropinComponentState = {\n elements: [],\n instantPaymentElements: [],\n storedPaymentElements: [],\n orderStatus: null,\n isDisabling: false,\n status: { type: 'loading', props: undefined },\n activePaymentMethod: null,\n cachedPaymentMethods: {}\n };\n\n componentDidMount() {\n this.prepareDropinData();\n }\n\n public prepareDropinData = () => {\n const { order, clientKey, loadingContext } = this.props;\n const [storedElementsPromises, elementsPromises, instantPaymentsPromises] = this.props.onCreateElements();\n const orderStatusPromise = order ? getOrderStatus({ clientKey, loadingContext }, order) : null;\n\n void Promise.all([storedElementsPromises, elementsPromises, instantPaymentsPromises, orderStatusPromise]).then(\n ([storedPaymentElements, elements, instantPaymentElements, orderStatus]) => {\n this.setState({ instantPaymentElements, elements, storedPaymentElements, orderStatus });\n this.setStatus('ready');\n\n this.props.modules?.analytics.sendAnalytics('dropin', { type: ANALYTICS_RENDERED_STR });\n }\n );\n\n this.onOrderCancel = this.getOnOrderCancel();\n };\n\n public setStatus = (status: UIElementStatus, props: DropinStatusProps = {}) => {\n this.setState({ status: { type: status, props } });\n };\n\n private setActivePaymentMethod = paymentMethod => {\n this.setState(prevState => ({\n activePaymentMethod: paymentMethod,\n cachedPaymentMethods: { ...prevState.cachedPaymentMethods, [paymentMethod._id]: true }\n }));\n };\n\n componentDidUpdate(prevProps, prevState) {\n if (prevState.status.type !== this.state.status.type && this.state.activePaymentMethod) {\n this.state.activePaymentMethod.setStatus(this.state.status.type);\n }\n\n if (this.state.status.type === 'ready' && prevState.status.type !== 'ready' && this.props.onReady) {\n this.props.onReady();\n }\n }\n\n private handleOnSelectPaymentMethod = paymentMethod => {\n const { activePaymentMethod } = this.state;\n\n this.setActivePaymentMethod(paymentMethod);\n\n // onSelect event\n if ((activePaymentMethod && activePaymentMethod._id !== paymentMethod._id) || !activePaymentMethod) {\n this.props.onSelect?.(paymentMethod);\n\n paymentMethod.submitAnalytics({ type: ANALYTICS_RENDERED_STR });\n }\n };\n\n private handleDisableStoredPaymentMethod = storedPaymentMethod => {\n this.setState({ isDisabling: true });\n\n new Promise((resolve, reject) => this.props.onDisableStoredPaymentMethod(storedPaymentMethod.props.storedPaymentMethodId, resolve, reject))\n .then(() => {\n this.setState(prevState => ({\n storedPaymentElements: prevState.storedPaymentElements.filter(pm => pm._id !== storedPaymentMethod._id)\n }));\n this.setState({ isDisabling: false });\n })\n .catch(() => {\n this.setState({ isDisabling: false });\n });\n };\n\n closeActivePaymentMethod() {\n this.setState({ activePaymentMethod: null });\n }\n\n /**\n * getOnOrderCancel decides which onOrderCancel logic should be used, manual or sessions\n */\n private getOnOrderCancel = () => {\n if (this.props.onOrderCancel) {\n return (data: onOrderCancelData) => {\n const order = sanitizeOrder(data.order);\n new Promise<{ amount: PaymentAmount }>((resolve, reject) => {\n this.props.onOrderCancel({ order }, { resolve, reject });\n })\n .then(({ amount }) => this.props.elementRef.handleAdvanceFlowPaymentMethodsUpdate(null, amount))\n .catch(error => {\n throw new AdyenCheckoutError('NETWORK_ERROR', error);\n });\n };\n }\n if (this.props.session) {\n return (data: onOrderCancelData) =>\n this.props.session\n .cancelOrder(data)\n .then(() => this.props.core.update({ order: null }))\n .catch(error => {\n console.error(error);\n this.setStatus(error?.message || 'error');\n });\n }\n return null;\n };\n\n private onOrderCancel: (data: onOrderCancelData) => void;\n\n render(props, { elements, instantPaymentElements, storedPaymentElements, status, activePaymentMethod, cachedPaymentMethods }) {\n const isLoading = status.type === 'loading';\n const isRedirecting = status.type === 'redirect';\n const hasPaymentMethodsToBeDisplayed = elements?.length || instantPaymentElements?.length || storedPaymentElements?.length;\n\n switch (status.type) {\n case 'success':\n return <Status.Success message={props?.amount?.value === 0 ? 'resultMessages.preauthorized' : status.props?.message} />;\n\n case 'error':\n return <Status.Error message={status.props?.message} />;\n\n case 'custom':\n return status.props?.component?.render();\n\n default:\n return (\n <div className={`adyen-checkout__dropin adyen-checkout__dropin--${status.type}`}>\n {isRedirecting && status.props.component && status.props.component.render()}\n {isLoading && status.props && status.props.component && status.props.component.render()}\n {!!hasPaymentMethodsToBeDisplayed && (\n <PaymentMethodList\n isLoading={isLoading || isRedirecting}\n isDisablingPaymentMethod={this.state.isDisabling}\n paymentMethods={elements}\n instantPaymentMethods={instantPaymentElements}\n storedPaymentMethods={storedPaymentElements}\n activePaymentMethod={activePaymentMethod}\n cachedPaymentMethods={cachedPaymentMethods}\n order={this.props.order}\n orderStatus={this.state.orderStatus}\n onOrderCancel={this.onOrderCancel}\n onSelect={this.handleOnSelectPaymentMethod}\n openPaymentMethod={this.props.openPaymentMethod}\n openFirstPaymentMethod={this.props.openFirstPaymentMethod}\n openFirstStoredPaymentMethod={this.props.openFirstStoredPaymentMethod}\n onDisableStoredPaymentMethod={this.handleDisableStoredPaymentMethod}\n showRemovePaymentMethodButton={this.props.showRemovePaymentMethodButton}\n showRadioButton={this.props.showRadioButton}\n />\n )}\n </div>\n );\n }\n }\n}\n\nexport default DropinComponent;\n"],"names":["DropinComponent","Component","state","elements","instantPaymentElements","storedPaymentElements","orderStatus","isDisabling","status","type","props","undefined","activePaymentMethod","cachedPaymentMethods","componentDidMount","this","prepareDropinData","order","clientKey","loadingContext","storedElementsPromises","elementsPromises","instantPaymentsPromises","onCreateElements","orderStatusPromise","getOrderStatus","Promise","all","then","setState","setStatus","modules","analytics","sendAnalytics","ANALYTICS_RENDERED_STR","onOrderCancel","getOnOrderCancel","setActivePaymentMethod","paymentMethod","prevState","_id","componentDidUpdate","prevProps","onReady","handleOnSelectPaymentMethod","onSelect","submitAnalytics","handleDisableStoredPaymentMethod","storedPaymentMethod","resolve","reject","onDisableStoredPaymentMethod","storedPaymentMethodId","filter","pm","catch","closeActivePaymentMethod","data","sanitizeOrder","amount","elementRef","handleAdvanceFlowPaymentMethodsUpdate","error","AdyenCheckoutError","session","cancelOrder","core","update","console","message","render","isLoading","isRedirecting","hasPaymentMethodsToBeDisplayed","length","h","Status","Success","value","Error","component","div","className","PaymentMethodList","isDisablingPaymentMethod","paymentMethods","instantPaymentMethods","storedPaymentMethods","openPaymentMethod","openFirstPaymentMethod","openFirstStoredPaymentMethod","showRemovePaymentMethodButton","showRadioButton"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PaymentMethodItem.js","sources":["../../../../../../../src/components/Dropin/components/PaymentMethod/PaymentMethodItem/PaymentMethodItem.tsx"],"sourcesContent":["import { Component, h } from 'preact';\nimport classNames from 'classnames';\nimport PaymentMethodDetails from '../PaymentMethodDetails';\nimport PaymentMethodIcon from '../PaymentMethodIcon';\nimport DisableOneClickConfirmation from '../DisableOneClickConfirmation';\nimport './PaymentMethodItem.scss';\nimport UIElement from '../../../../internal/UIElement/UIElement';\nimport PaymentMethodBrands from '../PaymentMethodBrands/PaymentMethodBrands';\nimport { BRAND_ICON_UI_EXCLUSION_LIST } from '../../../../internal/SecuredFields/lib/constants';\nimport PaymentMethodName from '../PaymentMethodName';\nimport { ExpandButton } from './ExpandButton';\nimport { useCoreContext } from '../../../../../core/Context/CoreProvider';\n\nexport interface PaymentMethodItemProps {\n paymentMethod: UIElement;\n isSelected?: boolean;\n isLoaded?: boolean;\n isLoading?: boolean;\n isDisablingPaymentMethod: boolean;\n showRemovePaymentMethodButton: boolean;\n onDisableStoredPaymentMethod: (paymentMethod) => void;\n onSelect: (paymentMethod: UIElement) => void;\n standalone: boolean;\n className?: string;\n showRadioButton?: boolean;\n}\n\nclass PaymentMethodItem extends Component<PaymentMethodItemProps> {\n public static defaultProps = {\n paymentMethod: null,\n isSelected: false,\n isLoaded: false,\n isLoading: false,\n showDisableStoredPaymentMethodConfirmation: false,\n showRadioButton: false\n };\n\n public state = {\n showDisableStoredPaymentMethodConfirmation: false\n };\n\n public toggleDisableConfirmation = () => {\n this.setState({ showDisableStoredPaymentMethodConfirmation: !this.state.showDisableStoredPaymentMethodConfirmation });\n };\n\n public onDisableStoredPaymentMethod = () => {\n this.props.onDisableStoredPaymentMethod(this.props.paymentMethod);\n this.toggleDisableConfirmation();\n };\n\n private handleOnListItemClick = (): void => {\n const { onSelect, paymentMethod } = this.props;\n onSelect(paymentMethod);\n };\n\n // @ts-ignore need to refine the type for paymentMethod\n render({ paymentMethod, isSelected, isDisablingPaymentMethod, isLoaded, isLoading, standalone, showRadioButton }) {\n const { i18n } = useCoreContext();\n\n if (!paymentMethod) {\n return null;\n }\n\n const isCard = paymentMethod.props.type === 'card' || paymentMethod.props.type === 'scheme';\n\n const paymentMethodClassnames = classNames({\n 'adyen-checkout__payment-method': true,\n [`adyen-checkout__payment-method--${paymentMethod.props.type}`]: true,\n ...(isCard && { [`adyen-checkout__payment-method--${paymentMethod.props.fundingSource ?? 'credit'}`]: true }),\n 'adyen-checkout__payment-method--selected': isSelected,\n 'adyen-checkout__payment-method--loading': isLoading,\n 'adyen-checkout__payment-method--disabling': isDisablingPaymentMethod,\n 'adyen-checkout__payment-method--confirming': this.state.showDisableStoredPaymentMethodConfirmation,\n 'adyen-checkout__payment-method--standalone': standalone,\n [paymentMethod._id]: true,\n [this.props.className]: true\n });\n\n const showRemovePaymentMethodButton = this.props.showRemovePaymentMethodButton && paymentMethod.props.oneClick && isSelected;\n const disableConfirmationId = `remove-${paymentMethod._id}`;\n const containerId = `container-${paymentMethod._id}`;\n const buttonId = `button-${paymentMethod._id}`;\n\n const showBrands = !paymentMethod.props.oneClick && paymentMethod.brands && paymentMethod.brands.length > 0;\n\n return (\n <li key={paymentMethod._id} className={paymentMethodClassnames} onClick={this.handleOnListItemClick}>\n <div className=\"adyen-checkout__payment-method__header\">\n <ExpandButton buttonId={buttonId} showRadioButton={showRadioButton} isSelected={isSelected} expandContentId={containerId}>\n <PaymentMethodIcon\n // Only add alt attribute to storedPaymentMethods (to avoid SR reading the PM name twice)\n {...(paymentMethod.props.oneClick && { altDescription: paymentMethod.props.name })}\n type={paymentMethod.type}\n src={paymentMethod.icon}\n />\n\n <PaymentMethodName\n displayName={paymentMethod.displayName}\n isSelected={isSelected}\n additionalInfo={paymentMethod.additionalInfo}\n />\n </ExpandButton>\n\n {showRemovePaymentMethodButton && (\n <button\n type=\"button\"\n className=\"adyen-checkout__button adyen-checkout__button--inline adyen-checkout__button--link\"\n onClick={this.toggleDisableConfirmation}\n aria-expanded={this.state.showDisableStoredPaymentMethodConfirmation}\n aria-controls={disableConfirmationId}\n >\n {i18n.get('storedPaymentMethod.disable.button')}\n </button>\n )}\n\n {showBrands && (\n <PaymentMethodBrands\n brands={paymentMethod.brands}\n excludedUIBrands={BRAND_ICON_UI_EXCLUSION_LIST}\n isPaymentMethodSelected={isSelected}\n />\n )}\n </div>\n\n <div className=\"adyen-checkout-pm-details-wrapper\" aria-hidden={!isSelected}>\n <div className=\"adyen-checkout__payment-method__details\" id={containerId} role=\"region\">\n {showRemovePaymentMethodButton && (\n <DisableOneClickConfirmation\n id={disableConfirmationId}\n open={this.state.showDisableStoredPaymentMethodConfirmation}\n onDisable={this.onDisableStoredPaymentMethod}\n onCancel={this.toggleDisableConfirmation}\n />\n )}\n\n <PaymentMethodDetails paymentMethodComponent={paymentMethod.render()} isLoaded={isLoaded} />\n </div>\n </div>\n </li>\n );\n }\n}\n\nexport default PaymentMethodItem;\n"],"names":["PaymentMethodItem","Component","static","paymentMethod","isSelected","isLoaded","isLoading","showDisableStoredPaymentMethodConfirmation","showRadioButton","state","toggleDisableConfirmation","this","setState","onDisableStoredPaymentMethod","props","handleOnListItemClick","onSelect","render","isDisablingPaymentMethod","standalone","i18n","useCoreContext","isCard","type","paymentMethodClassnames","classNames","fundingSource","_id","className","showRemovePaymentMethodButton","oneClick","disableConfirmationId","containerId","buttonId","showBrands","brands","length","h","li","key","onClick","div","ExpandButton","expandContentId","PaymentMethodIcon","altDescription","name","src","icon","PaymentMethodName","displayName","additionalInfo","button","aria-expanded","aria-controls","get","PaymentMethodBrands","excludedUIBrands","BRAND_ICON_UI_EXCLUSION_LIST","isPaymentMethodSelected","aria-hidden","id","role","DisableOneClickConfirmation","open","onDisable","onCancel","PaymentMethodDetails","paymentMethodComponent"],"mappings":"+lBA2BA,MAAMA,UAA0BC,EAC5BC,oBAA6B,CACzBC,cAAe,KACfC,YAAY,EACZC,UAAU,EACVC,WAAW,EACXC,4CAA4C,EAC5CC,iBAAiB,GAGdC,MAAQ,CACXF,4CAA4C,GAGzCG,0BAA4B,KAC/BC,KAAKC,SAAS,CAAEL,4CAA6CI,KAAKF,MAAMF,4CAA2C,EAGhHM,6BAA+B,KAClCF,KAAKG,MAAMD,6BAA6BF,KAAKG,MAAMX,eACnDQ,KAAKD,2BAAyB,EAG1BK,sBAAwB,KAC5B,MAAMC,SAAEA,EAAQb,cAAEA,GAAkBQ,KAAKG,MACzCE,EAASb,EAAAA,EAIbc,MAAAA,EAAOd,cAAEA,EAAaC,WAAEA,EAAUc,yBAAEA,EAAwBb,SAAEA,EAAQC,UAAEA,EAASa,WAAEA,EAAUX,gBAAEA,IAC3F,MAAMY,KAAEA,GAASC,IAEjB,IAAKlB,EACD,OAAO,KAGX,MAAMmB,EAAsC,SAA7BnB,EAAcW,MAAMS,MAAgD,WAA7BpB,EAAcW,MAAMS,KAEpEC,EAA0BC,EAAW,CACvC,kCAAkC,EAClC,CAAC,mCAAmCtB,EAAcW,MAAMS,SAAS,KAC7DD,GAAU,CAAE,CAAC,mCAAmCnB,EAAcW,MAAMY,eAAiB,aAAa,GACtG,2CAA4CtB,EAC5C,0CAA2CE,EAC3C,4CAA6CY,EAC7C,6CAA8CP,KAAKF,MAAMF,2CACzD,6CAA8CY,EAC9C,CAAChB,EAAcwB,MAAM,EACrB,CAAChB,KAAKG,MAAMc,YAAY,IAGtBC,EAAgClB,KAAKG,MAAMe,+BAAiC1B,EAAcW,MAAMgB,UAAY1B,EAC5G2B,EAAwB,UAAU5B,EAAcwB,MAChDK,EAAc,aAAa7B,EAAcwB,MACzCM,EAAW,UAAU9B,EAAcwB,MAEnCO,GAAc/B,EAAcW,MAAMgB,UAAY3B,EAAcgC,QAAUhC,EAAcgC,OAAOC,OAAS,EAE1G,OACIC,EAACC,KAAAA,CAAGC,IAAKpC,EAAcwB,IAAKC,UAAWJ,EAAyBgB,QAAS7B,KAAKI,uBAC1EsB,EAACI,MAAAA,CAAIb,UAAU,0CACXS,EAACK,EAAAA,CAAaT,SAAUA,EAAUzB,gBAAiBA,EAAiBJ,WAAYA,EAAYuC,gBAAiBX,GACzGK,EAACO,EAAAA,IAEQzC,EAAcW,MAAMgB,UAAY,CAAEe,eAAgB1C,EAAcW,MAAMgC,MAC3EvB,KAAMpB,EAAcoB,KACpBwB,IAAK5C,EAAc6C,OAGvBX,EAACY,EAAAA,CACGC,YAAa/C,EAAc+C,YAC3B9C,WAAYA,EACZ+C,eAAgBhD,EAAcgD,kBAIrCtB,GACGQ,EAACe,SAAAA,CACG7B,KAAK,SACLK,UAAU,qFACVY,QAAS7B,KAAKD,0BACd2C,gBAAe1C,KAAKF,MAAMF,2CAC1B+C,gBAAevB,GAEdX,EAAKmC,IAAI,uCAIjBrB,GACGG,EAACmB,EAAAA,CACGrB,OAAQhC,EAAcgC,OACtBsB,iBAAkBC,EAClBC,wBAAyBvD,KAKrCiC,EAACI,MAAAA,CAAIb,UAAU,oCAAoCgC,eAAcxD,GAC7DiC,EAACI,MAAAA,CAAIb,UAAU,0CAA0CiC,GAAI7B,EAAa8B,KAAK,UAC1EjC,GACGQ,EAAC0B,EAAAA,CACGF,GAAI9B,EACJiC,KAAMrD,KAAKF,MAAMF,2CACjB0D,UAAWtD,KAAKE,6BAChBqD,SAAUvD,KAAKD,4BAIvB2B,EAAC8B,EAAAA,CAAqBC,uBAAwBjE,EAAcc,SAAUZ,SAAUA,MAKpG"}
|
|
1
|
+
{"version":3,"file":"PaymentMethodItem.js","sources":["../../../../../../../src/components/Dropin/components/PaymentMethod/PaymentMethodItem/PaymentMethodItem.tsx"],"sourcesContent":["import { Component, h } from 'preact';\nimport classNames from 'classnames';\nimport PaymentMethodDetails from '../PaymentMethodDetails';\nimport PaymentMethodIcon from '../PaymentMethodIcon';\nimport DisableOneClickConfirmation from '../DisableOneClickConfirmation';\nimport './PaymentMethodItem.scss';\nimport UIElement from '../../../../internal/UIElement/UIElement';\nimport PaymentMethodBrands from '../PaymentMethodBrands/PaymentMethodBrands';\nimport { BRAND_ICON_UI_EXCLUSION_LIST } from '../../../../internal/SecuredFields/lib/constants';\nimport PaymentMethodName from '../PaymentMethodName';\nimport { ExpandButton } from './ExpandButton';\nimport { useCoreContext } from '../../../../../core/Context/CoreProvider';\n\nexport interface PaymentMethodItemProps {\n paymentMethod: UIElement;\n isSelected?: boolean;\n isLoaded?: boolean;\n isLoading?: boolean;\n isDisablingPaymentMethod: boolean;\n showRemovePaymentMethodButton: boolean;\n onDisableStoredPaymentMethod: (paymentMethod) => void;\n onSelect: (paymentMethod: UIElement) => void;\n standalone: boolean;\n className?: string;\n showRadioButton?: boolean;\n}\n\nclass PaymentMethodItem extends Component<PaymentMethodItemProps> {\n public static defaultProps = {\n paymentMethod: null,\n isSelected: false,\n isLoaded: false,\n isLoading: false,\n showDisableStoredPaymentMethodConfirmation: false,\n showRadioButton: false\n };\n\n public state = {\n showDisableStoredPaymentMethodConfirmation: false\n };\n\n public toggleDisableConfirmation = () => {\n this.setState({ showDisableStoredPaymentMethodConfirmation: !this.state.showDisableStoredPaymentMethodConfirmation });\n };\n\n public onDisableStoredPaymentMethod = () => {\n this.props.onDisableStoredPaymentMethod(this.props.paymentMethod);\n this.toggleDisableConfirmation();\n };\n\n private handleOnListItemClick = (): void => {\n const { onSelect, paymentMethod } = this.props;\n onSelect(paymentMethod);\n };\n\n // @ts-ignore need to refine the type for paymentMethod\n render({ paymentMethod, isSelected, isDisablingPaymentMethod, isLoaded, isLoading, standalone, showRadioButton }) {\n const { i18n } = useCoreContext();\n\n if (!paymentMethod) {\n return null;\n }\n\n const isCard = paymentMethod.props.type === 'card' || paymentMethod.props.type === 'scheme';\n\n const paymentMethodClassnames = classNames({\n 'adyen-checkout__payment-method': true,\n [`adyen-checkout__payment-method--${paymentMethod.props.type}`]: true,\n ...(isCard && { [`adyen-checkout__payment-method--${paymentMethod.props.fundingSource ?? 'credit'}`]: true }),\n 'adyen-checkout__payment-method--selected': isSelected,\n 'adyen-checkout__payment-method--loading': isLoading,\n 'adyen-checkout__payment-method--disabling': isDisablingPaymentMethod,\n 'adyen-checkout__payment-method--confirming': this.state.showDisableStoredPaymentMethodConfirmation,\n 'adyen-checkout__payment-method--standalone': standalone,\n [paymentMethod._id]: true,\n [this.props.className]: true\n });\n\n const showRemovePaymentMethodButton = this.props.showRemovePaymentMethodButton && paymentMethod.props.oneClick && isSelected;\n const disableConfirmationId = `remove-${paymentMethod._id}`;\n const containerId = `container-${paymentMethod._id}`;\n const buttonId = `button-${paymentMethod._id}`;\n\n const showBrands = !paymentMethod.props.oneClick && paymentMethod.brands && paymentMethod.brands.length > 0;\n\n return (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-noninteractive-element-interactions\n <li key={paymentMethod._id} className={paymentMethodClassnames} onClick={this.handleOnListItemClick}>\n <div className=\"adyen-checkout__payment-method__header\">\n <ExpandButton buttonId={buttonId} showRadioButton={showRadioButton} isSelected={isSelected} expandContentId={containerId}>\n <PaymentMethodIcon\n // Only add alt attribute to storedPaymentMethods (to avoid SR reading the PM name twice)\n {...(paymentMethod.props.oneClick && { altDescription: paymentMethod.props.name })}\n type={paymentMethod.type}\n src={paymentMethod.icon}\n />\n\n <PaymentMethodName\n displayName={paymentMethod.displayName}\n isSelected={isSelected}\n additionalInfo={paymentMethod.additionalInfo}\n />\n </ExpandButton>\n\n {showRemovePaymentMethodButton && (\n <button\n type=\"button\"\n className=\"adyen-checkout__button adyen-checkout__button--inline adyen-checkout__button--link\"\n onClick={this.toggleDisableConfirmation}\n aria-expanded={this.state.showDisableStoredPaymentMethodConfirmation}\n aria-controls={disableConfirmationId}\n >\n {i18n.get('storedPaymentMethod.disable.button')}\n </button>\n )}\n\n {showBrands && (\n <PaymentMethodBrands\n brands={paymentMethod.brands}\n excludedUIBrands={BRAND_ICON_UI_EXCLUSION_LIST}\n isPaymentMethodSelected={isSelected}\n />\n )}\n </div>\n\n <div className=\"adyen-checkout-pm-details-wrapper\" aria-hidden={!isSelected}>\n <div className=\"adyen-checkout__payment-method__details\" id={containerId} role=\"region\">\n {showRemovePaymentMethodButton && (\n <DisableOneClickConfirmation\n id={disableConfirmationId}\n open={this.state.showDisableStoredPaymentMethodConfirmation}\n onDisable={this.onDisableStoredPaymentMethod}\n onCancel={this.toggleDisableConfirmation}\n />\n )}\n\n <PaymentMethodDetails paymentMethodComponent={paymentMethod.render()} isLoaded={isLoaded} />\n </div>\n </div>\n </li>\n );\n }\n}\n\nexport default PaymentMethodItem;\n"],"names":["PaymentMethodItem","Component","static","paymentMethod","isSelected","isLoaded","isLoading","showDisableStoredPaymentMethodConfirmation","showRadioButton","state","toggleDisableConfirmation","this","setState","onDisableStoredPaymentMethod","props","handleOnListItemClick","onSelect","render","isDisablingPaymentMethod","standalone","i18n","useCoreContext","isCard","type","paymentMethodClassnames","classNames","fundingSource","_id","className","showRemovePaymentMethodButton","oneClick","disableConfirmationId","containerId","buttonId","showBrands","brands","length","h","li","key","onClick","div","ExpandButton","expandContentId","PaymentMethodIcon","altDescription","name","src","icon","PaymentMethodName","displayName","additionalInfo","button","aria-expanded","aria-controls","get","PaymentMethodBrands","excludedUIBrands","BRAND_ICON_UI_EXCLUSION_LIST","isPaymentMethodSelected","aria-hidden","id","role","DisableOneClickConfirmation","open","onDisable","onCancel","PaymentMethodDetails","paymentMethodComponent"],"mappings":"+lBA2BA,MAAMA,UAA0BC,EAC5BC,oBAA6B,CACzBC,cAAe,KACfC,YAAY,EACZC,UAAU,EACVC,WAAW,EACXC,4CAA4C,EAC5CC,iBAAiB,GAGdC,MAAQ,CACXF,4CAA4C,GAGzCG,0BAA4B,KAC/BC,KAAKC,SAAS,CAAEL,4CAA6CI,KAAKF,MAAMF,4CAA2C,EAGhHM,6BAA+B,KAClCF,KAAKG,MAAMD,6BAA6BF,KAAKG,MAAMX,eACnDQ,KAAKD,2BAAyB,EAG1BK,sBAAwB,KAC5B,MAAMC,SAAEA,EAAQb,cAAEA,GAAkBQ,KAAKG,MACzCE,EAASb,EAAAA,EAIbc,MAAAA,EAAOd,cAAEA,EAAaC,WAAEA,EAAUc,yBAAEA,EAAwBb,SAAEA,EAAQC,UAAEA,EAASa,WAAEA,EAAUX,gBAAEA,IAC3F,MAAMY,KAAEA,GAASC,IAEjB,IAAKlB,EACD,OAAO,KAGX,MAAMmB,EAAsC,SAA7BnB,EAAcW,MAAMS,MAAgD,WAA7BpB,EAAcW,MAAMS,KAEpEC,EAA0BC,EAAW,CACvC,kCAAkC,EAClC,CAAC,mCAAmCtB,EAAcW,MAAMS,SAAS,KAC7DD,GAAU,CAAE,CAAC,mCAAmCnB,EAAcW,MAAMY,eAAiB,aAAa,GACtG,2CAA4CtB,EAC5C,0CAA2CE,EAC3C,4CAA6CY,EAC7C,6CAA8CP,KAAKF,MAAMF,2CACzD,6CAA8CY,EAC9C,CAAChB,EAAcwB,MAAM,EACrB,CAAChB,KAAKG,MAAMc,YAAY,IAGtBC,EAAgClB,KAAKG,MAAMe,+BAAiC1B,EAAcW,MAAMgB,UAAY1B,EAC5G2B,EAAwB,UAAU5B,EAAcwB,MAChDK,EAAc,aAAa7B,EAAcwB,MACzCM,EAAW,UAAU9B,EAAcwB,MAEnCO,GAAc/B,EAAcW,MAAMgB,UAAY3B,EAAcgC,QAAUhC,EAAcgC,OAAOC,OAAS,EAE1G,OAEIC,EAACC,KAAAA,CAAGC,IAAKpC,EAAcwB,IAAKC,UAAWJ,EAAyBgB,QAAS7B,KAAKI,uBAC1EsB,EAACI,MAAAA,CAAIb,UAAU,0CACXS,EAACK,EAAAA,CAAaT,SAAUA,EAAUzB,gBAAiBA,EAAiBJ,WAAYA,EAAYuC,gBAAiBX,GACzGK,EAACO,EAAAA,IAEQzC,EAAcW,MAAMgB,UAAY,CAAEe,eAAgB1C,EAAcW,MAAMgC,MAC3EvB,KAAMpB,EAAcoB,KACpBwB,IAAK5C,EAAc6C,OAGvBX,EAACY,EAAAA,CACGC,YAAa/C,EAAc+C,YAC3B9C,WAAYA,EACZ+C,eAAgBhD,EAAcgD,kBAIrCtB,GACGQ,EAACe,SAAAA,CACG7B,KAAK,SACLK,UAAU,qFACVY,QAAS7B,KAAKD,0BACd2C,gBAAe1C,KAAKF,MAAMF,2CAC1B+C,gBAAevB,GAEdX,EAAKmC,IAAI,uCAIjBrB,GACGG,EAACmB,EAAAA,CACGrB,OAAQhC,EAAcgC,OACtBsB,iBAAkBC,EAClBC,wBAAyBvD,KAKrCiC,EAACI,MAAAA,CAAIb,UAAU,oCAAoCgC,eAAcxD,GAC7DiC,EAACI,MAAAA,CAAIb,UAAU,0CAA0CiC,GAAI7B,EAAa8B,KAAK,UAC1EjC,GACGQ,EAAC0B,EAAAA,CACGF,GAAI9B,EACJiC,KAAMrD,KAAKF,MAAMF,2CACjB0D,UAAWtD,KAAKE,6BAChBqD,SAAUvD,KAAKD,4BAIvB2B,EAAC8B,EAAAA,CAAqBC,uBAAwBjE,EAAcc,SAAUZ,SAAUA,MAKpG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PaymentMethodsContainer.js","sources":["../../../../../../src/components/Dropin/components/PaymentMethod/PaymentMethodsContainer.tsx"],"sourcesContent":["import { h } from 'preact';\nimport PaymentMethodItem from './PaymentMethodItem/PaymentMethodItem';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport { useMemo } from 'preact/hooks';\nimport uuid from '../../../../utils/uuid';\nimport classNames from 'classnames';\nimport UIElement from '../../../internal/UIElement';\n\nexport interface PaymentMethodsContainerProps {\n label: string;\n classNameModifiers?: string[];\n paymentMethods: UIElement[];\n activePaymentMethod?: UIElement;\n /**\n * Map that keeps track of which Payment methods (UIElements) already got rendered in the UI\n */\n cachedPaymentMethods: Record<string, boolean>;\n showRemovePaymentMethodButton?: boolean;\n onSelect?: (paymentMethod: UIElement) => void;\n onDisableStoredPaymentMethod?: (storedPaymentMethod) => void;\n isDisablingPaymentMethod?: boolean;\n isLoading: boolean;\n showRadioButton?: boolean;\n}\n\nfunction PaymentMethodsContainer({\n label,\n classNameModifiers = [],\n paymentMethods = [],\n activePaymentMethod = null,\n cachedPaymentMethods = {},\n isLoading = false,\n isDisablingPaymentMethod = false,\n showRemovePaymentMethodButton,\n onDisableStoredPaymentMethod = () => {},\n onSelect,\n showRadioButton\n}: Readonly<PaymentMethodsContainerProps>) {\n const { i18n } = useCoreContext();\n const selectListId: string = useMemo(() => `select-${uuid()}`, []);\n const paymentMethodListClassnames = classNames([\n 'adyen-checkout__payment-methods-list',\n { 'adyen-checkout__payment-methods-list--loading': isLoading },\n ...classNameModifiers.map(m => `adyen-checkout__payment-methods-list--${m}`)\n ]);\n\n return (\n <div className=\"adyen-checkout-payment-methods-container\">\n {!!label.length && (\n <label htmlFor={selectListId} className=\"adyen-checkout-payment-methods-list-label\">\n {label}\n </label>\n )}\n <ul\n id={selectListId}\n className={paymentMethodListClassnames}\n role=\"radiogroup\"\n aria-label={i18n.get('paymentMethodsList.aria.label')}\n required\n >\n {paymentMethods.map((paymentMethod, index, paymentMethodsCollection) => {\n const isSelected = activePaymentMethod && activePaymentMethod._id === paymentMethod._id;\n const isLoaded = paymentMethod._id in cachedPaymentMethods;\n const isNextOneSelected =\n activePaymentMethod &&\n paymentMethodsCollection[index + 1] &&\n activePaymentMethod._id === paymentMethodsCollection[index + 1]._id;\n\n return (\n <PaymentMethodItem\n className={classNames({ 'adyen-checkout__payment-method--next-selected': isNextOneSelected })}\n standalone={paymentMethods.length === 1}\n paymentMethod={paymentMethod}\n isSelected={isSelected}\n isDisablingPaymentMethod={isSelected && isDisablingPaymentMethod}\n isLoaded={isLoaded}\n isLoading={isLoading}\n onSelect={onSelect}\n key={paymentMethod._id}\n showRemovePaymentMethodButton={showRemovePaymentMethodButton}\n showRadioButton={showRadioButton}\n onDisableStoredPaymentMethod={onDisableStoredPaymentMethod}\n />\n );\n })}\n </ul>\n </div>\n );\n}\n\nexport default PaymentMethodsContainer;\n"],"names":["PaymentMethodsContainer","label","classNameModifiers","paymentMethods","activePaymentMethod","cachedPaymentMethods","isLoading","isDisablingPaymentMethod","showRemovePaymentMethodButton","onDisableStoredPaymentMethod","onSelect","showRadioButton","i18n","useCoreContext","selectListId","useMemo","uuid","paymentMethodListClassnames","classNames","map","m","h","div","className","length","htmlFor","ul","id","role","aria-label","get","required","paymentMethod","index","paymentMethodsCollection","isSelected","_id","isLoaded","isNextOneSelected","PaymentMethodItem","standalone","key"],"mappings":"wXAyBA,SAASA,GAAwBC,MAC7BA,EAAKC,mBACLA,EAAqB,GAAEC,eACvBA,EAAiB,GAAEC,oBACnBA,EAAsB,KAAIC,qBAC1BA,EAAuB,CAAA,EAAEC,UACzBA,GAAY,EAAKC,yBACjBA,GAA2B,EAAKC,8BAChCA,EAA6BC,6BAC7BA,EAA+B,SAAQC,SACvCA,EAAQC,gBACRA,IAEA,MAAMC,KAAEA,GAASC,IACXC,EAAuBC,GAAQ,IAAM,UAAUC,OAAU,IACzDC,EAA8BC,EAAW,CAC3C,uCACA,CAAE,gDAAiDZ,MAChDJ,EAAmBiB,KAAIC,GAAK,yCAAyCA,QAG5E,OACIC,EAACC,MAAAA,CAAIC,UAAU,8CACRtB,EAAMuB,QACLH,EAACpB,QAAAA,CAAMwB,QAASX,EAAcS,UAAU,6CACnCtB,
|
|
1
|
+
{"version":3,"file":"PaymentMethodsContainer.js","sources":["../../../../../../src/components/Dropin/components/PaymentMethod/PaymentMethodsContainer.tsx"],"sourcesContent":["import { h } from 'preact';\nimport PaymentMethodItem from './PaymentMethodItem/PaymentMethodItem';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport { useMemo } from 'preact/hooks';\nimport uuid from '../../../../utils/uuid';\nimport classNames from 'classnames';\nimport UIElement from '../../../internal/UIElement';\n\nexport interface PaymentMethodsContainerProps {\n label: string;\n classNameModifiers?: string[];\n paymentMethods: UIElement[];\n activePaymentMethod?: UIElement;\n /**\n * Map that keeps track of which Payment methods (UIElements) already got rendered in the UI\n */\n cachedPaymentMethods: Record<string, boolean>;\n showRemovePaymentMethodButton?: boolean;\n onSelect?: (paymentMethod: UIElement) => void;\n onDisableStoredPaymentMethod?: (storedPaymentMethod) => void;\n isDisablingPaymentMethod?: boolean;\n isLoading: boolean;\n showRadioButton?: boolean;\n}\n\nfunction PaymentMethodsContainer({\n label,\n classNameModifiers = [],\n paymentMethods = [],\n activePaymentMethod = null,\n cachedPaymentMethods = {},\n isLoading = false,\n isDisablingPaymentMethod = false,\n showRemovePaymentMethodButton,\n onDisableStoredPaymentMethod = () => {},\n onSelect,\n showRadioButton\n}: Readonly<PaymentMethodsContainerProps>) {\n const { i18n } = useCoreContext();\n const selectListId: string = useMemo(() => `select-${uuid()}`, []);\n const paymentMethodListClassnames = classNames([\n 'adyen-checkout__payment-methods-list',\n { 'adyen-checkout__payment-methods-list--loading': isLoading },\n ...classNameModifiers.map(m => `adyen-checkout__payment-methods-list--${m}`)\n ]);\n\n return (\n <div className=\"adyen-checkout-payment-methods-container\">\n {!!label.length && (\n <label htmlFor={selectListId} className=\"adyen-checkout-payment-methods-list-label\">\n {label}\n </label>\n )}\n {/* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */}\n <ul\n id={selectListId}\n className={paymentMethodListClassnames}\n role=\"radiogroup\"\n aria-label={i18n.get('paymentMethodsList.aria.label')}\n required\n >\n {paymentMethods.map((paymentMethod, index, paymentMethodsCollection) => {\n const isSelected = activePaymentMethod && activePaymentMethod._id === paymentMethod._id;\n const isLoaded = paymentMethod._id in cachedPaymentMethods;\n const isNextOneSelected =\n activePaymentMethod &&\n paymentMethodsCollection[index + 1] &&\n activePaymentMethod._id === paymentMethodsCollection[index + 1]._id;\n\n return (\n <PaymentMethodItem\n className={classNames({ 'adyen-checkout__payment-method--next-selected': isNextOneSelected })}\n standalone={paymentMethods.length === 1}\n paymentMethod={paymentMethod}\n isSelected={isSelected}\n isDisablingPaymentMethod={isSelected && isDisablingPaymentMethod}\n isLoaded={isLoaded}\n isLoading={isLoading}\n onSelect={onSelect}\n key={paymentMethod._id}\n showRemovePaymentMethodButton={showRemovePaymentMethodButton}\n showRadioButton={showRadioButton}\n onDisableStoredPaymentMethod={onDisableStoredPaymentMethod}\n />\n );\n })}\n </ul>\n </div>\n );\n}\n\nexport default PaymentMethodsContainer;\n"],"names":["PaymentMethodsContainer","label","classNameModifiers","paymentMethods","activePaymentMethod","cachedPaymentMethods","isLoading","isDisablingPaymentMethod","showRemovePaymentMethodButton","onDisableStoredPaymentMethod","onSelect","showRadioButton","i18n","useCoreContext","selectListId","useMemo","uuid","paymentMethodListClassnames","classNames","map","m","h","div","className","length","htmlFor","ul","id","role","aria-label","get","required","paymentMethod","index","paymentMethodsCollection","isSelected","_id","isLoaded","isNextOneSelected","PaymentMethodItem","standalone","key"],"mappings":"wXAyBA,SAASA,GAAwBC,MAC7BA,EAAKC,mBACLA,EAAqB,GAAEC,eACvBA,EAAiB,GAAEC,oBACnBA,EAAsB,KAAIC,qBAC1BA,EAAuB,CAAA,EAAEC,UACzBA,GAAY,EAAKC,yBACjBA,GAA2B,EAAKC,8BAChCA,EAA6BC,6BAC7BA,EAA+B,SAAQC,SACvCA,EAAQC,gBACRA,IAEA,MAAMC,KAAEA,GAASC,IACXC,EAAuBC,GAAQ,IAAM,UAAUC,OAAU,IACzDC,EAA8BC,EAAW,CAC3C,uCACA,CAAE,gDAAiDZ,MAChDJ,EAAmBiB,KAAIC,GAAK,yCAAyCA,QAG5E,OACIC,EAACC,MAAAA,CAAIC,UAAU,8CACRtB,EAAMuB,QACLH,EAACpB,QAAAA,CAAMwB,QAASX,EAAcS,UAAU,6CACnCtB,GAIToB,EAACK,KAAAA,CACGC,GAAIb,EACJS,UAAWN,EACXW,KAAK,aACLC,aAAYjB,EAAKkB,IAAI,iCACrBC,UAAAA,GAEC5B,EAAegB,KAAI,CAACa,EAAeC,EAAOC,KACvC,MAAMC,EAAa/B,GAAuBA,EAAoBgC,MAAQJ,EAAcI,IAC9EC,EAAWL,EAAcI,OAAO/B,EAChCiC,EACFlC,GACA8B,EAAyBD,EAAQ,IACjC7B,EAAoBgC,MAAQF,EAAyBD,EAAQ,GAAGG,IAEpE,OACIf,EAACkB,EAAAA,CACGhB,UAAWL,EAAW,CAAE,gDAAiDoB,IACzEE,WAAsC,IAA1BrC,EAAeqB,OAC3BQ,cAAeA,EACfG,WAAYA,EACZ5B,yBAA0B4B,GAAc5B,EACxC8B,SAAUA,EACV/B,UAAWA,EACXI,SAAUA,EACV+B,IAAKT,EAAcI,IACnB5B,8BAA+BA,EAC/BG,gBAAiBA,EACjBF,6BAA8BA,QAO1D"}
|