@adyen/adyen-web 6.37.0 → 6.38.0

package/dist/es-legacy/components/Dropin/components/PaymentMethod/PaymentMethodItem/PaymentMethodItem.js

@@ -1,2 +1,2 @@
-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,D=`remove-${e._id}`,M=`container-${e._id}`,S=`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:S,showRadioButton:C,isSelected:y,expandContentId:M,standalone:P},t(a,b(u({},e.props.oneClick&&{altDescription: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,onKeyPress:l,onKeyDown:l,ariaExpanded:this.state.showDisableStoredPaymentMethodConfirmation,ariaControls:D},g.get("storedPaymentMethod.disable.button"))),t("div",{className:"adyen-checkout-pm-details-wrapper","aria-hidden":!y},t("div",{className:"adyen-checkout__payment-method__details",id:M,inert:!y||void 0},w&&t(i,{id:D,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};
+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,onKeyPress:l,onKeyDown:l,ariaExpanded:this.state.showDisableStoredPaymentMethodConfirmation,ariaControls:M},g.get("storedPaymentMethod.disable.button"))),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};
 //# sourceMappingURL=PaymentMethodItem.js.map

package/dist/es-legacy/components/Dropin/components/PaymentMethod/PaymentMethodItem/PaymentMethodItem.js.map

@@ -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 && { altDescription: 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                            onKeyPress={stopPropagationForActionKeys}\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","altDescription","getFullBrandName","brand","src","icon","PaymentMethodName","displayName","additionalInfo","PaymentMethodBrands","showOtherInsteadOfNumber","keepBrandsVisible","excludedUIBrands","BRAND_ICON_UI_EXCLUSION_LIST","isPaymentMethodSelected","Button","inline","variant","toggleDisableConfirmation","onKeyPress","stopPropagationForActionKeys","onKeyDown","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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"}
+{"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                            onKeyPress={stopPropagationForActionKeys}\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","onKeyPress","stopPropagationForActionKeys","onKeyDown","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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"}

package/dist/es-legacy/components/PayTo/components/BSBInput.js

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../external/preact/dist/preact.js";import r from"../../internal/FormFields/Fieldset/Fieldset.js";import{useEffect as a,useRef as t}from"../../../external/preact/hooks/dist/hooks.js";import o from"../../../utils/useForm/useForm.js";import{getErrorMessage as s}from"../../../utils/getErrorMessage.js";import n from"../../internal/FormFields/Field/Field.js";import{useCoreContext as i}from"../../../core/Context/CoreProvider.js";import l from"../../internal/FormFields/InputText.js";import{bsbValidationRules as b}from"./validate.js";import{phoneFormatters as u}from"../../internal/PhoneInput/validate.js";import m from"./PayToNameFields.js";const c=["bankAccountNumber","bsb","firstName","lastName"];function d({setComponentRef:d,defaultData:p,placeholders:f,onChange:N,setStatus:h,id:k}){const{i18n:F}=i(),g=o({schema:c,defaultData:p,rules:b,formatters:u}),{handleChangeFor:j,triggerValidation:A,data:v,errors:B,valid:C,isValid:M}=g;a(()=>{N({data:v,valid:C,errors:B,isValid:M})},[v,C,B,M]);const x=t({setStatus:h,showValidation:A});return a(()=>{d(x.current)},[d]),e(r,{id:k,classNameModifiers:["payto__bsb_input"],label:"BSB",description:"payto.bsb.description"},e(n,{label:F.get("payto.bsb.label.bankAccountNumber"),classNameModifiers:["col-60","bankAccountNumber"],errorMessage:s(F,B.bankAccountNumber,F.get("payto.bsb.label.bankAccountNumber")),name:"bankAccountNumber",i18n:F},e(l,{name:"bankAccountNumber",value:v.bankAccountNumber,onInput:j("bankAccountNumber","input"),onBlur:j("bankAccountNumber","blur"),placeholder:null==f?void 0:f.bankAccountNumber,required:!0})),e(n,{label:F.get("Bank State Branch"),classNameModifiers:["col-40","bsb"],errorMessage:s(F,B.bsb,F.get("Bank State Branch")),name:"bsb",i18n:F},e(l,{name:"bsb",value:v.bsb,onInput:j("bsb","input"),onBlur:j("bsb","blur"),placeholder:null==f?void 0:f.bsb,required:!0})),e(m,{i18n:F,data:v,handleChangeFor:j,errors:B,placeholders:f}))}export{d as default};
+import{createElement as e}from"../../../external/preact/dist/preact.js";import r from"../../internal/FormFields/Fieldset/Fieldset.js";import{useEffect as t,useRef as a}from"../../../external/preact/hooks/dist/hooks.js";import o from"../../../utils/useForm/useFormWithA11y.js";import"../../internal/SecuredFields/lib/CSF/utils/userAgent.js";import{getErrorMessage as s}from"../../../utils/getErrorMessage.js";import n from"../../internal/FormFields/Field/Field.js";import{useCoreContext as i}from"../../../core/Context/CoreProvider.js";import l from"../../internal/FormFields/InputText.js";import{bsbValidationRules as u}from"./validate.js";import{phoneFormatters as b}from"../../internal/PhoneInput/validate.js";import m from"./PayToNameFields.js";const c=["bankAccountNumber","bsb","firstName","lastName"];function d({setComponentRef:d,defaultData:p,placeholders:f,onChange:h,setStatus:F,id:N}){const{i18n:k}=i(),g=o({schema:c,defaultData:p,rules:u,formatters:b,formHolder:`#${N}`}),{handleChangeFor:A,triggerValidation:j,data:v,errors:B,valid:C,isValid:S}=g;t(()=>{h({data:v,valid:C,errors:B,isValid:S})},[v,C,B,S]);const y=a({setStatus:F,showValidation:j});return t(()=>{d(y.current)},[d]),e(r,{id:N,classNameModifiers:["payto__bsb_input"],label:"BSB",description:"payto.bsb.description"},e(n,{label:k.get("payto.bsb.label.bankAccountNumber"),classNameModifiers:["col-60","bankAccountNumber"],errorMessage:s(k,B.bankAccountNumber,k.get("payto.bsb.label.bankAccountNumber")),name:"bankAccountNumber",i18n:k,errorLive:!0},e(l,{name:"bankAccountNumber",value:v.bankAccountNumber,onInput:A("bankAccountNumber","input"),onBlur:A("bankAccountNumber","blur"),placeholder:null==f?void 0:f.bankAccountNumber,required:!0})),e(n,{label:k.get("Bank State Branch"),classNameModifiers:["col-40","bsb"],errorMessage:s(k,B.bsb,k.get("Bank State Branch")),name:"bsb",i18n:k,errorLive:!0},e(l,{name:"bsb",value:v.bsb,onInput:A("bsb","input"),onBlur:A("bsb","blur"),placeholder:null==f?void 0:f.bsb,required:!0})),e(m,{i18n:k,data:v,handleChangeFor:A,errors:B,placeholders:f}))}export{d as default};
 //# sourceMappingURL=BSBInput.js.map

package/dist/es-legacy/components/PayTo/components/BSBInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"BSBInput.js","sources":["../../../../../src/components/PayTo/components/BSBInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport Fieldset from '../../internal/FormFields/Fieldset';\nimport { useEffect, useRef } from 'preact/hooks';\nimport useForm from '../../../utils/useForm';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport Field from '../../internal/FormFields/Field';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport InputText from '../../internal/FormFields/InputText';\nimport { bsbValidationRules } from './validate';\nimport './PayIDInput.scss';\nimport { phoneFormatters } from '../../internal/PhoneInput/validate';\nimport { ComponentMethodsRef, UIElementStatus } from '../../internal/UIElement/types';\nimport PayToNameFields from './PayToNameFields';\nimport { PayToPlaceholdersType } from '../types';\n\nexport interface BSBFormData {\n    bsb: string;\n    bankAccountNumber: string;\n    firstName: string;\n    lastName: string;\n}\n\nexport interface BSBInputProps {\n    status: UIElementStatus;\n    setStatus: (status: UIElementStatus) => void;\n    defaultData: BSBFormData;\n    placeholders: PayToPlaceholdersType;\n    onChange: (e) => void;\n    setComponentRef: (ref: ComponentMethodsRef) => void;\n    id?: string;\n}\n\nconst BASE_SCHEMA = ['bankAccountNumber', 'bsb', 'firstName', 'lastName'];\n\nexport default function BSBInput({ setComponentRef, defaultData, placeholders, onChange, setStatus, id }: Readonly<BSBInputProps>) {\n    const { i18n } = useCoreContext();\n\n    const form = useForm<BSBFormData>({\n        schema: BASE_SCHEMA,\n        defaultData: defaultData,\n        rules: bsbValidationRules,\n        formatters: phoneFormatters\n    });\n    const { handleChangeFor, triggerValidation, data, errors, valid, isValid } = form;\n\n    // standard onChange propagate to parent state\n    useEffect(() => {\n        onChange({ data, valid, errors, isValid });\n    }, [data, valid, errors, isValid]);\n\n    const payToRef = useRef<ComponentMethodsRef>({\n        setStatus: setStatus,\n        showValidation: triggerValidation\n    });\n\n    useEffect(() => {\n        setComponentRef(payToRef.current);\n    }, [setComponentRef]);\n\n    return (\n        <Fieldset id={id} classNameModifiers={['payto__bsb_input']} label={'BSB'} description={'payto.bsb.description'}>\n            <Field\n                label={i18n.get('payto.bsb.label.bankAccountNumber')}\n                classNameModifiers={['col-60', 'bankAccountNumber']}\n                errorMessage={getErrorMessage(i18n, errors.bankAccountNumber, i18n.get('payto.bsb.label.bankAccountNumber'))}\n                name={'bankAccountNumber'}\n                i18n={i18n}\n            >\n                <InputText\n                    name={'bankAccountNumber'}\n                    value={data.bankAccountNumber}\n                    onInput={handleChangeFor('bankAccountNumber', 'input')}\n                    onBlur={handleChangeFor('bankAccountNumber', 'blur')}\n                    placeholder={placeholders?.bankAccountNumber}\n                    required={true}\n                />\n            </Field>\n\n            <Field\n                label={i18n.get('Bank State Branch')}\n                classNameModifiers={['col-40', 'bsb']}\n                errorMessage={getErrorMessage(i18n, errors.bsb, i18n.get('Bank State Branch'))}\n                name={'bsb'}\n                i18n={i18n}\n            >\n                <InputText\n                    name={'bsb'}\n                    value={data.bsb}\n                    onInput={handleChangeFor('bsb', 'input')}\n                    onBlur={handleChangeFor('bsb', 'blur')}\n                    placeholder={placeholders?.bsb}\n                    required={true}\n                />\n            </Field>\n\n            <PayToNameFields i18n={i18n} data={data} handleChangeFor={handleChangeFor} errors={errors} placeholders={placeholders} />\n        </Fieldset>\n    );\n}\n"],"names":["BASE_SCHEMA","BSBInput","setComponentRef","defaultData","placeholders","onChange","setStatus","id","i18n","useCoreContext","form","useForm","schema","rules","bsbValidationRules","formatters","phoneFormatters","handleChangeFor","triggerValidation","data","errors","valid","isValid","useEffect","payToRef","useRef","showValidation","current","h","Fieldset","classNameModifiers","label","description","Field","get","errorMessage","getErrorMessage","bankAccountNumber","name","InputText","value","onInput","onBlur","placeholder","required","bsb","PayToNameFields"],"mappings":"oqBAgCA,MAAMA,EAAc,CAAC,oBAAqB,MAAO,YAAa,YAE/C,SAASC,GAASC,gBAAEA,EAAeC,YAAEA,EAAWC,aAAEA,EAAYC,SAAEA,EAAQC,UAAEA,EAASC,GAAEA,IAChG,MAAMC,KAAEA,GAASC,IAEXC,EAAOC,EAAqB,CAC9BC,OAAQZ,EACRG,YAAaA,EACbU,MAAOC,EACPC,WAAYC,KAEVC,gBAAEA,EAAeC,kBAAEA,EAAiBC,KAAEA,EAAIC,OAAEA,EAAMC,MAAEA,EAAKC,QAAEA,GAAYZ,EAG7Ea,EAAU,KACNlB,EAAS,CAAEc,OAAME,QAAOD,SAAQE,aACjC,CAACH,EAAME,EAAOD,EAAQE,IAEzB,MAAME,EAAWC,EAA4B,CACzCnB,UAAWA,EACXoB,eAAgBR,IAOpB,OAJAK,EAAU,KACNrB,EAAgBsB,EAASG,UAC1B,CAACzB,IAGA0B,EAACC,EAAAA,CAAStB,GAAIA,EAAIuB,mBAAoB,CAAC,oBAAqBC,MAAO,MAAOC,YAAa,yBACnFJ,EAACK,EAAAA,CACGF,MAAOvB,EAAK0B,IAAI,qCAChBJ,mBAAoB,CAAC,SAAU,qBAC/BK,aAAcC,EAAgB5B,EAAMY,EAAOiB,kBAAmB7B,EAAK0B,IAAI,sCACvEI,KAAM,oBACN9B,KAAMA,GAENoB,EAACW,EAAAA,CACGD,KAAM,oBACNE,MAAOrB,EAAKkB,kBACZI,QAASxB,EAAgB,oBAAqB,SAC9CyB,OAAQzB,EAAgB,oBAAqB,QAC7C0B,YAAavC,aAAAA,EAAAA,EAAciC,kBAC3BO,UAAU,KAIlBhB,EAACK,EAAAA,CACGF,MAAOvB,EAAK0B,IAAI,qBAChBJ,mBAAoB,CAAC,SAAU,OAC/BK,aAAcC,EAAgB5B,EAAMY,EAAOyB,IAAKrC,EAAK0B,IAAI,sBACzDI,KAAM,MACN9B,KAAMA,GAENoB,EAACW,EAAAA,CACGD,KAAM,MACNE,MAAOrB,EAAK0B,IACZJ,QAASxB,EAAgB,MAAO,SAChCyB,OAAQzB,EAAgB,MAAO,QAC/B0B,YAAavC,aAAAA,EAAAA,EAAcyC,IAC3BD,UAAU,KAIlBhB,EAACkB,EAAAA,CAAgBtC,KAAMA,EAAMW,KAAMA,EAAMF,gBAAiBA,EAAiBG,OAAQA,EAAQhB,aAAcA,IAGrH"}
+{"version":3,"file":"BSBInput.js","sources":["../../../../../src/components/PayTo/components/BSBInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport Fieldset from '../../internal/FormFields/Fieldset';\nimport { useEffect, useRef } from 'preact/hooks';\nimport { useFormWithA11y } from '../../../utils/useForm';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport Field from '../../internal/FormFields/Field';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport InputText from '../../internal/FormFields/InputText';\nimport { bsbValidationRules } from './validate';\nimport './PayIDInput.scss';\nimport { phoneFormatters } from '../../internal/PhoneInput/validate';\nimport { ComponentMethodsRef, UIElementStatus } from '../../internal/UIElement/types';\nimport PayToNameFields from './PayToNameFields';\nimport { PayToPlaceholdersType } from '../types';\n\nexport interface BSBFormData {\n    bsb: string;\n    bankAccountNumber: string;\n    firstName: string;\n    lastName: string;\n}\n\nexport interface BSBInputProps {\n    status: UIElementStatus;\n    setStatus: (status: UIElementStatus) => void;\n    defaultData: BSBFormData;\n    placeholders: PayToPlaceholdersType;\n    onChange: (e) => void;\n    setComponentRef: (ref: ComponentMethodsRef) => void;\n    id?: string;\n}\n\nconst BASE_SCHEMA = ['bankAccountNumber', 'bsb', 'firstName', 'lastName'];\n\nexport default function BSBInput({ setComponentRef, defaultData, placeholders, onChange, setStatus, id }: Readonly<BSBInputProps>) {\n    const { i18n } = useCoreContext();\n\n    const form = useFormWithA11y<BSBFormData>({\n        schema: BASE_SCHEMA,\n        defaultData: defaultData,\n        rules: bsbValidationRules,\n        formatters: phoneFormatters,\n        formHolder: `#${id}`\n    });\n    const { handleChangeFor, triggerValidation, data, errors, valid, isValid } = form;\n\n    // standard onChange propagate to parent state\n    useEffect(() => {\n        onChange({ data, valid, errors, isValid });\n    }, [data, valid, errors, isValid]);\n\n    const payToRef = useRef<ComponentMethodsRef>({\n        setStatus: setStatus,\n        showValidation: triggerValidation\n    });\n\n    useEffect(() => {\n        setComponentRef(payToRef.current);\n    }, [setComponentRef]);\n\n    return (\n        <Fieldset id={id} classNameModifiers={['payto__bsb_input']} label={'BSB'} description={'payto.bsb.description'}>\n            <Field\n                label={i18n.get('payto.bsb.label.bankAccountNumber')}\n                classNameModifiers={['col-60', 'bankAccountNumber']}\n                errorMessage={getErrorMessage(i18n, errors.bankAccountNumber, i18n.get('payto.bsb.label.bankAccountNumber'))}\n                name={'bankAccountNumber'}\n                i18n={i18n}\n                errorLive={true}\n            >\n                <InputText\n                    name={'bankAccountNumber'}\n                    value={data.bankAccountNumber}\n                    onInput={handleChangeFor('bankAccountNumber', 'input')}\n                    onBlur={handleChangeFor('bankAccountNumber', 'blur')}\n                    placeholder={placeholders?.bankAccountNumber}\n                    required={true}\n                />\n            </Field>\n\n            <Field\n                label={i18n.get('Bank State Branch')}\n                classNameModifiers={['col-40', 'bsb']}\n                errorMessage={getErrorMessage(i18n, errors.bsb, i18n.get('Bank State Branch'))}\n                name={'bsb'}\n                i18n={i18n}\n                errorLive={true}\n            >\n                <InputText\n                    name={'bsb'}\n                    value={data.bsb}\n                    onInput={handleChangeFor('bsb', 'input')}\n                    onBlur={handleChangeFor('bsb', 'blur')}\n                    placeholder={placeholders?.bsb}\n                    required={true}\n                />\n            </Field>\n\n            <PayToNameFields i18n={i18n} data={data} handleChangeFor={handleChangeFor} errors={errors} placeholders={placeholders} />\n        </Fieldset>\n    );\n}\n"],"names":["BASE_SCHEMA","BSBInput","setComponentRef","defaultData","placeholders","onChange","setStatus","id","i18n","useCoreContext","form","useFormWithA11y","schema","rules","bsbValidationRules","formatters","phoneFormatters","formHolder","handleChangeFor","triggerValidation","data","errors","valid","isValid","useEffect","payToRef","useRef","showValidation","current","h","Fieldset","classNameModifiers","label","description","Field","get","errorMessage","getErrorMessage","bankAccountNumber","name","errorLive","InputText","value","onInput","onBlur","placeholder","required","bsb","PayToNameFields"],"mappings":"4uBAgCA,MAAMA,EAAc,CAAC,oBAAqB,MAAO,YAAa,YAE/C,SAASC,GAASC,gBAAEA,EAAeC,YAAEA,EAAWC,aAAEA,EAAYC,SAAEA,EAAQC,UAAEA,EAASC,GAAEA,IAChG,MAAMC,KAAEA,GAASC,IAEXC,EAAOC,EAA6B,CACtCC,OAAQZ,EACRG,YAAaA,EACbU,MAAOC,EACPC,WAAYC,EACZC,WAAY,IAAIV,OAEdW,gBAAEA,EAAeC,kBAAEA,EAAiBC,KAAEA,EAAIC,OAAEA,EAAMC,MAAEA,EAAKC,QAAEA,GAAYb,EAG7Ec,EAAU,KACNnB,EAAS,CAAEe,OAAME,QAAOD,SAAQE,aACjC,CAACH,EAAME,EAAOD,EAAQE,IAEzB,MAAME,EAAWC,EAA4B,CACzCpB,UAAWA,EACXqB,eAAgBR,IAOpB,OAJAK,EAAU,KACNtB,EAAgBuB,EAASG,UAC1B,CAAC1B,IAGA2B,EAACC,EAAAA,CAASvB,GAAIA,EAAIwB,mBAAoB,CAAC,oBAAqBC,MAAO,MAAOC,YAAa,yBACnFJ,EAACK,EAAAA,CACGF,MAAOxB,EAAK2B,IAAI,qCAChBJ,mBAAoB,CAAC,SAAU,qBAC/BK,aAAcC,EAAgB7B,EAAMa,EAAOiB,kBAAmB9B,EAAK2B,IAAI,sCACvEI,KAAM,oBACN/B,KAAMA,EACNgC,WAAW,GAEXX,EAACY,EAAAA,CACGF,KAAM,oBACNG,MAAOtB,EAAKkB,kBACZK,QAASzB,EAAgB,oBAAqB,SAC9C0B,OAAQ1B,EAAgB,oBAAqB,QAC7C2B,YAAazC,aAAAA,EAAAA,EAAckC,kBAC3BQ,UAAU,KAIlBjB,EAACK,EAAAA,CACGF,MAAOxB,EAAK2B,IAAI,qBAChBJ,mBAAoB,CAAC,SAAU,OAC/BK,aAAcC,EAAgB7B,EAAMa,EAAO0B,IAAKvC,EAAK2B,IAAI,sBACzDI,KAAM,MACN/B,KAAMA,EACNgC,WAAW,GAEXX,EAACY,EAAAA,CACGF,KAAM,MACNG,MAAOtB,EAAK2B,IACZJ,QAASzB,EAAgB,MAAO,SAChC0B,OAAQ1B,EAAgB,MAAO,QAC/B2B,YAAazC,aAAAA,EAAAA,EAAc2C,IAC3BD,UAAU,KAIlBjB,EAACmB,EAAAA,CAAgBxC,KAAMA,EAAMY,KAAMA,EAAMF,gBAAiBA,EAAiBG,OAAQA,EAAQjB,aAAcA,IAGrH"}

package/dist/es-legacy/components/PayTo/components/PayIDInput.js

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../external/preact/dist/preact.js";import r from"../../internal/FormFields/Fieldset/Fieldset.js";import i,{PayToIdentifierEnum as t}from"./IdentifierSelector.js";import{useEffect as o,useRef as a}from"../../../external/preact/hooks/dist/hooks.js";import l from"../../../utils/useForm/useForm.js";import n from"./PayToPhone.js";import s from"../../internal/FormFields/InputEmail.js";import{getErrorMessage as d}from"../../../utils/getErrorMessage.js";import m from"../../internal/FormFields/Field/Field.js";import{useCoreContext as p}from"../../../core/Context/CoreProvider.js";import c from"../../internal/FormFields/InputText.js";import{payIdValidationRules as f}from"./validate.js";import{phoneFormatters as u}from"../../internal/PhoneInput/validate.js";import g from"./PayToNameFields.js";function b(e,r,i){return r in e?Object.defineProperty(e,r,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[r]=i,e}function h(e){for(var r=1;r<arguments.length;r++){var i=null!=arguments[r]?arguments[r]:{},t=Object.keys(i);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(i).filter(function(e){return Object.getOwnPropertyDescriptor(i,e).enumerable}))),t.forEach(function(r){b(e,r,i[r])})}return e}const I=["selectedIdentifier","firstName","lastName"],j={[t.email]:["email"],[t.phone]:["phoneNumber","phonePrefix"],[t.abn]:["abn"],[t.orgid]:["orgid"]};function y({setComponentRef:b,defaultData:y,placeholders:F,onChange:v,setStatus:N,id:P}){const{i18n:M}=p(),O=l({schema:I,defaultData:h({selectedIdentifier:t.phone},y),rules:f,formatters:u}),{handleChangeFor:E,triggerValidation:S,data:x,errors:B,valid:C,isValid:w,setSchema:D}=O;o(()=>{D([...j[x.selectedIdentifier],...I])},[x.selectedIdentifier]),o(()=>{v({data:x,valid:C,errors:B,isValid:w})},[x,C,B,w]);const V=a({setStatus:N,showValidation:S});return o(()=>{b(V.current)},[b]),e(r,{id:P,classNameModifiers:["payto__payid_input"],label:"PayID",description:"payto.payid.description"},e(i,{classNameModifiers:["col-40"],onSelectedIdentifier:E("selectedIdentifier"),selectedIdentifier:x.selectedIdentifier}),x.selectedIdentifier===t.phone&&e(n,{form:O}),x.selectedIdentifier===t.email&&e(m,{label:M.get("shopperEmail"),classNameModifiers:["col-60","email"],errorMessage:d(M,B.email,M.get("shopperEmail")),dir:"ltr",name:"email",i18n:M},e(s,{name:"email",value:x.email,onInput:E("email","input"),onBlur:E("email","blur"),placeholder:null==F?void 0:F.email,required:!0})),x.selectedIdentifier===t.abn&&e(m,{label:M.get("ABN"),classNameModifiers:["col-60","abn"],errorMessage:d(M,B.abn,M.get("ABN")),name:"ABN",i18n:M},e(c,{name:"abn",value:x.abn,onInput:E("abn","input"),onBlur:E("abn","blur"),placeholder:null==F?void 0:F.abn,required:!0})),x.selectedIdentifier===t.orgid&&e(m,{label:M.get("payto.payid.label.orgid"),classNameModifiers:["col-60","orgid"],errorMessage:d(M,B.orgid,M.get("payto.payid.label.orgid")),name:"orgid",i18n:M},e(c,{name:"orgid",value:x.orgid,onInput:E("orgid","input"),onBlur:E("orgid","blur"),placeholder:null==F?void 0:F.orgid,required:!0})),e(g,{i18n:M,data:x,handleChangeFor:E,errors:B,placeholders:F}))}export{y as default};
+import{createElement as e}from"../../../external/preact/dist/preact.js";import r from"../../internal/FormFields/Fieldset/Fieldset.js";import i,{PayToIdentifierEnum as t}from"./IdentifierSelector.js";import{useEffect as o,useRef as a}from"../../../external/preact/hooks/dist/hooks.js";import l from"../../../utils/useForm/useFormWithA11y.js";import"../../internal/SecuredFields/lib/CSF/utils/userAgent.js";import n from"./PayToPhone.js";import s from"../../internal/FormFields/InputEmail.js";import{getErrorMessage as d}from"../../../utils/getErrorMessage.js";import m from"../../internal/FormFields/Field/Field.js";import{useCoreContext as p}from"../../../core/Context/CoreProvider.js";import c from"../../internal/FormFields/InputText.js";import{payIdValidationRules as u}from"./validate.js";import{phoneFormatters as f}from"../../internal/PhoneInput/validate.js";import g from"./PayToNameFields.js";function b(e,r,i){return r in e?Object.defineProperty(e,r,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[r]=i,e}function h(e){for(var r=1;r<arguments.length;r++){var i=null!=arguments[r]?arguments[r]:{},t=Object.keys(i);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(i).filter(function(e){return Object.getOwnPropertyDescriptor(i,e).enumerable}))),t.forEach(function(r){b(e,r,i[r])})}return e}const j=["selectedIdentifier","firstName","lastName"],y={[t.email]:["email"],[t.phone]:["phoneNumber","phonePrefix"],[t.abn]:["abn"],[t.orgid]:["orgid"]};function I({setComponentRef:b,defaultData:I,placeholders:F,onChange:v,setStatus:N,id:P}){const{i18n:M}=p(),S=l({schema:j,defaultData:h({selectedIdentifier:t.phone},I),rules:u,formatters:f,formHolder:`#${P}`}),{handleChangeFor:O,triggerValidation:C,data:E,errors:x,valid:B,isValid:w,setSchema:A}=S;o(()=>{A([...y[E.selectedIdentifier],...j])},[E.selectedIdentifier]),o(()=>{v({data:E,valid:B,errors:x,isValid:w})},[E,B,x,w]);const D=a({setStatus:N,showValidation:C});return o(()=>{b(D.current)},[b]),e(r,{id:P,classNameModifiers:["payto__payid_input"],label:"PayID",description:"payto.payid.description"},e(i,{classNameModifiers:["col-40"],onSelectedIdentifier:O("selectedIdentifier"),selectedIdentifier:E.selectedIdentifier}),E.selectedIdentifier===t.phone&&e(n,{form:S}),E.selectedIdentifier===t.email&&e(m,{label:M.get("shopperEmail"),classNameModifiers:["col-60","email"],errorMessage:d(M,x.email,M.get("shopperEmail")),dir:"ltr",name:"email",i18n:M,errorLive:!0},e(s,{name:"email",value:E.email,onInput:O("email","input"),onBlur:O("email","blur"),placeholder:null==F?void 0:F.email,required:!0})),E.selectedIdentifier===t.abn&&e(m,{label:M.get("ABN"),classNameModifiers:["col-60","abn"],errorMessage:d(M,x.abn,M.get("ABN")),name:"ABN",i18n:M,errorLive:!0},e(c,{name:"abn",value:E.abn,onInput:O("abn","input"),onBlur:O("abn","blur"),placeholder:null==F?void 0:F.abn,required:!0})),E.selectedIdentifier===t.orgid&&e(m,{label:M.get("payto.payid.label.orgid"),classNameModifiers:["col-60","orgid"],errorMessage:d(M,x.orgid,M.get("payto.payid.label.orgid")),name:"orgid",i18n:M,errorLive:!0},e(c,{name:"orgid",value:E.orgid,onInput:O("orgid","input"),onBlur:O("orgid","blur"),placeholder:null==F?void 0:F.orgid,required:!0})),e(g,{i18n:M,data:E,handleChangeFor:O,errors:x,placeholders:F}))}export{I as default};
 //# sourceMappingURL=PayIDInput.js.map

package/dist/es-legacy/components/PayTo/components/PayIDInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"PayIDInput.js","sources":["../../../../../src/components/PayTo/components/PayIDInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport Fieldset from '../../internal/FormFields/Fieldset';\nimport IdentifierSelector, { PayToIdentifierEnum } from './IdentifierSelector';\nimport { useEffect, useRef } from 'preact/hooks';\nimport useForm from '../../../utils/useForm';\nimport PayToPhone from './PayToPhone';\nimport InputEmail from '../../internal/FormFields/InputEmail';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport Field from '../../internal/FormFields/Field';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport InputText from '../../internal/FormFields/InputText';\nimport { payIdValidationRules } from './validate';\nimport './PayIDInput.scss';\nimport { phoneFormatters } from '../../internal/PhoneInput/validate';\nimport { ComponentMethodsRef, UIElementStatus } from '../../internal/UIElement/types';\nimport PayToNameFields from './PayToNameFields';\nimport { PayToPlaceholdersType } from '../types';\n\nexport interface PayIdFormData {\n    email: string;\n    phone: string;\n    abn: string;\n    orgid: string;\n    firstName: string;\n    lastName: string;\n    phoneNumber?: string;\n    phonePrefix?: string;\n    selectedIdentifier: PayToIdentifierEnum;\n}\n\nexport interface PayIDInputProps {\n    status: UIElementStatus;\n    setStatus: (status: UIElementStatus) => void;\n    defaultData: PayIdFormData;\n    placeholders: PayToPlaceholdersType;\n    onChange: (e) => void;\n    setComponentRef: (ref: ComponentMethodsRef) => void;\n    id?: string;\n}\n\nconst BASE_SCHEMA = ['selectedIdentifier', 'firstName', 'lastName'];\n\nconst IDENTIFIER_SCHEMA = {\n    [PayToIdentifierEnum.email]: ['email'],\n    [PayToIdentifierEnum.phone]: ['phoneNumber', 'phonePrefix'],\n    [PayToIdentifierEnum.abn]: ['abn'],\n    [PayToIdentifierEnum.orgid]: ['orgid']\n};\n\nexport default function PayIDInput({ setComponentRef, defaultData, placeholders, onChange, setStatus, id }: Readonly<PayIDInputProps>) {\n    const { i18n } = useCoreContext();\n\n    const form = useForm<PayIdFormData>({\n        schema: BASE_SCHEMA,\n        defaultData: { selectedIdentifier: PayToIdentifierEnum.phone, ...defaultData },\n        rules: payIdValidationRules,\n        formatters: phoneFormatters\n    });\n    const { handleChangeFor, triggerValidation, data, errors, valid, isValid, setSchema } = form;\n\n    // handle the changes of identifier, each identifier gets its own schema\n    useEffect(() => {\n        // get the correct schema for each identifier and merge it with the base\n        setSchema([...IDENTIFIER_SCHEMA[data.selectedIdentifier], ...BASE_SCHEMA]);\n    }, [data.selectedIdentifier]);\n\n    // standard onChange propagate to parent state\n    useEffect(() => {\n        onChange({ data, valid, errors, isValid });\n    }, [data, valid, errors, isValid]);\n\n    const payToRef = useRef<ComponentMethodsRef>({\n        setStatus: setStatus,\n        showValidation: triggerValidation\n    });\n\n    useEffect(() => {\n        setComponentRef(payToRef.current);\n    }, [setComponentRef]);\n\n    return (\n        <Fieldset id={id} classNameModifiers={['payto__payid_input']} label={'PayID'} description={'payto.payid.description'}>\n            <IdentifierSelector\n                classNameModifiers={['col-40']}\n                onSelectedIdentifier={handleChangeFor('selectedIdentifier')}\n                selectedIdentifier={data.selectedIdentifier}\n            />\n            {data.selectedIdentifier === PayToIdentifierEnum.phone && <PayToPhone form={form} />}\n\n            {/* TODO probably worth refactoring this into  either re-usable components or builder */}\n            {data.selectedIdentifier === PayToIdentifierEnum.email && (\n                <Field\n                    label={i18n.get('shopperEmail')}\n                    classNameModifiers={['col-60', 'email']}\n                    errorMessage={getErrorMessage(i18n, errors.email, i18n.get('shopperEmail'))}\n                    dir={'ltr'}\n                    name={'email'}\n                    i18n={i18n}\n                >\n                    <InputEmail\n                        name={'email'}\n                        value={data.email}\n                        onInput={handleChangeFor('email', 'input')}\n                        onBlur={handleChangeFor('email', 'blur')}\n                        placeholder={placeholders?.email}\n                        required={true}\n                    />\n                </Field>\n            )}\n\n            {data.selectedIdentifier === PayToIdentifierEnum.abn && (\n                <Field\n                    label={i18n.get('ABN')}\n                    classNameModifiers={['col-60', 'abn']}\n                    errorMessage={getErrorMessage(i18n, errors.abn, i18n.get('ABN'))}\n                    name={'ABN'}\n                    i18n={i18n}\n                >\n                    <InputText\n                        name={'abn'}\n                        value={data.abn}\n                        onInput={handleChangeFor('abn', 'input')}\n                        onBlur={handleChangeFor('abn', 'blur')}\n                        placeholder={placeholders?.abn}\n                        required={true}\n                    />\n                </Field>\n            )}\n\n            {data.selectedIdentifier === PayToIdentifierEnum.orgid && (\n                <Field\n                    label={i18n.get('payto.payid.label.orgid')}\n                    classNameModifiers={['col-60', 'orgid']}\n                    errorMessage={getErrorMessage(i18n, errors.orgid, i18n.get('payto.payid.label.orgid'))}\n                    name={'orgid'}\n                    i18n={i18n}\n                >\n                    <InputText\n                        name={'orgid'}\n                        value={data.orgid}\n                        onInput={handleChangeFor('orgid', 'input')}\n                        onBlur={handleChangeFor('orgid', 'blur')}\n                        placeholder={placeholders?.orgid}\n                        required={true}\n                    />\n                </Field>\n            )}\n\n            <PayToNameFields i18n={i18n} data={data} handleChangeFor={handleChangeFor} errors={errors} placeholders={placeholders} />\n        </Fieldset>\n    );\n}\n"],"names":["BASE_SCHEMA","IDENTIFIER_SCHEMA","PayToIdentifierEnum","email","phone","abn","orgid","PayIDInput","setComponentRef","defaultData","placeholders","onChange","setStatus","id","i18n","useCoreContext","form","useForm","schema","_object_spread","selectedIdentifier","rules","payIdValidationRules","formatters","phoneFormatters","handleChangeFor","triggerValidation","data","errors","valid","isValid","setSchema","useEffect","payToRef","useRef","showValidation","current","h","Fieldset","classNameModifiers","label","description","IdentifierSelector","onSelectedIdentifier","PayToPhone","Field","get","errorMessage","getErrorMessage","dir","name","InputEmail","value","onInput","onBlur","placeholder","required","InputText","PayToNameFields"],"mappings":"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"}
+{"version":3,"file":"PayIDInput.js","sources":["../../../../../src/components/PayTo/components/PayIDInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport Fieldset from '../../internal/FormFields/Fieldset';\nimport IdentifierSelector, { PayToIdentifierEnum } from './IdentifierSelector';\nimport { useEffect, useRef } from 'preact/hooks';\nimport { useFormWithA11y } from '../../../utils/useForm';\nimport PayToPhone from './PayToPhone';\nimport InputEmail from '../../internal/FormFields/InputEmail';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport Field from '../../internal/FormFields/Field';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport InputText from '../../internal/FormFields/InputText';\nimport { payIdValidationRules } from './validate';\nimport './PayIDInput.scss';\nimport { phoneFormatters } from '../../internal/PhoneInput/validate';\nimport { ComponentMethodsRef, UIElementStatus } from '../../internal/UIElement/types';\nimport PayToNameFields from './PayToNameFields';\nimport { PayToPlaceholdersType } from '../types';\n\nexport interface PayIdFormData {\n    email: string;\n    phone: string;\n    abn: string;\n    orgid: string;\n    firstName: string;\n    lastName: string;\n    phoneNumber?: string;\n    phonePrefix?: string;\n    selectedIdentifier: PayToIdentifierEnum;\n}\n\nexport interface PayIDInputProps {\n    status: UIElementStatus;\n    setStatus: (status: UIElementStatus) => void;\n    defaultData: PayIdFormData;\n    placeholders: PayToPlaceholdersType;\n    onChange: (e) => void;\n    setComponentRef: (ref: ComponentMethodsRef) => void;\n    id?: string;\n}\n\nconst BASE_SCHEMA = ['selectedIdentifier', 'firstName', 'lastName'];\n\nconst IDENTIFIER_SCHEMA = {\n    [PayToIdentifierEnum.email]: ['email'],\n    [PayToIdentifierEnum.phone]: ['phoneNumber', 'phonePrefix'],\n    [PayToIdentifierEnum.abn]: ['abn'],\n    [PayToIdentifierEnum.orgid]: ['orgid']\n};\n\nexport default function PayIDInput({ setComponentRef, defaultData, placeholders, onChange, setStatus, id }: Readonly<PayIDInputProps>) {\n    const { i18n } = useCoreContext();\n\n    const form = useFormWithA11y<PayIdFormData>({\n        schema: BASE_SCHEMA,\n        defaultData: { selectedIdentifier: PayToIdentifierEnum.phone, ...defaultData },\n        rules: payIdValidationRules,\n        formatters: phoneFormatters,\n        formHolder: `#${id}`\n    });\n    const { handleChangeFor, triggerValidation, data, errors, valid, isValid, setSchema } = form;\n\n    // handle the changes of identifier, each identifier gets its own schema\n    useEffect(() => {\n        // get the correct schema for each identifier and merge it with the base\n        setSchema([...IDENTIFIER_SCHEMA[data.selectedIdentifier], ...BASE_SCHEMA]);\n    }, [data.selectedIdentifier]);\n\n    // standard onChange propagate to parent state\n    useEffect(() => {\n        onChange({ data, valid, errors, isValid });\n    }, [data, valid, errors, isValid]);\n\n    const payToRef = useRef<ComponentMethodsRef>({\n        setStatus: setStatus,\n        showValidation: triggerValidation\n    });\n\n    useEffect(() => {\n        setComponentRef(payToRef.current);\n    }, [setComponentRef]);\n\n    return (\n        <Fieldset id={id} classNameModifiers={['payto__payid_input']} label={'PayID'} description={'payto.payid.description'}>\n            <IdentifierSelector\n                classNameModifiers={['col-40']}\n                onSelectedIdentifier={handleChangeFor('selectedIdentifier')}\n                selectedIdentifier={data.selectedIdentifier}\n            />\n            {data.selectedIdentifier === PayToIdentifierEnum.phone && <PayToPhone form={form} />}\n\n            {/* TODO probably worth refactoring this into  either re-usable components or builder */}\n            {data.selectedIdentifier === PayToIdentifierEnum.email && (\n                <Field\n                    label={i18n.get('shopperEmail')}\n                    classNameModifiers={['col-60', 'email']}\n                    errorMessage={getErrorMessage(i18n, errors.email, i18n.get('shopperEmail'))}\n                    dir={'ltr'}\n                    name={'email'}\n                    i18n={i18n}\n                    errorLive={true}\n                >\n                    <InputEmail\n                        name={'email'}\n                        value={data.email}\n                        onInput={handleChangeFor('email', 'input')}\n                        onBlur={handleChangeFor('email', 'blur')}\n                        placeholder={placeholders?.email}\n                        required={true}\n                    />\n                </Field>\n            )}\n\n            {data.selectedIdentifier === PayToIdentifierEnum.abn && (\n                <Field\n                    label={i18n.get('ABN')}\n                    classNameModifiers={['col-60', 'abn']}\n                    errorMessage={getErrorMessage(i18n, errors.abn, i18n.get('ABN'))}\n                    name={'ABN'}\n                    i18n={i18n}\n                    errorLive={true}\n                >\n                    <InputText\n                        name={'abn'}\n                        value={data.abn}\n                        onInput={handleChangeFor('abn', 'input')}\n                        onBlur={handleChangeFor('abn', 'blur')}\n                        placeholder={placeholders?.abn}\n                        required={true}\n                    />\n                </Field>\n            )}\n\n            {data.selectedIdentifier === PayToIdentifierEnum.orgid && (\n                <Field\n                    label={i18n.get('payto.payid.label.orgid')}\n                    classNameModifiers={['col-60', 'orgid']}\n                    errorMessage={getErrorMessage(i18n, errors.orgid, i18n.get('payto.payid.label.orgid'))}\n                    name={'orgid'}\n                    i18n={i18n}\n                    errorLive={true}\n                >\n                    <InputText\n                        name={'orgid'}\n                        value={data.orgid}\n                        onInput={handleChangeFor('orgid', 'input')}\n                        onBlur={handleChangeFor('orgid', 'blur')}\n                        placeholder={placeholders?.orgid}\n                        required={true}\n                    />\n                </Field>\n            )}\n\n            <PayToNameFields i18n={i18n} data={data} handleChangeFor={handleChangeFor} errors={errors} placeholders={placeholders} />\n        </Fieldset>\n    );\n}\n"],"names":["BASE_SCHEMA","IDENTIFIER_SCHEMA","PayToIdentifierEnum","email","phone","abn","orgid","PayIDInput","setComponentRef","defaultData","placeholders","onChange","setStatus","id","i18n","useCoreContext","form","useFormWithA11y","schema","_object_spread","selectedIdentifier","rules","payIdValidationRules","formatters","phoneFormatters","formHolder","handleChangeFor","triggerValidation","data","errors","valid","isValid","setSchema","useEffect","payToRef","useRef","showValidation","current","h","Fieldset","classNameModifiers","label","description","IdentifierSelector","onSelectedIdentifier","PayToPhone","Field","get","errorMessage","getErrorMessage","dir","name","errorLive","InputEmail","value","onInput","onBlur","placeholder","required","InputText","PayToNameFields"],"mappings":"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"}

package/dist/es-legacy/components/PayTo/components/PayToNameFields.js

@@ -1,2 +1,2 @@
-import{createElement as e,Fragment as a}from"../../../external/preact/dist/preact.js";import r from"../../internal/FormFields/Field/Field.js";import{getErrorMessage as l}from"../../../utils/getErrorMessage.js";import s from"../../internal/FormFields/InputText.js";function t({i18n:t,errors:i,data:m,handleChangeFor:o,placeholders:n}){return e(a,null,e(r,{label:t.get("payto.label.firstName"),classNameModifiers:["col-50","firstName"],errorMessage:l(t,i.firstName,t.get("firstName")),name:"firstName",i18n:t},e(s,{name:"firstName",value:m.firstName,classNameModifiers:["firstName"],onInput:o("firstName","input"),onBlur:o("firstName","input"),placeholder:null==n?void 0:n.firstName,spellcheck:!1,required:!0})),e(r,{label:t.get("payto.label.lastName"),classNameModifiers:["col-50","lastName"],errorMessage:l(t,i.lastName,t.get("lastName")),name:"lastName",i18n:t},e(s,{name:"lastName",value:m.lastName,classNameModifiers:["lastName"],onInput:o("lastName","input"),onBlur:o("lastName","blur"),placeholder:null==n?void 0:n.lastName,spellcheck:!1,required:!0})))}export{t as default};
+import{createElement as e,Fragment as a}from"../../../external/preact/dist/preact.js";import r from"../../internal/FormFields/Field/Field.js";import{getErrorMessage as l}from"../../../utils/getErrorMessage.js";import s from"../../internal/FormFields/InputText.js";function t({i18n:t,errors:i,data:m,handleChangeFor:o,placeholders:n}){return e(a,null,e(r,{label:t.get("payto.label.firstName"),classNameModifiers:["col-50","firstName"],errorMessage:l(t,i.firstName,t.get("firstName")),name:"firstName",i18n:t,errorLive:!0},e(s,{name:"firstName",value:m.firstName,classNameModifiers:["firstName"],onInput:o("firstName","input"),onBlur:o("firstName","input"),placeholder:null==n?void 0:n.firstName,spellcheck:!1,required:!0})),e(r,{label:t.get("payto.label.lastName"),classNameModifiers:["col-50","lastName"],errorMessage:l(t,i.lastName,t.get("lastName")),name:"lastName",i18n:t,errorLive:!0},e(s,{name:"lastName",value:m.lastName,classNameModifiers:["lastName"],onInput:o("lastName","input"),onBlur:o("lastName","blur"),placeholder:null==n?void 0:n.lastName,spellcheck:!1,required:!0})))}export{t as default};
 //# sourceMappingURL=PayToNameFields.js.map

package/dist/es-legacy/components/PayTo/components/PayToNameFields.js.map

@@ -1 +1 @@
-{"version":3,"file":"PayToNameFields.js","sources":["../../../../../src/components/PayTo/components/PayToNameFields.tsx"],"sourcesContent":["import { h, Fragment } from 'preact';\nimport Field from '../../internal/FormFields/Field';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport InputText from '../../internal/FormFields/InputText';\nimport Language from '../../../language';\nimport { HandleChangeForModeType } from '../../../utils/useForm/types';\nimport { ValidationRuleResult } from '../../../utils/Validator/ValidationRuleResult';\n\nexport interface PayToNameFieldsProps {\n    i18n: Language;\n    errors: {\n        [key: string]: ValidationRuleResult;\n    };\n    data: {\n        firstName: string;\n        lastName: string;\n    };\n    handleChangeFor: (key: string, mode?: HandleChangeForModeType) => (e: h.JSX.TargetedEvent<HTMLInputElement, Event>) => void;\n    placeholders: {\n        firstName: string;\n        lastName: string;\n    };\n}\n\nexport default function PayToNameFields({ i18n, errors, data, handleChangeFor, placeholders }: Readonly<PayToNameFieldsProps>) {\n    return (\n        <Fragment>\n            <Field\n                label={i18n.get('payto.label.firstName')}\n                classNameModifiers={['col-50', 'firstName']}\n                errorMessage={getErrorMessage(i18n, errors.firstName, i18n.get('firstName'))}\n                name={'firstName'}\n                i18n={i18n}\n            >\n                <InputText\n                    name={'firstName'}\n                    value={data.firstName}\n                    classNameModifiers={['firstName']}\n                    onInput={handleChangeFor('firstName', 'input')}\n                    onBlur={handleChangeFor('firstName', 'input')}\n                    placeholder={placeholders?.firstName}\n                    spellcheck={false}\n                    required={true}\n                />\n            </Field>\n            <Field\n                label={i18n.get('payto.label.lastName')}\n                classNameModifiers={['col-50', 'lastName']}\n                errorMessage={getErrorMessage(i18n, errors.lastName, i18n.get('lastName'))}\n                name={'lastName'}\n                i18n={i18n}\n            >\n                <InputText\n                    name={'lastName'}\n                    value={data.lastName}\n                    classNameModifiers={['lastName']}\n                    onInput={handleChangeFor('lastName', 'input')}\n                    onBlur={handleChangeFor('lastName', 'blur')}\n                    placeholder={placeholders?.lastName}\n                    spellcheck={false}\n                    required={true}\n                />\n            </Field>\n        </Fragment>\n    );\n}\n"],"names":["PayToNameFields","i18n","errors","data","handleChangeFor","placeholders","h","Fragment","Field","label","get","classNameModifiers","errorMessage","getErrorMessage","firstName","name","InputText","value","onInput","onBlur","placeholder","spellcheck","required","lastName"],"mappings":"wQAwBe,SAASA,GAAgBC,KAAEA,EAAIC,OAAEA,EAAMC,KAAEA,EAAIC,gBAAEA,EAAeC,aAAEA,IAC3E,OACIC,EAACC,OACGD,EAACE,EAAAA,CACGC,MAAOR,EAAKS,IAAI,yBAChBC,mBAAoB,CAAC,SAAU,aAC/BC,aAAcC,EAAgBZ,EAAMC,EAAOY,UAAWb,EAAKS,IAAI,cAC/DK,KAAM,YACNd,KAAMA,GAENK,EAACU,EAAAA,CACGD,KAAM,YACNE,MAAOd,EAAKW,UACZH,mBAAoB,CAAC,aACrBO,QAASd,EAAgB,YAAa,SACtCe,OAAQf,EAAgB,YAAa,SACrCgB,YAAaf,aAAAA,EAAAA,EAAcS,UAC3BO,YAAY,EACZC,UAAU,KAGlBhB,EAACE,EAAAA,CACGC,MAAOR,EAAKS,IAAI,wBAChBC,mBAAoB,CAAC,SAAU,YAC/BC,aAAcC,EAAgBZ,EAAMC,EAAOqB,SAAUtB,EAAKS,IAAI,aAC9DK,KAAM,WACNd,KAAMA,GAENK,EAACU,EAAAA,CACGD,KAAM,WACNE,MAAOd,EAAKoB,SACZZ,mBAAoB,CAAC,YACrBO,QAASd,EAAgB,WAAY,SACrCe,OAAQf,EAAgB,WAAY,QACpCgB,YAAaf,aAAAA,EAAAA,EAAckB,SAC3BF,YAAY,EACZC,UAAU,KAK9B"}
+{"version":3,"file":"PayToNameFields.js","sources":["../../../../../src/components/PayTo/components/PayToNameFields.tsx"],"sourcesContent":["import { h, Fragment } from 'preact';\nimport Field from '../../internal/FormFields/Field';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport InputText from '../../internal/FormFields/InputText';\nimport Language from '../../../language';\nimport { HandleChangeForModeType } from '../../../utils/useForm/types';\nimport { ValidationRuleResult } from '../../../utils/Validator/ValidationRuleResult';\n\nexport interface PayToNameFieldsProps {\n    i18n: Language;\n    errors: {\n        [key: string]: ValidationRuleResult;\n    };\n    data: {\n        firstName: string;\n        lastName: string;\n    };\n    handleChangeFor: (key: string, mode?: HandleChangeForModeType) => (e: h.JSX.TargetedEvent<HTMLInputElement, Event>) => void;\n    placeholders: {\n        firstName: string;\n        lastName: string;\n    };\n}\n\nexport default function PayToNameFields({ i18n, errors, data, handleChangeFor, placeholders }: Readonly<PayToNameFieldsProps>) {\n    return (\n        <Fragment>\n            <Field\n                label={i18n.get('payto.label.firstName')}\n                classNameModifiers={['col-50', 'firstName']}\n                errorMessage={getErrorMessage(i18n, errors.firstName, i18n.get('firstName'))}\n                name={'firstName'}\n                i18n={i18n}\n                errorLive={true}\n            >\n                <InputText\n                    name={'firstName'}\n                    value={data.firstName}\n                    classNameModifiers={['firstName']}\n                    onInput={handleChangeFor('firstName', 'input')}\n                    onBlur={handleChangeFor('firstName', 'input')}\n                    placeholder={placeholders?.firstName}\n                    spellcheck={false}\n                    required={true}\n                />\n            </Field>\n            <Field\n                label={i18n.get('payto.label.lastName')}\n                classNameModifiers={['col-50', 'lastName']}\n                errorMessage={getErrorMessage(i18n, errors.lastName, i18n.get('lastName'))}\n                name={'lastName'}\n                i18n={i18n}\n                errorLive={true}\n            >\n                <InputText\n                    name={'lastName'}\n                    value={data.lastName}\n                    classNameModifiers={['lastName']}\n                    onInput={handleChangeFor('lastName', 'input')}\n                    onBlur={handleChangeFor('lastName', 'blur')}\n                    placeholder={placeholders?.lastName}\n                    spellcheck={false}\n                    required={true}\n                />\n            </Field>\n        </Fragment>\n    );\n}\n"],"names":["PayToNameFields","i18n","errors","data","handleChangeFor","placeholders","h","Fragment","Field","label","get","classNameModifiers","errorMessage","getErrorMessage","firstName","name","errorLive","InputText","value","onInput","onBlur","placeholder","spellcheck","required","lastName"],"mappings":"wQAwBe,SAASA,GAAgBC,KAAEA,EAAIC,OAAEA,EAAMC,KAAEA,EAAIC,gBAAEA,EAAeC,aAAEA,IAC3E,OACIC,EAACC,OACGD,EAACE,EAAAA,CACGC,MAAOR,EAAKS,IAAI,yBAChBC,mBAAoB,CAAC,SAAU,aAC/BC,aAAcC,EAAgBZ,EAAMC,EAAOY,UAAWb,EAAKS,IAAI,cAC/DK,KAAM,YACNd,KAAMA,EACNe,WAAW,GAEXV,EAACW,EAAAA,CACGF,KAAM,YACNG,MAAOf,EAAKW,UACZH,mBAAoB,CAAC,aACrBQ,QAASf,EAAgB,YAAa,SACtCgB,OAAQhB,EAAgB,YAAa,SACrCiB,YAAahB,aAAAA,EAAAA,EAAcS,UAC3BQ,YAAY,EACZC,UAAU,KAGlBjB,EAACE,EAAAA,CACGC,MAAOR,EAAKS,IAAI,wBAChBC,mBAAoB,CAAC,SAAU,YAC/BC,aAAcC,EAAgBZ,EAAMC,EAAOsB,SAAUvB,EAAKS,IAAI,aAC9DK,KAAM,WACNd,KAAMA,EACNe,WAAW,GAEXV,EAACW,EAAAA,CACGF,KAAM,WACNG,MAAOf,EAAKqB,SACZb,mBAAoB,CAAC,YACrBQ,QAASf,EAAgB,WAAY,SACrCgB,OAAQhB,EAAgB,WAAY,QACpCiB,YAAahB,aAAAA,EAAAA,EAAcmB,SAC3BF,YAAY,EACZC,UAAU,KAK9B"}

package/dist/es-legacy/components/PayTo/components/PayToPhone.js

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../external/preact/dist/preact.js";import{useCoreContext as r}from"../../../core/Context/CoreProvider.js";import o from"../../internal/PhoneInput/PhoneInputFields.js";import{getErrorMessage as t}from"../../../utils/getErrorMessage.js";import{useCallback as s}from"../../../external/preact/hooks/dist/hooks.js";const m=[{id:"+61",name:"+61 (AU)",selectedOptionName:"+61"}];function n({form:n}){const{i18n:i}=r(),a=s(e=>t(i,n.errors[e]),[i,n]);return e(o,{phoneNumberKey:"mobileNumber",getError:a,items:m,canSelectPrefix:!1,showNumber:!0,showPrefix:!0,form:n})}export{n as default};
+import{createElement as e}from"../../../external/preact/dist/preact.js";import{useCoreContext as r}from"../../../core/Context/CoreProvider.js";import o from"../../internal/PhoneInput/PhoneInputFields.js";import{getErrorMessage as t}from"../../../utils/getErrorMessage.js";import{useCallback as s}from"../../../external/preact/hooks/dist/hooks.js";const i=[{id:"+61",name:"+61 (AU)",selectedOptionName:"+61"}];function m({form:m}){const{i18n:n}=r(),a=s(e=>t(n,m.errors[e]),[n,m]);return e(o,{phoneNumberKey:"mobileNumber",getError:a,items:i,canSelectPrefix:!1,showNumber:!0,showPrefix:!0,form:m,errorLive:!0})}export{m as default};
 //# sourceMappingURL=PayToPhone.js.map

package/dist/es-legacy/components/PayTo/components/PayToPhone.js.map

@@ -1 +1 @@
-{"version":3,"file":"PayToPhone.js","sources":["../../../../../src/components/PayTo/components/PayToPhone.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport PhoneInputFields from '../../internal/PhoneInput/PhoneInputFields';\nimport { Form } from '../../../utils/useForm/types';\nimport { PayIdFormData } from './PayIDInput';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport { useCallback } from 'preact/hooks';\n\ninterface PayToPhoneProps {\n    form: Form<PayIdFormData>;\n}\n\n// we have decided to hardcode phone prefix as it's going to be always +61 for now\nconst AUSTRALIAN_PHONE_PREFIXES = [\n    {\n        id: '+61',\n        name: '+61 (AU)',\n        selectedOptionName: '+61'\n    }\n];\n\nexport default function PayToPhone({ form }: Readonly<PayToPhoneProps>) {\n    const { i18n } = useCoreContext();\n\n    const getError = useCallback((field: string) => getErrorMessage(i18n, form.errors[field]), [i18n, form]);\n\n    return (\n        <PhoneInputFields\n            phoneNumberKey={'mobileNumber'}\n            getError={getError}\n            items={AUSTRALIAN_PHONE_PREFIXES}\n            canSelectPrefix={false}\n            showNumber={true}\n            showPrefix={true}\n            form={form}\n        />\n    );\n}\n"],"names":["AUSTRALIAN_PHONE_PREFIXES","id","name","selectedOptionName","PayToPhone","form","i18n","useCoreContext","getError","useCallback","field","getErrorMessage","errors","h","PhoneInputFields","phoneNumberKey","items","canSelectPrefix","showNumber","showPrefix"],"mappings":"2VAaA,MAAMA,EAA4B,CAC9B,CACIC,GAAI,MACJC,KAAM,WACNC,mBAAoB,QAIb,SAASC,GAAWC,KAAEA,IACjC,MAAMC,KAAEA,GAASC,IAEXC,EAAWC,EAAaC,GAAkBC,EAAgBL,EAAMD,EAAKO,OAAOF,IAAS,CAACJ,EAAMD,IAElG,OACIQ,EAACC,EAAAA,CACGC,eAAgB,eAChBP,SAAUA,EACVQ,MAAOhB,EACPiB,iBAAiB,EACjBC,YAAY,EACZC,YAAY,EACZd,KAAMA,GAGlB"}
+{"version":3,"file":"PayToPhone.js","sources":["../../../../../src/components/PayTo/components/PayToPhone.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport PhoneInputFields from '../../internal/PhoneInput/PhoneInputFields';\nimport { Form } from '../../../utils/useForm/types';\nimport { PayIdFormData } from './PayIDInput';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport { useCallback } from 'preact/hooks';\n\ninterface PayToPhoneProps {\n    form: Form<PayIdFormData>;\n}\n\n// we have decided to hardcode phone prefix as it's going to be always +61 for now\nconst AUSTRALIAN_PHONE_PREFIXES = [\n    {\n        id: '+61',\n        name: '+61 (AU)',\n        selectedOptionName: '+61'\n    }\n];\n\nexport default function PayToPhone({ form }: Readonly<PayToPhoneProps>) {\n    const { i18n } = useCoreContext();\n\n    const getError = useCallback((field: string) => getErrorMessage(i18n, form.errors[field]), [i18n, form]);\n\n    return (\n        <PhoneInputFields\n            phoneNumberKey={'mobileNumber'}\n            getError={getError}\n            items={AUSTRALIAN_PHONE_PREFIXES}\n            canSelectPrefix={false}\n            showNumber={true}\n            showPrefix={true}\n            form={form}\n            errorLive={true}\n        />\n    );\n}\n"],"names":["AUSTRALIAN_PHONE_PREFIXES","id","name","selectedOptionName","PayToPhone","form","i18n","useCoreContext","getError","useCallback","field","getErrorMessage","errors","h","PhoneInputFields","phoneNumberKey","items","canSelectPrefix","showNumber","showPrefix","errorLive"],"mappings":"2VAaA,MAAMA,EAA4B,CAC9B,CACIC,GAAI,MACJC,KAAM,WACNC,mBAAoB,QAIb,SAASC,GAAWC,KAAEA,IACjC,MAAMC,KAAEA,GAASC,IAEXC,EAAWC,EAAaC,GAAkBC,EAAgBL,EAAMD,EAAKO,OAAOF,IAAS,CAACJ,EAAMD,IAElG,OACIQ,EAACC,EAAAA,CACGC,eAAgB,eAChBP,SAAUA,EACVQ,MAAOhB,EACPiB,iBAAiB,EACjBC,YAAY,EACZC,YAAY,EACZd,KAAMA,EACNe,WAAW,GAGvB"}

package/dist/es-legacy/components/Pix/components/PixInput/PixInput.js

@@ -1,2 +1,2 @@
-import{createElement as a}from"../../../../external/preact/dist/preact.js";import{useEffect as e,useState as t}from"../../../../external/preact/hooks/dist/hooks.js";import{pixValidationRules as r}from"./validate.js";import{pixFormatters as s}from"./utils.js";import{useCoreContext as o}from"../../../../core/Context/CoreProvider.js";import i from"../../../../utils/useForm/useForm.js";import{BrazilPersonalDetail as l}from"../../../internal/SocialSecurityNumberBrazil/BrazilPersonalDetail.js";function n({name:n,data:d,personalDetailsRequired:m,showPayButton:u,onChange:c,payButton:f}){const{i18n:p}=o(),h=["firstName","lastName","socialSecurityNumber"],{handleChangeFor:y,triggerValidation:j,setSchema:g,data:v,valid:N,errors:S,isValid:x}=i({schema:h,defaultData:d,rules:r,formatters:s});e(()=>{const a=m?[...h]:[];g(a)},[m]);const[C,B]=t("ready");this.setStatus=B,this.showValidation=()=>{j()},e(()=>{c({data:v,valid:N,errors:S,isValid:x})},[c,v,N,S]);const F=m?[]:["standalone"];return a("div",{className:"adyen-checkout__pix-input__field",style:u||m?null:{display:"none"}},m&&a(l,{i18n:p,data:v,handleChangeFor:y,errors:S,valid:N}),u&&f({status:C,label:`${p.get("continueTo")} ${n}`,classNameModifiers:F}))}export{n as default};
+import{createElement as e}from"../../../../external/preact/dist/preact.js";import{useEffect as t,useState as a}from"../../../../external/preact/hooks/dist/hooks.js";import{pixValidationRules as r}from"./validate.js";import{pixFormatters as s}from"./utils.js";import{useCoreContext as i}from"../../../../core/Context/CoreProvider.js";import o from"../../../../utils/useForm/useForm.js";import"../../../internal/SecuredFields/lib/CSF/utils/userAgent.js";import{BrazilPersonalDetail as l}from"../../../internal/SocialSecurityNumberBrazil/BrazilPersonalDetail.js";function n({name:n,data:d,personalDetailsRequired:m,showPayButton:u,onChange:c,payButton:p}){const{i18n:f}=i(),h=["firstName","lastName","socialSecurityNumber"],{handleChangeFor:j,triggerValidation:y,setSchema:S,data:g,valid:v,errors:C,isValid:F}=o({schema:h,defaultData:d,rules:r,formatters:s});t(()=>{const e=m?[...h]:[];S(e)},[m]);const[N,x]=a("ready");this.setStatus=x,this.showValidation=()=>{y()},t(()=>{c({data:g,valid:v,errors:C,isValid:F})},[c,g,v,C]);const b=m?[]:["standalone"];return e("div",{className:"adyen-checkout__pix-input__field",style:u||m?null:{display:"none"}},m&&e(l,{i18n:f,data:g,handleChangeFor:j,errors:C,valid:v}),u&&p({status:N,label:`${f.get("continueTo")} ${n}`,classNameModifiers:b}))}export{n as default};
 //# sourceMappingURL=PixInput.js.map

package/dist/es-legacy/components/Pix/components/PixInput/PixInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"PixInput.js","sources":["../../../../../../src/components/Pix/components/PixInput/PixInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useState } from 'preact/hooks';\nimport { pixValidationRules } from './validate';\nimport { pixFormatters } from './utils';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport useForm from '../../../../utils/useForm';\nimport { BrazilPersonalDetail } from '../../../internal/SocialSecurityNumberBrazil/BrazilPersonalDetail';\nimport { PixInputDataState, PixInputProps } from './types';\n\nfunction PixInput({ name, data: dataProps, personalDetailsRequired, showPayButton, onChange, payButton }: Readonly<PixInputProps>) {\n    const { i18n } = useCoreContext();\n    const formSchema = ['firstName', 'lastName', 'socialSecurityNumber'];\n\n    const { handleChangeFor, triggerValidation, setSchema, data, valid, errors, isValid } = useForm<PixInputDataState>({\n        schema: formSchema,\n        defaultData: dataProps,\n        rules: pixValidationRules,\n        formatters: pixFormatters\n    });\n\n    // Handle form schema updates\n    useEffect(() => {\n        const newSchema = personalDetailsRequired ? [...formSchema] : [];\n        setSchema(newSchema);\n    }, [personalDetailsRequired]);\n\n    const [status, setStatus] = useState('ready');\n    this.setStatus = setStatus;\n\n    this.showValidation = () => {\n        triggerValidation();\n    };\n\n    useEffect(() => {\n        onChange({ data, valid, errors, isValid });\n    }, [onChange, data, valid, errors]);\n\n    const buttonModifiers = !personalDetailsRequired ? ['standalone'] : [];\n\n    return (\n        <div className=\"adyen-checkout__pix-input__field\" style={!showPayButton && !personalDetailsRequired ? { display: 'none' } : null}>\n            {personalDetailsRequired && (\n                <BrazilPersonalDetail i18n={i18n} data={data} handleChangeFor={handleChangeFor} errors={errors} valid={valid} />\n            )}\n\n            {showPayButton &&\n                payButton({\n                    status,\n                    label: `${i18n.get('continueTo')} ${name}`,\n                    classNameModifiers: buttonModifiers\n                })}\n        </div>\n    );\n}\n\nexport default PixInput;\n"],"names":["PixInput","name","data","dataProps","personalDetailsRequired","showPayButton","onChange","payButton","i18n","useCoreContext","formSchema","handleChangeFor","triggerValidation","setSchema","valid","errors","isValid","useForm","schema","defaultData","rules","pixValidationRules","formatters","pixFormatters","useEffect","newSchema","status","setStatus","useState","this","showValidation","buttonModifiers","h","div","className","style","display","BrazilPersonalDetail","label","get","classNameModifiers"],"mappings":"6eASA,SAASA,GAASC,KAAEA,EAAMC,KAAMC,EAASC,wBAAEA,EAAuBC,cAAEA,EAAaC,SAAEA,EAAQC,UAAEA,IACzF,MAAMC,KAAEA,GAASC,IACXC,EAAa,CAAC,YAAa,WAAY,yBAEvCC,gBAAEA,EAAeC,kBAAEA,EAAiBC,UAAEA,EAASX,KAAEA,EAAIY,MAAEA,EAAKC,OAAEA,EAAMC,QAAEA,GAAYC,EAA2B,CAC/GC,OAAQR,EACRS,YAAahB,EACbiB,MAAOC,EACPC,WAAYC,IAIhBC,EAAU,KACN,MAAMC,EAAYrB,EAA0B,IAAIM,GAAc,GAC9DG,EAAUY,IACX,CAACrB,IAEJ,MAAOsB,EAAQC,GAAaC,EAAS,SACrCC,KAAKF,UAAYA,EAEjBE,KAAKC,eAAiB,KAClBlB,KAGJY,EAAU,KACNlB,EAAS,CAAEJ,OAAMY,QAAOC,SAAQC,aACjC,CAACV,EAAUJ,EAAMY,EAAOC,IAE3B,MAAMgB,EAAmB3B,EAA2C,GAAjB,CAAC,cAEpD,OACI4B,EAACC,MAAAA,CAAIC,UAAU,mCAAmCC,MAAQ9B,GAAkBD,EAAgD,KAAtB,CAAEgC,QAAS,SAC5GhC,GACG4B,EAACK,EAAAA,CAAqB7B,KAAMA,EAAMN,KAAMA,EAAMS,gBAAiBA,EAAiBI,OAAQA,EAAQD,MAAOA,IAG1GT,GACGE,EAAU,CACNmB,SACAY,MAAO,GAAG9B,EAAK+B,IAAI,iBAAiBtC,IACpCuC,mBAAoBT,IAIxC"}
+{"version":3,"file":"PixInput.js","sources":["../../../../../../src/components/Pix/components/PixInput/PixInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useState } from 'preact/hooks';\nimport { pixValidationRules } from './validate';\nimport { pixFormatters } from './utils';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport useForm from '../../../../utils/useForm';\nimport { BrazilPersonalDetail } from '../../../internal/SocialSecurityNumberBrazil/BrazilPersonalDetail';\nimport { PixInputDataState, PixInputProps } from './types';\n\nfunction PixInput({ name, data: dataProps, personalDetailsRequired, showPayButton, onChange, payButton }: Readonly<PixInputProps>) {\n    const { i18n } = useCoreContext();\n    const formSchema = ['firstName', 'lastName', 'socialSecurityNumber'];\n\n    const { handleChangeFor, triggerValidation, setSchema, data, valid, errors, isValid } = useForm<PixInputDataState>({\n        schema: formSchema,\n        defaultData: dataProps,\n        rules: pixValidationRules,\n        formatters: pixFormatters\n    });\n\n    // Handle form schema updates\n    useEffect(() => {\n        const newSchema = personalDetailsRequired ? [...formSchema] : [];\n        setSchema(newSchema);\n    }, [personalDetailsRequired]);\n\n    const [status, setStatus] = useState('ready');\n    this.setStatus = setStatus;\n\n    this.showValidation = () => {\n        triggerValidation();\n    };\n\n    useEffect(() => {\n        onChange({ data, valid, errors, isValid });\n    }, [onChange, data, valid, errors]);\n\n    const buttonModifiers = !personalDetailsRequired ? ['standalone'] : [];\n\n    return (\n        <div className=\"adyen-checkout__pix-input__field\" style={!showPayButton && !personalDetailsRequired ? { display: 'none' } : null}>\n            {personalDetailsRequired && (\n                <BrazilPersonalDetail i18n={i18n} data={data} handleChangeFor={handleChangeFor} errors={errors} valid={valid} />\n            )}\n\n            {showPayButton &&\n                payButton({\n                    status,\n                    label: `${i18n.get('continueTo')} ${name}`,\n                    classNameModifiers: buttonModifiers\n                })}\n        </div>\n    );\n}\n\nexport default PixInput;\n"],"names":["PixInput","name","data","dataProps","personalDetailsRequired","showPayButton","onChange","payButton","i18n","useCoreContext","formSchema","handleChangeFor","triggerValidation","setSchema","valid","errors","isValid","useForm","schema","defaultData","rules","pixValidationRules","formatters","pixFormatters","useEffect","newSchema","status","setStatus","useState","this","showValidation","buttonModifiers","h","div","className","style","display","BrazilPersonalDetail","label","get","classNameModifiers"],"mappings":"gjBASA,SAASA,GAASC,KAAEA,EAAMC,KAAMC,EAASC,wBAAEA,EAAuBC,cAAEA,EAAaC,SAAEA,EAAQC,UAAEA,IACzF,MAAMC,KAAEA,GAASC,IACXC,EAAa,CAAC,YAAa,WAAY,yBAEvCC,gBAAEA,EAAeC,kBAAEA,EAAiBC,UAAEA,EAASX,KAAEA,EAAIY,MAAEA,EAAKC,OAAEA,EAAMC,QAAEA,GAAYC,EAA2B,CAC/GC,OAAQR,EACRS,YAAahB,EACbiB,MAAOC,EACPC,WAAYC,IAIhBC,EAAU,KACN,MAAMC,EAAYrB,EAA0B,IAAIM,GAAc,GAC9DG,EAAUY,IACX,CAACrB,IAEJ,MAAOsB,EAAQC,GAAaC,EAAS,SACrCC,KAAKF,UAAYA,EAEjBE,KAAKC,eAAiB,KAClBlB,KAGJY,EAAU,KACNlB,EAAS,CAAEJ,OAAMY,QAAOC,SAAQC,aACjC,CAACV,EAAUJ,EAAMY,EAAOC,IAE3B,MAAMgB,EAAmB3B,EAA2C,GAAjB,CAAC,cAEpD,OACI4B,EAACC,MAAAA,CAAIC,UAAU,mCAAmCC,MAAQ9B,GAAkBD,EAAgD,KAAtB,CAAEgC,QAAS,SAC5GhC,GACG4B,EAACK,EAAAA,CAAqB7B,KAAMA,EAAMN,KAAMA,EAAMS,gBAAiBA,EAAiBI,OAAQA,EAAQD,MAAOA,IAG1GT,GACGE,EAAU,CACNmB,SACAY,MAAO,GAAG9B,EAAK+B,IAAI,iBAAiBtC,IACpCuC,mBAAoBT,IAIxC"}

package/dist/es-legacy/components/PreAuthorizedDebitCanada/components/PreAuthorizedDebitCanadaComponent.js

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../external/preact/dist/preact.js";import{useState as a,useRef as t,useEffect as n}from"../../../external/preact/hooks/dist/hooks.js";import{useCoreContext as o}from"../../../core/Context/CoreProvider.js";import r from"../../internal/FormFields/Fieldset/Fieldset.js";import l from"../../internal/FormInstruction/FormInstruction.js";import i from"../../../utils/useForm/useForm.js";import s from"../../internal/FormFields/Field/Field.js";import u from"../../internal/FormFields/InputText.js";import{preAuthorizedDebitCanadaValidationRules as d,preAuthorizedDebitCanadaFormatters as m}from"./validate.js";import c from"../../internal/StoreDetails/StoreDetails.js";import b from"../../../core/Context/useImage.js";import{SettlementInfo as p}from"./SettlementInfo.js";function k({onChange:k,payButton:f,showPayButton:N,placeholders:g,setComponentRef:x,enableStoreDetails:h,showContextualElement:C=!0}){const I=b(),{i18n:w}=o(),[F,v]=a("ready"),{handleChangeFor:j,triggerValidation:M,data:A,errors:L,valid:V,isValid:T}=i({schema:["ownerName","bankAccountNumber","bankCode","bankLocationId"],rules:d,formatters:m}),[y,B]=a(!1),E="loading"===F,S=t({setStatus:v,showValidation:()=>{M()}});return n(()=>{x(S.current)},[x,S.current]),n(()=>{k({data:A,valid:V,errors:L,isValid:T,storePaymentMethod:y})},[k,A,V,L,T,y]),e("div",{className:"adyen-checkout__eftpad-canada"},e(l,null),e(r,null,e(s,{label:w.get("eftpad-canada.input.accountHolderName.label"),errorMessage:!!L.ownerName&&w.get(L.ownerName.errorMessage),isValid:!!V.ownerName,name:"ownerName"},e(u,{disabled:E,name:"ownerName",placeholder:null==g?void 0:g.ownerName,value:A.ownerName,onInput:j("ownerName","input"),onBlur:j("ownerName","blur"),required:!0,"data-testid":"owner-name"})),e(s,{label:w.get("eftpad-canada.input.accountNumber.label"),errorMessage:!!L.bankAccountNumber&&w.get(L.bankAccountNumber.errorMessage),name:"bankAccountNumber",isValid:!!V.bankAccountNumber,showContextualElement:C,contextualText:w.get("eftpad-canada.input.accountNumber.contextualText")},e(u,{disabled:E,name:"bankAccountNumber",placeholder:null==g?void 0:g.bankAccountNumber,value:A.bankAccountNumber,onInput:j("bankAccountNumber","input"),onBlur:j("bankAccountNumber","blur"),required:!0,maxlength:12})),e(s,{label:w.get("eftpad-canada.input.institutionNumber.label"),classNameModifiers:["col-50"],errorMessage:!!L.bankCode&&w.get(L.bankCode.errorMessage),isValid:!!V.bankCode,name:"bankCode",showContextualElement:C,contextualText:w.get("eftpad-canada.input.institutionNumber.contextualText")},e(u,{disabled:E,name:"bankCode",placeholder:null==g?void 0:g.bankCode,value:A.bankCode,onInput:j("bankCode","input"),onBlur:j("bankCode","blur"),required:!0,maxlength:3})),e(s,{label:w.get("eftpad-canada.input.transitNumber.label"),classNameModifiers:["col-50"],errorMessage:!!L.bankLocationId&&w.get(L.bankLocationId.errorMessage),name:"bankLocationId",isValid:!!V.bankLocationId,showContextualElement:C,contextualText:w.get("eftpad-canada.input.transitNumber.contextualText")},e(u,{disabled:E,name:"bankLocationId",placeholder:null==g?void 0:g.bankLocationId,value:A.bankLocationId,onInput:j("bankLocationId","input"),onBlur:j("bankLocationId","blur"),required:!0,maxlength:5}))),h&&e(c,{className:"adyen-checkout_eftpad-canada-store-details",disabled:E,onChange:B}),e(p,null),N&&f({status:F,icon:I({imageFolder:"components/"})("bento_lock")}))}export{k as default};
+import{createElement as e}from"../../../external/preact/dist/preact.js";import{useState as a,useRef as t,useEffect as n}from"../../../external/preact/hooks/dist/hooks.js";import{useCoreContext as o}from"../../../core/Context/CoreProvider.js";import r from"../../internal/FormFields/Fieldset/Fieldset.js";import l from"../../internal/FormInstruction/FormInstruction.js";import i from"../../../utils/useForm/useForm.js";import"../../internal/SecuredFields/lib/CSF/utils/userAgent.js";import s from"../../internal/FormFields/Field/Field.js";import u from"../../internal/FormFields/InputText.js";import{preAuthorizedDebitCanadaValidationRules as d,preAuthorizedDebitCanadaFormatters as m}from"./validate.js";import c from"../../internal/StoreDetails/StoreDetails.js";import b from"../../../core/Context/useImage.js";import{SettlementInfo as p}from"./SettlementInfo.js";function k({onChange:k,payButton:f,showPayButton:g,placeholders:N,setComponentRef:x,enableStoreDetails:h,showContextualElement:C=!0}){const I=b(),{i18n:F}=o(),[w,j]=a("ready"),{handleChangeFor:v,triggerValidation:A,data:M,errors:L,valid:S,isValid:V}=i({schema:["ownerName","bankAccountNumber","bankCode","bankLocationId"],rules:d,formatters:m}),[T,y]=a(!1),B="loading"===w,E=t({setStatus:j,showValidation:()=>{A()}});return n(()=>{x(E.current)},[x,E.current]),n(()=>{k({data:M,valid:S,errors:L,isValid:V,storePaymentMethod:T})},[k,M,S,L,V,T]),e("div",{className:"adyen-checkout__eftpad-canada"},e(l,null),e(r,null,e(s,{label:F.get("eftpad-canada.input.accountHolderName.label"),errorMessage:!!L.ownerName&&F.get(L.ownerName.errorMessage),isValid:!!S.ownerName,name:"ownerName"},e(u,{disabled:B,name:"ownerName",placeholder:null==N?void 0:N.ownerName,value:M.ownerName,onInput:v("ownerName","input"),onBlur:v("ownerName","blur"),required:!0,"data-testid":"owner-name"})),e(s,{label:F.get("eftpad-canada.input.accountNumber.label"),errorMessage:!!L.bankAccountNumber&&F.get(L.bankAccountNumber.errorMessage),name:"bankAccountNumber",isValid:!!S.bankAccountNumber,showContextualElement:C,contextualText:F.get("eftpad-canada.input.accountNumber.contextualText")},e(u,{disabled:B,name:"bankAccountNumber",placeholder:null==N?void 0:N.bankAccountNumber,value:M.bankAccountNumber,onInput:v("bankAccountNumber","input"),onBlur:v("bankAccountNumber","blur"),required:!0,maxlength:12})),e(s,{label:F.get("eftpad-canada.input.institutionNumber.label"),classNameModifiers:["col-50"],errorMessage:!!L.bankCode&&F.get(L.bankCode.errorMessage),isValid:!!S.bankCode,name:"bankCode",showContextualElement:C,contextualText:F.get("eftpad-canada.input.institutionNumber.contextualText")},e(u,{disabled:B,name:"bankCode",placeholder:null==N?void 0:N.bankCode,value:M.bankCode,onInput:v("bankCode","input"),onBlur:v("bankCode","blur"),required:!0,maxlength:3})),e(s,{label:F.get("eftpad-canada.input.transitNumber.label"),classNameModifiers:["col-50"],errorMessage:!!L.bankLocationId&&F.get(L.bankLocationId.errorMessage),name:"bankLocationId",isValid:!!S.bankLocationId,showContextualElement:C,contextualText:F.get("eftpad-canada.input.transitNumber.contextualText")},e(u,{disabled:B,name:"bankLocationId",placeholder:null==N?void 0:N.bankLocationId,value:M.bankLocationId,onInput:v("bankLocationId","input"),onBlur:v("bankLocationId","blur"),required:!0,maxlength:5}))),h&&e(c,{className:"adyen-checkout_eftpad-canada-store-details",disabled:B,onChange:y}),e(p,null),g&&f({status:w,icon:I({imageFolder:"components/"})("bento_lock")}))}export{k as default};
 //# sourceMappingURL=PreAuthorizedDebitCanadaComponent.js.map

package/dist/es-legacy/components/PreAuthorizedDebitCanada/components/PreAuthorizedDebitCanadaComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"PreAuthorizedDebitCanadaComponent.js","sources":["../../../../../src/components/PreAuthorizedDebitCanada/components/PreAuthorizedDebitCanadaComponent.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useRef, useState } from 'preact/hooks';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport Fieldset from '../../internal/FormFields/Fieldset';\nimport FormInstruction from '../../internal/FormInstruction';\nimport useForm from '../../../utils/useForm';\nimport Field from '../../internal/FormFields/Field';\nimport InputText from '../../internal/FormFields/InputText';\nimport { preAuthorizedDebitCanadaFormatters, preAuthorizedDebitCanadaValidationRules } from './validate';\nimport StoreDetails from '../../internal/StoreDetails';\nimport useImage from '../../../core/Context/useImage';\nimport { SettlementInfo } from './SettlementInfo';\n\nimport type { PayButtonProps } from '../../internal/PayButton/PayButton';\nimport type { ComponentMethodsRef } from '../../internal/UIElement/types';\nimport type { PreAuthorizedDebitCanadaPlaceholders } from '../types';\n\nimport './PreAuthorizedDebitCanada.scss';\nimport { ValidationRuleResult } from '../../../utils/Validator/ValidationRuleResult';\n\ninterface PreAuthorizedDebitCanadaForm {\n    ownerName: string;\n    bankAccountNumber: string;\n    bankCode: string;\n    bankLocationId: string;\n}\n\ninterface PreAuthorizedDebitCanadaComponentProps {\n    onChange({\n        data,\n        valid,\n        errors,\n        isValid,\n        storePaymentMethod\n    }: {\n        data: PreAuthorizedDebitCanadaForm;\n        valid: { [key: string]: boolean };\n        errors: { [key: string]: ValidationRuleResult };\n        isValid: boolean;\n        storePaymentMethod: boolean;\n    }): void;\n    payButton: (props: PayButtonProps) => h.JSX.Element;\n    setComponentRef: (ref: ComponentMethodsRef) => void;\n    showPayButton: boolean;\n    enableStoreDetails: boolean;\n    showContextualElement?: boolean;\n    placeholders?: PreAuthorizedDebitCanadaPlaceholders;\n}\n\nfunction PreAuthorizedDebitCanadaComponent({\n    onChange,\n    payButton,\n    showPayButton,\n    placeholders,\n    setComponentRef,\n    enableStoreDetails,\n    showContextualElement = true\n}: Readonly<PreAuthorizedDebitCanadaComponentProps>) {\n    const getImage = useImage();\n    const { i18n } = useCoreContext();\n    const [status, setStatus] = useState('ready');\n    const { handleChangeFor, triggerValidation, data, errors, valid, isValid } = useForm<PreAuthorizedDebitCanadaForm>({\n        schema: ['ownerName', 'bankAccountNumber', 'bankCode', 'bankLocationId'],\n        rules: preAuthorizedDebitCanadaValidationRules,\n        formatters: preAuthorizedDebitCanadaFormatters\n    });\n    const [storePaymentMethod, setStorePaymentMethod] = useState(false);\n\n    const isFormDisabled = status === 'loading';\n\n    const componentRef = useRef<ComponentMethodsRef>({\n        setStatus: setStatus,\n        showValidation: () => {\n            triggerValidation();\n        }\n    });\n\n    useEffect(() => {\n        setComponentRef(componentRef.current);\n    }, [setComponentRef, componentRef.current]);\n\n    useEffect(() => {\n        onChange({ data, valid, errors, isValid, storePaymentMethod });\n    }, [onChange, data, valid, errors, isValid, storePaymentMethod]);\n\n    return (\n        <div className=\"adyen-checkout__eftpad-canada\">\n            <FormInstruction />\n\n            <Fieldset>\n                <Field\n                    label={i18n.get('eftpad-canada.input.accountHolderName.label')}\n                    errorMessage={!!errors.ownerName && i18n.get(errors.ownerName.errorMessage)}\n                    isValid={!!valid.ownerName}\n                    name={'ownerName'}\n                >\n                    <InputText\n                        disabled={isFormDisabled}\n                        name={'ownerName'}\n                        placeholder={placeholders?.ownerName}\n                        value={data.ownerName}\n                        onInput={handleChangeFor('ownerName', 'input')}\n                        onBlur={handleChangeFor('ownerName', 'blur')}\n                        required={true}\n                        data-testid={'owner-name'}\n                    />\n                </Field>\n\n                <Field\n                    label={i18n.get('eftpad-canada.input.accountNumber.label')}\n                    errorMessage={!!errors.bankAccountNumber && i18n.get(errors.bankAccountNumber.errorMessage)}\n                    name={'bankAccountNumber'}\n                    isValid={!!valid.bankAccountNumber}\n                    showContextualElement={showContextualElement}\n                    contextualText={i18n.get('eftpad-canada.input.accountNumber.contextualText')}\n                >\n                    <InputText\n                        disabled={isFormDisabled}\n                        name={'bankAccountNumber'}\n                        placeholder={placeholders?.bankAccountNumber}\n                        value={data.bankAccountNumber}\n                        onInput={handleChangeFor('bankAccountNumber', 'input')}\n                        onBlur={handleChangeFor('bankAccountNumber', 'blur')}\n                        required={true}\n                        maxlength={12}\n                    />\n                </Field>\n\n                <Field\n                    label={i18n.get('eftpad-canada.input.institutionNumber.label')}\n                    classNameModifiers={['col-50']}\n                    errorMessage={!!errors.bankCode && i18n.get(errors.bankCode.errorMessage)}\n                    isValid={!!valid.bankCode}\n                    name={'bankCode'}\n                    showContextualElement={showContextualElement}\n                    contextualText={i18n.get('eftpad-canada.input.institutionNumber.contextualText')}\n                >\n                    <InputText\n                        disabled={isFormDisabled}\n                        name={'bankCode'}\n                        placeholder={placeholders?.bankCode}\n                        value={data.bankCode}\n                        onInput={handleChangeFor('bankCode', 'input')}\n                        onBlur={handleChangeFor('bankCode', 'blur')}\n                        required={true}\n                        maxlength={3}\n                    />\n                </Field>\n\n                <Field\n                    label={i18n.get('eftpad-canada.input.transitNumber.label')}\n                    classNameModifiers={['col-50']}\n                    errorMessage={!!errors.bankLocationId && i18n.get(errors.bankLocationId.errorMessage)}\n                    name={'bankLocationId'}\n                    isValid={!!valid.bankLocationId}\n                    showContextualElement={showContextualElement}\n                    contextualText={i18n.get('eftpad-canada.input.transitNumber.contextualText')}\n                >\n                    <InputText\n                        disabled={isFormDisabled}\n                        name={'bankLocationId'}\n                        placeholder={placeholders?.bankLocationId}\n                        value={data.bankLocationId}\n                        onInput={handleChangeFor('bankLocationId', 'input')}\n                        onBlur={handleChangeFor('bankLocationId', 'blur')}\n                        required={true}\n                        maxlength={5}\n                    />\n                </Field>\n            </Fieldset>\n\n            {enableStoreDetails && (\n                <StoreDetails className={'adyen-checkout_eftpad-canada-store-details'} disabled={isFormDisabled} onChange={setStorePaymentMethod} />\n            )}\n\n            <SettlementInfo />\n\n            {showPayButton && payButton({ status, icon: getImage({ imageFolder: 'components/' })('bento_lock') })}\n        </div>\n    );\n}\n\nexport default PreAuthorizedDebitCanadaComponent;\n"],"names":["PreAuthorizedDebitCanadaComponent","onChange","payButton","showPayButton","placeholders","setComponentRef","enableStoreDetails","showContextualElement","getImage","useImage","i18n","useCoreContext","status","setStatus","useState","handleChangeFor","triggerValidation","data","errors","valid","isValid","useForm","schema","rules","preAuthorizedDebitCanadaValidationRules","formatters","preAuthorizedDebitCanadaFormatters","storePaymentMethod","setStorePaymentMethod","isFormDisabled","componentRef","useRef","showValidation","useEffect","current","h","div","className","FormInstruction","Fieldset","Field","label","get","errorMessage","ownerName","name","InputText","disabled","placeholder","value","onInput","onBlur","required","data-testid","bankAccountNumber","contextualText","maxlength","classNameModifiers","bankCode","bankLocationId","StoreDetails","SettlementInfo","icon","imageFolder"],"mappings":"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"}
+{"version":3,"file":"PreAuthorizedDebitCanadaComponent.js","sources":["../../../../../src/components/PreAuthorizedDebitCanada/components/PreAuthorizedDebitCanadaComponent.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useRef, useState } from 'preact/hooks';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport Fieldset from '../../internal/FormFields/Fieldset';\nimport FormInstruction from '../../internal/FormInstruction';\nimport useForm from '../../../utils/useForm';\nimport Field from '../../internal/FormFields/Field';\nimport InputText from '../../internal/FormFields/InputText';\nimport { preAuthorizedDebitCanadaFormatters, preAuthorizedDebitCanadaValidationRules } from './validate';\nimport StoreDetails from '../../internal/StoreDetails';\nimport useImage from '../../../core/Context/useImage';\nimport { SettlementInfo } from './SettlementInfo';\n\nimport type { PayButtonProps } from '../../internal/PayButton/PayButton';\nimport type { ComponentMethodsRef } from '../../internal/UIElement/types';\nimport type { PreAuthorizedDebitCanadaPlaceholders } from '../types';\n\nimport './PreAuthorizedDebitCanada.scss';\nimport { ValidationRuleResult } from '../../../utils/Validator/ValidationRuleResult';\n\ninterface PreAuthorizedDebitCanadaForm {\n    ownerName: string;\n    bankAccountNumber: string;\n    bankCode: string;\n    bankLocationId: string;\n}\n\ninterface PreAuthorizedDebitCanadaComponentProps {\n    onChange({\n        data,\n        valid,\n        errors,\n        isValid,\n        storePaymentMethod\n    }: {\n        data: PreAuthorizedDebitCanadaForm;\n        valid: { [key: string]: boolean };\n        errors: { [key: string]: ValidationRuleResult };\n        isValid: boolean;\n        storePaymentMethod: boolean;\n    }): void;\n    payButton: (props: PayButtonProps) => h.JSX.Element;\n    setComponentRef: (ref: ComponentMethodsRef) => void;\n    showPayButton: boolean;\n    enableStoreDetails: boolean;\n    showContextualElement?: boolean;\n    placeholders?: PreAuthorizedDebitCanadaPlaceholders;\n}\n\nfunction PreAuthorizedDebitCanadaComponent({\n    onChange,\n    payButton,\n    showPayButton,\n    placeholders,\n    setComponentRef,\n    enableStoreDetails,\n    showContextualElement = true\n}: Readonly<PreAuthorizedDebitCanadaComponentProps>) {\n    const getImage = useImage();\n    const { i18n } = useCoreContext();\n    const [status, setStatus] = useState('ready');\n    const { handleChangeFor, triggerValidation, data, errors, valid, isValid } = useForm<PreAuthorizedDebitCanadaForm>({\n        schema: ['ownerName', 'bankAccountNumber', 'bankCode', 'bankLocationId'],\n        rules: preAuthorizedDebitCanadaValidationRules,\n        formatters: preAuthorizedDebitCanadaFormatters\n    });\n    const [storePaymentMethod, setStorePaymentMethod] = useState(false);\n\n    const isFormDisabled = status === 'loading';\n\n    const componentRef = useRef<ComponentMethodsRef>({\n        setStatus: setStatus,\n        showValidation: () => {\n            triggerValidation();\n        }\n    });\n\n    useEffect(() => {\n        setComponentRef(componentRef.current);\n    }, [setComponentRef, componentRef.current]);\n\n    useEffect(() => {\n        onChange({ data, valid, errors, isValid, storePaymentMethod });\n    }, [onChange, data, valid, errors, isValid, storePaymentMethod]);\n\n    return (\n        <div className=\"adyen-checkout__eftpad-canada\">\n            <FormInstruction />\n\n            <Fieldset>\n                <Field\n                    label={i18n.get('eftpad-canada.input.accountHolderName.label')}\n                    errorMessage={!!errors.ownerName && i18n.get(errors.ownerName.errorMessage)}\n                    isValid={!!valid.ownerName}\n                    name={'ownerName'}\n                >\n                    <InputText\n                        disabled={isFormDisabled}\n                        name={'ownerName'}\n                        placeholder={placeholders?.ownerName}\n                        value={data.ownerName}\n                        onInput={handleChangeFor('ownerName', 'input')}\n                        onBlur={handleChangeFor('ownerName', 'blur')}\n                        required={true}\n                        data-testid={'owner-name'}\n                    />\n                </Field>\n\n                <Field\n                    label={i18n.get('eftpad-canada.input.accountNumber.label')}\n                    errorMessage={!!errors.bankAccountNumber && i18n.get(errors.bankAccountNumber.errorMessage)}\n                    name={'bankAccountNumber'}\n                    isValid={!!valid.bankAccountNumber}\n                    showContextualElement={showContextualElement}\n                    contextualText={i18n.get('eftpad-canada.input.accountNumber.contextualText')}\n                >\n                    <InputText\n                        disabled={isFormDisabled}\n                        name={'bankAccountNumber'}\n                        placeholder={placeholders?.bankAccountNumber}\n                        value={data.bankAccountNumber}\n                        onInput={handleChangeFor('bankAccountNumber', 'input')}\n                        onBlur={handleChangeFor('bankAccountNumber', 'blur')}\n                        required={true}\n                        maxlength={12}\n                    />\n                </Field>\n\n                <Field\n                    label={i18n.get('eftpad-canada.input.institutionNumber.label')}\n                    classNameModifiers={['col-50']}\n                    errorMessage={!!errors.bankCode && i18n.get(errors.bankCode.errorMessage)}\n                    isValid={!!valid.bankCode}\n                    name={'bankCode'}\n                    showContextualElement={showContextualElement}\n                    contextualText={i18n.get('eftpad-canada.input.institutionNumber.contextualText')}\n                >\n                    <InputText\n                        disabled={isFormDisabled}\n                        name={'bankCode'}\n                        placeholder={placeholders?.bankCode}\n                        value={data.bankCode}\n                        onInput={handleChangeFor('bankCode', 'input')}\n                        onBlur={handleChangeFor('bankCode', 'blur')}\n                        required={true}\n                        maxlength={3}\n                    />\n                </Field>\n\n                <Field\n                    label={i18n.get('eftpad-canada.input.transitNumber.label')}\n                    classNameModifiers={['col-50']}\n                    errorMessage={!!errors.bankLocationId && i18n.get(errors.bankLocationId.errorMessage)}\n                    name={'bankLocationId'}\n                    isValid={!!valid.bankLocationId}\n                    showContextualElement={showContextualElement}\n                    contextualText={i18n.get('eftpad-canada.input.transitNumber.contextualText')}\n                >\n                    <InputText\n                        disabled={isFormDisabled}\n                        name={'bankLocationId'}\n                        placeholder={placeholders?.bankLocationId}\n                        value={data.bankLocationId}\n                        onInput={handleChangeFor('bankLocationId', 'input')}\n                        onBlur={handleChangeFor('bankLocationId', 'blur')}\n                        required={true}\n                        maxlength={5}\n                    />\n                </Field>\n            </Fieldset>\n\n            {enableStoreDetails && (\n                <StoreDetails className={'adyen-checkout_eftpad-canada-store-details'} disabled={isFormDisabled} onChange={setStorePaymentMethod} />\n            )}\n\n            <SettlementInfo />\n\n            {showPayButton && payButton({ status, icon: getImage({ imageFolder: 'components/' })('bento_lock') })}\n        </div>\n    );\n}\n\nexport default PreAuthorizedDebitCanadaComponent;\n"],"names":["PreAuthorizedDebitCanadaComponent","onChange","payButton","showPayButton","placeholders","setComponentRef","enableStoreDetails","showContextualElement","getImage","useImage","i18n","useCoreContext","status","setStatus","useState","handleChangeFor","triggerValidation","data","errors","valid","isValid","useForm","schema","rules","preAuthorizedDebitCanadaValidationRules","formatters","preAuthorizedDebitCanadaFormatters","storePaymentMethod","setStorePaymentMethod","isFormDisabled","componentRef","useRef","showValidation","useEffect","current","h","div","className","FormInstruction","Fieldset","Field","label","get","errorMessage","ownerName","name","InputText","disabled","placeholder","value","onInput","onBlur","required","data-testid","bankAccountNumber","contextualText","maxlength","classNameModifiers","bankCode","bankLocationId","StoreDetails","SettlementInfo","icon","imageFolder"],"mappings":"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"}

package/dist/es-legacy/components/ThreeDS2/components/Challenge/PrepareChallenge3DS2.js.map

@@ -1 +1 @@
-{"version":3,"file":"PrepareChallenge3DS2.js","sources":["../../../../../../src/components/ThreeDS2/components/Challenge/PrepareChallenge3DS2.tsx"],"sourcesContent":["import { Component, h } from 'preact';\nimport DoChallenge3DS2 from './DoChallenge3DS2';\nimport { createChallengeResolveData, prepareChallengeData, isErrorObject } from '../utils';\nimport { PrepareChallenge3DS2Props, PrepareChallenge3DS2State, StatusErrorInfoObject } from './types';\nimport { ChallengeData, ResultObject, ThreeDS2FlowObject, ErrorCodeObject, ChallengeResolveData } from '../../types';\nimport '../../ThreeDS2.scss';\nimport Img from '../../../internal/Img';\nimport './challenge.scss';\nimport { hasOwnProperty } from '../../../../utils/hasOwnProperty';\nimport useImage from '../../../../core/Context/useImage';\nimport AdyenCheckoutError, { ERROR } from '../../../../core/Errors/AdyenCheckoutError';\nimport { THREEDS2_CHALLENGE, THREEDS2_CHALLENGE_ERROR, THREEDS2_NUM, MISSING_TOKEN_IN_ACTION_MSG } from '../../constants';\nimport { isValidHttpUrl } from '../../../../utils/isValidURL';\nimport { ErrorObject } from '../../../../core/Errors/types';\nimport { AnalyticsLogEvent, LogEventSubtype, LogEventType } from '../../../../core/Analytics/events/AnalyticsLogEvent';\nimport { AnalyticsErrorEvent, ErrorEventCode, ErrorEventType } from '../../../../core/Analytics/events/AnalyticsErrorEvent';\nimport { AbstractAnalyticsEvent } from '../../../../core/Analytics/events/AbstractAnalyticsEvent';\n\nclass PrepareChallenge3DS2 extends Component<PrepareChallenge3DS2Props, PrepareChallenge3DS2State> {\n    public static readonly defaultProps = {\n        onComplete: () => {},\n        onError: () => {},\n        isMDFlow: false\n    };\n\n    constructor(props) {\n        super(props);\n\n        if (this.props.token) {\n            const challengeData: ChallengeData | ErrorObject = prepareChallengeData({\n                token: this.props.token,\n                size: this.props.challengeWindowSize || this.props.size // TODO confirm that this.props.size is legacy and can be removed\n            });\n\n            this.state = {\n                status: 'init',\n                challengeData: challengeData as ChallengeData\n            };\n        } else {\n            // Will be picked up in componentDidMount\n            this.state = { challengeData: { success: false, error: MISSING_TOKEN_IN_ACTION_MSG } };\n\n            console.debug(`${THREEDS2_CHALLENGE_ERROR}: ${MISSING_TOKEN_IN_ACTION_MSG}`);\n        }\n    }\n\n    public onFormSubmit = (msg: string) => {\n        const event = new AnalyticsLogEvent({\n            component: this.props.type,\n            type: LogEventType.threeDS2,\n            subType: LogEventSubtype.challengeDataSentWeb,\n            message: msg\n        });\n\n        this.props.onSubmitAnalytics(event);\n    };\n\n    componentDidMount() {\n        const hasChallengeData = !isErrorObject(this.state.challengeData);\n\n        if (hasChallengeData) {\n            const shouldAllowHttpDomains =\n                /** Allow http urls if in development and testing against localhost:8080 */\n                (process.env.NODE_ENV === 'development' && process.env.__CLIENT_ENV__?.includes('localhost:8080')) ||\n                /**\n                 * Allows the checkoutshopper demo on localhost:8080 to work -\n                 *  requires a configuration in localhost of environment: 'test', _environmentUrls: {api: 'http://localhost:8080/'}\n                 */\n                (this.props.environment === 'test' && this.props._environmentUrls?.api?.includes('http://localhost:8080'));\n\n            /**\n             * Check the structure of the created challengeData\n             */\n            const { acsURL } = this.state.challengeData as ChallengeData;\n            const hasValidAcsURL = isValidHttpUrl(acsURL, shouldAllowHttpDomains);\n\n            // Only render component if we have an acsURL.\n            if (!hasValidAcsURL) {\n                // Set UI error & call onError callback\n                this.setError(\n                    {\n                        errorInfo: `${ErrorEventCode.THREEDS2_TOKEN_IS_MISSING_ACSURL}: ${this.props.i18n.get('err.gen.9102')}` //\n                    },\n                    true\n                );\n\n                // Send error to analytics endpoint // TODO - check logs to see if this *ever* happens\n                const event = new AnalyticsErrorEvent({\n                    component: this.props.type,\n                    code: ErrorEventCode.THREEDS2_TOKEN_IS_MISSING_ACSURL,\n                    errorType: ErrorEventType.threeDS2,\n                    message: `${THREEDS2_CHALLENGE_ERROR}: Decoded token is missing a valid acsURL property`\n                });\n                this.props.onSubmitAnalytics(event);\n\n                console.debug('### PrepareChallenge3DS2::exiting:: no valid acsURL');\n                return;\n            }\n\n            const { acsTransID, messageVersion, threeDSServerTransID } = (this.state.challengeData as ChallengeData).cReqData;\n\n            // Only render component if we have a acsTransID, messageVersion & threeDSServerTransID\n            if (!acsTransID || !messageVersion || !threeDSServerTransID) {\n                // Set UI error & call onError callback\n                this.setError(\n                    {\n                        errorInfo: `${ErrorEventCode.THREEDS2_TOKEN_IS_MISSING_OTHER_PROPS}: ${this.props.i18n.get('err.gen.9102')}`\n                    },\n                    true\n                );\n\n                // Send error to analytics endpoint // TODO - check logs to see if this *ever* happens\n                const event = new AnalyticsErrorEvent({\n                    component: this.props.type,\n                    code: ErrorEventCode.THREEDS2_TOKEN_IS_MISSING_OTHER_PROPS,\n                    errorType: ErrorEventType.threeDS2,\n                    message: `${THREEDS2_CHALLENGE_ERROR}: Decoded token is missing one or more of the following properties (acsTransID | messageVersion | threeDSServerTransID)`\n                });\n                this.props.onSubmitAnalytics(event);\n\n                console.debug(\n                    '### PrepareChallenge3DS2::exiting:: missing one or more of the following properties (acsTransID | messageVersion | threeDSServerTransID)'\n                );\n                return;\n            }\n\n            // Proceed to allow component to render\n            this.setState({ status: 'performingChallenge' });\n            //\n        } else {\n            const errorMsg: string = (this.state.challengeData as ErrorObject).error;\n\n            const errorCode = errorMsg.includes(MISSING_TOKEN_IN_ACTION_MSG)\n                ? ErrorEventCode.THREEDS2_ACTION_IS_MISSING_TOKEN\n                : ErrorEventCode.THREEDS2_TOKEN_DECODE_OR_PARSING_FAILED;\n\n            // Set UI error & call onError callback\n            this.setError(\n                {\n                    errorInfo: `${errorCode}: ${this.props.i18n.get('err.gen.9102')}`\n                    // errorObj: this.state.challengeData // TODO Decide if we want to expose this data\n                },\n                true\n            );\n\n            // Send error to analytics endpoint // TODO - check logs to see if the base64 decoding errors *ever* happen\n            const event = new AnalyticsErrorEvent({\n                component: this.props.type,\n                code: errorCode,\n                errorType: ErrorEventType.threeDS2,\n                message: `${THREEDS2_CHALLENGE_ERROR}: ${errorMsg}` // can be: 'Missing \"token\" property from threeDS2 action', 'not base64', 'malformed URI sequence' or 'Could not JSON parse token'\n            });\n\n            this.props.onSubmitAnalytics(event);\n\n            console.debug('### PrepareChallenge3DS2::exiting:: no challengeData');\n        }\n    }\n\n    setStatusComplete(resultObj: ResultObject, errorCodeObject: ErrorCodeObject = null) {\n        this.setState({ status: 'complete' }, () => {\n            const data: ChallengeResolveData = createChallengeResolveData(this.props.dataKey, resultObj.transStatus, this.props.paymentData);\n\n            if (errorCodeObject) {\n                console.debug('### PrepareChallenge3DS2::errorCodeObject::', errorCodeObject);\n            }\n\n            let event: AbstractAnalyticsEvent;\n\n            /** Are we in an \"error\" i.e. timeout or no transStatus, scenario? If so, submit analytics about it */\n            const finalResObject = errorCodeObject ? errorCodeObject : resultObj;\n            if (finalResObject.errorCode) {\n                const errorTypeAndCode = {\n                    code: finalResObject.errorCode === 'timeout' ? ErrorEventCode.THREEDS2_TIMEOUT : ErrorEventCode.THREEDS2_NO_TRANSSTATUS,\n                    errorType: ErrorEventType.threeDS2\n                };\n\n                // Challenge process has timed out,\n                // or, It's an error reported by the backend 'cos no transStatus could be retrieved // TODO - check logs to see if this *ever* happens\n\n                event = new AnalyticsErrorEvent({\n                    component: this.props.type,\n                    message: (finalResObject as ErrorCodeObject).message,\n                    ...errorTypeAndCode\n                });\n\n                // Send error to analytics endpoint\n                this.props.onSubmitAnalytics(event);\n            }\n\n            /** Calculate \"result\" for analytics */\n            let result: string;\n\n            switch (resultObj?.transStatus) {\n                case 'Y':\n                    result = 'success';\n                    break;\n                case 'N':\n                    result = 'failed';\n                    break;\n                case 'U':\n                    result = !errorCodeObject ? 'cancelled' : 'timeout';\n                    break;\n                default:\n            }\n            if (resultObj?.errorCode) {\n                result = 'noTransStatus';\n            }\n\n            /** Create log object - the process is completed, one way or another */\n\n            event = new AnalyticsLogEvent({\n                component: this.props.type,\n                type: LogEventType.threeDS2,\n                subType: LogEventSubtype.challengeCompleted,\n                message: `${THREEDS2_NUM} challenge has completed`,\n                result\n            });\n\n            // Send log to analytics endpoint\n            this.props.onSubmitAnalytics(event);\n\n            /**\n             * Equals call to onAdditionalDetails (except for in 3DS2InMDFlow)\n             */\n            this.props.onComplete(data);\n        });\n    }\n\n    /**\n     * Display error in the UI,\n     * and, optionally, decide whether to send any of these errors to the merchant defined onError callback\n     *\n     * @param errorInfoObj -\n     * @param isFatal -\n     */\n    setError(errorInfoObj: StatusErrorInfoObject, isFatal: boolean) {\n        this.setState({ status: 'error', errorInfo: errorInfoObj.errorInfo });\n\n        // Decide whether to call this.props.onError\n        if (isFatal) {\n            this.props.onError(new AdyenCheckoutError(ERROR, errorInfoObj.errorInfo, { cause: errorInfoObj.errorObj }));\n        }\n    }\n\n    render(_, { challengeData }) {\n        const getImage = useImage();\n        if (this.state.status === 'performingChallenge') {\n            return (\n                <DoChallenge3DS2\n                    onCompleteChallenge={(challenge: ThreeDS2FlowObject) => {\n                        let errorCodeObject: ErrorCodeObject = null;\n\n                        // Challenge has resulted in an error (no transStatus could be retrieved) - but we still treat this as a valid scenario\n                        if (hasOwnProperty(challenge.result, 'errorCode') && challenge.result.errorCode.length) {\n                            // Tell the merchant there's been an error\n                            errorCodeObject = {\n                                errorCode: challenge.result.errorCode,\n                                message: `${THREEDS2_CHALLENGE_ERROR}: ${\n                                    challenge.result.errorDescription ? challenge.result.errorDescription : 'no transStatus could be retrieved'\n                                }`\n                            };\n\n                            /**\n                             * NOTE: we can now use this.props.isMDFlow to decide if we want to send any of these errors to the onError handler\n                             *  - this is problematic in the regular flow since merchants tend to treat any calls to their onError handler as 'fatal',\n                             *   but in the MDFlow we control what the onError handler does.\n                             */\n                            if (this.props.isMDFlow) {\n                                this.props.onError(\n                                    new AdyenCheckoutError(\n                                        ERROR,\n                                        `${THREEDS2_CHALLENGE_ERROR}: ${\n                                            challenge.result.errorDescription\n                                                ? challenge.result.errorDescription\n                                                : 'no transStatus could be retrieved'\n                                        }`,\n                                        { cause: challenge.result.errorCode }\n                                    )\n                                );\n                            }\n                        }\n\n                        /**\n                         * An object has been returned, parsed & accepted as legit (according to the rules in getProcessMessageHandler),\n                         * but the result prop on that object is missing\n                         */\n                        if (!challenge.result) {\n                            this.setError(\n                                {\n                                    errorInfo: `${THREEDS2_CHALLENGE_ERROR}:  ${this.props.i18n.get('3ds.chal.805', {\n                                        values: { result: '\"result\"' }\n                                    })}`,\n                                    errorObj: challenge as unknown as ErrorObject\n                                },\n                                true\n                            );\n\n                            // Send error to analytics endpoint\n                            const event = new AnalyticsErrorEvent({\n                                component: this.props.type,\n                                code: ErrorEventCode.THREEDS2_CHALLENGE_RESOLVED_WITHOUT_RESULT_PROP,\n                                errorType: ErrorEventType.threeDS2,\n                                message: `${THREEDS2_CHALLENGE_ERROR}: challenge resolved without a \"result\" object`\n                            });\n\n                            this.props.onSubmitAnalytics(event);\n\n                            console.debug('### PrepareChallenge3DS2::exiting:: challenge resolved without a \"result\" object');\n\n                            return;\n                        }\n\n                        // Proceed with call to onAdditionalDetails (except for in 3DS2InMDFlow)\n                        this.setStatusComplete(challenge.result, errorCodeObject);\n                    }}\n                    onErrorChallenge={(challenge: ThreeDS2FlowObject) => {\n                        /**\n                         * Called when challenge times-out (which is still a valid scenario)...\n                         */\n                        if (hasOwnProperty(challenge, 'errorCode')) {\n                            const timeoutObject: ErrorCodeObject = {\n                                errorCode: challenge.errorCode,\n                                message: `${THREEDS2_CHALLENGE}: ${challenge.errorCode}`\n                            };\n\n                            // see comment in onCompleteChallenge code block\n                            if (this.props.isMDFlow) {\n                                this.props.onError(\n                                    new AdyenCheckoutError(ERROR, `${THREEDS2_CHALLENGE_ERROR}: '3DS2 challenge timed out'`, {\n                                        cause: challenge.errorCode\n                                    })\n                                );\n                            }\n\n                            this.setStatusComplete(challenge.result, timeoutObject);\n                            return;\n                        }\n                    }}\n                    {...challengeData}\n                    onActionHandled={this.props.onActionHandled}\n                    onFormSubmit={this.onFormSubmit}\n                />\n            );\n        }\n\n        if (this.state.status === 'error') {\n            return (\n                <div className=\"adyen-checkout__threeds2-challenge-error\">\n                    <Img\n                        className=\"adyen-checkout__status__icon adyen-checkout__status__icon--error\"\n                        src={getImage({\n                            imageFolder: 'components/'\n                        })('error')}\n                        alt={''}\n                    />\n                    <div className=\"adyen-checkout__status__text\">\n                        {this.state.errorInfo ? this.state.errorInfo : this.props.i18n.get('error.message.unknown')}\n                    </div>\n                </div>\n            );\n        }\n\n        return null;\n    }\n}\n\nexport default PrepareChallenge3DS2;\n"],"names":["PrepareChallenge3DS2","Component","componentDidMount","isErrorObject","this","state","challengeData","process","_this_props__environmentUrls_api","_this_props__environmentUrls","shouldAllowHttpDomains","props","environment","_environmentUrls","api","includes","acsURL","isValidHttpUrl","setError","errorInfo","ErrorEventCode","THREEDS2_TOKEN_IS_MISSING_ACSURL","i18n","get","event","AnalyticsErrorEvent","component","type","code","errorType","ErrorEventType","threeDS2","message","THREEDS2_CHALLENGE_ERROR","onSubmitAnalytics","console","debug","acsTransID","messageVersion","threeDSServerTransID","cReqData","THREEDS2_TOKEN_IS_MISSING_OTHER_PROPS","setState","status","errorMsg","error","errorCode","MISSING_TOKEN_IN_ACTION_MSG","THREEDS2_ACTION_IS_MISSING_TOKEN","THREEDS2_TOKEN_DECODE_OR_PARSING_FAILED","setStatusComplete","resultObj","errorCodeObject","data","createChallengeResolveData","dataKey","transStatus","paymentData","finalResObject","errorTypeAndCode","THREEDS2_TIMEOUT","THREEDS2_NO_TRANSSTATUS","_object_spread","result","AnalyticsLogEvent","LogEventType","subType","LogEventSubtype","challengeCompleted","THREEDS2_NUM","onComplete","errorInfoObj","isFatal","onError","AdyenCheckoutError","ERROR","cause","errorObj","render","_","getImage","useImage","h","DoChallenge3DS2","onCompleteChallenge","challenge","hasOwnProperty","length","errorDescription","isMDFlow","values","THREEDS2_CHALLENGE_RESOLVED_WITHOUT_RESULT_PROP","onErrorChallenge","timeoutObject","THREEDS2_CHALLENGE","onActionHandled","onFormSubmit","div","className","Img","src","imageFolder","alt","constructor","super","_define_property","msg","challengeDataSentWeb","token","prepareChallengeData","size","challengeWindowSize","success","defaultProps"],"mappings":"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"}
+{"version":3,"file":"PrepareChallenge3DS2.js","sources":["../../../../../../src/components/ThreeDS2/components/Challenge/PrepareChallenge3DS2.tsx"],"sourcesContent":["import { Component, h } from 'preact';\nimport DoChallenge3DS2 from './DoChallenge3DS2';\nimport { createChallengeResolveData, prepareChallengeData, isErrorObject } from '../utils';\nimport { PrepareChallenge3DS2Props, PrepareChallenge3DS2State, StatusErrorInfoObject } from './types';\nimport { ChallengeData, ResultObject, ThreeDS2FlowObject, ErrorCodeObject, ChallengeResolveData } from '../../types';\nimport '../../ThreeDS2.scss';\nimport Img from '../../../internal/Img';\nimport './challenge.scss';\nimport { hasOwnProperty } from '../../../../utils/hasOwnProperty';\nimport useImage from '../../../../core/Context/useImage';\nimport AdyenCheckoutError, { ERROR } from '../../../../core/Errors/AdyenCheckoutError';\nimport { THREEDS2_CHALLENGE, THREEDS2_CHALLENGE_ERROR, THREEDS2_NUM, MISSING_TOKEN_IN_ACTION_MSG } from '../../constants';\nimport { isValidHttpUrl } from '../../../../utils/isValidURL';\nimport { ErrorObject } from '../../../../core/Errors/types';\nimport { AnalyticsLogEvent, LogEventSubtype, LogEventType } from '../../../../core/Analytics/events/AnalyticsLogEvent';\nimport { AnalyticsErrorEvent, ErrorEventCode, ErrorEventType } from '../../../../core/Analytics/events/AnalyticsErrorEvent';\nimport { AbstractAnalyticsEvent } from '../../../../core/Analytics/events/AbstractAnalyticsEvent';\n\nclass PrepareChallenge3DS2 extends Component<PrepareChallenge3DS2Props, PrepareChallenge3DS2State> {\n    public static readonly defaultProps = {\n        onComplete: () => {},\n        onError: () => {},\n        isMDFlow: false\n    };\n\n    constructor(props) {\n        super(props);\n\n        if (this.props.token) {\n            const challengeData: ChallengeData | ErrorObject = prepareChallengeData({\n                token: this.props.token,\n                size: this.props.challengeWindowSize || this.props.size // TODO confirm that this.props.size is legacy and can be removed\n            });\n\n            this.state = {\n                status: 'init',\n                challengeData\n            };\n        } else {\n            // Will be picked up in componentDidMount\n            this.state = { challengeData: { success: false, error: MISSING_TOKEN_IN_ACTION_MSG } };\n\n            console.debug(`${THREEDS2_CHALLENGE_ERROR}: ${MISSING_TOKEN_IN_ACTION_MSG}`);\n        }\n    }\n\n    public onFormSubmit = (msg: string) => {\n        const event = new AnalyticsLogEvent({\n            component: this.props.type,\n            type: LogEventType.threeDS2,\n            subType: LogEventSubtype.challengeDataSentWeb,\n            message: msg\n        });\n\n        this.props.onSubmitAnalytics(event);\n    };\n\n    componentDidMount() {\n        const hasChallengeData = !isErrorObject(this.state.challengeData);\n\n        if (hasChallengeData) {\n            const shouldAllowHttpDomains =\n                /** Allow http urls if in development and testing against localhost:8080 */\n                (process.env.NODE_ENV === 'development' && process.env.__CLIENT_ENV__?.includes('localhost:8080')) ||\n                /**\n                 * Allows the checkoutshopper demo on localhost:8080 to work -\n                 *  requires a configuration in localhost of environment: 'test', _environmentUrls: {api: 'http://localhost:8080/'}\n                 */\n                (this.props.environment === 'test' && this.props._environmentUrls?.api?.includes('http://localhost:8080'));\n\n            /**\n             * Check the structure of the created challengeData\n             */\n            const { acsURL } = this.state.challengeData as ChallengeData;\n            const hasValidAcsURL = isValidHttpUrl(acsURL, shouldAllowHttpDomains);\n\n            // Only render component if we have an acsURL.\n            if (!hasValidAcsURL) {\n                // Set UI error & call onError callback\n                this.setError(\n                    {\n                        errorInfo: `${ErrorEventCode.THREEDS2_TOKEN_IS_MISSING_ACSURL}: ${this.props.i18n.get('err.gen.9102')}` //\n                    },\n                    true\n                );\n\n                // Send error to analytics endpoint // TODO - check logs to see if this *ever* happens\n                const event = new AnalyticsErrorEvent({\n                    component: this.props.type,\n                    code: ErrorEventCode.THREEDS2_TOKEN_IS_MISSING_ACSURL,\n                    errorType: ErrorEventType.threeDS2,\n                    message: `${THREEDS2_CHALLENGE_ERROR}: Decoded token is missing a valid acsURL property`\n                });\n                this.props.onSubmitAnalytics(event);\n\n                console.debug('### PrepareChallenge3DS2::exiting:: no valid acsURL');\n                return;\n            }\n\n            const { acsTransID, messageVersion, threeDSServerTransID } = (this.state.challengeData as ChallengeData).cReqData;\n\n            // Only render component if we have a acsTransID, messageVersion & threeDSServerTransID\n            if (!acsTransID || !messageVersion || !threeDSServerTransID) {\n                // Set UI error & call onError callback\n                this.setError(\n                    {\n                        errorInfo: `${ErrorEventCode.THREEDS2_TOKEN_IS_MISSING_OTHER_PROPS}: ${this.props.i18n.get('err.gen.9102')}`\n                    },\n                    true\n                );\n\n                // Send error to analytics endpoint // TODO - check logs to see if this *ever* happens\n                const event = new AnalyticsErrorEvent({\n                    component: this.props.type,\n                    code: ErrorEventCode.THREEDS2_TOKEN_IS_MISSING_OTHER_PROPS,\n                    errorType: ErrorEventType.threeDS2,\n                    message: `${THREEDS2_CHALLENGE_ERROR}: Decoded token is missing one or more of the following properties (acsTransID | messageVersion | threeDSServerTransID)`\n                });\n                this.props.onSubmitAnalytics(event);\n\n                console.debug(\n                    '### PrepareChallenge3DS2::exiting:: missing one or more of the following properties (acsTransID | messageVersion | threeDSServerTransID)'\n                );\n                return;\n            }\n\n            // Proceed to allow component to render\n            this.setState({ status: 'performingChallenge' });\n            //\n        } else {\n            const errorMsg: string = (this.state.challengeData as ErrorObject).error;\n\n            const errorCode = errorMsg.includes(MISSING_TOKEN_IN_ACTION_MSG)\n                ? ErrorEventCode.THREEDS2_ACTION_IS_MISSING_TOKEN\n                : ErrorEventCode.THREEDS2_TOKEN_DECODE_OR_PARSING_FAILED;\n\n            // Set UI error & call onError callback\n            this.setError(\n                {\n                    errorInfo: `${errorCode}: ${this.props.i18n.get('err.gen.9102')}`\n                    // errorObj: this.state.challengeData // TODO Decide if we want to expose this data\n                },\n                true\n            );\n\n            // Send error to analytics endpoint // TODO - check logs to see if the base64 decoding errors *ever* happen\n            const event = new AnalyticsErrorEvent({\n                component: this.props.type,\n                code: errorCode,\n                errorType: ErrorEventType.threeDS2,\n                message: `${THREEDS2_CHALLENGE_ERROR}: ${errorMsg}` // can be: 'Missing \"token\" property from threeDS2 action', 'not base64', 'malformed URI sequence' or 'Could not JSON parse token'\n            });\n\n            this.props.onSubmitAnalytics(event);\n\n            console.debug('### PrepareChallenge3DS2::exiting:: no challengeData');\n        }\n    }\n\n    setStatusComplete(resultObj: ResultObject, errorCodeObject: ErrorCodeObject = null) {\n        this.setState({ status: 'complete' }, () => {\n            const data: ChallengeResolveData = createChallengeResolveData(this.props.dataKey, resultObj.transStatus, this.props.paymentData);\n\n            if (errorCodeObject) {\n                console.debug('### PrepareChallenge3DS2::errorCodeObject::', errorCodeObject);\n            }\n\n            let event: AbstractAnalyticsEvent;\n\n            /** Are we in an \"error\" i.e. timeout or no transStatus, scenario? If so, submit analytics about it */\n            const finalResObject = errorCodeObject ? errorCodeObject : resultObj;\n            if (finalResObject.errorCode) {\n                const errorTypeAndCode = {\n                    code: finalResObject.errorCode === 'timeout' ? ErrorEventCode.THREEDS2_TIMEOUT : ErrorEventCode.THREEDS2_NO_TRANSSTATUS,\n                    errorType: ErrorEventType.threeDS2\n                };\n\n                // Challenge process has timed out,\n                // or, It's an error reported by the backend 'cos no transStatus could be retrieved // TODO - check logs to see if this *ever* happens\n\n                event = new AnalyticsErrorEvent({\n                    component: this.props.type,\n                    message: (finalResObject as ErrorCodeObject).message,\n                    ...errorTypeAndCode\n                });\n\n                // Send error to analytics endpoint\n                this.props.onSubmitAnalytics(event);\n            }\n\n            /** Calculate \"result\" for analytics */\n            let result: string;\n\n            switch (resultObj?.transStatus) {\n                case 'Y':\n                    result = 'success';\n                    break;\n                case 'N':\n                    result = 'failed';\n                    break;\n                case 'U':\n                    result = !errorCodeObject ? 'cancelled' : 'timeout';\n                    break;\n                default:\n            }\n            if (resultObj?.errorCode) {\n                result = 'noTransStatus';\n            }\n\n            /** Create log object - the process is completed, one way or another */\n\n            event = new AnalyticsLogEvent({\n                component: this.props.type,\n                type: LogEventType.threeDS2,\n                subType: LogEventSubtype.challengeCompleted,\n                message: `${THREEDS2_NUM} challenge has completed`,\n                result\n            });\n\n            // Send log to analytics endpoint\n            this.props.onSubmitAnalytics(event);\n\n            /**\n             * Equals call to onAdditionalDetails (except for in 3DS2InMDFlow)\n             */\n            this.props.onComplete(data);\n        });\n    }\n\n    /**\n     * Display error in the UI,\n     * and, optionally, decide whether to send any of these errors to the merchant defined onError callback\n     *\n     * @param errorInfoObj -\n     * @param isFatal -\n     */\n    setError(errorInfoObj: StatusErrorInfoObject, isFatal: boolean) {\n        this.setState({ status: 'error', errorInfo: errorInfoObj.errorInfo });\n\n        // Decide whether to call this.props.onError\n        if (isFatal) {\n            this.props.onError(new AdyenCheckoutError(ERROR, errorInfoObj.errorInfo, { cause: errorInfoObj.errorObj }));\n        }\n    }\n\n    render(_, { challengeData }) {\n        const getImage = useImage();\n        if (this.state.status === 'performingChallenge') {\n            return (\n                <DoChallenge3DS2\n                    onCompleteChallenge={(challenge: ThreeDS2FlowObject) => {\n                        let errorCodeObject: ErrorCodeObject = null;\n\n                        // Challenge has resulted in an error (no transStatus could be retrieved) - but we still treat this as a valid scenario\n                        if (hasOwnProperty(challenge.result, 'errorCode') && challenge.result.errorCode.length) {\n                            // Tell the merchant there's been an error\n                            errorCodeObject = {\n                                errorCode: challenge.result.errorCode,\n                                message: `${THREEDS2_CHALLENGE_ERROR}: ${\n                                    challenge.result.errorDescription ? challenge.result.errorDescription : 'no transStatus could be retrieved'\n                                }`\n                            };\n\n                            /**\n                             * NOTE: we can now use this.props.isMDFlow to decide if we want to send any of these errors to the onError handler\n                             *  - this is problematic in the regular flow since merchants tend to treat any calls to their onError handler as 'fatal',\n                             *   but in the MDFlow we control what the onError handler does.\n                             */\n                            if (this.props.isMDFlow) {\n                                this.props.onError(\n                                    new AdyenCheckoutError(\n                                        ERROR,\n                                        `${THREEDS2_CHALLENGE_ERROR}: ${\n                                            challenge.result.errorDescription\n                                                ? challenge.result.errorDescription\n                                                : 'no transStatus could be retrieved'\n                                        }`,\n                                        { cause: challenge.result.errorCode }\n                                    )\n                                );\n                            }\n                        }\n\n                        /**\n                         * An object has been returned, parsed & accepted as legit (according to the rules in getProcessMessageHandler),\n                         * but the result prop on that object is missing\n                         */\n                        if (!challenge.result) {\n                            this.setError(\n                                {\n                                    errorInfo: `${THREEDS2_CHALLENGE_ERROR}:  ${this.props.i18n.get('3ds.chal.805', {\n                                        values: { result: '\"result\"' }\n                                    })}`,\n                                    errorObj: challenge as unknown as ErrorObject\n                                },\n                                true\n                            );\n\n                            // Send error to analytics endpoint\n                            const event = new AnalyticsErrorEvent({\n                                component: this.props.type,\n                                code: ErrorEventCode.THREEDS2_CHALLENGE_RESOLVED_WITHOUT_RESULT_PROP,\n                                errorType: ErrorEventType.threeDS2,\n                                message: `${THREEDS2_CHALLENGE_ERROR}: challenge resolved without a \"result\" object`\n                            });\n\n                            this.props.onSubmitAnalytics(event);\n\n                            console.debug('### PrepareChallenge3DS2::exiting:: challenge resolved without a \"result\" object');\n\n                            return;\n                        }\n\n                        // Proceed with call to onAdditionalDetails (except for in 3DS2InMDFlow)\n                        this.setStatusComplete(challenge.result, errorCodeObject);\n                    }}\n                    onErrorChallenge={(challenge: ThreeDS2FlowObject) => {\n                        /**\n                         * Called when challenge times-out (which is still a valid scenario)...\n                         */\n                        if (hasOwnProperty(challenge, 'errorCode')) {\n                            const timeoutObject: ErrorCodeObject = {\n                                errorCode: challenge.errorCode,\n                                message: `${THREEDS2_CHALLENGE}: ${challenge.errorCode}`\n                            };\n\n                            // see comment in onCompleteChallenge code block\n                            if (this.props.isMDFlow) {\n                                this.props.onError(\n                                    new AdyenCheckoutError(ERROR, `${THREEDS2_CHALLENGE_ERROR}: '3DS2 challenge timed out'`, {\n                                        cause: challenge.errorCode\n                                    })\n                                );\n                            }\n\n                            this.setStatusComplete(challenge.result, timeoutObject);\n                            return;\n                        }\n                    }}\n                    {...challengeData}\n                    onActionHandled={this.props.onActionHandled}\n                    onFormSubmit={this.onFormSubmit}\n                />\n            );\n        }\n\n        if (this.state.status === 'error') {\n            return (\n                <div className=\"adyen-checkout__threeds2-challenge-error\">\n                    <Img\n                        className=\"adyen-checkout__status__icon adyen-checkout__status__icon--error\"\n                        src={getImage({\n                            imageFolder: 'components/'\n                        })('error')}\n                        alt={''}\n                    />\n                    <div className=\"adyen-checkout__status__text\">\n                        {this.state.errorInfo ? this.state.errorInfo : this.props.i18n.get('error.message.unknown')}\n                    </div>\n                </div>\n            );\n        }\n\n        return null;\n    }\n}\n\nexport default PrepareChallenge3DS2;\n"],"names":["PrepareChallenge3DS2","Component","componentDidMount","isErrorObject","this","state","challengeData","process","_this_props__environmentUrls_api","_this_props__environmentUrls","shouldAllowHttpDomains","props","environment","_environmentUrls","api","includes","acsURL","isValidHttpUrl","setError","errorInfo","ErrorEventCode","THREEDS2_TOKEN_IS_MISSING_ACSURL","i18n","get","event","AnalyticsErrorEvent","component","type","code","errorType","ErrorEventType","threeDS2","message","THREEDS2_CHALLENGE_ERROR","onSubmitAnalytics","console","debug","acsTransID","messageVersion","threeDSServerTransID","cReqData","THREEDS2_TOKEN_IS_MISSING_OTHER_PROPS","setState","status","errorMsg","error","errorCode","MISSING_TOKEN_IN_ACTION_MSG","THREEDS2_ACTION_IS_MISSING_TOKEN","THREEDS2_TOKEN_DECODE_OR_PARSING_FAILED","setStatusComplete","resultObj","errorCodeObject","data","createChallengeResolveData","dataKey","transStatus","paymentData","finalResObject","errorTypeAndCode","THREEDS2_TIMEOUT","THREEDS2_NO_TRANSSTATUS","_object_spread","result","AnalyticsLogEvent","LogEventType","subType","LogEventSubtype","challengeCompleted","THREEDS2_NUM","onComplete","errorInfoObj","isFatal","onError","AdyenCheckoutError","ERROR","cause","errorObj","render","_","getImage","useImage","h","DoChallenge3DS2","onCompleteChallenge","challenge","hasOwnProperty","length","errorDescription","isMDFlow","values","THREEDS2_CHALLENGE_RESOLVED_WITHOUT_RESULT_PROP","onErrorChallenge","timeoutObject","THREEDS2_CHALLENGE","onActionHandled","onFormSubmit","div","className","Img","src","imageFolder","alt","constructor","super","_define_property","msg","challengeDataSentWeb","token","prepareChallengeData","size","challengeWindowSize","success","defaultProps"],"mappings":"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"}