@adyen/adyen-web 6.47.0-alpha.41c41fe → 6.47.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/adyen.css +10 -10
- 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 -12
- package/dist/es/adyen.css +10 -10
- package/dist/es/adyen.css.map +1 -1
- package/dist/es/components/Dropin/components/PaymentMethod/DisableOneClickConfirmation.js +1 -1
- package/dist/es/components/Dropin/components/PaymentMethod/DisableOneClickConfirmation.js.map +1 -1
- package/dist/es/components/Dropin/components/PaymentMethod/PaymentMethodItem/PaymentMethodItem.js +1 -1
- package/dist/es/components/Dropin/components/PaymentMethod/PaymentMethodItem/PaymentMethodItem.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/Giftcard/types.js +2 -0
- package/dist/es/components/Giftcard/types.js.map +1 -0
- package/dist/es/components/Giftcard/utils.js +2 -0
- package/dist/es/components/Giftcard/utils.js.map +1 -0
- package/dist/es/components/internal/Address/components/CountryField.js +1 -1
- package/dist/es/components/internal/Address/components/CountryField.js.map +1 -1
- package/dist/es/components/internal/Address/components/StateField.js +1 -1
- package/dist/es/components/internal/Address/components/StateField.js.map +1 -1
- package/dist/es/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePasswordInput/CtPResendOtpLink.js +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 +1 -1
- package/dist/es/components/internal/ClickToPay/components/CtPSection/CtPLogoutLink.js.map +1 -1
- package/dist/es/components/internal/SecuredFields/lib/securedField/utils/processAriaConfig.js +1 -1
- package/dist/es/components/internal/SecuredFields/lib/securedField/utils/processAriaConfig.js.map +1 -1
- package/dist/es/components/internal/UIElement/UIElement.js.map +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/index.d.ts +57 -12
- package/dist/es/language/Language.js +1 -1
- package/dist/es/language/Language.js.map +1 -1
- package/dist/es/language/utils.js +1 -1
- package/dist/es/language/utils.js.map +1 -1
- package/dist/es/utils/amount-util.js +1 -1
- package/dist/es/utils/amount-util.js.map +1 -1
- package/dist/es-legacy/adyen.css +10 -10
- package/dist/es-legacy/adyen.css.map +1 -1
- package/dist/es-legacy/components/Dropin/components/PaymentMethod/DisableOneClickConfirmation.js +1 -1
- package/dist/es-legacy/components/Dropin/components/PaymentMethod/DisableOneClickConfirmation.js.map +1 -1
- package/dist/es-legacy/components/Dropin/components/PaymentMethod/PaymentMethodItem/PaymentMethodItem.js +1 -1
- package/dist/es-legacy/components/Dropin/components/PaymentMethod/PaymentMethodItem/PaymentMethodItem.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/Giftcard/types.js +2 -0
- package/dist/es-legacy/components/Giftcard/types.js.map +1 -0
- package/dist/es-legacy/components/Giftcard/utils.js +2 -0
- package/dist/es-legacy/components/Giftcard/utils.js.map +1 -0
- package/dist/es-legacy/components/internal/Address/components/CountryField.js +1 -1
- package/dist/es-legacy/components/internal/Address/components/CountryField.js.map +1 -1
- package/dist/es-legacy/components/internal/Address/components/StateField.js +1 -1
- package/dist/es-legacy/components/internal/Address/components/StateField.js.map +1 -1
- package/dist/es-legacy/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePasswordInput/CtPResendOtpLink.js +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 +1 -1
- package/dist/es-legacy/components/internal/ClickToPay/components/CtPSection/CtPLogoutLink.js.map +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/securedField/utils/processAriaConfig.js +1 -1
- package/dist/es-legacy/components/internal/SecuredFields/lib/securedField/utils/processAriaConfig.js.map +1 -1
- package/dist/es-legacy/components/internal/UIElement/UIElement.js.map +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/language/Language.js +1 -1
- package/dist/es-legacy/language/Language.js.map +1 -1
- package/dist/es-legacy/language/utils.js +1 -1
- package/dist/es-legacy/language/utils.js.map +1 -1
- package/dist/es-legacy/utils/amount-util.js +1 -1
- package/dist/es-legacy/utils/amount-util.js.map +1 -1
- package/package.json +25 -25
- package/styles/adyen.css +10 -10
package/dist/es-legacy/components/Dropin/components/PaymentMethod/DisableOneClickConfirmation.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as
|
|
1
|
+
import{createElement as e}from"../../../../external/preact/dist/preact.js";import o from"../../../../_virtual/index.js";import{useCoreContext as t}from"../../../../core/Context/CoreProvider.js";import n from"../../../internal/Button/Button.js";import{stopPropagationForActionKeys as a}from"../../../internal/Button/stopPropagationForActionKeys.js";const i=({id:i,open:r,onDisable:d,onCancel:s})=>{const{i18n:c}=t();return e("div",{id:i,"aria-hidden":!r,className:o({"adyen-checkout__payment-method__disable-confirmation":!0,"adyen-checkout__payment-method__disable-confirmation--open":r})},e("div",{className:"adyen-checkout__payment-method__disable-confirmation__content"},c.get("storedPaymentMethod.disable.confirmation"),e("div",{className:"adyen-checkout__payment-method__disable-confirmation__buttons"},e(n,{classNameModifiers:["disable-confirmation","disable-confirmation-remove"],disabled:!r,onClick:d,onKeyDown:a,label:c.get("storedPaymentMethod.disable.confirmButton")}),e(n,{classNameModifiers:["disable-confirmation","disable-confirmation-cancel"],disabled:!r,onClick:s,onKeyDown:a,label:c.get("storedPaymentMethod.disable.cancelButton")}))))};export{i as default};
|
|
2
2
|
//# sourceMappingURL=DisableOneClickConfirmation.js.map
|
package/dist/es-legacy/components/Dropin/components/PaymentMethod/DisableOneClickConfirmation.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DisableOneClickConfirmation.js","sources":["../../../../../../src/components/Dropin/components/PaymentMethod/DisableOneClickConfirmation.tsx"],"sourcesContent":["import { h } from 'preact';\nimport classNames from 'classnames';\n\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport { stopPropagationForActionKeys } from '../../../internal/Button/stopPropagationForActionKeys';\nimport './DisableOneClickConfirmation.scss';\n\nconst DisableOneClickConfirmation = ({ id, open, onDisable, onCancel }) => {\n const { i18n } = useCoreContext();\n return (\n <div\n id={id}\n aria-hidden={!open}\n className={classNames({\n 'adyen-checkout__payment-method__disable-confirmation': true,\n 'adyen-checkout__payment-method__disable-confirmation--open': open\n })}\n >\n <div className=\"adyen-checkout__payment-method__disable-confirmation__content\">\n {i18n.get('storedPaymentMethod.disable.confirmation')}\n <div className=\"adyen-checkout__payment-method__disable-confirmation__buttons\">\n <
|
|
1
|
+
{"version":3,"file":"DisableOneClickConfirmation.js","sources":["../../../../../../src/components/Dropin/components/PaymentMethod/DisableOneClickConfirmation.tsx"],"sourcesContent":["import { h } from 'preact';\nimport classNames from 'classnames';\n\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport Button from '../../../internal/Button';\nimport { stopPropagationForActionKeys } from '../../../internal/Button/stopPropagationForActionKeys';\nimport './DisableOneClickConfirmation.scss';\n\nconst DisableOneClickConfirmation = ({ id, open, onDisable, onCancel }) => {\n const { i18n } = useCoreContext();\n return (\n <div\n id={id}\n aria-hidden={!open}\n className={classNames({\n 'adyen-checkout__payment-method__disable-confirmation': true,\n 'adyen-checkout__payment-method__disable-confirmation--open': open\n })}\n >\n <div className=\"adyen-checkout__payment-method__disable-confirmation__content\">\n {i18n.get('storedPaymentMethod.disable.confirmation')}\n <div className=\"adyen-checkout__payment-method__disable-confirmation__buttons\">\n <Button\n classNameModifiers={['disable-confirmation', 'disable-confirmation-remove']}\n disabled={!open}\n onClick={onDisable}\n onKeyDown={stopPropagationForActionKeys}\n label={i18n.get('storedPaymentMethod.disable.confirmButton')}\n />\n <Button\n classNameModifiers={['disable-confirmation', 'disable-confirmation-cancel']}\n disabled={!open}\n onClick={onCancel}\n onKeyDown={stopPropagationForActionKeys}\n label={i18n.get('storedPaymentMethod.disable.cancelButton')}\n />\n </div>\n </div>\n </div>\n );\n};\n\nexport default DisableOneClickConfirmation;\n"],"names":["DisableOneClickConfirmation","id","open","onDisable","onCancel","i18n","useCoreContext","h","div","aria-hidden","className","classNames","get","Button","classNameModifiers","disabled","onClick","onKeyDown","stopPropagationForActionKeys","label"],"mappings":"4VAQA,MAAMA,EAA8B,EAAGC,KAAIC,OAAMC,YAAWC,eACxD,MAAMC,KAAEA,GAASC,IACjB,OACIC,EAACC,MAAAA,CACGP,GAAIA,EACJQ,eAAcP,EACdQ,UAAWC,EAAW,CAClB,wDAAwD,EACxD,6DAA8DT,KAGlEK,EAACC,MAAAA,CAAIE,UAAU,iEACVL,EAAKO,IAAI,4CACVL,EAACC,MAAAA,CAAIE,UAAU,iEACXH,EAACM,EAAAA,CACGC,mBAAoB,CAAC,uBAAwB,+BAC7CC,UAAWb,EACXc,QAASb,EACTc,UAAWC,EACXC,MAAOd,EAAKO,IAAI,+CAEpBL,EAACM,EAAAA,CACGC,mBAAoB,CAAC,uBAAwB,+BAC7CC,UAAWb,EACXc,QAASZ,EACTa,UAAWC,EACXC,MAAOd,EAAKO,IAAI"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Component as e,createElement as t}from"../../../../../external/preact/dist/preact.js";import o from"../../../../../_virtual/index.js";import{PaymentMethodDetails as n}from"../PaymentMethodDetails.js";import a from"../PaymentMethodIcon.js";import i from"../DisableOneClickConfirmation.js";import r from"../PaymentMethodBrands/PaymentMethodBrands.js";import{BRAND_ICON_UI_EXCLUSION_LIST as s}from"../../../../internal/SecuredFields/lib/constants.js";import d from"../PaymentMethodName.js";import{useCoreContext as m}from"../../../../../core/Context/CoreProvider.js";import p from"../../../../internal/ExpandButton/ExpandButton.js";import{getFullBrandName as c}from"../../../../Card/components/CardInput/utils.js";import{stopPropagationForActionKeys as l}from"../../../../internal/Button/stopPropagationForActionKeys.js";import h from"../../../../internal/Button/Button.js";function y(e,t,o){return t in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e}function u(e){for(var t=1;t<arguments.length;t++){var o=null!=arguments[t]?arguments[t]:{},n=Object.keys(o);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(o).filter(function(e){return Object.getOwnPropertyDescriptor(o,e).enumerable}))),n.forEach(function(t){y(e,t,o[t])})}return e}function b(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t.push.apply(t,o)}return t}(Object(t)).forEach(function(o){Object.defineProperty(e,o,Object.getOwnPropertyDescriptor(t,o))}),e}class f extends e{render({paymentMethod:e,isSelected:y,isDisablingPaymentMethod:f,isLoading:_,standalone:P,showRadioButton:C}){var O;const{i18n:g}=m();if(!e)return null;const j="card"===e.props.type||"scheme"===e.props.type,k=o(b(u({"adyen-checkout__payment-method":!0,[`adyen-checkout__payment-method--${e.props.type}`]:!0},j&&{[`adyen-checkout__payment-method--${null!==(O=e.props.fundingSource)&&void 0!==O?O:"credit"}`]:!0}),{"adyen-checkout__payment-method--selected":y,"adyen-checkout__payment-method--loading":_,"adyen-checkout__payment-method--disabling":f,"adyen-checkout__payment-method--confirming":this.state.showDisableStoredPaymentMethodConfirmation,"adyen-checkout__payment-method--standalone":P,[e._id]:!0,[this.props.className]:!0})),w=this.props.showRemovePaymentMethodButton&&e.props.oneClick&&y,M=`remove-${e._id}`,S=`container-${e._id}`,D=`button-${e._id}`,v=!e.props.oneClick&&e.brands&&e.brands.length>0;return t("div",{key:e._id,className:k,onClick:this.handleOnListItemClick},t("div",{className:"adyen-checkout__payment-method__header"},t(p,{className:"adyen-checkout__payment-method__header__content",buttonId:D,showRadioButton:C,isSelected:y,expandContentId:S,standalone:P},t(a,b(u({},e.props.oneClick&&{alt:c(e.props.brand)}),{type:e.type,src:e.icon})),t("div",{className:"adyen-checkout__payment-method__header__details"},t(d,{displayName:e.displayName,isSelected:y,additionalInfo:e.additionalInfo}),v&&t(r,{showOtherInsteadOfNumber:e.props.showOtherInsteadOfNumber,keepBrandsVisible:e.props.keepBrandsVisible,brands:e.brands,excludedUIBrands:s,isPaymentMethodSelected:y}))),w&&t(h,{inline:!0,variant:"link",onClick:this.toggleDisableConfirmation,onKeyDown:l,ariaExpanded:this.state.showDisableStoredPaymentMethodConfirmation,ariaControls:M}
|
|
1
|
+
import{Component as e,createElement as t}from"../../../../../external/preact/dist/preact.js";import o from"../../../../../_virtual/index.js";import{PaymentMethodDetails as n}from"../PaymentMethodDetails.js";import a from"../PaymentMethodIcon.js";import i from"../DisableOneClickConfirmation.js";import r from"../PaymentMethodBrands/PaymentMethodBrands.js";import{BRAND_ICON_UI_EXCLUSION_LIST as s}from"../../../../internal/SecuredFields/lib/constants.js";import d from"../PaymentMethodName.js";import{useCoreContext as m}from"../../../../../core/Context/CoreProvider.js";import p from"../../../../internal/ExpandButton/ExpandButton.js";import{getFullBrandName as c}from"../../../../Card/components/CardInput/utils.js";import{stopPropagationForActionKeys as l}from"../../../../internal/Button/stopPropagationForActionKeys.js";import h from"../../../../internal/Button/Button.js";function y(e,t,o){return t in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e}function u(e){for(var t=1;t<arguments.length;t++){var o=null!=arguments[t]?arguments[t]:{},n=Object.keys(o);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(o).filter(function(e){return Object.getOwnPropertyDescriptor(o,e).enumerable}))),n.forEach(function(t){y(e,t,o[t])})}return e}function b(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t.push.apply(t,o)}return t}(Object(t)).forEach(function(o){Object.defineProperty(e,o,Object.getOwnPropertyDescriptor(t,o))}),e}class f extends e{render({paymentMethod:e,isSelected:y,isDisablingPaymentMethod:f,isLoading:_,standalone:P,showRadioButton:C}){var O;const{i18n:g}=m();if(!e)return null;const j="card"===e.props.type||"scheme"===e.props.type,k=o(b(u({"adyen-checkout__payment-method":!0,[`adyen-checkout__payment-method--${e.props.type}`]:!0},j&&{[`adyen-checkout__payment-method--${null!==(O=e.props.fundingSource)&&void 0!==O?O:"credit"}`]:!0}),{"adyen-checkout__payment-method--selected":y,"adyen-checkout__payment-method--loading":_,"adyen-checkout__payment-method--disabling":f,"adyen-checkout__payment-method--confirming":this.state.showDisableStoredPaymentMethodConfirmation,"adyen-checkout__payment-method--standalone":P,[e._id]:!0,[this.props.className]:!0})),w=this.props.showRemovePaymentMethodButton&&e.props.oneClick&&y,M=`remove-${e._id}`,S=`container-${e._id}`,D=`button-${e._id}`,v=!e.props.oneClick&&e.brands&&e.brands.length>0;return t("div",{key:e._id,className:k,onClick:this.handleOnListItemClick},t("div",{className:"adyen-checkout__payment-method__header"},t(p,{className:"adyen-checkout__payment-method__header__content",buttonId:D,showRadioButton:C,isSelected:y,expandContentId:S,standalone:P},t(a,b(u({},e.props.oneClick&&{alt:c(e.props.brand)}),{type:e.type,src:e.icon})),t("div",{className:"adyen-checkout__payment-method__header__details"},t(d,{displayName:e.displayName,isSelected:y,additionalInfo:e.additionalInfo}),v&&t(r,{showOtherInsteadOfNumber:e.props.showOtherInsteadOfNumber,keepBrandsVisible:e.props.keepBrandsVisible,brands:e.brands,excludedUIBrands:s,isPaymentMethodSelected:y}))),w&&t(h,{inline:!0,variant:"link",label:g.get("storedPaymentMethod.disable.button"),onClick:this.toggleDisableConfirmation,onKeyDown:l,ariaExpanded:this.state.showDisableStoredPaymentMethodConfirmation,ariaControls:M})),t("div",{className:"adyen-checkout-pm-details-wrapper","aria-hidden":!y},t("div",{className:"adyen-checkout__payment-method__details",id:S,inert:!y||void 0},w&&t(i,{id:M,open:this.state.showDisableStoredPaymentMethodConfirmation,onDisable:this.onDisableStoredPaymentMethod,onCancel:this.toggleDisableConfirmation}),t(n,{paymentMethodComponent:e,isSelected:y}))))}constructor(...e){super(...e),y(this,"state",{showDisableStoredPaymentMethodConfirmation:!1}),y(this,"toggleDisableConfirmation",()=>{this.setState({showDisableStoredPaymentMethodConfirmation:!this.state.showDisableStoredPaymentMethodConfirmation})}),y(this,"onDisableStoredPaymentMethod",()=>{this.props.onDisableStoredPaymentMethod(this.props.paymentMethod),this.toggleDisableConfirmation()}),y(this,"handleOnListItemClick",()=>{const{onSelect:e,paymentMethod:t}=this.props;e(t)})}}y(f,"defaultProps",{paymentMethod:null,isSelected:!1,isLoaded:!1,isLoading:!1,showDisableStoredPaymentMethodConfirmation:!1,showRadioButton:!1});export{f as default};
|
|
2
2
|
//# sourceMappingURL=PaymentMethodItem.js.map
|
|
@@ -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';\n\nimport { PaymentMethodDetails } from '../PaymentMethodDetails';\nimport PaymentMethodIcon from '../PaymentMethodIcon';\nimport DisableOneClickConfirmation from '../DisableOneClickConfirmation';\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 { useCoreContext } from '../../../../../core/Context/CoreProvider';\nimport ExpandButton from '../../../../internal/ExpandButton';\nimport { getFullBrandName } from '../../../../Card/components/CardInput/utils';\nimport { stopPropagationForActionKeys } from '../../../../internal/Button/stopPropagationForActionKeys';\nimport './PaymentMethodItem.scss';\nimport Button from '../../../../internal/Button';\n\nexport interface PaymentMethodItemProps {\n paymentMethod: UIElement;\n isSelected?: 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<Readonly<PaymentMethodItemProps>> {\n public static readonly 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 readonly 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, 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-static-element-interactions\n <div key={paymentMethod._id} className={paymentMethodClassnames} onClick={this.handleOnListItemClick}>\n <div className=\"adyen-checkout__payment-method__header\">\n <ExpandButton\n className=\"adyen-checkout__payment-method__header__content\"\n buttonId={buttonId}\n showRadioButton={showRadioButton}\n isSelected={isSelected}\n expandContentId={containerId}\n standalone={standalone}\n >\n <PaymentMethodIcon\n // Only add alt attribute to storedPaymentMethods (to avoid SR reading the PM name twice)\n {...(paymentMethod.props.oneClick && { alt: getFullBrandName(paymentMethod.props.brand) })}\n type={paymentMethod.type}\n src={paymentMethod.icon}\n />\n\n <div className=\"adyen-checkout__payment-method__header__details\">\n <PaymentMethodName\n displayName={paymentMethod.displayName}\n isSelected={isSelected}\n additionalInfo={paymentMethod.additionalInfo}\n />\n {showBrands && (\n <PaymentMethodBrands\n showOtherInsteadOfNumber={paymentMethod.props.showOtherInsteadOfNumber}\n keepBrandsVisible={paymentMethod.props.keepBrandsVisible}\n brands={paymentMethod.brands}\n excludedUIBrands={BRAND_ICON_UI_EXCLUSION_LIST}\n isPaymentMethodSelected={isSelected}\n />\n )}\n </div>\n </ExpandButton>\n\n {showRemovePaymentMethodButton && (\n <Button\n inline\n variant=\"link\"\n onClick={this.toggleDisableConfirmation}\n onKeyDown={stopPropagationForActionKeys}\n ariaExpanded={this.state.showDisableStoredPaymentMethodConfirmation}\n ariaControls={disableConfirmationId}\n >\n {i18n.get('storedPaymentMethod.disable.button')}\n </Button>\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} inert={isSelected ? undefined : true}>\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} isSelected={isSelected} />\n </div>\n </div>\n </div>\n );\n }\n}\n\nexport default PaymentMethodItem;\n"],"names":["PaymentMethodItem","Component","render","paymentMethod","isSelected","isDisablingPaymentMethod","isLoading","standalone","showRadioButton","i18n","useCoreContext","isCard","props","type","paymentMethodClassnames","classNames","_object_spread_props","_object_spread","fundingSource","this","state","showDisableStoredPaymentMethodConfirmation","_id","className","showRemovePaymentMethodButton","oneClick","disableConfirmationId","containerId","buttonId","showBrands","brands","length","h","div","key","onClick","handleOnListItemClick","ExpandButton","expandContentId","PaymentMethodIcon","alt","getFullBrandName","brand","src","icon","PaymentMethodName","displayName","additionalInfo","PaymentMethodBrands","showOtherInsteadOfNumber","keepBrandsVisible","excludedUIBrands","BRAND_ICON_UI_EXCLUSION_LIST","isPaymentMethodSelected","Button","inline","variant","toggleDisableConfirmation","onKeyDown","stopPropagationForActionKeys","ariaExpanded","ariaControls","get","aria-hidden","id","inert","undefined","DisableOneClickConfirmation","open","onDisable","onDisableStoredPaymentMethod","onCancel","PaymentMethodDetails","paymentMethodComponent","super","args","_define_property","setState","onSelect","defaultProps","isLoaded"],"mappings":"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"}
|
|
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';\n\nimport { PaymentMethodDetails } from '../PaymentMethodDetails';\nimport PaymentMethodIcon from '../PaymentMethodIcon';\nimport DisableOneClickConfirmation from '../DisableOneClickConfirmation';\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 { useCoreContext } from '../../../../../core/Context/CoreProvider';\nimport ExpandButton from '../../../../internal/ExpandButton';\nimport { getFullBrandName } from '../../../../Card/components/CardInput/utils';\nimport { stopPropagationForActionKeys } from '../../../../internal/Button/stopPropagationForActionKeys';\nimport './PaymentMethodItem.scss';\nimport Button from '../../../../internal/Button';\n\nexport interface PaymentMethodItemProps {\n paymentMethod: UIElement;\n isSelected?: 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<Readonly<PaymentMethodItemProps>> {\n public static readonly 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 readonly 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, 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-static-element-interactions\n <div key={paymentMethod._id} className={paymentMethodClassnames} onClick={this.handleOnListItemClick}>\n <div className=\"adyen-checkout__payment-method__header\">\n <ExpandButton\n className=\"adyen-checkout__payment-method__header__content\"\n buttonId={buttonId}\n showRadioButton={showRadioButton}\n isSelected={isSelected}\n expandContentId={containerId}\n standalone={standalone}\n >\n <PaymentMethodIcon\n // Only add alt attribute to storedPaymentMethods (to avoid SR reading the PM name twice)\n {...(paymentMethod.props.oneClick && { alt: getFullBrandName(paymentMethod.props.brand) })}\n type={paymentMethod.type}\n src={paymentMethod.icon}\n />\n\n <div className=\"adyen-checkout__payment-method__header__details\">\n <PaymentMethodName\n displayName={paymentMethod.displayName}\n isSelected={isSelected}\n additionalInfo={paymentMethod.additionalInfo}\n />\n {showBrands && (\n <PaymentMethodBrands\n showOtherInsteadOfNumber={paymentMethod.props.showOtherInsteadOfNumber}\n keepBrandsVisible={paymentMethod.props.keepBrandsVisible}\n brands={paymentMethod.brands}\n excludedUIBrands={BRAND_ICON_UI_EXCLUSION_LIST}\n isPaymentMethodSelected={isSelected}\n />\n )}\n </div>\n </ExpandButton>\n\n {showRemovePaymentMethodButton && (\n <Button\n inline\n variant=\"link\"\n label={i18n.get('storedPaymentMethod.disable.button')}\n onClick={this.toggleDisableConfirmation}\n onKeyDown={stopPropagationForActionKeys}\n ariaExpanded={this.state.showDisableStoredPaymentMethodConfirmation}\n ariaControls={disableConfirmationId}\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} inert={isSelected ? undefined : true}>\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} isSelected={isSelected} />\n </div>\n </div>\n </div>\n );\n }\n}\n\nexport default PaymentMethodItem;\n"],"names":["PaymentMethodItem","Component","render","paymentMethod","isSelected","isDisablingPaymentMethod","isLoading","standalone","showRadioButton","i18n","useCoreContext","isCard","props","type","paymentMethodClassnames","classNames","_object_spread_props","_object_spread","fundingSource","this","state","showDisableStoredPaymentMethodConfirmation","_id","className","showRemovePaymentMethodButton","oneClick","disableConfirmationId","containerId","buttonId","showBrands","brands","length","h","div","key","onClick","handleOnListItemClick","ExpandButton","expandContentId","PaymentMethodIcon","alt","getFullBrandName","brand","src","icon","PaymentMethodName","displayName","additionalInfo","PaymentMethodBrands","showOtherInsteadOfNumber","keepBrandsVisible","excludedUIBrands","BRAND_ICON_UI_EXCLUSION_LIST","isPaymentMethodSelected","Button","inline","variant","label","get","toggleDisableConfirmation","onKeyDown","stopPropagationForActionKeys","ariaExpanded","ariaControls","aria-hidden","id","inert","undefined","DisableOneClickConfirmation","open","onDisable","onDisableStoredPaymentMethod","onCancel","PaymentMethodDetails","paymentMethodComponent","super","args","_define_property","setState","onSelect","defaultProps","isLoaded"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as e}from"../../external/preact/dist/preact.js";import{UIElement as t}from"../internal/UIElement/UIElement.js";import r from"./components/GiftcardComponent.js";import n from"../internal/PayButton/PayButton.js";import o from"../../core/Errors/AdyenCheckoutError.js";import{
|
|
1
|
+
import{createElement as e}from"../../external/preact/dist/preact.js";import{UIElement as t}from"../internal/UIElement/UIElement.js";import r from"./components/GiftcardComponent.js";import n from"../internal/PayButton/PayButton.js";import o from"../../core/Errors/AdyenCheckoutError.js";import{resolvePlaceholders as s,resolveBalanceCheckError as i}from"./utils.js";import{TxVariants as a}from"../tx-variants.js";function p(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function c(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter(function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable}))),n.forEach(function(t){p(e,t,r[t])})}return e}function h(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}),e}class l extends t{formatProps(e){return c({},null==e?void 0:e.configuration,e)}formatData(){var e,t;return{paymentMethod:{type:this.constructor.type,brand:this.props.brand,encryptedCardNumber:null===(e=this.state.data)||void 0===e?void 0:e.encryptedCardNumber,encryptedSecurityCode:null===(t=this.state.data)||void 0===t?void 0:t.encryptedSecurityCode}}}get isValid(){return!!this.state.isValid}get icon(){var e;return(null===(e=this.props.brandsConfiguration[this.props.brand])||void 0===e?void 0:e.icon)||this.props.icon||this.resources.getImage()(this.props.brand)}get displayName(){var e;return(null===(e=this.props.brandsConfiguration[this.props.brand])||void 0===e?void 0:e.name)||this.props.name}setBalanceCheckError(e){var t,r;null===(r=this.componentRef)||void 0===r||null===(t=r.setBalanceCheckErrors)||void 0===t||t.call(r,e)}balanceCheck(){return this.onBalanceCheck()}submit(){this.balanceCheck()}makeSubmitCall(){super.submit()}componentToRender(){return e(r,h(c({ref:e=>{this.componentRef=e}},this.props),{placeholders:s(this.props.brand,this.props.brandsConfiguration,this.props.placeholders),handleKeyDown:this.handleKeyDown,onChange:this.setState,makeBalanceCheck:()=>this.onBalanceCheck(),makePayment:()=>this.makeSubmitCall(),payButton:this.payButton,onSubmitAnalytics:this.submitAnalytics}))}constructor(...t){super(...t),p(this,"handleBalanceCheck",e=>this.props.onBalanceCheck?new Promise((t,r)=>{this.props.onBalanceCheck(t,r,e)}):this.props.session?this.props.session.checkBalance(e):void 0),p(this,"onOrderRequest",e=>this.props.onOrderRequest?new Promise((t,r)=>{this.props.onOrderRequest(t,r,e)}):this.props.session?this.props.session.createOrder():void 0),p(this,"onBalanceCheck",()=>{if(!this.isValid)return void this.showValidation();if(!(this.props.session||this.props.onBalanceCheck))return super.submit();this.setElementStatus("loading"),this.setBalanceCheckError(null),this.handleBalanceCheck(this.formatData()).then(({balance:e,transactionLimit:t={}})=>{var r;if(!e)throw new Error("card-error");if((null==e?void 0:e.currency)!==(null===(r=this.props.amount)||void 0===r?void 0:r.currency))throw new Error("currency-error");if((null==e?void 0:e.value)<=0)throw new Error("no-balance");return this.props.amount.value>e.value||this.props.amount.value>t.value?this.props.order?this.executePaymentsCall():this.onOrderRequest(this.data).then(e=>(this.setState({order:{orderData:e.orderData,pspReference:e.pspReference}}),this.executePaymentsCall())):this.handleOnRequiringConfirmation(e,t)}).catch(e=>{this.setBalanceCheckError(i(e)),e instanceof o?this.handleError(e):this.handleError(new o("ERROR",e))})}),p(this,"handleOnRequiringConfirmation",(e,t)=>{if(this.componentRef.setBalance({balance:e,transactionLimit:t}),this.setElementStatus("ready"),!this.props.showPayButton){if(!this.props.onRequiringConfirmation)throw new o("IMPLEMENTATION_ERROR","onRequiringConfirmation must be provided");return new Promise((e,t)=>{this.props.onRequiringConfirmation(e,t)}).then(()=>this.makeSubmitCall()).catch(()=>{})}}),p(this,"payButton",t=>{var r;return e(n,h(c({},t),{showPayButton:this.props.showPayButton,disclaimerMessage:this.props.disclaimerMessage,showReview:null!==(r=t.showReview)&&void 0!==r?r:!!this.props.onReview}))})}}p(l,"type",a.giftcard),p(l,"defaultProps",{brandsConfiguration:{}});export{l as GiftcardElement,l as default};
|
|
2
2
|
//# sourceMappingURL=Giftcard.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Giftcard.js","sources":["../../../../src/components/Giftcard/Giftcard.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport GiftcardComponent from './components/GiftcardComponent';\nimport PayButton from '../internal/PayButton';\nimport AdyenCheckoutError from '../../core/Errors/AdyenCheckoutError';\nimport { PaymentAmount } from '../../types/global-types';\nimport { GiftCardElementData, GiftCardConfiguration, balanceCheckResponseType, GiftCardBalanceCheckErrorType } from './types';\nimport { TxVariants } from '../tx-variants';\nimport { PayButtonProps } from '../internal/PayButton/PayButton';\n\nexport class GiftcardElement extends UIElement<GiftCardConfiguration> {\n public static readonly type: TxVariants = TxVariants.giftcard;\n\n declare protected componentRef: GiftcardComponent | undefined;\n\n protected static readonly defaultProps = {\n brandsConfiguration: {}\n };\n\n formatProps(props) {\n return {\n ...props?.configuration,\n ...props\n };\n }\n\n formatData(): GiftCardElementData {\n return {\n paymentMethod: {\n type: this.constructor['type'],\n brand: this.props.brand,\n encryptedCardNumber: this.state.data?.encryptedCardNumber,\n encryptedSecurityCode: this.state.data?.encryptedSecurityCode\n }\n };\n }\n\n get isValid() {\n return !!this.state.isValid;\n }\n\n get icon() {\n return this.props.brandsConfiguration[this.props.brand]?.icon || this.props.icon || this.resources.getImage()(this.props.brand);\n }\n\n get displayName() {\n return this.props.brandsConfiguration[this.props.brand]?.name || this.props.name;\n }\n\n private setBalanceCheckError(errorMessage: GiftCardBalanceCheckErrorType | null): void {\n this.componentRef?.setBalanceCheckErrors?.(errorMessage);\n }\n\n private readonly handleBalanceCheck = (data: GiftCardElementData): Promise<balanceCheckResponseType> => {\n if (this.props.onBalanceCheck) {\n return new Promise((resolve, reject) => {\n void this.props.onBalanceCheck(resolve, reject, data);\n });\n }\n\n if (this.props.session) {\n return this.props.session.checkBalance(data);\n }\n };\n\n private readonly onOrderRequest = data => {\n if (this.props.onOrderRequest)\n return new Promise((resolve, reject) => {\n void this.props.onOrderRequest(resolve, reject, data);\n });\n if (this.props.session) {\n return this.props.session.createOrder();\n }\n };\n\n public balanceCheck() {\n return this.onBalanceCheck();\n }\n\n private readonly onBalanceCheck = (): void => {\n if (!this.isValid) {\n this.showValidation();\n return;\n }\n\n // skip balance check if no onBalanceCheck event has been defined\n const hasBalanceCheck = this.props.session || this.props.onBalanceCheck;\n if (!hasBalanceCheck) return super.submit();\n\n this.setStatus('loading');\n\n this.handleBalanceCheck(this.formatData())\n .then(({ balance, transactionLimit = {} as PaymentAmount }) => {\n // Clear any previous balance check errors on success\n this.setBalanceCheckError(null);\n\n // We still need to throw these errors, otherwise it would be a breaking changing\n if (!balance) throw new Error('card-error'); // card doesn't exist\n if (balance?.currency !== this.props.amount?.currency) throw new Error('currency-error');\n if (balance?.value <= 0) throw new Error('no-balance');\n\n if (this.props.amount.value > balance.value || this.props.amount.value > transactionLimit.value) {\n if (this.props.order) {\n return this.executePaymentsCall();\n }\n\n return this.onOrderRequest(this.data).then((order: { orderData: string; pspReference: string }) => {\n this.setState({ order: { orderData: order.orderData, pspReference: order.pspReference } });\n return this.executePaymentsCall();\n });\n } else {\n return this.handleOnRequiringConfirmation(balance, transactionLimit);\n }\n })\n .catch(error => {\n // Simply pass the raw error message to setBalanceCheckError\n this.setBalanceCheckError(error?.message);\n\n // Still call handleError for other side effects (analytics, onError callback)\n if (error instanceof AdyenCheckoutError) {\n this.handleError(error);\n } else {\n this.handleError(new AdyenCheckoutError('ERROR', error));\n }\n });\n };\n\n /**\n * Check if it should call onRequiringConfirmation\n */\n private readonly handleOnRequiringConfirmation = (balance: PaymentAmount, transactionLimit: PaymentAmount): Promise<void> | void => {\n this.componentRef.setBalance({ balance, transactionLimit });\n this.setStatus('ready');\n\n // 1. if we show pay button we don't need to ask for confirmation\n if (this.props.showPayButton) {\n return;\n }\n // 2. there's no callback, we throw error\n if (!this.props.onRequiringConfirmation) {\n throw new AdyenCheckoutError('IMPLEMENTATION_ERROR', 'onRequiringConfirmation must be provided');\n }\n // 3. success case if in case of custom pay button\n return (\n new Promise<void>((resolve, reject) => {\n void this.props.onRequiringConfirmation(resolve, reject);\n })\n //when this resolve passed to onRequiringConfirmation gets resolved make payments call\n .then(() => this.makeSubmitCall())\n //when it gets rejected handle cancellation\n .catch(() => {})\n );\n };\n\n public submit() {\n // for simplicity of the merchant we always only expose .submit()\n // however to make the actual payment call we call makeSubmitCall\n this.balanceCheck();\n }\n\n // this makes the payment, as .submit is used by the merchant to trigger the payButton action\n private makeSubmitCall() {\n super.submit();\n }\n\n // Giftcards override the regular payButton flow\n protected override payButton = (props: PayButtonProps) => {\n return (\n <PayButton\n {...props}\n showPayButton={this.props.showPayButton}\n disclaimerMessage={this.props.disclaimerMessage}\n showReview={props.showReview ?? !!this.props.onReview}\n />\n );\n };\n\n protected override componentToRender(): h.JSX.Element {\n return (\n <GiftcardComponent\n ref={ref => {\n this.componentRef = ref;\n }}\n {...this.props}\n handleKeyDown={this.handleKeyDown}\n onChange={this.setState}\n makeBalanceCheck={() => this.onBalanceCheck()}\n makePayment={() => this.makeSubmitCall()}\n payButton={this.payButton}\n onSubmitAnalytics={this.submitAnalytics}\n />\n );\n }\n}\n\nexport default GiftcardElement;\n"],"names":["GiftcardElement","UIElement","formatProps","props","_object_spread","configuration","formatData","_this_state_data","_this_state_data1","paymentMethod","type","this","constructor","brand","encryptedCardNumber","state","data","encryptedSecurityCode","isValid","icon","_this_props_brandsConfiguration_this_props_brand","brandsConfiguration","resources","getImage","displayName","name","setBalanceCheckError","errorMessage","_this_componentRef_setBalanceCheckErrors","_this_componentRef","componentRef","setBalanceCheckErrors","call","balanceCheck","onBalanceCheck","submit","makeSubmitCall","super","componentToRender","h","GiftcardComponent","ref","handleKeyDown","onChange","setState","makeBalanceCheck","makePayment","payButton","onSubmitAnalytics","submitAnalytics","args","_define_property","handleBalanceCheck","Promise","resolve","reject","session","checkBalance","onOrderRequest","createOrder","showValidation","setStatus","then","balance","transactionLimit","_this_props_amount","Error","currency","amount","value","order","executePaymentsCall","orderData","pspReference","handleOnRequiringConfirmation","catch","error","message","AdyenCheckoutError","handleError","setBalance","showPayButton","onRequiringConfirmation","PayButton","disclaimerMessage","showReview","onReview","TxVariants","giftcard","defaultProps"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Giftcard.js","sources":["../../../../src/components/Giftcard/Giftcard.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport GiftcardComponent from './components/GiftcardComponent';\nimport PayButton from '../internal/PayButton';\nimport AdyenCheckoutError from '../../core/Errors/AdyenCheckoutError';\nimport { PaymentAmount } from '../../types/global-types';\nimport { GiftCardElementData, GiftCardConfiguration, balanceCheckResponseType, GiftCardBalanceCheckErrorType } from './types';\nimport { resolveBalanceCheckError, resolvePlaceholders } from './utils';\nimport { TxVariants } from '../tx-variants';\nimport { PayButtonProps } from '../internal/PayButton/PayButton';\n\nexport class GiftcardElement extends UIElement<GiftCardConfiguration> {\n public static readonly type: TxVariants = TxVariants.giftcard;\n\n declare protected componentRef: GiftcardComponent | undefined;\n\n protected static readonly defaultProps = {\n brandsConfiguration: {}\n };\n\n formatProps(props) {\n return {\n ...props?.configuration,\n ...props\n };\n }\n\n formatData(): GiftCardElementData {\n return {\n paymentMethod: {\n type: this.constructor['type'],\n brand: this.props.brand,\n encryptedCardNumber: this.state.data?.encryptedCardNumber,\n encryptedSecurityCode: this.state.data?.encryptedSecurityCode\n }\n };\n }\n\n get isValid() {\n return !!this.state.isValid;\n }\n\n get icon() {\n return this.props.brandsConfiguration[this.props.brand]?.icon || this.props.icon || this.resources.getImage()(this.props.brand);\n }\n\n get displayName() {\n return this.props.brandsConfiguration[this.props.brand]?.name || this.props.name;\n }\n\n private setBalanceCheckError(errorMessage: GiftCardBalanceCheckErrorType | null): void {\n this.componentRef?.setBalanceCheckErrors?.(errorMessage);\n }\n\n private readonly handleBalanceCheck = (data: GiftCardElementData): Promise<balanceCheckResponseType> => {\n if (this.props.onBalanceCheck) {\n return new Promise((resolve, reject) => {\n void this.props.onBalanceCheck(resolve, reject, data);\n });\n }\n\n if (this.props.session) {\n return this.props.session.checkBalance(data);\n }\n };\n\n private readonly onOrderRequest = data => {\n if (this.props.onOrderRequest)\n return new Promise((resolve, reject) => {\n void this.props.onOrderRequest(resolve, reject, data);\n });\n if (this.props.session) {\n return this.props.session.createOrder();\n }\n };\n\n public balanceCheck() {\n return this.onBalanceCheck();\n }\n\n private readonly onBalanceCheck = (): void => {\n if (!this.isValid) {\n this.showValidation();\n return;\n }\n\n // skip balance check if no onBalanceCheck event has been defined\n const hasBalanceCheck = this.props.session || this.props.onBalanceCheck;\n if (!hasBalanceCheck) return super.submit();\n\n this.setElementStatus('loading');\n\n // Clear any previous balance check errors at the start of every attempt\n this.setBalanceCheckError(null);\n\n this.handleBalanceCheck(this.formatData())\n .then(({ balance, transactionLimit = {} as PaymentAmount }) => {\n // We still need to throw these errors, otherwise it would be a breaking changing\n if (!balance) throw new Error('card-error'); // card doesn't exist\n if (balance?.currency !== this.props.amount?.currency) throw new Error('currency-error');\n if (balance?.value <= 0) throw new Error('no-balance');\n\n if (this.props.amount.value > balance.value || this.props.amount.value > transactionLimit.value) {\n if (this.props.order) {\n return this.executePaymentsCall();\n }\n\n return this.onOrderRequest(this.data).then((order: { orderData: string; pspReference: string }) => {\n this.setState({ order: { orderData: order.orderData, pspReference: order.pspReference } });\n return this.executePaymentsCall();\n });\n } else {\n return this.handleOnRequiringConfirmation(balance, transactionLimit);\n }\n })\n .catch(error => {\n this.setBalanceCheckError(resolveBalanceCheckError(error));\n\n // Still call handleError for other side effects (analytics, onError callback)\n if (error instanceof AdyenCheckoutError) {\n this.handleError(error);\n } else {\n this.handleError(new AdyenCheckoutError('ERROR', error));\n }\n });\n };\n\n /**\n * Check if it should call onRequiringConfirmation\n */\n private readonly handleOnRequiringConfirmation = (balance: PaymentAmount, transactionLimit: PaymentAmount): Promise<void> | void => {\n this.componentRef.setBalance({ balance, transactionLimit });\n this.setElementStatus('ready');\n\n // 1. if we show pay button we don't need to ask for confirmation\n if (this.props.showPayButton) {\n return;\n }\n // 2. there's no callback, we throw error\n if (!this.props.onRequiringConfirmation) {\n throw new AdyenCheckoutError('IMPLEMENTATION_ERROR', 'onRequiringConfirmation must be provided');\n }\n // 3. success case if in case of custom pay button\n return (\n new Promise<void>((resolve, reject) => {\n void this.props.onRequiringConfirmation(resolve, reject);\n })\n //when this resolve passed to onRequiringConfirmation gets resolved make payments call\n .then(() => this.makeSubmitCall())\n //when it gets rejected handle cancellation\n .catch(() => {})\n );\n };\n\n public submit() {\n // for simplicity of the merchant we always only expose .submit()\n // however to make the actual payment call we call makeSubmitCall\n this.balanceCheck();\n }\n\n // this makes the payment, as .submit is used by the merchant to trigger the payButton action\n private makeSubmitCall() {\n super.submit();\n }\n\n // Giftcards override the regular payButton flow\n protected override payButton = (props: PayButtonProps) => {\n return (\n <PayButton\n {...props}\n showPayButton={this.props.showPayButton}\n disclaimerMessage={this.props.disclaimerMessage}\n showReview={props.showReview ?? !!this.props.onReview}\n />\n );\n };\n\n protected override componentToRender(): h.JSX.Element {\n return (\n <GiftcardComponent\n ref={ref => {\n this.componentRef = ref;\n }}\n {...this.props}\n placeholders={resolvePlaceholders(this.props.brand, this.props.brandsConfiguration, this.props.placeholders)}\n handleKeyDown={this.handleKeyDown}\n onChange={this.setState}\n makeBalanceCheck={() => this.onBalanceCheck()}\n makePayment={() => this.makeSubmitCall()}\n payButton={this.payButton}\n onSubmitAnalytics={this.submitAnalytics}\n />\n );\n }\n}\n\nexport default GiftcardElement;\n"],"names":["GiftcardElement","UIElement","formatProps","props","_object_spread","configuration","formatData","_this_state_data","_this_state_data1","paymentMethod","type","this","constructor","brand","encryptedCardNumber","state","data","encryptedSecurityCode","isValid","icon","_this_props_brandsConfiguration_this_props_brand","brandsConfiguration","resources","getImage","displayName","name","setBalanceCheckError","errorMessage","_this_componentRef_setBalanceCheckErrors","_this_componentRef","componentRef","setBalanceCheckErrors","call","balanceCheck","onBalanceCheck","submit","makeSubmitCall","super","componentToRender","h","GiftcardComponent","ref","placeholders","resolvePlaceholders","handleKeyDown","onChange","setState","makeBalanceCheck","makePayment","payButton","onSubmitAnalytics","submitAnalytics","args","_define_property","handleBalanceCheck","Promise","resolve","reject","session","checkBalance","onOrderRequest","createOrder","showValidation","setElementStatus","then","balance","transactionLimit","_this_props_amount","Error","currency","amount","value","order","executePaymentsCall","orderData","pspReference","handleOnRequiringConfirmation","catch","error","resolveBalanceCheckError","AdyenCheckoutError","handleError","setBalance","showPayButton","onRequiringConfirmation","PayButton","disclaimerMessage","showReview","onReview","TxVariants","giftcard","defaultProps"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Component as t,createElement as e}from"../../../external/preact/dist/preact.js";import r from"../../internal/SecuredFields/SFP/SecuredFieldsProvider.js";import s from"../../internal/Alert/Alert.js";import
|
|
1
|
+
import{Component as t,createElement as e}from"../../../external/preact/dist/preact.js";import r from"../../internal/SecuredFields/SFP/SecuredFieldsProvider.js";import s from"../../internal/Alert/Alert.js";import o from"./GiftcardResult.js";import{useCoreContext as n}from"../../../core/Context/CoreProvider.js";import{GIFT_CARD as a}from"../../internal/SecuredFields/lib/constants.js";import{GiftCardFields as i}from"./GiftcardFields.js";import{useSRPanelForGiftcardErrors as c}from"./useSRPanelForGiftcardErrors.js";import{useAmount as l}from"../../../core/Context/AmountProvider.js";function u(t,e,r){return e in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}function d(t){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{},s=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(s=s.concat(Object.getOwnPropertySymbols(r).filter(function(t){return Object.getOwnPropertyDescriptor(r,t).enumerable}))),s.forEach(function(e){u(t,e,r[e])})}return t}function p(t,e){return e=null!=e?e:{},Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(e)):function(t){var e=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);e.push.apply(e,r)}return e}(Object(e)).forEach(function(r){Object.defineProperty(t,r,Object.getOwnPropertyDescriptor(e,r))}),t}const h={"no-balance":"error.giftcard.no-balance","card-error":"error.giftcard.card-error","currency-error":"error.giftcard.currency-error"};class m extends t{generateBalanceCheckErrors(t){const e={};return null==t||(e.encryptedCardNumber={isValid:!1,errorMessage:h[t],error:t}),e}render(t,{focusedElement:i,balance:u,transactionLimit:h,isValidating:m,transformedErrors:f,showUnknownError:y}){const{i18n:b}=n(),{amount:g}=l();c({errors:f,isValidating:m,setIsValidating:this.setIsValidating,sfp:this.sfp});const O=(null==h?void 0:h.value)<(null==u?void 0:u.value)?h:u,j=(null==O?void 0:O.value)>=(null==g?void 0:g.value);if(O&&j)return e(o,{balance:u,transactionLimit:h,makePayment:t.makePayment,status:this.state.status,makeBalanceCheck:t.makeBalanceCheck,payButton:this.props.payButton});const C=t=>t.errors.encryptedCardNumber?b.get(t.errors.encryptedCardNumber):f.encryptedCardNumber?b.get(f.encryptedCardNumber.errorMessage):null;return e("div",{className:"adyen-checkout__giftcard"},y&&e(s,{icon:"cross"},b.get("error.message.unknown")),e(r,p(d({},this.props),{clientKey:this.props.clientKey,loadingContext:this.props.loadingContext,ref:t=>{this.sfp=t},onChange:this.onChange,onFocus:this.handleFocus,onSubmitAnalytics:t.onSubmitAnalytics,type:a,componentType:t.type,render:({setRootNode:t,setFocusOn:e},r)=>this.props.fieldsLayoutComponent({i18n:b,pinRequired:this.props.pinRequired,focusedElement:i,getCardErrorMessage:C,setRootNode:t,setFocusOn:e,sfpState:r})})),this.props.payButton({status:this.state.status,onClick:this.props.makeBalanceCheck,label:b.get("applyGiftcard"),showReview:!1}))}constructor(...t){super(...t),u(this,"state",{status:"ready",data:{},balance:null,transactionLimit:null,focusedElement:!1,isValid:!1,sfpState:{},isValidating:!1,transformedErrors:{},showUnknownError:!1}),u(this,"sfp",void 0),u(this,"mapErrorsToValidationObjects",()=>this.sfp?this.sfp.mapErrorsToValidationRuleResult():{}),u(this,"updateTransformedErrors",t=>{const e=d({},this.mapErrorsToValidationObjects(),t);this.setState({transformedErrors:e})}),u(this,"onChange",t=>{this.setState({sfpState:t},()=>this.updateTransformedErrors()),this.props.onChange({data:t.data,isValid:t.isSfpValid})}),u(this,"handleFocus",t=>{this.setState({focusedElement:t.currentFocusObject});!0===t.focus?this.props.onFocus(t):this.props.onBlur(t)}),u(this,"setBalance",({balance:t,transactionLimit:e})=>{this.setState({balance:t,transactionLimit:e})}),u(this,"setBalanceCheckErrors",t=>{const e=null!=t&&"unknown-error"!==t?t:null;this.setState({showUnknownError:"unknown-error"===t}),this.updateTransformedErrors(this.generateBalanceCheckErrors(e))}),u(this,"showValidation",()=>{var t;this.setState({isValidating:!0}),null===(t=this.sfp)||void 0===t||t.showValidation()}),u(this,"setIsValidating",t=>{this.setState({isValidating:t})}),u(this,"setStatus",t=>{this.setState({status:t})})}}u(m,"defaultProps",{pinRequired:!0,expiryDateRequired:!1,onChange:()=>{},onFocus:()=>{},onBlur:()=>{},fieldsLayoutComponent:i});export{m as default};
|
|
2
2
|
//# sourceMappingURL=GiftcardComponent.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GiftcardComponent.js","sources":["../../../../../src/components/Giftcard/components/GiftcardComponent.tsx"],"sourcesContent":["import { Component, FunctionComponent, h } from 'preact';\nimport SecuredFieldsProvider from '../../internal/SecuredFields/SFP/SecuredFieldsProvider';\nimport Alert from '../../internal/Alert';\nimport GiftcardResult from './GiftcardResult';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { GIFT_CARD } from '../../internal/SecuredFields/lib/constants';\nimport { GiftCardFields } from './GiftcardFields';\nimport { GiftcardFieldsProps, Placeholders } from './types';\nimport { useSRPanelForGiftcardErrors } from './useSRPanelForGiftcardErrors';\nimport { GiftCardBalanceCheckErrorType, GiftCardValidationError } from '../types';\nimport { PayButtonProps } from '../../internal/PayButton/PayButton';\nimport { useAmount } from '../../../core/Context/AmountProvider';\nimport type { AbstractAnalyticsEvent } from '../../../core/Analytics/events/AbstractAnalyticsEvent';\nimport type { SFPProps } from '../../internal/SecuredFields/SFP/types';\nimport type { UIElementStatus } from '../../internal/UIElement/types';\n\ninterface GiftcardComponentProps extends Partial<Pick<SFPProps, 'clientKey' | 'loadingContext'>> {\n onChange: (state) => void;\n onFocus: (event) => void;\n onBlur: (event) => void;\n makeBalanceCheck: (event) => void;\n makePayment: (event) => void;\n payButton: (props: PayButtonProps) => h.JSX.Element;\n pinRequired: boolean;\n expiryDateRequired?: boolean;\n fieldsLayoutComponent: FunctionComponent<GiftcardFieldsProps>;\n placeholders?: Placeholders;\n handleKeyDown?: (event: KeyboardEvent) => void;\n onSubmitAnalytics?: (event: AbstractAnalyticsEvent) => void;\n}\n\nclass Giftcard extends Component<Readonly<GiftcardComponentProps>> {\n public state = {\n status: 'ready',\n data: {},\n balance: null,\n transactionLimit: null,\n focusedElement: false,\n isValid: false,\n sfpState: {},\n isValidating: false,\n transformedErrors: {}\n };\n\n public static readonly defaultProps = {\n pinRequired: true,\n expiryDateRequired: false,\n onChange: () => {},\n onFocus: () => {},\n onBlur: () => {},\n fieldsLayoutComponent: GiftCardFields\n };\n\n public sfp: SecuredFieldsProvider;\n\n /**\n * Maps string error codes from SecuredFields to validation rule objects\n */\n public mapErrorsToValidationObjects = () => {\n // Use the sfp reference to call mapErrorsToValidationRuleResult\n if (!this.sfp) return {};\n return this.sfp.mapErrorsToValidationRuleResult();\n };\n\n private readonly updateTransformedErrors = (balanceCheckErrors?: Record<string, GiftCardValidationError>) => {\n const transformedErrors = this.mapErrorsToValidationObjects();\n\n const mergedErrors = { ...transformedErrors, ...balanceCheckErrors };\n\n this.setState({ transformedErrors: mergedErrors });\n };\n\n public onChange = sfpState => {\n this.setState({ sfpState }, () => this.updateTransformedErrors());\n\n this.props.onChange({\n data: sfpState.data,\n isValid: sfpState.isSfpValid\n });\n };\n\n public handleFocus = e => {\n this.setState({ focusedElement: e.currentFocusObject });\n\n const isFocused = e.focus === true;\n if (isFocused) {\n this.props.onFocus(e);\n } else {\n this.props.onBlur(e);\n }\n };\n\n public setBalance = ({ balance, transactionLimit }) => {\n this.setState({ balance, transactionLimit });\n };\n\n /**\n * Generates balance check errors in the same format as SFP errors\n * Compatible with the transformedErrors structure\n */\n private generateBalanceCheckErrors(errorType?: GiftCardBalanceCheckErrorType | null): Record<string, GiftCardValidationError> {\n const balanceCheckErrors: Record<string, GiftCardValidationError> = {};\n\n // This is the field that the error is associated with, only used for SR logic\n const fieldToAnnounce = 'encryptedCardNumber';\n\n // If errorType is null, clear errors\n if (errorType === null) {\n return balanceCheckErrors;\n }\n\n // Create error in the same format as SFP errors for consistency\n balanceCheckErrors[fieldToAnnounce] = {\n isValid: false,\n errorMessage: `error.giftcard.${errorType}`,\n error: errorType\n };\n\n return balanceCheckErrors;\n }\n\n /**\n * Checks if a status represents a balance check error\n */\n private isBalanceCheckError(status: string): boolean {\n return ['no-balance', 'card-error', 'currency-error'].includes(status);\n }\n\n /**\n * Method called by GiftcardElement to set balance check errors only\n */\n public setBalanceCheckErrors = (errorType: GiftCardBalanceCheckErrorType | null): void => {\n // Check if the errors should be displayed\n if (this.isBalanceCheckError(errorType)) {\n // Generate balance check errors in the style of useForm\n // This is usefull because then we can use the same logic for SF and balance check errors\n // Also we can use the same logic for SRPanel errors\n const balanceCheckErrors = this.generateBalanceCheckErrors(errorType);\n this.updateTransformedErrors(balanceCheckErrors);\n }\n };\n\n public showValidation = () => {\n this.setState({ isValidating: true });\n\n // Validate SecuredFields\n this.sfp?.showValidation();\n };\n\n public setIsValidating = (val: boolean) => {\n this.setState({ isValidating: val });\n };\n\n public setStatus = (status: UIElementStatus) => {\n this.setState({ status });\n };\n\n render(props, { focusedElement, balance, transactionLimit, isValidating, transformedErrors }) {\n const { i18n } = useCoreContext();\n const { amount } = useAmount();\n\n // Handle SRPanel errors in render with transformed error objects\n useSRPanelForGiftcardErrors({\n errors: transformedErrors,\n isValidating,\n setIsValidating: this.setIsValidating,\n sfp: this.sfp\n });\n\n const transactionAmount = transactionLimit?.value < balance?.value ? transactionLimit : balance;\n const hasEnoughBalance = transactionAmount?.value >= amount?.value;\n\n if (transactionAmount && hasEnoughBalance) {\n return (\n <GiftcardResult\n balance={balance}\n transactionLimit={transactionLimit}\n makePayment={props.makePayment}\n status={this.state.status}\n makeBalanceCheck={props.makeBalanceCheck}\n payButton={this.props.payButton}\n />\n );\n }\n\n const getCardErrorMessage = sfpState => {\n if (sfpState.errors.encryptedCardNumber) return i18n.get(sfpState.errors.encryptedCardNumber);\n\n // This logic is a bit of a hack, but it's the only way to get the error message for balance check errors\n // In the future we should move this logic to useForm\n if (transformedErrors.encryptedCardNumber) {\n return i18n.get(transformedErrors.encryptedCardNumber.errorMessage);\n }\n\n return null;\n };\n\n return (\n <div className=\"adyen-checkout__giftcard\">\n {this.state.status === 'error' && <Alert icon={'cross'}>{i18n.get('error.message.unknown')}</Alert>}\n\n <SecuredFieldsProvider\n {...this.props}\n clientKey={this.props.clientKey}\n loadingContext={this.props.loadingContext}\n ref={ref => {\n this.sfp = ref;\n }}\n onChange={this.onChange}\n onFocus={this.handleFocus}\n onSubmitAnalytics={props.onSubmitAnalytics}\n type={GIFT_CARD}\n componentType={props.type}\n render={({ setRootNode, setFocusOn }, sfpState) =>\n this.props.fieldsLayoutComponent({\n i18n: i18n,\n pinRequired: this.props.pinRequired,\n focusedElement: focusedElement,\n getCardErrorMessage: getCardErrorMessage,\n setRootNode: setRootNode,\n setFocusOn: setFocusOn,\n sfpState: sfpState\n })\n }\n />\n\n {this.props.payButton({\n status: this.state.status,\n onClick: this.props.makeBalanceCheck,\n label: i18n.get('applyGiftcard'),\n showReview: false\n })}\n </div>\n );\n }\n}\n\nexport default Giftcard;\n"],"names":["Giftcard","Component","generateBalanceCheckErrors","errorType","balanceCheckErrors","isValid","errorMessage","error","isBalanceCheckError","status","includes","render","props","focusedElement","balance","transactionLimit","isValidating","transformedErrors","i18n","useCoreContext","amount","useAmount","useSRPanelForGiftcardErrors","errors","setIsValidating","this","sfp","transactionAmount","value","hasEnoughBalance","h","GiftcardResult","makePayment","state","makeBalanceCheck","payButton","getCardErrorMessage","sfpState","encryptedCardNumber","get","div","className","Alert","icon","SecuredFieldsProvider","clientKey","loadingContext","ref","onChange","onFocus","handleFocus","onSubmitAnalytics","type","GIFT_CARD","componentType","setRootNode","setFocusOn","fieldsLayoutComponent","pinRequired","onClick","label","showReview","super","args","_define_property","data","mapErrorsToValidationObjects","mapErrorsToValidationRuleResult","updateTransformedErrors","mergedErrors","_object_spread","setState","isSfpValid","e","currentFocusObject","focus","onBlur","setBalance","setBalanceCheckErrors","showValidation","_this_sfp","val","setStatus","defaultProps","expiryDateRequired","GiftCardFields"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"GiftcardComponent.js","sources":["../../../../../src/components/Giftcard/components/GiftcardComponent.tsx"],"sourcesContent":["import { Component, FunctionComponent, h } from 'preact';\nimport SecuredFieldsProvider from '../../internal/SecuredFields/SFP/SecuredFieldsProvider';\nimport Alert from '../../internal/Alert';\nimport GiftcardResult from './GiftcardResult';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { GIFT_CARD } from '../../internal/SecuredFields/lib/constants';\nimport { GiftCardFields } from './GiftcardFields';\nimport { GiftcardFieldsProps, Placeholders } from './types';\nimport { useSRPanelForGiftcardErrors } from './useSRPanelForGiftcardErrors';\nimport { PayButtonProps } from '../../internal/PayButton/PayButton';\nimport { useAmount } from '../../../core/Context/AmountProvider';\nimport type { AbstractAnalyticsEvent } from '../../../core/Analytics/events/AbstractAnalyticsEvent';\nimport type { SFPProps } from '../../internal/SecuredFields/SFP/types';\nimport type { UIElementStatus } from '../../internal/UIElement/types';\nimport type { GiftCardBalanceCheckErrorType, GiftCardValidationError, KnownBalanceCheckError } from '../types';\n\n/**\n * Explicit key map so that adding a member to KnownBalanceCheckError is a compile error until a translation key exists.\n * An interpolated key cannot be verified by TS and a missing one renders the raw key to the shopper.\n */\nconst INLINE_ERROR_TRANSLATION_KEYS: Record<KnownBalanceCheckError, string> = {\n 'no-balance': 'error.giftcard.no-balance',\n 'card-error': 'error.giftcard.card-error',\n 'currency-error': 'error.giftcard.currency-error'\n};\n\ninterface GiftcardComponentProps extends Partial<Pick<SFPProps, 'clientKey' | 'loadingContext'>> {\n onChange: (state) => void;\n onFocus: (event) => void;\n onBlur: (event) => void;\n makeBalanceCheck: (event) => void;\n makePayment: (event) => void;\n payButton: (props: PayButtonProps) => h.JSX.Element;\n pinRequired: boolean;\n expiryDateRequired?: boolean;\n fieldsLayoutComponent: FunctionComponent<GiftcardFieldsProps>;\n placeholders?: Placeholders;\n handleKeyDown?: (event: KeyboardEvent) => void;\n onSubmitAnalytics?: (event: AbstractAnalyticsEvent) => void;\n}\n\nclass Giftcard extends Component<Readonly<GiftcardComponentProps>> {\n public state = {\n status: 'ready',\n data: {},\n balance: null,\n transactionLimit: null,\n focusedElement: false,\n isValid: false,\n sfpState: {},\n isValidating: false,\n transformedErrors: {},\n showUnknownError: false\n };\n\n public static readonly defaultProps = {\n pinRequired: true,\n expiryDateRequired: false,\n onChange: () => {},\n onFocus: () => {},\n onBlur: () => {},\n fieldsLayoutComponent: GiftCardFields\n };\n\n public sfp: SecuredFieldsProvider;\n\n /**\n * Maps string error codes from SecuredFields to validation rule objects\n */\n public mapErrorsToValidationObjects = () => {\n // Use the sfp reference to call mapErrorsToValidationRuleResult\n if (!this.sfp) return {};\n return this.sfp.mapErrorsToValidationRuleResult();\n };\n\n private readonly updateTransformedErrors = (balanceCheckErrors?: Record<string, GiftCardValidationError>) => {\n const transformedErrors = this.mapErrorsToValidationObjects();\n\n const mergedErrors = { ...transformedErrors, ...balanceCheckErrors };\n\n this.setState({ transformedErrors: mergedErrors });\n };\n\n public onChange = sfpState => {\n this.setState({ sfpState }, () => this.updateTransformedErrors());\n\n this.props.onChange({\n data: sfpState.data,\n isValid: sfpState.isSfpValid\n });\n };\n\n public handleFocus = e => {\n this.setState({ focusedElement: e.currentFocusObject });\n\n const isFocused = e.focus === true;\n if (isFocused) {\n this.props.onFocus(e);\n } else {\n this.props.onBlur(e);\n }\n };\n\n public setBalance = ({ balance, transactionLimit }) => {\n this.setState({ balance, transactionLimit });\n };\n\n /**\n * Generates balance check errors in the same format as SFP errors\n * Compatible with the transformedErrors structure\n */\n private generateBalanceCheckErrors(errorType: KnownBalanceCheckError | null): Record<string, GiftCardValidationError> {\n const balanceCheckErrors: Record<string, GiftCardValidationError> = {};\n\n // This is the field that the error is associated with, only used for SR logic\n const fieldToAnnounce = 'encryptedCardNumber';\n\n // If there is no errorType, clear errors\n if (errorType == null) {\n return balanceCheckErrors;\n }\n\n // Create error in the same format as SFP errors for consistency\n balanceCheckErrors[fieldToAnnounce] = {\n isValid: false,\n errorMessage: INLINE_ERROR_TRANSLATION_KEYS[errorType],\n error: errorType\n };\n\n return balanceCheckErrors;\n }\n\n /**\n * Method called by GiftcardElement to set balance check errors only\n */\n public setBalanceCheckErrors = (errorType: GiftCardBalanceCheckErrorType | null): void => {\n // Errors we cannot attribute to the card itself are shown as a banner instead of an inline field error\n const inlineError = errorType != null && errorType !== 'unknown-error' ? errorType : null;\n\n this.setState({ showUnknownError: errorType === 'unknown-error' });\n\n // Generate balance check errors in the style of useForm\n // This is usefull because then we can use the same logic for SF and balance check errors\n // Also we can use the same logic for SRPanel errors\n this.updateTransformedErrors(this.generateBalanceCheckErrors(inlineError));\n };\n\n public showValidation = () => {\n this.setState({ isValidating: true });\n\n // Validate SecuredFields\n this.sfp?.showValidation();\n };\n\n public setIsValidating = (val: boolean) => {\n this.setState({ isValidating: val });\n };\n\n public setStatus = (status: UIElementStatus) => {\n this.setState({ status });\n };\n\n render(props, { focusedElement, balance, transactionLimit, isValidating, transformedErrors, showUnknownError }) {\n const { i18n } = useCoreContext();\n const { amount } = useAmount();\n\n // Handle SRPanel errors in render with transformed error objects\n useSRPanelForGiftcardErrors({\n errors: transformedErrors,\n isValidating,\n setIsValidating: this.setIsValidating,\n sfp: this.sfp\n });\n\n const transactionAmount = transactionLimit?.value < balance?.value ? transactionLimit : balance;\n const hasEnoughBalance = transactionAmount?.value >= amount?.value;\n\n if (transactionAmount && hasEnoughBalance) {\n return (\n <GiftcardResult\n balance={balance}\n transactionLimit={transactionLimit}\n makePayment={props.makePayment}\n status={this.state.status}\n makeBalanceCheck={props.makeBalanceCheck}\n payButton={this.props.payButton}\n />\n );\n }\n\n const getCardErrorMessage = sfpState => {\n if (sfpState.errors.encryptedCardNumber) return i18n.get(sfpState.errors.encryptedCardNumber);\n\n // This logic is a bit of a hack, but it's the only way to get the error message for balance check errors\n // In the future we should move this logic to useForm\n if (transformedErrors.encryptedCardNumber) {\n return i18n.get(transformedErrors.encryptedCardNumber.errorMessage);\n }\n\n return null;\n };\n\n return (\n <div className=\"adyen-checkout__giftcard\">\n {showUnknownError && <Alert icon={'cross'}>{i18n.get('error.message.unknown')}</Alert>}\n\n <SecuredFieldsProvider\n {...this.props}\n clientKey={this.props.clientKey}\n loadingContext={this.props.loadingContext}\n ref={ref => {\n this.sfp = ref;\n }}\n onChange={this.onChange}\n onFocus={this.handleFocus}\n onSubmitAnalytics={props.onSubmitAnalytics}\n type={GIFT_CARD}\n componentType={props.type}\n render={({ setRootNode, setFocusOn }, sfpState) =>\n this.props.fieldsLayoutComponent({\n i18n: i18n,\n pinRequired: this.props.pinRequired,\n focusedElement: focusedElement,\n getCardErrorMessage: getCardErrorMessage,\n setRootNode: setRootNode,\n setFocusOn: setFocusOn,\n sfpState: sfpState\n })\n }\n />\n\n {this.props.payButton({\n status: this.state.status,\n onClick: this.props.makeBalanceCheck,\n label: i18n.get('applyGiftcard'),\n showReview: false\n })}\n </div>\n );\n }\n}\n\nexport default Giftcard;\n"],"names":["INLINE_ERROR_TRANSLATION_KEYS","Giftcard","Component","generateBalanceCheckErrors","errorType","balanceCheckErrors","isValid","errorMessage","error","render","props","focusedElement","balance","transactionLimit","isValidating","transformedErrors","showUnknownError","i18n","useCoreContext","amount","useAmount","useSRPanelForGiftcardErrors","errors","setIsValidating","this","sfp","transactionAmount","value","hasEnoughBalance","h","GiftcardResult","makePayment","status","state","makeBalanceCheck","payButton","getCardErrorMessage","sfpState","encryptedCardNumber","get","div","className","Alert","icon","SecuredFieldsProvider","clientKey","loadingContext","ref","onChange","onFocus","handleFocus","onSubmitAnalytics","type","GIFT_CARD","componentType","setRootNode","setFocusOn","fieldsLayoutComponent","pinRequired","onClick","label","showReview","super","args","_define_property","data","mapErrorsToValidationObjects","mapErrorsToValidationRuleResult","updateTransformedErrors","mergedErrors","_object_spread","setState","isSfpValid","e","currentFocusObject","focus","onBlur","setBalance","setBalanceCheckErrors","inlineError","showValidation","_this_sfp","val","setStatus","defaultProps","expiryDateRequired","GiftCardFields"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.js","sources":["../../../../src/components/Giftcard/types.ts"],"sourcesContent":["import { FunctionComponent } from 'preact';\nimport { GiftcardFieldsProps } from './components/types';\nimport { UIElementProps } from '../internal/UIElement/types';\nimport { Order, PaymentAmount, PaymentData } from '../../types/global-types';\nimport type { BrandConfiguration } from '../internal/SecuredFields/lib/types';\nimport type { Placeholders } from './components/types';\n\nexport interface GiftCardBrandConfiguration extends BrandConfiguration {\n /**\n * Placeholders for this gift card brand. Keys not set here fall back to the top-level `placeholders`.\n */\n placeholders?: Placeholders;\n}\n\nexport type GiftCardBrandsConfiguration = Record<string, GiftCardBrandConfiguration>;\n\nexport interface GiftCardElementData {\n paymentMethod: {\n type: 'giftcard';\n brand: string;\n encryptedCardNumber: string;\n encryptedSecurityCode: string;\n };\n}\n\nexport type balanceCheckResponseType = {\n sessionData?: string;\n pspReference?: string;\n resultCode?: string;\n balance?: PaymentAmount;\n transactionLimit?: PaymentAmount;\n};\n\nexport type onBalanceCheckCallbackType = (\n resolve: (res: balanceCheckResponseType) => void,\n reject: (error: Error) => void,\n data: GiftCardElementData\n) => Promise<void>;\n\nexport type onOrderUpdatedCallbackType = (data: { order: Order }) => void;\n\nexport type onRequiringConfirmationCallbackType = (resolve: () => void, reject: (error: Error) => void) => Promise<void>;\n\nexport type onOrderRequestCallbackType = (resolve: (order: Order) => void, reject: (error: Error) => void, data: PaymentData) => Promise<void>;\n\n// TODO: Fix these types\nexport interface GiftCardConfiguration extends UIElementProps {\n pinRequired?: boolean;\n expiryDateRequired?: boolean;\n brandsConfiguration?: GiftCardBrandsConfiguration;\n /**\n * Placeholders for the gift card fields. Used for every brand, unless a brand sets its own in `brandsConfiguration`.\n */\n placeholders?: Placeholders;\n brand?: string;\n onOrderUpdated?: onOrderUpdatedCallbackType;\n onBalanceCheck?: onBalanceCheckCallbackType;\n onOrderRequest?: onOrderRequestCallbackType;\n\n onRequiringConfirmation?: onRequiringConfirmationCallbackType;\n\n /**\n * @internal\n */\n fieldsLayoutComponent?: FunctionComponent<GiftcardFieldsProps>;\n}\n\n/**\n * Unified error interface that matches useForm error structure for gift cards\n */\nexport interface GiftCardValidationError {\n isValid: boolean;\n errorMessage: string;\n errorI18n?: string;\n error?: string; // Original error code\n}\n\n/**\n * Errors synthesized client-side from a successful (2xx) balance check response.\n * These are rendered inline, next to the gift card number field.\n */\nexport const BALANCE_CHECK_ERRORS = ['no-balance', 'card-error', 'currency-error'] as const;\n\nexport type KnownBalanceCheckError = (typeof BALANCE_CHECK_ERRORS)[number];\n\n/**\n * `unknown-error` covers everything we cannot attribute to the card itself\n * (5xx, network, CORS, timeout, a merchant calling `reject()`) and is rendered\n * as a banner rather than an inline field error.\n */\nexport type GiftCardBalanceCheckErrorType = KnownBalanceCheckError | 'unknown-error';\n"],"names":["BALANCE_CHECK_ERRORS"],"mappings":"MAiFaA,EAAuB,CAAC,aAAc,aAAc"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import r from"../../core/Errors/AdyenCheckoutError.js";import{BALANCE_CHECK_ERRORS as e}from"./types.js";function o(r,e,o){return e in r?Object.defineProperty(r,e,{value:o,enumerable:!0,configurable:!0,writable:!0}):r[e]=o,r}const n=(r,e,n)=>{var t;return function(r){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{},t=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(n).filter(function(r){return Object.getOwnPropertyDescriptor(n,r).enumerable}))),t.forEach(function(e){o(r,e,n[e])})}return r}({},n,r?null==e||null===(t=e[r])||void 0===t?void 0:t.placeholders:void 0)},t=o=>{var n,t;return o instanceof Error&&("string"==typeof(t=o.message)&&e.includes(t))?o.message:o instanceof r&&"validation"===(null===(n=o.cause)||void 0===n?void 0:n.errorType)?"card-error":"unknown-error"};export{t as resolveBalanceCheckError,n as resolvePlaceholders};
|
|
2
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../../../src/components/Giftcard/utils.ts"],"sourcesContent":["import AdyenCheckoutError from '../../core/Errors/AdyenCheckoutError';\nimport { BALANCE_CHECK_ERRORS } from './types';\nimport type { AdyenApiErrorResponse } from '../../core/Services/http';\nimport type { GiftCardBalanceCheckErrorType, GiftCardBrandsConfiguration, KnownBalanceCheckError } from './types';\nimport type { Placeholders } from './components/types';\n\nconst isKnownBalanceCheckError = (value: unknown): value is KnownBalanceCheckError =>\n typeof value === 'string' && (BALANCE_CHECK_ERRORS as readonly string[]).includes(value);\n\n/**\n * Merges the placeholders of a gift card brand over the top-level placeholders, key by key.\n * An empty string set on the brand is kept, so a brand can blank out a top-level placeholder.\n *\n * @param brand - the gift card brand being rendered\n * @param brandsConfiguration - the merchant's per-brand configuration\n * @param placeholders - the top-level placeholders, used for keys the brand does not define\n * @returns the placeholders to send to the secured fields\n */\nexport const resolvePlaceholders = (\n brand?: string,\n brandsConfiguration?: GiftCardBrandsConfiguration,\n placeholders?: Placeholders\n): Placeholders => ({\n ...placeholders,\n ...(brand ? brandsConfiguration?.[brand]?.placeholders : undefined)\n});\n\n/**\n * Classifies anything the balance check promise can reject with into a single error type the component knows how to render.\n *\n * @param error - the rejection value from the balance check\n * @returns the error type to display to the shopper\n */\nexport const resolveBalanceCheckError = (error: unknown): GiftCardBalanceCheckErrorType => {\n // Identifiers thrown by our own checks on a successful response\n if (error instanceof Error && isKnownBalanceCheckError(error.message)) return error.message;\n\n // The API rejected the card details, so treat it as a bad card number\n if (error instanceof AdyenCheckoutError && (error.cause as AdyenApiErrorResponse)?.errorType === 'validation') return 'card-error';\n\n // 5xx, network, CORS, timeout, or a merchant calling reject()\n return 'unknown-error';\n};\n"],"names":["resolvePlaceholders","brand","brandsConfiguration","placeholders","_object_spread","undefined","resolveBalanceCheckError","error","value","Error","message","BALANCE_CHECK_ERRORS","includes","AdyenCheckoutError","cause","_error_cause","errorType"],"mappings":"iOAMA,MAYaA,EAAsB,CAC/BC,EACAC,EACAC,KAGYD,IAAAA,EAFI,yUAAAE,CAAA,GACbD,EACCF,EAAQC,SAA4B,QAA5BA,EAAAA,EAAsBD,UAAtBC,IAAAA,SAAAA,EAA8BC,kBAAeE,IAShDC,EAA4BC,IAKOA,IAAAA,EAhCdC,EA6B9B,OAAID,aAAiBE,QA5BJ,iBADaD,EA6ByBD,EAAMG,UA5B/BC,EAA2CC,SAASJ,IA4BJD,EAAMG,QAGhFH,aAAiBM,GAA4E,gBAA1C,QAAXN,EAAAA,EAAMO,aAANP,IAAAA,OAAAA,EAADQ,EAAwCC,WAAmC,aAG/G"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as e}from"../../../../external/preact/dist/preact.js";import{useState as r,useLayoutEffect as t}from"../../../../external/preact/hooks/dist/hooks.js";import o from"../../FormFields/Field/Field.js";import{useCoreContext as n}from"../../../../core/Context/CoreProvider.js";import c from"../../../../core/Services/get-dataset.js";import s from"../../FormFields/Select/Select.js";function a(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function i(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}),e}const l=(e,r)=>{const t=e=>i(function(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},o=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(t).filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),o.forEach(function(r){a(e,r,t[r])})}return e}({},e),{name:e.name,selectedOptionName:e.name});return r.length?e.filter(e=>r.includes(e.id)).map(t):e.map(t)};function u(a){const{allowedCountries:i=[],classNameModifiers:u=[],errorMessage:p,onDropdownChange:m,value:f,required:d}=a,{i18n:y,loadingContext:O}=n(),[b,j]=r([]),[g,h]=r(!1),[w,P]=r(a.readOnly);return t(()=>{c("countries",O,y.
|
|
1
|
+
import{createElement as e}from"../../../../external/preact/dist/preact.js";import{useState as r,useLayoutEffect as t}from"../../../../external/preact/hooks/dist/hooks.js";import o from"../../FormFields/Field/Field.js";import{useCoreContext as n}from"../../../../core/Context/CoreProvider.js";import c from"../../../../core/Services/get-dataset.js";import s from"../../FormFields/Select/Select.js";function a(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function i(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}),e}const l=(e,r)=>{const t=e=>i(function(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},o=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(t).filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),o.forEach(function(r){a(e,r,t[r])})}return e}({},e),{name:e.name,selectedOptionName:e.name});return r.length?e.filter(e=>r.includes(e.id)).map(t):e.map(t)};function u(a){const{allowedCountries:i=[],classNameModifiers:u=[],errorMessage:p,onDropdownChange:m,value:f,required:d}=a,{i18n:y,loadingContext:O}=n(),[b,j]=r([]),[g,h]=r(!1),[w,P]=r(a.readOnly);return t(()=>{c("countries",O,y.translationsLocale).then(e=>{const r=l(e,i);j(r||[]),P(1===r.length||w),h(!0)}).catch(e=>{console.error(e),j([]),h(!0)})},[]),g?e(o,{name:"country",label:y.get("country"),errorMessage:p,classNameModifiers:u,isValid:!!f,showValidIcon:!1,i18n:y,readOnly:w&&!!f},e(s,{onChange:m,name:"country",selectedValue:f,items:b,readonly:w&&!!f,required:d})):null}export{u as default};
|
|
2
2
|
//# sourceMappingURL=CountryField.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CountryField.js","sources":["../../../../../../src/components/internal/Address/components/CountryField.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useLayoutEffect, useState } from 'preact/hooks';\nimport Field from '../../FormFields/Field';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport getDataset from '../../../../core/Services/get-dataset';\nimport { CountryFieldProps, CountryFieldItem } from '../types';\nimport Select from '../../FormFields/Select';\n\nconst formatCountries = (countries: Array<CountryFieldItem>, allowedCountries: string[]) => {\n const applyFilter = (country: CountryFieldItem) => allowedCountries.includes(country.id);\n const applyMapper = (country: CountryFieldItem) => {\n return {\n ...country,\n name: country.name,\n selectedOptionName: country.name\n };\n };\n return allowedCountries.length ? countries.filter(applyFilter).map(applyMapper) : countries.map(applyMapper);\n};\n\nexport default function CountryField(props: Readonly<CountryFieldProps>) {\n const { allowedCountries = [], classNameModifiers = [], errorMessage, onDropdownChange, value, required } = props;\n const { i18n, loadingContext } = useCoreContext();\n const [countries, setCountries] = useState<CountryFieldItem[]>([]);\n const [loaded, setLoaded] = useState<boolean>(false);\n const [readOnly, setReadOnly] = useState(props.readOnly);\n\n useLayoutEffect(() => {\n getDataset<CountryFieldItem[]>('countries', loadingContext, i18n.
|
|
1
|
+
{"version":3,"file":"CountryField.js","sources":["../../../../../../src/components/internal/Address/components/CountryField.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useLayoutEffect, useState } from 'preact/hooks';\nimport Field from '../../FormFields/Field';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport getDataset from '../../../../core/Services/get-dataset';\nimport { CountryFieldProps, CountryFieldItem } from '../types';\nimport Select from '../../FormFields/Select';\n\nconst formatCountries = (countries: Array<CountryFieldItem>, allowedCountries: string[]) => {\n const applyFilter = (country: CountryFieldItem) => allowedCountries.includes(country.id);\n const applyMapper = (country: CountryFieldItem) => {\n return {\n ...country,\n name: country.name,\n selectedOptionName: country.name\n };\n };\n return allowedCountries.length ? countries.filter(applyFilter).map(applyMapper) : countries.map(applyMapper);\n};\n\nexport default function CountryField(props: Readonly<CountryFieldProps>) {\n const { allowedCountries = [], classNameModifiers = [], errorMessage, onDropdownChange, value, required } = props;\n const { i18n, loadingContext } = useCoreContext();\n const [countries, setCountries] = useState<CountryFieldItem[]>([]);\n const [loaded, setLoaded] = useState<boolean>(false);\n const [readOnly, setReadOnly] = useState(props.readOnly);\n\n useLayoutEffect(() => {\n getDataset<CountryFieldItem[]>('countries', loadingContext, i18n.translationsLocale)\n .then(response => {\n const newCountries = formatCountries(response, allowedCountries);\n setCountries(newCountries || []);\n setReadOnly(newCountries.length === 1 || readOnly);\n setLoaded(true);\n })\n .catch(error => {\n console.error(error);\n setCountries([]);\n setLoaded(true);\n });\n }, []);\n\n if (!loaded) return null;\n\n return (\n <Field\n name={'country'}\n label={i18n.get('country')}\n errorMessage={errorMessage}\n classNameModifiers={classNameModifiers}\n isValid={!!value}\n showValidIcon={false}\n i18n={i18n}\n readOnly={readOnly && !!value}\n >\n <Select\n onChange={onDropdownChange}\n name={'country'}\n selectedValue={value}\n items={countries}\n readonly={readOnly && !!value}\n required={required}\n />\n </Field>\n );\n}\n"],"names":["formatCountries","countries","allowedCountries","applyMapper","country","_object_spread_props","_object_spread","name","selectedOptionName","length","filter","includes","id","map","CountryField","props","classNameModifiers","errorMessage","onDropdownChange","value","required","i18n","loadingContext","useCoreContext","setCountries","useState","loaded","setLoaded","readOnly","setReadOnly","useLayoutEffect","getDataset","translationsLocale","then","response","newCountries","catch","error","console","h","Field","label","get","isValid","showValidIcon","Select","onChange","selectedValue","items","readonly"],"mappings":"k3BAQA,MAAMA,EAAkB,CAACC,EAAoCC,KACzD,MACMC,EAAeC,GACVC,oUAAAC,CAAA,CAAA,EACAF,GAAAA,CACHG,KAAMH,EAAQG,KACdC,mBAAoBJ,EAAQG,OAGpC,OAAOL,EAAiBO,OAASR,EAAUS,OARtBN,GAA8BF,EAAiBS,SAASP,EAAQQ,KAQtBC,IAAIV,GAAeF,EAAUY,IAAIV,IAGrF,SAASW,EAAaC,GACjC,MAAMb,iBAAEA,EAAmB,GAAEc,mBAAEA,EAAqB,GAAEC,aAAEA,EAAYC,iBAAEA,EAAgBC,MAAEA,EAAKC,SAAEA,GAAaL,GACtGM,KAAEA,EAAIC,eAAEA,GAAmBC,KAC1BtB,EAAWuB,GAAgBC,EAA6B,KACxDC,EAAQC,GAAaF,GAAkB,IACvCG,EAAUC,GAAeJ,EAASV,EAAMa,UAiB/C,OAfAE,EAAgB,KACZC,EAA+B,YAAaT,EAAgBD,EAAKW,oBAC5DC,KAAKC,IACF,MAAMC,EAAenC,EAAgBkC,EAAUhC,GAC/CsB,EAAaW,GAAgB,IAC7BN,EAAoC,IAAxBM,EAAa1B,QAAgBmB,GACzCD,GAAU,KAEbS,MAAMC,IACHC,QAAQD,MAAMA,GACdb,EAAa,IACbG,GAAU,MAEnB,IAEED,EAGDa,EAACC,EAAAA,CACGjC,KAAM,UACNkC,MAAOpB,EAAKqB,IAAI,WAChBzB,aAAcA,EACdD,mBAAoBA,EACpB2B,UAAWxB,EACXyB,eAAe,EACfvB,KAAMA,EACNO,SAAUA,KAAcT,GAExBoB,EAACM,EAAAA,CACGC,SAAU5B,EACVX,KAAM,UACNwC,cAAe5B,EACf6B,MAAO/C,EACPgD,SAAUrB,KAAcT,EACxBC,SAAUA,KAnBF,IAuBxB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as e}from"../../../../external/preact/dist/preact.js";import{useState as
|
|
1
|
+
import{createElement as e}from"../../../../external/preact/dist/preact.js";import{useState as t,useLayoutEffect as r}from"../../../../external/preact/hooks/dist/hooks.js";import o from"../../FormFields/Field/Field.js";import{useCoreContext as s}from"../../../../core/Context/CoreProvider.js";import a from"../../../../core/Services/get-dataset.js";import i from"../../FormFields/Select/Select.js";function n(n){const{classNameModifiers:l,label:c,onDropdownChange:d,readOnly:m,selectedCountry:f,specifications:u,value:p,required:h}=n,{i18n:g,loadingContext:j}=s(),[v,y]=t([]),[C,F]=t(!1);return r(()=>{if(!f||!u.countryHasDataset(f))return y([]),void F(!0);a(`states/${f}`,j,g.translationsLocale).then(e=>{const t=e&&e.length?e:[];y(t),F(!0)}).catch(()=>{y([]),F(!0)})},[f]),C&&v.length?e(o,{label:c,classNameModifiers:l,errorMessage:n.errorMessage,isValid:!!p,showValidIcon:!1,name:"stateOrProvince",i18n:g,readOnly:m&&!!p},e(i,{name:"stateOrProvince",onChange:d,selectedValue:p,items:v,required:h,readonly:m&&!!p})):null}export{n as default};
|
|
2
2
|
//# sourceMappingURL=StateField.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StateField.js","sources":["../../../../../../src/components/internal/Address/components/StateField.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useState, useLayoutEffect } from 'preact/hooks';\nimport Field from '../../FormFields/Field';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport getDataset from '../../../../core/Services/get-dataset';\nimport { StateFieldItem, StateFieldProps } from '../types';\nimport Select from '../../FormFields/Select';\n\nexport default function StateField(props: Readonly<StateFieldProps>) {\n const { classNameModifiers, label, onDropdownChange, readOnly, selectedCountry, specifications, value, required } = props;\n const { i18n, loadingContext } = useCoreContext();\n const [states, setStates] = useState<StateFieldItem[]>([]);\n const [loaded, setLoaded] = useState<boolean>(false);\n\n useLayoutEffect(() => {\n if (!selectedCountry || !specifications.countryHasDataset(selectedCountry)) {\n setStates([]);\n setLoaded(true);\n return;\n }\n\n getDataset<StateFieldItem[]>(`states/${selectedCountry}`, loadingContext, i18n.
|
|
1
|
+
{"version":3,"file":"StateField.js","sources":["../../../../../../src/components/internal/Address/components/StateField.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useState, useLayoutEffect } from 'preact/hooks';\nimport Field from '../../FormFields/Field';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport getDataset from '../../../../core/Services/get-dataset';\nimport { StateFieldItem, StateFieldProps } from '../types';\nimport Select from '../../FormFields/Select';\n\nexport default function StateField(props: Readonly<StateFieldProps>) {\n const { classNameModifiers, label, onDropdownChange, readOnly, selectedCountry, specifications, value, required } = props;\n const { i18n, loadingContext } = useCoreContext();\n const [states, setStates] = useState<StateFieldItem[]>([]);\n const [loaded, setLoaded] = useState<boolean>(false);\n\n useLayoutEffect(() => {\n if (!selectedCountry || !specifications.countryHasDataset(selectedCountry)) {\n setStates([]);\n setLoaded(true);\n return;\n }\n\n getDataset<StateFieldItem[]>(`states/${selectedCountry}`, loadingContext, i18n.translationsLocale)\n .then(response => {\n const newStates = response && response.length ? response : [];\n setStates(newStates);\n setLoaded(true);\n })\n .catch(() => {\n setStates([]);\n setLoaded(true);\n });\n }, [selectedCountry]);\n\n if (!loaded || !states.length) return null;\n\n return (\n <Field\n label={label}\n classNameModifiers={classNameModifiers}\n errorMessage={props.errorMessage}\n isValid={!!value}\n showValidIcon={false}\n name={'stateOrProvince'}\n i18n={i18n}\n readOnly={readOnly && !!value}\n >\n <Select\n name={'stateOrProvince'}\n onChange={onDropdownChange}\n selectedValue={value}\n items={states}\n required={required}\n readonly={readOnly && !!value}\n />\n </Field>\n );\n}\n"],"names":["StateField","props","classNameModifiers","label","onDropdownChange","readOnly","selectedCountry","specifications","value","required","i18n","loadingContext","useCoreContext","states","setStates","useState","loaded","setLoaded","useLayoutEffect","countryHasDataset","getDataset","translationsLocale","then","response","newStates","length","catch","h","Field","errorMessage","isValid","showValidIcon","name","Select","onChange","selectedValue","items","readonly"],"mappings":"6YAQe,SAASA,EAAWC,GAC/B,MAAMC,mBAAEA,EAAkBC,MAAEA,EAAKC,iBAAEA,EAAgBC,SAAEA,EAAQC,gBAAEA,EAAeC,eAAEA,EAAcC,MAAEA,EAAKC,SAAEA,GAAaR,GAC9GS,KAAEA,EAAIC,eAAEA,GAAmBC,KAC1BC,EAAQC,GAAaC,EAA2B,KAChDC,EAAQC,GAAaF,GAAkB,GAqB9C,OAnBAG,EAAgB,KACZ,IAAKZ,IAAoBC,EAAeY,kBAAkBb,GAGtD,OAFAQ,EAAU,SACVG,GAAU,GAIdG,EAA6B,UAAUd,IAAmBK,EAAgBD,EAAKW,oBAC1EC,KAAKC,IACF,MAAMC,EAAYD,GAAYA,EAASE,OAASF,EAAW,GAC3DT,EAAUU,GACVP,GAAU,KAEbS,MAAM,KACHZ,EAAU,IACVG,GAAU,MAEnB,CAACX,IAECU,GAAWH,EAAOY,OAGnBE,EAACC,EAAAA,CACGzB,MAAOA,EACPD,mBAAoBA,EACpB2B,aAAc5B,EAAM4B,aACpBC,UAAWtB,EACXuB,eAAe,EACfC,KAAM,kBACNtB,KAAMA,EACNL,SAAUA,KAAcG,GAExBmB,EAACM,EAAAA,CACGD,KAAM,kBACNE,SAAU9B,EACV+B,cAAe3B,EACf4B,MAAOvB,EACPJ,SAAUA,EACV4B,SAAUhC,KAAcG,KAnBE,IAuB1C"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as e}from"../../../../../../external/preact/dist/preact.js";import{useState as t,useEffect as o,useCallback as r}from"../../../../../../external/preact/hooks/dist/hooks.js";import s from"../../../context/useClickToPayContext.js";import n from"../../../../../../_virtual/index.js";import{useCoreContext as c}from"../../../../../../core/Context/CoreProvider.js";import{useA11yReporter as a}from"../../../../../../core/Errors/useA11yReporter.js";import i from"../../../../Icon/Icon.js";import{isSrciError as d}from"../../../services/utils.js";import{PREFIX as
|
|
1
|
+
import{createElement as e}from"../../../../../../external/preact/dist/preact.js";import{useState as t,useEffect as o,useCallback as r}from"../../../../../../external/preact/hooks/dist/hooks.js";import s from"../../../context/useClickToPayContext.js";import n from"../../../../../../_virtual/index.js";import{useCoreContext as c}from"../../../../../../core/Context/CoreProvider.js";import{useA11yReporter as a}from"../../../../../../core/Errors/useA11yReporter.js";import i from"../../../../Icon/Icon.js";import{isSrciError as d}from"../../../services/utils.js";import{PREFIX as l}from"../../../../Icon/constants.js";import p from"../../../../Button/Button.js";const m=({onError:m,onResendCode:u,disabled:f})=>{const[k,C]=t(null),[h,j]=t(!1),{i18n:y}=c(),{startIdentityValidation:v}=s(),[_,b]=t(null);a(_),o(()=>{let e;return k>0&&(e=setTimeout(()=>C(k-1),1e3)),60===k?b(`${y.get("ctp.otp.resendCode")} - ${k}s`):0===k&&b(y.get("ctp.otp.resendCode")),()=>clearTimeout(e)},[k]),o(()=>{let e;return h&&(e=setTimeout(()=>{j(!1),C(60)},2e3)),()=>clearTimeout(e)},[h]);const x=r(async e=>{e.preventDefault();try{u(),j(!0),await v()}catch(e){if(C(0),j(!1),!d(e))return void console.error(e);m(e.reason)}},[v,m,u]);return h?e("div",{role:"alert",className:"adyen-checkout-ctp__otp-resend-code--confirmation"},y.get("ctp.otp.codeResent"),e(i,{type:`${l}checkmark_black`,height:14,width:14})):k>0?e("div",{role:"timer",className:"adyen-checkout-ctp__otp-resend-code--disabled"},y.get("ctp.otp.resendCode")," -"," ",e("span",{className:"adyen-checkout-ctp__otp-resend-code-counter"}," ",k>0&&`${k}s`," ")):e(p,{classNameModifiers:[n("otp-resend-code",{"otp-resend-code--disabled":f})],onClick:x,variant:"link",inline:!0,label:y.get("ctp.otp.resendCode"),disabled:f})};export{m as default};
|
|
2
2
|
//# sourceMappingURL=CtPResendOtpLink.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CtPResendOtpLink.js","sources":["../../../../../../../../src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePasswordInput/CtPResendOtpLink.tsx"],"sourcesContent":["import { h, TargetedMouseEvent } from 'preact';\nimport { useCallback, useEffect, useState } from 'preact/hooks';\nimport useClickToPayContext from '../../../context/useClickToPayContext';\nimport classnames from 'classnames';\nimport { useCoreContext } from '../../../../../../core/Context/CoreProvider';\nimport { useA11yReporter } from '../../../../../../core/Errors/useA11yReporter';\nimport Icon from '../../../../Icon';\nimport { isSrciError } from '../../../services/utils';\nimport { PREFIX } from '../../../../Icon/constants';\nimport Button from '../../../../Button';\n\nconst CONFIRMATION_SHOWING_TIME = 2000;\nconst RESEND_OTP_COUNTDOWN_SECONDS = 60;\n\ninterface CtPResendOtpLinkProps {\n onError(errorCode: string): void;\n onResendCode(): void;\n disabled: boolean;\n}\n\nconst CtPResendOtpLink = ({ onError, onResendCode, disabled }: Readonly<CtPResendOtpLinkProps>): h.JSX.Element => {\n const [counter, setCounter] = useState<number | null>(null);\n const [showConfirmation, setShowConfirmation] = useState<boolean>(false);\n const { i18n } = useCoreContext();\n const { startIdentityValidation } = useClickToPayContext();\n const [resendStatusMessage, setResendStatusMessage] = useState<string | null>(null);\n useA11yReporter(resendStatusMessage);\n\n useEffect(() => {\n let timeout: ReturnType<typeof setTimeout> | undefined;\n if (counter > 0) {\n timeout = setTimeout(() => setCounter(counter - 1), 1000);\n }\n if (counter === RESEND_OTP_COUNTDOWN_SECONDS) {\n setResendStatusMessage(`${i18n.get('ctp.otp.resendCode')} - ${counter}s`);\n } else if (counter === 0) {\n setResendStatusMessage(i18n.get('ctp.otp.resendCode'));\n }\n return () => clearTimeout(timeout);\n }, [counter]);\n\n useEffect(() => {\n let timeout: ReturnType<typeof setTimeout> | undefined;\n\n if (showConfirmation) {\n timeout = setTimeout(() => {\n setShowConfirmation(false);\n setCounter(RESEND_OTP_COUNTDOWN_SECONDS);\n }, CONFIRMATION_SHOWING_TIME);\n }\n return () => clearTimeout(timeout);\n }, [showConfirmation]);\n\n const handleResendCodeClick = useCallback(\n async (event: TargetedMouseEvent<HTMLButtonElement>) => {\n event.preventDefault();\n\n try {\n onResendCode();\n setShowConfirmation(true);\n await startIdentityValidation();\n } catch (error: unknown) {\n setCounter(0);\n setShowConfirmation(false);\n\n if (!isSrciError(error)) {\n console.error(error);\n return;\n }\n\n onError(error.reason);\n }\n },\n [startIdentityValidation, onError, onResendCode]\n );\n\n if (showConfirmation) {\n return (\n <div role=\"alert\" className=\"adyen-checkout-ctp__otp-resend-code--confirmation\">\n {i18n.get('ctp.otp.codeResent')}\n <Icon type={`${PREFIX}checkmark_black`} height={14} width={14} />\n </div>\n );\n }\n\n if (counter > 0) {\n return (\n <div role=\"timer\" className=\"adyen-checkout-ctp__otp-resend-code--disabled\">\n {i18n.get('ctp.otp.resendCode')} -{' '}\n <span className=\"adyen-checkout-ctp__otp-resend-code-counter\"> {counter > 0 && `${counter}s`} </span>\n </div>\n );\n }\n\n return (\n <Button\n classNameModifiers={[classnames('otp-resend-code', { 'otp-resend-code--disabled': disabled })]}\n onClick={handleResendCodeClick}\n variant=\"link\"\n inline={true}\n
|
|
1
|
+
{"version":3,"file":"CtPResendOtpLink.js","sources":["../../../../../../../../src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePasswordInput/CtPResendOtpLink.tsx"],"sourcesContent":["import { h, TargetedMouseEvent } from 'preact';\nimport { useCallback, useEffect, useState } from 'preact/hooks';\nimport useClickToPayContext from '../../../context/useClickToPayContext';\nimport classnames from 'classnames';\nimport { useCoreContext } from '../../../../../../core/Context/CoreProvider';\nimport { useA11yReporter } from '../../../../../../core/Errors/useA11yReporter';\nimport Icon from '../../../../Icon';\nimport { isSrciError } from '../../../services/utils';\nimport { PREFIX } from '../../../../Icon/constants';\nimport Button from '../../../../Button';\n\nconst CONFIRMATION_SHOWING_TIME = 2000;\nconst RESEND_OTP_COUNTDOWN_SECONDS = 60;\n\ninterface CtPResendOtpLinkProps {\n onError(errorCode: string): void;\n onResendCode(): void;\n disabled: boolean;\n}\n\nconst CtPResendOtpLink = ({ onError, onResendCode, disabled }: Readonly<CtPResendOtpLinkProps>): h.JSX.Element => {\n const [counter, setCounter] = useState<number | null>(null);\n const [showConfirmation, setShowConfirmation] = useState<boolean>(false);\n const { i18n } = useCoreContext();\n const { startIdentityValidation } = useClickToPayContext();\n const [resendStatusMessage, setResendStatusMessage] = useState<string | null>(null);\n useA11yReporter(resendStatusMessage);\n\n useEffect(() => {\n let timeout: ReturnType<typeof setTimeout> | undefined;\n if (counter > 0) {\n timeout = setTimeout(() => setCounter(counter - 1), 1000);\n }\n if (counter === RESEND_OTP_COUNTDOWN_SECONDS) {\n setResendStatusMessage(`${i18n.get('ctp.otp.resendCode')} - ${counter}s`);\n } else if (counter === 0) {\n setResendStatusMessage(i18n.get('ctp.otp.resendCode'));\n }\n return () => clearTimeout(timeout);\n }, [counter]);\n\n useEffect(() => {\n let timeout: ReturnType<typeof setTimeout> | undefined;\n\n if (showConfirmation) {\n timeout = setTimeout(() => {\n setShowConfirmation(false);\n setCounter(RESEND_OTP_COUNTDOWN_SECONDS);\n }, CONFIRMATION_SHOWING_TIME);\n }\n return () => clearTimeout(timeout);\n }, [showConfirmation]);\n\n const handleResendCodeClick = useCallback(\n async (event: TargetedMouseEvent<HTMLButtonElement>) => {\n event.preventDefault();\n\n try {\n onResendCode();\n setShowConfirmation(true);\n await startIdentityValidation();\n } catch (error: unknown) {\n setCounter(0);\n setShowConfirmation(false);\n\n if (!isSrciError(error)) {\n console.error(error);\n return;\n }\n\n onError(error.reason);\n }\n },\n [startIdentityValidation, onError, onResendCode]\n );\n\n if (showConfirmation) {\n return (\n <div role=\"alert\" className=\"adyen-checkout-ctp__otp-resend-code--confirmation\">\n {i18n.get('ctp.otp.codeResent')}\n <Icon type={`${PREFIX}checkmark_black`} height={14} width={14} />\n </div>\n );\n }\n\n if (counter > 0) {\n return (\n <div role=\"timer\" className=\"adyen-checkout-ctp__otp-resend-code--disabled\">\n {i18n.get('ctp.otp.resendCode')} -{' '}\n <span className=\"adyen-checkout-ctp__otp-resend-code-counter\"> {counter > 0 && `${counter}s`} </span>\n </div>\n );\n }\n\n return (\n <Button\n classNameModifiers={[classnames('otp-resend-code', { 'otp-resend-code--disabled': disabled })]}\n onClick={handleResendCodeClick}\n variant=\"link\"\n inline={true}\n label={i18n.get('ctp.otp.resendCode')}\n disabled={disabled}\n />\n );\n};\n\nexport default CtPResendOtpLink;\n"],"names":["CtPResendOtpLink","onError","onResendCode","disabled","counter","setCounter","useState","showConfirmation","setShowConfirmation","i18n","useCoreContext","startIdentityValidation","useClickToPayContext","resendStatusMessage","setResendStatusMessage","useA11yReporter","useEffect","timeout","setTimeout","get","clearTimeout","handleResendCodeClick","useCallback","async","event","preventDefault","error","isSrciError","console","reason","h","div","role","className","Icon","type","PREFIX","height","width","span","Button","classNameModifiers","classnames","onClick","variant","inline","label"],"mappings":"opBAWA,MASMA,EAAmB,EAAGC,UAASC,eAAcC,eAC/C,MAAOC,EAASC,GAAcC,EAAwB,OAC/CC,EAAkBC,GAAuBF,GAAkB,IAC5DG,KAAEA,GAASC,KACXC,wBAAEA,GAA4BC,KAC7BC,EAAqBC,GAA0BR,EAAwB,MAC9ES,EAAgBF,GAEhBG,EAAU,KACN,IAAIC,EASJ,OARIb,EAAU,IACVa,EAAUC,WAAW,IAAMb,EAAWD,EAAU,GAAI,MAnB3B,KAqBzBA,EACAU,EAAuB,GAAGL,EAAKU,IAAI,2BAA2Bf,MAC3C,IAAZA,GACPU,EAAuBL,EAAKU,IAAI,uBAE7B,IAAMC,aAAaH,IAC3B,CAACb,IAEJY,EAAU,KACN,IAAIC,EAQJ,OANIV,IACAU,EAAUC,WAAW,KACjBV,GAAoB,GACpBH,EAnCqB,KADH,MAuCnB,IAAMe,aAAaH,IAC3B,CAACV,IAEJ,MAAMc,EAAwBC,EAC1BC,MAAOC,IACHA,EAAMC,iBAEN,IACIvB,IACAM,GAAoB,SACdG,GACV,CAAE,MAAOe,GAIL,GAHArB,EAAW,GACXG,GAAoB,IAEfmB,EAAYD,GAEb,YADAE,QAAQF,MAAMA,GAIlBzB,EAAQyB,EAAMG,OAClB,GAEJ,CAAClB,EAAyBV,EAASC,IAGvC,OAAIK,EAEIuB,EAACC,MAAAA,CAAIC,KAAK,QAAQC,UAAU,qDACvBxB,EAAKU,IAAI,sBACVW,EAACI,EAAAA,CAAKC,KAAM,GAAGC,mBAAyBC,OAAQ,GAAIC,MAAO,MAKnElC,EAAU,EAEN0B,EAACC,MAAAA,CAAIC,KAAK,QAAQC,UAAU,iDACvBxB,EAAKU,IAAI,sBAAsB,KAAG,IACnCW,EAACS,OAAAA,CAAKN,UAAU,+CAA8C,IAAE7B,EAAU,GAAK,GAAGA,KAAW,MAMrG0B,EAACU,EAAAA,CACGC,mBAAoB,CAACC,EAAW,kBAAmB,CAAE,4BAA6BvC,KAClFwC,QAAStB,EACTuB,QAAQ,OACRC,QAAQ,EACRC,MAAOrC,EAAKU,IAAI,sBAChBhB,SAAUA"}
|
package/dist/es-legacy/components/internal/ClickToPay/components/CtPSection/CtPLogoutLink.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createElement as t}from"../../../../../external/preact/dist/preact.js";import o from"../../context/useClickToPayContext.js";import{CtpState as e}from"../../services/ClickToPayService.js";import r from"../../../../../_virtual/index.js";import{useMemo as n}from"../../../../../external/preact/hooks/dist/hooks.js";import{useCoreContext as s}from"../../../../../core/Context/CoreProvider.js";import i from"../../../Button/Button.js";const a=()=>{const{ctpState:a,logoutShopper:l,status:c,cards:u}=o(),{i18n:d}=s();if(!1===[e.Ready,e.OneTimePassword].includes(a))return null;const m=n(()=>a===e.Ready&&u.length>1?d.get("ctp.logout.notYourCards"):a===e.Ready&&1===u.length?d.get("ctp.logout.notYourCard"):a===e.Ready&&0===u.length?d.get("ctp.logout.notYourProfile"):d.get("ctp.logout.notYou"),[d,a]);return t(i,{classNameModifiers:[r("section-logout-button",{"section-logout-button--disabled":"loading"===c})],disabled:"loading"===c,onClick:l,variant:"link",inline:!0
|
|
1
|
+
import{createElement as t}from"../../../../../external/preact/dist/preact.js";import o from"../../context/useClickToPayContext.js";import{CtpState as e}from"../../services/ClickToPayService.js";import r from"../../../../../_virtual/index.js";import{useMemo as n}from"../../../../../external/preact/hooks/dist/hooks.js";import{useCoreContext as s}from"../../../../../core/Context/CoreProvider.js";import i from"../../../Button/Button.js";const a=()=>{const{ctpState:a,logoutShopper:l,status:c,cards:u}=o(),{i18n:d}=s();if(!1===[e.Ready,e.OneTimePassword].includes(a))return null;const m=n(()=>a===e.Ready&&u.length>1?d.get("ctp.logout.notYourCards"):a===e.Ready&&1===u.length?d.get("ctp.logout.notYourCard"):a===e.Ready&&0===u.length?d.get("ctp.logout.notYourProfile"):d.get("ctp.logout.notYou"),[d,a]);return t(i,{classNameModifiers:[r("section-logout-button",{"section-logout-button--disabled":"loading"===c})],disabled:"loading"===c,onClick:l,variant:"link",inline:!0,label:m})};export{a as default};
|
|
2
2
|
//# sourceMappingURL=CtPLogoutLink.js.map
|
package/dist/es-legacy/components/internal/ClickToPay/components/CtPSection/CtPLogoutLink.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CtPLogoutLink.js","sources":["../../../../../../../src/components/internal/ClickToPay/components/CtPSection/CtPLogoutLink.tsx"],"sourcesContent":["import { h } from 'preact';\nimport useClickToPayContext from '../../context/useClickToPayContext';\nimport { CtpState } from '../../services/ClickToPayService';\nimport classnames from 'classnames';\nimport { useMemo } from 'preact/hooks';\nimport { useCoreContext } from '../../../../../core/Context/CoreProvider';\nimport './CtPLogoutLink.scss';\nimport Button from '../../../Button';\n\nconst CtPLogoutLink = () => {\n const { ctpState, logoutShopper, status, cards } = useClickToPayContext();\n const { i18n } = useCoreContext();\n\n if ([CtpState.Ready, CtpState.OneTimePassword].includes(ctpState) === false) {\n return null;\n }\n\n const label = useMemo(() => {\n if (ctpState === CtpState.Ready && cards.length > 1) return i18n.get('ctp.logout.notYourCards');\n if (ctpState === CtpState.Ready && cards.length === 1) return i18n.get('ctp.logout.notYourCard');\n if (ctpState === CtpState.Ready && cards.length === 0) return i18n.get('ctp.logout.notYourProfile');\n return i18n.get('ctp.logout.notYou');\n }, [i18n, ctpState]);\n\n return (\n <Button\n classNameModifiers={[\n classnames('section-logout-button', {\n 'section-logout-button--disabled': status === 'loading'\n })\n ]}\n disabled={status === 'loading'}\n onClick={logoutShopper}\n variant=\"link\"\n inline={true}\n
|
|
1
|
+
{"version":3,"file":"CtPLogoutLink.js","sources":["../../../../../../../src/components/internal/ClickToPay/components/CtPSection/CtPLogoutLink.tsx"],"sourcesContent":["import { h } from 'preact';\nimport useClickToPayContext from '../../context/useClickToPayContext';\nimport { CtpState } from '../../services/ClickToPayService';\nimport classnames from 'classnames';\nimport { useMemo } from 'preact/hooks';\nimport { useCoreContext } from '../../../../../core/Context/CoreProvider';\nimport './CtPLogoutLink.scss';\nimport Button from '../../../Button';\n\nconst CtPLogoutLink = () => {\n const { ctpState, logoutShopper, status, cards } = useClickToPayContext();\n const { i18n } = useCoreContext();\n\n if ([CtpState.Ready, CtpState.OneTimePassword].includes(ctpState) === false) {\n return null;\n }\n\n const label = useMemo(() => {\n if (ctpState === CtpState.Ready && cards.length > 1) return i18n.get('ctp.logout.notYourCards');\n if (ctpState === CtpState.Ready && cards.length === 1) return i18n.get('ctp.logout.notYourCard');\n if (ctpState === CtpState.Ready && cards.length === 0) return i18n.get('ctp.logout.notYourProfile');\n return i18n.get('ctp.logout.notYou');\n }, [i18n, ctpState]);\n\n return (\n <Button\n classNameModifiers={[\n classnames('section-logout-button', {\n 'section-logout-button--disabled': status === 'loading'\n })\n ]}\n disabled={status === 'loading'}\n onClick={logoutShopper}\n variant=\"link\"\n inline={true}\n label={label}\n />\n );\n};\n\nexport default CtPLogoutLink;\n"],"names":["CtPLogoutLink","ctpState","logoutShopper","status","cards","useClickToPayContext","i18n","useCoreContext","CtpState","Ready","OneTimePassword","includes","label","useMemo","length","get","h","Button","classNameModifiers","classnames","disabled","onClick","variant","inline"],"mappings":"qbASA,MAAMA,EAAgB,KAClB,MAAMC,SAAEA,EAAQC,cAAEA,EAAaC,OAAEA,EAAMC,MAAEA,GAAUC,KAC7CC,KAAEA,GAASC,IAEjB,IAAsE,IAAlE,CAACC,EAASC,MAAOD,EAASE,iBAAiBC,SAASV,GACpD,OAAO,KAGX,MAAMW,EAAQC,EAAQ,IACdZ,IAAaO,EAASC,OAASL,EAAMU,OAAS,EAAUR,EAAKS,IAAI,2BACjEd,IAAaO,EAASC,OAA0B,IAAjBL,EAAMU,OAAqBR,EAAKS,IAAI,0BACnEd,IAAaO,EAASC,OAA0B,IAAjBL,EAAMU,OAAqBR,EAAKS,IAAI,6BAChET,EAAKS,IAAI,qBACjB,CAACT,EAAML,IAEV,OACIe,EAACC,EAAAA,CACGC,mBAAoB,CAChBC,EAAW,wBAAyB,CAChC,kCAA8C,YAAXhB,KAG3CiB,SAAqB,YAAXjB,EACVkB,QAASnB,EACToB,QAAQ,OACRC,QAAQ,EACRX,MAAOA"}
|
package/dist/es-legacy/components/internal/SecuredFields/lib/securedField/utils/processAriaConfig.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{addErrorTranslationsToObject as e}from"../../../../../../core/Errors/utils.js";import t from"../../utilities/addContextTranslations.js";import{SF_FIELDS_MAP as r}from"../../constants.js";function n(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function o(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}),e}function c(c,i,l,a){const s=["giftcard"].includes(c)?c:"creditCard";let f=l.get(`${s}.${i}.aria.iframeTitle`);"none"===f&&(f="");const u=l.get(`${s}.${r[i]}.label`),b=l.
|
|
1
|
+
import{addErrorTranslationsToObject as e}from"../../../../../../core/Errors/utils.js";import t from"../../utilities/addContextTranslations.js";import{SF_FIELDS_MAP as r}from"../../constants.js";function n(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function o(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}),e}function c(c,i,l,a){const s=["giftcard"].includes(c)?c:"creditCard";let f=l.get(`${s}.${i}.aria.iframeTitle`);"none"===f&&(f="");const u=l.get(`${s}.${r[i]}.label`),b=l.translationsLocale;let p=e({iframeTitle:f,label:u},l,i);return a&&(p=t(p,l,c,i)),o(function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},o=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(r).filter(function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable}))),o.forEach(function(t){n(e,t,r[t])})}return e}({},b&&{lang:b}),{[i]:p})}export{c as processAriaConfig};
|
|
2
2
|
//# sourceMappingURL=processAriaConfig.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"processAriaConfig.js","sources":["../../../../../../../../src/components/internal/SecuredFields/lib/securedField/utils/processAriaConfig.ts"],"sourcesContent":["import { addErrorTranslationsToObject } from '../../../../../../core/Errors/utils';\nimport addContextTranslationsToObject from '../../utilities/addContextTranslations';\nimport Language from '../../../../../../language/Language';\nimport { SF_FIELDS_MAP } from '../../constants';\nimport { AriaConfig, AriaConfigObject } from '../../types';\n\n/**\n * Creates an ariaConfig object with 'iframeTitle' and 'label' properties, whose values are retrieved from the translations object.\n * (These values either come from the translation file or have been overwritten by the merchant in a translations config object.)\n * We then add an error object containing the possible errors for any securedField read from the translation file and stored under error-codes\n */\nexport function processAriaConfig(txVariant: string, fieldType: string, i18n: Language, showContextuaElement): AriaConfig {\n // txVariant can be the scheme name (VISA, Mastercard...) so we put all of them under creditCard\n const type = ['giftcard'].includes(txVariant) ? txVariant : 'creditCard';\n\n // Get translation for iframeTitle\n let iframeTitle: string = i18n.get(`${type}.${fieldType}.aria.iframeTitle`);\n\n /**\n * Fix bug where, if iframeTitle was set to 'none', although we didn't add it to the iframe element, we still passed it through to the securedField\n * where it got set as the title of the html page\n */\n if (iframeTitle === 'none') {\n iframeTitle = '';\n }\n\n // Get translation for aria label using *same* key that is used to label the element - important a11y consideration for (securedField) iframe\n const label: string = i18n.get(`${type}.${SF_FIELDS_MAP[fieldType]}.label`);\n\n // Get lang property\n const lang = i18n.
|
|
1
|
+
{"version":3,"file":"processAriaConfig.js","sources":["../../../../../../../../src/components/internal/SecuredFields/lib/securedField/utils/processAriaConfig.ts"],"sourcesContent":["import { addErrorTranslationsToObject } from '../../../../../../core/Errors/utils';\nimport addContextTranslationsToObject from '../../utilities/addContextTranslations';\nimport Language from '../../../../../../language/Language';\nimport { SF_FIELDS_MAP } from '../../constants';\nimport { AriaConfig, AriaConfigObject } from '../../types';\n\n/**\n * Creates an ariaConfig object with 'iframeTitle' and 'label' properties, whose values are retrieved from the translations object.\n * (These values either come from the translation file or have been overwritten by the merchant in a translations config object.)\n * We then add an error object containing the possible errors for any securedField read from the translation file and stored under error-codes\n */\nexport function processAriaConfig(txVariant: string, fieldType: string, i18n: Language, showContextuaElement): AriaConfig {\n // txVariant can be the scheme name (VISA, Mastercard...) so we put all of them under creditCard\n const type = ['giftcard'].includes(txVariant) ? txVariant : 'creditCard';\n\n // Get translation for iframeTitle\n let iframeTitle: string = i18n.get(`${type}.${fieldType}.aria.iframeTitle`);\n\n /**\n * Fix bug where, if iframeTitle was set to 'none', although we didn't add it to the iframe element, we still passed it through to the securedField\n * where it got set as the title of the html page\n */\n if (iframeTitle === 'none') {\n iframeTitle = '';\n }\n\n // Get translation for aria label using *same* key that is used to label the element - important a11y consideration for (securedField) iframe\n const label: string = i18n.get(`${type}.${SF_FIELDS_MAP[fieldType]}.label`);\n\n // Get lang property. It must match the language of the copy that is rendered, not the locale used for formatting\n const lang = i18n.translationsLocale;\n\n // Create a new object with the iframeTitle & label values from translation file\n const ariaFieldConfigObj: AriaConfigObject = { iframeTitle, label };\n\n // Add error translations object\n let enhancedAriaFieldConfigObj: AriaConfigObject = addErrorTranslationsToObject(ariaFieldConfigObj, i18n, fieldType);\n\n // If allowed, add the translated contextual texts\n if (showContextuaElement) {\n enhancedAriaFieldConfigObj = addContextTranslationsToObject(enhancedAriaFieldConfigObj, i18n, txVariant, fieldType);\n }\n\n // Create a new aria config object keeping the old entries and adding a new one for this field\n // N.B. need to do this deconstruction of the original aria config object to break existing refs & avoid getting an \"accumulated\" object\n return {\n ...(lang && { lang }),\n [fieldType]: enhancedAriaFieldConfigObj\n } as AriaConfig;\n}\n"],"names":["processAriaConfig","txVariant","fieldType","i18n","showContextuaElement","type","includes","iframeTitle","get","label","SF_FIELDS_MAP","lang","translationsLocale","enhancedAriaFieldConfigObj","addErrorTranslationsToObject","addContextTranslationsToObject","_object_spread_props"],"mappings":"uqBAWO,SAASA,EAAkBC,EAAmBC,EAAmBC,EAAgBC,GAEpF,MAAMC,EAAO,CAAC,YAAYC,SAASL,GAAaA,EAAY,aAG5D,IAAIM,EAAsBJ,EAAKK,IAAI,GAAGH,KAAQH,sBAM1B,SAAhBK,IACAA,EAAc,IAIlB,MAAME,EAAgBN,EAAKK,IAAI,GAAGH,KAAQK,EAAcR,YAGlDS,EAAOR,EAAKS,mBAMlB,IAAIC,EAA+CC,EAHN,CAAEP,cAAaE,SAGwCN,EAAMD,GAS1G,OANIE,IACAS,EAA6BE,EAA+BF,EAA4BV,EAAMF,EAAWC,IAKtGc,wUACCL,GAAQ,CAAEA,SAAK,CACnBT,CAACA,GAAYW,GAErB"}
|