@adyen/adyen-web 6.0.0-alpha.7 → 6.0.0-beta.0

package/dist/es/components/ANCV/ANCV.js

@@ -1,2 +1,2 @@
-import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as e}from"../internal/UIElement/UIElement.js";import r from"./components/ANCVInput.js";import{CoreProvider as o}from"../../core/Context/CoreProvider.js";import s from"./components/ANCVAwait/config.js";import i from"../internal/Await/Await.js";import n from"../../core/Errors/SRPanelProvider.js";import a from"../../core/Errors/AdyenCheckoutError.js";import p from"../internal/PayButton/PayButton.js";class h extends e{static type="ancv";formatData(){return{paymentMethod:{type:h.type,beneficiaryId:this.state.data?.beneficiaryId}}}onOrderRequest=t=>this.props.onOrderRequest?new Promise(((e,r)=>{this.props.onOrderRequest(e,r,t)})):this.props.session?this.props.session.createOrder():void 0;createOrder=()=>this.isValid?(this.setStatus("loading"),this.onOrderRequest(this.data).then((t=>{this.setState({order:{orderData:t.orderData,pspReference:t.pspReference}}),this.submit()})).catch((t=>{this.setStatus(t?.message||"error"),this.props.onError&&this.handleError(new a("ERROR",t))}))):(this.showValidation(),!1);payButton=e=>t(p,e);get isValid(){return!!this.state.isValid}get displayName(){return this.props.name}render(){return this.props.paymentData?t(o,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},t(n,{srPanel:this.props.modules.srPanel},t(i,{ref:t=>{this.componentRef=t},clientKey:this.props.clientKey,paymentData:this.props.paymentData,onError:this.props.onError,onComplete:this.onComplete,brandLogo:this.icon,type:this.constructor.type,messageText:this.props.i18n.get("ancv.confirmPayment"),awaitText:this.props.i18n.get("await.waitForConfirmation"),showCountdownTimer:s.showCountdownTimer,throttleTime:s.THROTTLE_TIME,throttleInterval:s.THROTTLE_INTERVAL,onActionHandled:this.props.onActionHandled}))):t(o,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},t(r,{ref:t=>{this.componentRef=t},...this.props,onSubmit:this.createOrder,onChange:this.setState,payButton:this.payButton,showPayButton:this.props.showPayButton}))}}export{h as ANCVElement,h as default};
+import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as e}from"../internal/UIElement/UIElement.js";import r from"./components/ANCVInput.js";import{CoreProvider as s}from"../../core/Context/CoreProvider.js";import o from"./components/ANCVAwait/config.js";import i from"../internal/Await/Await.js";import n from"../../core/Errors/SRPanelProvider.js";import a from"../../core/Errors/AdyenCheckoutError.js";import p from"../internal/PayButton/PayButton.js";import{sanitizeResponse as h,verifyPaymentDidNotFail as m}from"../internal/UIElement/utils.js";class d extends e{static type="ancv";formatData(){return{paymentMethod:{type:d.type,beneficiaryId:this.state.data?.beneficiaryId}}}onOrderRequest=t=>this.props.onOrderRequest?new Promise(((e,r)=>{this.props.onOrderRequest(e,r,t)})):this.props.session?this.props.session.createOrder():void 0;createOrder=()=>(this.setStatus("loading"),this.props.order?Promise.resolve():this.onOrderRequest(this.data).then((t=>{const e={orderData:t.orderData,pspReference:t.pspReference};return this.setState(e),Promise.resolve()})).catch((t=>{this.setStatus(t?.message||"error"),this.props.onError&&this.handleError(new a("ERROR",t))})));submit(){if(!this.isValid)return this.showValidation(),!1;this.createOrder().then(this.makePaymentsCall).then(h).then(m).then(this.handleResponse).catch(this.handleFailedResult)}payButton=e=>t(p,e);get isValid(){return!!this.state.isValid}get displayName(){return this.props.name}render(){return this.props.paymentData?t(s,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},t(n,{srPanel:this.props.modules.srPanel},t(i,{ref:t=>{this.componentRef=t},clientKey:this.props.clientKey,paymentData:this.props.paymentData,onError:this.props.onError,onComplete:this.onComplete,brandLogo:this.icon,type:this.constructor.type,messageText:this.props.i18n.get("ancv.confirmPayment"),awaitText:this.props.i18n.get("await.waitForConfirmation"),showCountdownTimer:o.showCountdownTimer,throttleTime:o.THROTTLE_TIME,throttleInterval:o.THROTTLE_INTERVAL,onActionHandled:this.props.onActionHandled}))):t(s,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},t(r,{ref:t=>{this.componentRef=t},...this.props,onSubmit:this.submit,onChange:this.setState,payButton:this.payButton,showPayButton:this.props.showPayButton}))}}export{d as ANCVElement,d as default};
 //# sourceMappingURL=ANCV.js.map

package/dist/es/components/ANCV/ANCV.js.map

@@ -1 +1 @@
-{"version":3,"file":"ANCV.js","sources":["../../../../src/components/ANCV/ANCV.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport ANCVInput from './components/ANCVInput';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport config from './components/ANCVAwait/config';\nimport Await from '../../components/internal/Await';\nimport SRPanelProvider from '../../core/Errors/SRPanelProvider';\nimport AdyenCheckoutError from '../../core/Errors/AdyenCheckoutError';\nimport PayButton from '../internal/PayButton';\nimport { ANCVConfiguration } from './types';\nexport class ANCVElement extends UIElement<ANCVConfiguration> {\n    public static type = 'ancv';\n\n    /**\n     * Formats the component data output\n     */\n    formatData() {\n        return {\n            paymentMethod: {\n                type: ANCVElement.type,\n                beneficiaryId: this.state.data?.beneficiaryId\n            }\n        };\n    }\n\n    private onOrderRequest = data => {\n        if (this.props.onOrderRequest)\n            return new Promise((resolve, reject) => {\n                this.props.onOrderRequest(resolve, reject, data);\n            });\n\n        if (this.props.session) {\n            return this.props.session.createOrder();\n        }\n    };\n\n    public createOrder = () => {\n        if (!this.isValid) {\n            this.showValidation();\n            return false;\n        }\n\n        this.setStatus('loading');\n\n        return this.onOrderRequest(this.data)\n            .then((order: { orderData: string; pspReference: string }) => {\n                this.setState({ order: { orderData: order.orderData, pspReference: order.pspReference } });\n                this.submit();\n            })\n            .catch(error => {\n                this.setStatus(error?.message || 'error');\n                if (this.props.onError) this.handleError(new AdyenCheckoutError('ERROR', error));\n            });\n    };\n\n    // Reimplement payButton similar to GiftCard to allow to set onClick\n    public payButton = props => {\n        return <PayButton {...props} />;\n    };\n\n    get isValid(): boolean {\n        return !!this.state.isValid;\n    }\n\n    get displayName(): string {\n        return this.props.name;\n    }\n\n    render() {\n        if (this.props.paymentData) {\n            return (\n                <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                    <SRPanelProvider srPanel={this.props.modules.srPanel}>\n                        <Await\n                            ref={ref => {\n                                this.componentRef = ref;\n                            }}\n                            clientKey={this.props.clientKey}\n                            paymentData={this.props.paymentData}\n                            onError={this.props.onError}\n                            onComplete={this.onComplete}\n                            brandLogo={this.icon}\n                            type={this.constructor['type']}\n                            messageText={this.props.i18n.get('ancv.confirmPayment')}\n                            awaitText={this.props.i18n.get('await.waitForConfirmation')}\n                            showCountdownTimer={config.showCountdownTimer}\n                            throttleTime={config.THROTTLE_TIME}\n                            throttleInterval={config.THROTTLE_INTERVAL}\n                            onActionHandled={this.props.onActionHandled}\n                        />\n                    </SRPanelProvider>\n                </CoreProvider>\n            );\n        }\n\n        return (\n            <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                <ANCVInput\n                    ref={ref => {\n                        this.componentRef = ref;\n                    }}\n                    {...this.props}\n                    onSubmit={this.createOrder}\n                    onChange={this.setState}\n                    payButton={this.payButton}\n                    showPayButton={this.props.showPayButton}\n                />\n            </CoreProvider>\n        );\n    }\n}\n\nexport default ANCVElement;\n"],"names":["ANCVElement","UIElement","static","formatData","paymentMethod","type","beneficiaryId","this","state","data","onOrderRequest","props","Promise","resolve","reject","session","createOrder","isValid","setStatus","then","order","setState","orderData","pspReference","submit","catch","error","message","onError","handleError","AdyenCheckoutError","showValidation","payButton","h","PayButton","displayName","name","render","paymentData","CoreProvider","i18n","loadingContext","resources","SRPanelProvider","srPanel","modules","Await","ref","componentRef","clientKey","onComplete","brandLogo","icon","constructor","messageText","get","awaitText","showCountdownTimer","config","throttleTime","THROTTLE_TIME","throttleInterval","THROTTLE_INTERVAL","onActionHandled","ANCVInput","onSubmit","onChange","showPayButton"],"mappings":"seAUO,MAAMA,UAAoBC,EAC7BC,YAAqB,OAKrBC,UAAAA,GACI,MAAO,CACHC,cAAe,CACXC,KAAML,EAAYK,KAClBC,cAAeC,KAAKC,MAAMC,MAAMH,eAG5C,CAEQI,eAAiBD,GACjBF,KAAKI,MAAMD,eACJ,IAAIE,SAAQ,CAACC,EAASC,KACzBP,KAAKI,MAAMD,eAAeG,EAASC,EAAQL,EAAAA,IAG/CF,KAAKI,MAAMI,QACJR,KAAKI,MAAMI,QAAQC,mBAD9B,EAKGA,YAAc,IACZT,KAAKU,SAKVV,KAAKW,UAAU,WAERX,KAAKG,eAAeH,KAAKE,MAC3BU,MAAMC,IACHb,KAAKc,SAAS,CAAED,MAAO,CAAEE,UAAWF,EAAME,UAAWC,aAAcH,EAAMG,gBACzEhB,KAAKiB,QAAM,IAEdC,OAAMC,IACHnB,KAAKW,UAAUQ,GAAOC,SAAW,SAC7BpB,KAAKI,MAAMiB,SAASrB,KAAKsB,YAAY,IAAIC,EAAmB,QAASJ,GAAAA,MAb7EnB,KAAKwB,kBACE,GAiBRC,UAAYrB,GACRsB,EAACC,EAAcvB,GAG1B,WAAIM,GACA,QAASV,KAAKC,MAAMS,OACxB,CAEA,eAAIkB,GACA,OAAO5B,KAAKI,MAAMyB,IACtB,CAEAC,MAAAA,GACI,OAAI9B,KAAKI,MAAM2B,YAEPL,EAACM,EAAAA,CAAaC,KAAMjC,KAAKI,MAAM6B,KAAMC,eAAgBlC,KAAKI,MAAM8B,eAAgBC,UAAWnC,KAAKmC,WAC5FT,EAACU,EAAAA,CAAgBC,QAASrC,KAAKI,MAAMkC,QAAQD,SACzCX,EAACa,EAAAA,CACGC,IAAKA,IACDxC,KAAKyC,aAAeD,CAAAA,EAExBE,UAAW1C,KAAKI,MAAMsC,UACtBX,YAAa/B,KAAKI,MAAM2B,YACxBV,QAASrB,KAAKI,MAAMiB,QACpBsB,WAAY3C,KAAK2C,WACjBC,UAAW5C,KAAK6C,KAChB/C,KAAME,KAAK8C,YAAmB,KAC9BC,YAAa/C,KAAKI,MAAM6B,KAAKe,IAAI,uBACjCC,UAAWjD,KAAKI,MAAM6B,KAAKe,IAAI,6BAC/BE,mBAAoBC,EAAOD,mBAC3BE,aAAcD,EAAOE,cACrBC,iBAAkBH,EAAOI,kBACzBC,gBAAiBxD,KAAKI,MAAMoD,oBAQ5C9B,EAACM,EAAAA,CAAaC,KAAMjC,KAAKI,MAAM6B,KAAMC,eAAgBlC,KAAKI,MAAM8B,eAAgBC,UAAWnC,KAAKmC,WAC5FT,EAAC+B,EAAAA,CACGjB,IAAKA,IACDxC,KAAKyC,aAAeD,CAAAA,KAEpBxC,KAAKI,MACTsD,SAAU1D,KAAKS,YACfkD,SAAU3D,KAAKc,SACfW,UAAWzB,KAAKyB,UAChBmC,cAAe5D,KAAKI,MAAMwD,gBAI1C"}
+{"version":3,"file":"ANCV.js","sources":["../../../../src/components/ANCV/ANCV.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport ANCVInput from './components/ANCVInput';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport config from './components/ANCVAwait/config';\nimport Await from '../../components/internal/Await';\nimport SRPanelProvider from '../../core/Errors/SRPanelProvider';\nimport AdyenCheckoutError from '../../core/Errors/AdyenCheckoutError';\nimport PayButton from '../internal/PayButton';\nimport { ANCVConfiguration } from './types';\nimport { sanitizeResponse, verifyPaymentDidNotFail } from '../internal/UIElement/utils';\n\nexport class ANCVElement extends UIElement<ANCVConfiguration> {\n    public static type = 'ancv';\n\n    /**\n     * Formats the component data output\n     */\n    formatData() {\n        return {\n            paymentMethod: {\n                type: ANCVElement.type,\n                beneficiaryId: this.state.data?.beneficiaryId\n            }\n        };\n    }\n\n    private onOrderRequest = data => {\n        if (this.props.onOrderRequest)\n            return new Promise((resolve, reject) => {\n                this.props.onOrderRequest(resolve, reject, data);\n            });\n\n        if (this.props.session) {\n            return this.props.session.createOrder();\n        }\n    };\n\n    /**\n     * Check if order exists, if it does Resolve.\n     * Otherwise createOrder and then Resolve.\n     */\n    public createOrder = (): Promise<void> => {\n        this.setStatus('loading');\n\n        // allow for multiple ANCV payments, follow giftcard logic and just use order if it exists\n        if (this.props.order) {\n            return Promise.resolve();\n        }\n\n        return this.onOrderRequest(this.data)\n            .then((order: { orderData: string; pspReference: string }) => {\n                const stateOrder = { orderData: order.orderData, pspReference: order.pspReference };\n                this.setState(stateOrder);\n                return Promise.resolve();\n            })\n            .catch(error => {\n                this.setStatus(error?.message || 'error');\n                if (this.props.onError) this.handleError(new AdyenCheckoutError('ERROR', error));\n            });\n    };\n\n    public submit() {\n        if (!this.isValid) {\n            this.showValidation();\n            return false;\n        }\n\n        this.createOrder()\n            .then(this.makePaymentsCall)\n            .then(sanitizeResponse)\n            .then(verifyPaymentDidNotFail)\n            .then(this.handleResponse)\n            .catch(this.handleFailedResult);\n    }\n\n    // Reimplement payButton similar to GiftCard to allow to set onClick\n    public payButton = props => {\n        return <PayButton {...props} />;\n    };\n\n    get isValid(): boolean {\n        return !!this.state.isValid;\n    }\n\n    get displayName(): string {\n        return this.props.name;\n    }\n\n    render() {\n        if (this.props.paymentData) {\n            return (\n                <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                    <SRPanelProvider srPanel={this.props.modules.srPanel}>\n                        <Await\n                            ref={ref => {\n                                this.componentRef = ref;\n                            }}\n                            clientKey={this.props.clientKey}\n                            paymentData={this.props.paymentData}\n                            onError={this.props.onError}\n                            onComplete={this.onComplete}\n                            brandLogo={this.icon}\n                            type={this.constructor['type']}\n                            messageText={this.props.i18n.get('ancv.confirmPayment')}\n                            awaitText={this.props.i18n.get('await.waitForConfirmation')}\n                            showCountdownTimer={config.showCountdownTimer}\n                            throttleTime={config.THROTTLE_TIME}\n                            throttleInterval={config.THROTTLE_INTERVAL}\n                            onActionHandled={this.props.onActionHandled}\n                        />\n                    </SRPanelProvider>\n                </CoreProvider>\n            );\n        }\n\n        return (\n            <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                <ANCVInput\n                    ref={ref => {\n                        this.componentRef = ref;\n                    }}\n                    {...this.props}\n                    onSubmit={this.submit}\n                    onChange={this.setState}\n                    payButton={this.payButton}\n                    showPayButton={this.props.showPayButton}\n                />\n            </CoreProvider>\n        );\n    }\n}\n\nexport default ANCVElement;\n"],"names":["ANCVElement","UIElement","static","formatData","paymentMethod","type","beneficiaryId","this","state","data","onOrderRequest","props","Promise","resolve","reject","session","createOrder","setStatus","order","then","stateOrder","orderData","pspReference","setState","catch","error","message","onError","handleError","AdyenCheckoutError","submit","isValid","showValidation","makePaymentsCall","sanitizeResponse","verifyPaymentDidNotFail","handleResponse","handleFailedResult","payButton","h","PayButton","displayName","name","render","paymentData","CoreProvider","i18n","loadingContext","resources","SRPanelProvider","srPanel","modules","Await","ref","componentRef","clientKey","onComplete","brandLogo","icon","constructor","messageText","get","awaitText","showCountdownTimer","config","throttleTime","THROTTLE_TIME","throttleInterval","THROTTLE_INTERVAL","onActionHandled","ANCVInput","onSubmit","onChange","showPayButton"],"mappings":"qkBAYO,MAAMA,UAAoBC,EAC7BC,YAAqB,OAKrBC,UAAAA,GACI,MAAO,CACHC,cAAe,CACXC,KAAML,EAAYK,KAClBC,cAAeC,KAAKC,MAAMC,MAAMH,eAG5C,CAEQI,eAAiBD,GACjBF,KAAKI,MAAMD,eACJ,IAAIE,SAAQ,CAACC,EAASC,KACzBP,KAAKI,MAAMD,eAAeG,EAASC,EAAQL,EAAAA,IAG/CF,KAAKI,MAAMI,QACJR,KAAKI,MAAMI,QAAQC,mBAD9B,EASJA,YAAqB,KACjBT,KAAKU,UAAU,WAGXV,KAAKI,MAAMO,MACJN,QAAQC,UAGZN,KAAKG,eAAeH,KAAKE,MAC3BU,MAAMD,IACH,MAAME,EAAa,CAAEC,UAAWH,EAAMG,UAAWC,aAAcJ,EAAMI,cAErE,OADAf,KAAKgB,SAASH,GACPR,QAAQC,SAAO,IAEzBW,OAAMC,IACHlB,KAAKU,UAAUQ,GAAOC,SAAW,SAC7BnB,KAAKI,MAAMgB,SAASpB,KAAKqB,YAAY,IAAIC,EAAmB,QAASJ,GAAAA,KAI9EK,MAAAA,GACH,IAAKvB,KAAKwB,QAEN,OADAxB,KAAKyB,kBACE,EAGXzB,KAAKS,cACAG,KAAKZ,KAAK0B,kBACVd,KAAKe,GACLf,KAAKgB,GACLhB,KAAKZ,KAAK6B,gBACVZ,MAAMjB,KAAK8B,mBACpB,CAGOC,UAAY3B,GACR4B,EAACC,EAAc7B,GAG1B,WAAIoB,GACA,QAASxB,KAAKC,MAAMuB,OACxB,CAEA,eAAIU,GACA,OAAOlC,KAAKI,MAAM+B,IACtB,CAEAC,MAAAA,GACI,OAAIpC,KAAKI,MAAMiC,YAEPL,EAACM,EAAAA,CAAaC,KAAMvC,KAAKI,MAAMmC,KAAMC,eAAgBxC,KAAKI,MAAMoC,eAAgBC,UAAWzC,KAAKyC,WAC5FT,EAACU,EAAAA,CAAgBC,QAAS3C,KAAKI,MAAMwC,QAAQD,SACzCX,EAACa,EAAAA,CACGC,IAAKA,IACD9C,KAAK+C,aAAeD,CAAAA,EAExBE,UAAWhD,KAAKI,MAAM4C,UACtBX,YAAarC,KAAKI,MAAMiC,YACxBjB,QAASpB,KAAKI,MAAMgB,QACpB6B,WAAYjD,KAAKiD,WACjBC,UAAWlD,KAAKmD,KAChBrD,KAAME,KAAKoD,YAAmB,KAC9BC,YAAarD,KAAKI,MAAMmC,KAAKe,IAAI,uBACjCC,UAAWvD,KAAKI,MAAMmC,KAAKe,IAAI,6BAC/BE,mBAAoBC,EAAOD,mBAC3BE,aAAcD,EAAOE,cACrBC,iBAAkBH,EAAOI,kBACzBC,gBAAiB9D,KAAKI,MAAM0D,oBAQ5C9B,EAACM,EAAAA,CAAaC,KAAMvC,KAAKI,MAAMmC,KAAMC,eAAgBxC,KAAKI,MAAMoC,eAAgBC,UAAWzC,KAAKyC,WAC5FT,EAAC+B,EAAAA,CACGjB,IAAKA,IACD9C,KAAK+C,aAAeD,CAAAA,KAEpB9C,KAAKI,MACT4D,SAAUhE,KAAKuB,OACf0C,SAAUjE,KAAKgB,SACfe,UAAW/B,KAAK+B,UAChBmC,cAAelE,KAAKI,MAAM8D,gBAI1C"}

package/dist/es/components/ANCV/components/ANCVInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"ANCVInput.js","sources":["../../../../../src/components/ANCV/components/ANCVInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useState } from 'preact/hooks';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport LoadingWrapper from '../../internal/LoadingWrapper';\nimport InputText from '../../internal/FormFields/InputText';\nimport Field from '../../internal/FormFields/Field';\nimport useForm from '../../../utils/useForm';\nimport { ancvValidationRules } from '../validate';\nimport { ANCVDataState } from '../types';\nimport { UIElementProps } from '../../internal/UIElement/types';\n\nexport interface ANCVInputProps extends UIElementProps {\n    ref?: any;\n    showPayButton: boolean;\n    onSubmit: () => void;\n}\n\ntype ANCVInputDataState = ANCVDataState;\n\nfunction ANCVInput({ showPayButton, payButton, onChange, onSubmit }: ANCVInputProps) {\n    const { i18n } = useCoreContext();\n\n    const { handleChangeFor, triggerValidation, data, valid, errors, isValid } = useForm<ANCVInputDataState>({\n        schema: ['beneficiaryId'],\n        rules: ancvValidationRules\n    });\n\n    useEffect(() => {\n        onChange({ data, errors, valid, isValid }, this);\n    }, [data, valid, errors, isValid]);\n\n    const [status, setStatus] = useState<string>('ready');\n\n    this.setStatus = setStatus;\n    this.showValidation = triggerValidation;\n\n    return (\n        <LoadingWrapper>\n            <div className=\"adyen-checkout__ancv\">\n                <p className=\"adyen-checkout-form-instruction\">{i18n.get('ancv.form.instruction')}</p>\n                <Field\n                    errorMessage={!!errors.beneficiaryId && i18n.get(errors.beneficiaryId.errorMessage)}\n                    label={i18n.get('ancv.input.label')}\n                    isValid={valid.beneficiaryId}\n                    name={'beneficiaryId'}\n                >\n                    <InputText\n                        value={data.beneficiaryId}\n                        name={'beneficiaryId'}\n                        spellcheck={true}\n                        required={true}\n                        onInput={handleChangeFor('beneficiaryId', 'input')}\n                        onBlur={handleChangeFor('beneficiaryId', 'blur')}\n                    />\n                </Field>\n                {showPayButton && payButton({ status, label: i18n.get('confirmPurchase'), onClick: onSubmit })}\n            </div>\n        </LoadingWrapper>\n    );\n}\n\nANCVInput.defaultProps = {};\n\nexport default ANCVInput;\n"],"names":["ANCVInput","showPayButton","payButton","onChange","onSubmit","i18n","useCoreContext","handleChangeFor","triggerValidation","data","valid","errors","isValid","useForm","schema","rules","ancvValidationRules","useEffect","this","status","setStatus","useState","showValidation","h","LoadingWrapper","div","className","p","get","Field","errorMessage","beneficiaryId","label","name","InputText","value","spellcheck","required","onInput","onBlur","onClick","defaultProps"],"mappings":"yfAmBA,SAASA,GAAUC,cAAEA,EAAaC,UAAEA,EAASC,SAAEA,EAAQC,SAAEA,IACrD,MAAMC,KAAEA,GAASC,KAEXC,gBAAEA,EAAeC,kBAAEA,EAAiBC,KAAEA,EAAIC,MAAEA,EAAKC,OAAEA,EAAMC,QAAEA,GAAYC,EAA4B,CACrGC,OAAQ,CAAC,iBACTC,MAAOC,IAGXC,GAAU,KACNd,EAAS,CAAEM,OAAME,SAAQD,QAAOE,WAAWM,KAAI,GAChD,CAACT,EAAMC,EAAOC,EAAQC,IAEzB,MAAOO,EAAQC,GAAaC,EAAiB,SAK7C,OAHAH,KAAKE,UAAYA,EACjBF,KAAKI,eAAiBd,EAGlBe,EAACC,OACGD,EAACE,MAAAA,CAAIC,UAAU,wBACXH,EAACI,IAAAA,CAAED,UAAU,mCAAmCrB,EAAKuB,IAAI,0BACzDL,EAACM,EAAAA,CACGC,eAAgBnB,EAAOoB,eAAiB1B,EAAKuB,IAAIjB,EAAOoB,cAAcD,cACtEE,MAAO3B,EAAKuB,IAAI,oBAChBhB,QAASF,EAAMqB,cACfE,KAAM,iBAENV,EAACW,EAAAA,CACGC,MAAO1B,EAAKsB,cACZE,KAAM,gBACNG,YAAY,EACZC,UAAU,EACVC,QAAS/B,EAAgB,gBAAiB,SAC1CgC,OAAQhC,EAAgB,gBAAiB,WAGhDN,GAAiBC,EAAU,CAAEiB,SAAQa,MAAO3B,EAAKuB,IAAI,mBAAoBY,QAASpC,KAInG,CAEAJ,EAAUyC,aAAe,CAAC"}
+{"version":3,"file":"ANCVInput.js","sources":["../../../../../src/components/ANCV/components/ANCVInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useState } from 'preact/hooks';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport LoadingWrapper from '../../internal/LoadingWrapper';\nimport InputText from '../../internal/FormFields/InputText';\nimport Field from '../../internal/FormFields/Field';\nimport useForm from '../../../utils/useForm';\nimport { ancvValidationRules } from '../validate';\nimport { ANCVDataState } from '../types';\nimport { UIElementProps } from '../../internal/UIElement/types';\n\nexport interface ANCVInputProps extends UIElementProps {\n    ref?: any;\n    showPayButton: boolean;\n    onSubmit: () => void;\n}\n\ntype ANCVInputDataState = ANCVDataState;\n\nfunction ANCVInput({ showPayButton, payButton, onChange, onSubmit }: ANCVInputProps) {\n    const { i18n } = useCoreContext();\n\n    const { handleChangeFor, triggerValidation, data, valid, errors, isValid } = useForm<ANCVInputDataState>({\n        schema: ['beneficiaryId'],\n        rules: ancvValidationRules\n    });\n\n    useEffect(() => {\n        // @ts-ignore TODO: Fix this. Preact component types should not inherit from UIElementProps.\n        onChange({ data, errors, valid, isValid }, this);\n    }, [data, valid, errors, isValid]);\n\n    const [status, setStatus] = useState<string>('ready');\n\n    this.setStatus = setStatus;\n    this.showValidation = triggerValidation;\n\n    return (\n        <LoadingWrapper>\n            <div className=\"adyen-checkout__ancv\">\n                <p className=\"adyen-checkout-form-instruction\">{i18n.get('ancv.form.instruction')}</p>\n                <Field\n                    errorMessage={!!errors.beneficiaryId && i18n.get(errors.beneficiaryId.errorMessage)}\n                    label={i18n.get('ancv.input.label')}\n                    isValid={valid.beneficiaryId}\n                    name={'beneficiaryId'}\n                >\n                    <InputText\n                        value={data.beneficiaryId}\n                        name={'beneficiaryId'}\n                        spellcheck={true}\n                        required={true}\n                        onInput={handleChangeFor('beneficiaryId', 'input')}\n                        onBlur={handleChangeFor('beneficiaryId', 'blur')}\n                    />\n                </Field>\n                {showPayButton && payButton({ status, label: i18n.get('confirmPurchase'), onClick: onSubmit })}\n            </div>\n        </LoadingWrapper>\n    );\n}\n\nANCVInput.defaultProps = {};\n\nexport default ANCVInput;\n"],"names":["ANCVInput","showPayButton","payButton","onChange","onSubmit","i18n","useCoreContext","handleChangeFor","triggerValidation","data","valid","errors","isValid","useForm","schema","rules","ancvValidationRules","useEffect","this","status","setStatus","useState","showValidation","h","LoadingWrapper","div","className","p","get","Field","errorMessage","beneficiaryId","label","name","InputText","value","spellcheck","required","onInput","onBlur","onClick","defaultProps"],"mappings":"yfAmBA,SAASA,GAAUC,cAAEA,EAAaC,UAAEA,EAASC,SAAEA,EAAQC,SAAEA,IACrD,MAAMC,KAAEA,GAASC,KAEXC,gBAAEA,EAAeC,kBAAEA,EAAiBC,KAAEA,EAAIC,MAAEA,EAAKC,OAAEA,EAAMC,QAAEA,GAAYC,EAA4B,CACrGC,OAAQ,CAAC,iBACTC,MAAOC,IAGXC,GAAU,KAENd,EAAS,CAAEM,OAAME,SAAQD,QAAOE,WAAWM,KAAI,GAChD,CAACT,EAAMC,EAAOC,EAAQC,IAEzB,MAAOO,EAAQC,GAAaC,EAAiB,SAK7C,OAHAH,KAAKE,UAAYA,EACjBF,KAAKI,eAAiBd,EAGlBe,EAACC,OACGD,EAACE,MAAAA,CAAIC,UAAU,wBACXH,EAACI,IAAAA,CAAED,UAAU,mCAAmCrB,EAAKuB,IAAI,0BACzDL,EAACM,EAAAA,CACGC,eAAgBnB,EAAOoB,eAAiB1B,EAAKuB,IAAIjB,EAAOoB,cAAcD,cACtEE,MAAO3B,EAAKuB,IAAI,oBAChBhB,QAASF,EAAMqB,cACfE,KAAM,iBAENV,EAACW,EAAAA,CACGC,MAAO1B,EAAKsB,cACZE,KAAM,gBACNG,YAAY,EACZC,UAAU,EACVC,QAAS/B,EAAgB,gBAAiB,SAC1CgC,OAAQhC,EAAgB,gBAAiB,WAGhDN,GAAiBC,EAAU,CAAEiB,SAAQa,MAAO3B,EAAKuB,IAAI,mBAAoBY,QAASpC,KAInG,CAEAJ,EAAUyC,aAAe,CAAC"}

package/dist/es/components/Ach/Ach.js

@@ -1,2 +1,2 @@
-import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as e}from"../internal/UIElement/UIElement.js";import s from"./components/AchInput/AchInput.js";import{CoreProvider as o}from"../../core/Context/CoreProvider.js";import r from"../internal/RedirectButton/RedirectButton.js";import{TxVariants as n}from"../tx-variants.js";class i extends e{static type=n.ach;formatProps(t){return{...t,holderNameRequired:t.hasHolderName??t.holderNameRequired}}formatData(){const t=!!this.props.storedPaymentMethodId,e={type:i.type,...this.state.data,ownerName:this.state.data?.holderName,...t&&{storedPaymentMethodId:this.props.storedPaymentMethodId}};return delete e.holderName,{paymentMethod:e,...this.state.billingAddress&&{billingAddress:this.state.billingAddress},...this.state.storePaymentMethod&&{storePaymentMethod:this.state.storePaymentMethod}}}updateStyles(t){return this.componentRef&&this.componentRef.updateStyles&&this.componentRef.updateStyles(t),this}setFocusOn(t){return this.componentRef&&this.componentRef.setFocusOn&&this.componentRef.setFocusOn(t),this}get isValid(){return!!this.props.storedPaymentMethodId||!!this.state.isValid}get displayName(){return this.props.storedPaymentMethodId&&this.props.bankAccountNumber?`•••• ${this.props.bankAccountNumber.slice(-4)}`:this.props.name}get additionalInfo(){return this.props.storedPaymentMethodId?this.props.i18n.get("ach.savedBankAccount"):""}render(){return t(o,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},this.props.storedPaymentMethodId?t(r,{name:this.displayName,amount:this.props.amount,payButton:this.payButton,onSubmit:this.submit,ref:t=>{this.componentRef=t}}):t(s,{setComponentRef:this.setComponentRef,...this.props,onChange:this.setState,onSubmit:this.submit,payButton:this.payButton,resources:this.resources}))}}export{i as AchElement,i as default};
+import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as e}from"../internal/UIElement/UIElement.js";import s from"./components/AchInput/AchInput.js";import{CoreProvider as o}from"../../core/Context/CoreProvider.js";import r from"../internal/RedirectButton/RedirectButton.js";import{TxVariants as n}from"../tx-variants.js";class i extends e{static type=n.ach;formatProps(t){return{...t,holderNameRequired:t.hasHolderName??t.holderNameRequired}}formatData(){const t=!!this.props.storedPaymentMethodId,e={type:i.type,...this.state.data,ownerName:this.state.data?.holderName,...t&&{storedPaymentMethodId:this.props.storedPaymentMethodId}};return delete e.holderName,{paymentMethod:e,...this.state.billingAddress&&{billingAddress:this.state.billingAddress},...this.state.storePaymentMethod&&{storePaymentMethod:this.state.storePaymentMethod}}}updateStyles(t){return this.componentRef&&this.componentRef.updateStyles&&this.componentRef.updateStyles(t),this}setFocusOn(t){return this.componentRef&&this.componentRef.setFocusOn&&this.componentRef.setFocusOn(t),this}get isValid(){return!!this.props.storedPaymentMethodId||!!this.state.isValid}get displayName(){return this.props.storedPaymentMethodId&&this.props.bankAccountNumber?`•••• ${this.props.bankAccountNumber.slice(-4)}`:this.props.name}get additionalInfo(){return this.props.storedPaymentMethodId?this.props.i18n.get("ach.savedBankAccount"):""}render(){return t(o,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},this.props.storedPaymentMethodId?t(r,{showPayButton:this.props.showPayButton,name:this.displayName,amount:this.props.amount,payButton:this.payButton,onSubmit:this.submit,ref:t=>{this.componentRef=t}}):t(s,{setComponentRef:this.setComponentRef,...this.props,onChange:this.setState,onSubmit:this.submit,payButton:this.payButton,resources:this.resources}))}}export{i as AchElement,i as default};
 //# sourceMappingURL=Ach.js.map

package/dist/es/components/Ach/Ach.js.map

@@ -1 +1 @@
-{"version":3,"file":"Ach.js","sources":["../../../../src/components/Ach/Ach.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport AchInput from './components/AchInput';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport RedirectButton from '../internal/RedirectButton';\nimport { AchConfiguration } from './types';\nimport { TxVariants } from '../tx-variants';\n\nexport class AchElement extends UIElement<AchConfiguration> {\n    public static type = TxVariants.ach;\n\n    formatProps(props: AchConfiguration) {\n        return {\n            ...props,\n            // Fix mismatch between passed hasHolderName & holderNameRequired props\n            // (when holderNameRequired = true, but hasHolderName = false - which means component will never be valid)\n            holderNameRequired: props.hasHolderName ?? props.holderNameRequired\n            // TODO - if it turns out that hasHolderName & holderNameRequired are not configurable by the merchant\n            //  then we will need to force these properties to true\n        };\n    }\n\n    /**\n     * Formats the component data output\n     */\n    formatData() {\n        const recurringPayment = !!this.props.storedPaymentMethodId;\n\n        // Map holderName to ownerName\n        const paymentMethod = {\n            type: AchElement.type,\n            ...this.state.data,\n            ownerName: this.state.data?.holderName,\n            ...(recurringPayment && { storedPaymentMethodId: this.props.storedPaymentMethodId })\n        };\n\n        delete paymentMethod.holderName;\n\n        return {\n            paymentMethod,\n            ...(this.state.billingAddress && { billingAddress: this.state.billingAddress }),\n            ...(this.state.storePaymentMethod && { storePaymentMethod: this.state.storePaymentMethod })\n        };\n    }\n\n    updateStyles(stylesObj) {\n        if (this.componentRef && this.componentRef.updateStyles) this.componentRef.updateStyles(stylesObj);\n        return this;\n    }\n\n    setFocusOn(fieldName) {\n        if (this.componentRef && this.componentRef.setFocusOn) this.componentRef.setFocusOn(fieldName);\n        return this;\n    }\n\n    get isValid() {\n        if (this.props.storedPaymentMethodId) {\n            return true;\n        }\n\n        return !!this.state.isValid;\n    }\n\n    get displayName() {\n        if (this.props.storedPaymentMethodId && this.props.bankAccountNumber) {\n            // get lastFour from bankAccountNumber, value comes from storedPaymentMethods\n            return `•••• ${this.props.bankAccountNumber.slice(-4)}`;\n        }\n        return this.props.name;\n    }\n\n    get additionalInfo() {\n        return this.props.storedPaymentMethodId ? this.props.i18n.get('ach.savedBankAccount') : '';\n    }\n\n    render() {\n        return (\n            <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                {this.props.storedPaymentMethodId ? (\n                    <RedirectButton\n                        name={this.displayName}\n                        amount={this.props.amount}\n                        payButton={this.payButton}\n                        onSubmit={this.submit}\n                        ref={ref => {\n                            this.componentRef = ref;\n                        }}\n                    />\n                ) : (\n                    <AchInput\n                        setComponentRef={this.setComponentRef}\n                        {...this.props}\n                        onChange={this.setState}\n                        onSubmit={this.submit}\n                        payButton={this.payButton}\n                        resources={this.resources}\n                    />\n                )}\n            </CoreProvider>\n        );\n    }\n}\n\nexport default AchElement;\n"],"names":["AchElement","UIElement","static","TxVariants","ach","formatProps","props","holderNameRequired","hasHolderName","formatData","recurringPayment","this","storedPaymentMethodId","paymentMethod","type","state","data","ownerName","holderName","billingAddress","storePaymentMethod","updateStyles","stylesObj","componentRef","setFocusOn","fieldName","isValid","displayName","bankAccountNumber","slice","name","additionalInfo","i18n","get","render","h","CoreProvider","loadingContext","resources","RedirectButton","amount","payButton","onSubmit","submit","ref","AchInput","setComponentRef","onChange","setState"],"mappings":"kWAQO,MAAMA,UAAmBC,EAC5BC,YAAqBC,EAAWC,IAEhCC,WAAAA,CAAYC,GACR,MAAO,IACAA,EAGHC,mBAAoBD,EAAME,eAAiBF,EAAMC,mBAIzD,CAKAE,UAAAA,GACI,MAAMC,IAAqBC,KAAKL,MAAMM,sBAGhCC,EAAgB,CAClBC,KAAMd,EAAWc,QACdH,KAAKI,MAAMC,KACdC,UAAWN,KAAKI,MAAMC,MAAME,cACxBR,GAAoB,CAAEE,sBAAuBD,KAAKL,MAAMM,wBAKhE,cAFOC,EAAcK,WAEd,CACHL,mBACIF,KAAKI,MAAMI,gBAAkB,CAAEA,eAAgBR,KAAKI,MAAMI,mBAC1DR,KAAKI,MAAMK,oBAAsB,CAAEA,mBAAoBT,KAAKI,MAAMK,oBAE9E,CAEAC,YAAAA,CAAaC,GAET,OADIX,KAAKY,cAAgBZ,KAAKY,aAAaF,cAAcV,KAAKY,aAAaF,aAAaC,GACjFX,IACX,CAEAa,UAAAA,CAAWC,GAEP,OADId,KAAKY,cAAgBZ,KAAKY,aAAaC,YAAYb,KAAKY,aAAaC,WAAWC,GAC7Ed,IACX,CAEA,WAAIe,GACA,QAAIf,KAAKL,MAAMM,yBAIND,KAAKI,MAAMW,OACxB,CAEA,eAAIC,GACA,OAAIhB,KAAKL,MAAMM,uBAAyBD,KAAKL,MAAMsB,kBAExC,QAAQjB,KAAKL,MAAMsB,kBAAkBC,OAAO,KAEhDlB,KAAKL,MAAMwB,IACtB,CAEA,kBAAIC,GACA,OAAOpB,KAAKL,MAAMM,sBAAwBD,KAAKL,MAAM0B,KAAKC,IAAI,wBAA0B,EAC5F,CAEAC,MAAAA,GACI,OACIC,EAACC,EAAAA,CAAaJ,KAAMrB,KAAKL,MAAM0B,KAAMK,eAAgB1B,KAAKL,MAAM+B,eAAgBC,UAAW3B,KAAK2B,WAC3F3B,KAAKL,MAAMM,sBACRuB,EAACI,EAAAA,CACGT,KAAMnB,KAAKgB,YACXa,OAAQ7B,KAAKL,MAAMkC,OACnBC,UAAW9B,KAAK8B,UAChBC,SAAU/B,KAAKgC,OACfC,IAAKA,IACDjC,KAAKY,aAAeqB,CAAAA,IAI5BT,EAACU,EAAAA,CACGC,gBAAiBnC,KAAKmC,mBAClBnC,KAAKL,MACTyC,SAAUpC,KAAKqC,SACfN,SAAU/B,KAAKgC,OACfF,UAAW9B,KAAK8B,UAChBH,UAAW3B,KAAK2B,YAKpC"}
+{"version":3,"file":"Ach.js","sources":["../../../../src/components/Ach/Ach.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport AchInput from './components/AchInput';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport RedirectButton from '../internal/RedirectButton';\nimport { AchConfiguration } from './types';\nimport { TxVariants } from '../tx-variants';\n\nexport class AchElement extends UIElement<AchConfiguration> {\n    public static type = TxVariants.ach;\n\n    formatProps(props: AchConfiguration) {\n        return {\n            ...props,\n            // Fix mismatch between passed hasHolderName & holderNameRequired props\n            // (when holderNameRequired = true, but hasHolderName = false - which means component will never be valid)\n            holderNameRequired: props.hasHolderName ?? props.holderNameRequired\n            // TODO - if it turns out that hasHolderName & holderNameRequired are not configurable by the merchant\n            //  then we will need to force these properties to true\n        };\n    }\n\n    /**\n     * Formats the component data output\n     */\n    formatData() {\n        const recurringPayment = !!this.props.storedPaymentMethodId;\n\n        // Map holderName to ownerName\n        const paymentMethod = {\n            type: AchElement.type,\n            ...this.state.data,\n            ownerName: this.state.data?.holderName,\n            ...(recurringPayment && { storedPaymentMethodId: this.props.storedPaymentMethodId })\n        };\n\n        delete paymentMethod.holderName;\n\n        return {\n            paymentMethod,\n            ...(this.state.billingAddress && { billingAddress: this.state.billingAddress }),\n            ...(this.state.storePaymentMethod && { storePaymentMethod: this.state.storePaymentMethod })\n        };\n    }\n\n    updateStyles(stylesObj) {\n        if (this.componentRef && this.componentRef.updateStyles) this.componentRef.updateStyles(stylesObj);\n        return this;\n    }\n\n    setFocusOn(fieldName) {\n        if (this.componentRef && this.componentRef.setFocusOn) this.componentRef.setFocusOn(fieldName);\n        return this;\n    }\n\n    get isValid() {\n        if (this.props.storedPaymentMethodId) {\n            return true;\n        }\n\n        return !!this.state.isValid;\n    }\n\n    get displayName() {\n        if (this.props.storedPaymentMethodId && this.props.bankAccountNumber) {\n            // get lastFour from bankAccountNumber, value comes from storedPaymentMethods\n            return `•••• ${this.props.bankAccountNumber.slice(-4)}`;\n        }\n        return this.props.name;\n    }\n\n    get additionalInfo() {\n        return this.props.storedPaymentMethodId ? this.props.i18n.get('ach.savedBankAccount') : '';\n    }\n\n    render() {\n        return (\n            <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                {this.props.storedPaymentMethodId ? (\n                    <RedirectButton\n                        showPayButton={this.props.showPayButton}\n                        name={this.displayName}\n                        amount={this.props.amount}\n                        payButton={this.payButton}\n                        onSubmit={this.submit}\n                        ref={ref => {\n                            this.componentRef = ref;\n                        }}\n                    />\n                ) : (\n                    <AchInput\n                        setComponentRef={this.setComponentRef}\n                        {...this.props}\n                        onChange={this.setState}\n                        onSubmit={this.submit}\n                        payButton={this.payButton}\n                        resources={this.resources}\n                    />\n                )}\n            </CoreProvider>\n        );\n    }\n}\n\nexport default AchElement;\n"],"names":["AchElement","UIElement","static","TxVariants","ach","formatProps","props","holderNameRequired","hasHolderName","formatData","recurringPayment","this","storedPaymentMethodId","paymentMethod","type","state","data","ownerName","holderName","billingAddress","storePaymentMethod","updateStyles","stylesObj","componentRef","setFocusOn","fieldName","isValid","displayName","bankAccountNumber","slice","name","additionalInfo","i18n","get","render","h","CoreProvider","loadingContext","resources","RedirectButton","showPayButton","amount","payButton","onSubmit","submit","ref","AchInput","setComponentRef","onChange","setState"],"mappings":"kWAQO,MAAMA,UAAmBC,EAC5BC,YAAqBC,EAAWC,IAEhCC,WAAAA,CAAYC,GACR,MAAO,IACAA,EAGHC,mBAAoBD,EAAME,eAAiBF,EAAMC,mBAIzD,CAKAE,UAAAA,GACI,MAAMC,IAAqBC,KAAKL,MAAMM,sBAGhCC,EAAgB,CAClBC,KAAMd,EAAWc,QACdH,KAAKI,MAAMC,KACdC,UAAWN,KAAKI,MAAMC,MAAME,cACxBR,GAAoB,CAAEE,sBAAuBD,KAAKL,MAAMM,wBAKhE,cAFOC,EAAcK,WAEd,CACHL,mBACIF,KAAKI,MAAMI,gBAAkB,CAAEA,eAAgBR,KAAKI,MAAMI,mBAC1DR,KAAKI,MAAMK,oBAAsB,CAAEA,mBAAoBT,KAAKI,MAAMK,oBAE9E,CAEAC,YAAAA,CAAaC,GAET,OADIX,KAAKY,cAAgBZ,KAAKY,aAAaF,cAAcV,KAAKY,aAAaF,aAAaC,GACjFX,IACX,CAEAa,UAAAA,CAAWC,GAEP,OADId,KAAKY,cAAgBZ,KAAKY,aAAaC,YAAYb,KAAKY,aAAaC,WAAWC,GAC7Ed,IACX,CAEA,WAAIe,GACA,QAAIf,KAAKL,MAAMM,yBAIND,KAAKI,MAAMW,OACxB,CAEA,eAAIC,GACA,OAAIhB,KAAKL,MAAMM,uBAAyBD,KAAKL,MAAMsB,kBAExC,QAAQjB,KAAKL,MAAMsB,kBAAkBC,OAAO,KAEhDlB,KAAKL,MAAMwB,IACtB,CAEA,kBAAIC,GACA,OAAOpB,KAAKL,MAAMM,sBAAwBD,KAAKL,MAAM0B,KAAKC,IAAI,wBAA0B,EAC5F,CAEAC,MAAAA,GACI,OACIC,EAACC,EAAAA,CAAaJ,KAAMrB,KAAKL,MAAM0B,KAAMK,eAAgB1B,KAAKL,MAAM+B,eAAgBC,UAAW3B,KAAK2B,WAC3F3B,KAAKL,MAAMM,sBACRuB,EAACI,EAAAA,CACGC,cAAe7B,KAAKL,MAAMkC,cAC1BV,KAAMnB,KAAKgB,YACXc,OAAQ9B,KAAKL,MAAMmC,OACnBC,UAAW/B,KAAK+B,UAChBC,SAAUhC,KAAKiC,OACfC,IAAKA,IACDlC,KAAKY,aAAesB,CAAAA,IAI5BV,EAACW,EAAAA,CACGC,gBAAiBpC,KAAKoC,mBAClBpC,KAAKL,MACT0C,SAAUrC,KAAKsC,SACfN,SAAUhC,KAAKiC,OACfF,UAAW/B,KAAK+B,UAChBJ,UAAW3B,KAAK2B,YAKpC"}

package/dist/es/components/Ach/components/AchInput/AchInput.js

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../../external/preact/dist/preact.js";import{useState as o,useRef as r,useEffect as t}from"../../../../external/preact/hooks/dist/hooks.js";import a from"../../../../external/classnames/index.js";import l from"./components/AchSecuredFields.js";import s from"../../../internal/SecuredFields/SFP/SecuredFieldsProvider.js";import d from"../../../internal/Address/Address.js";import n from"../../../internal/FormFields/Field/Field.js";import i from"../../../internal/LoadingWrapper/LoadingWrapper.js";import c from"./defaultProps.js";import u from"./defaultStyles.js";import{useCoreContext as m}from"../../../../core/Context/CoreProvider.js";import h from"../../../internal/StoreDetails/StoreDetails.js";import p from"../../../internal/FormFields/InputText.js";import N from"../../../internal/FormInstruction/FormInstruction.js";function f(e,o=!1){return!o||!!e&&"string"==typeof e&&e.trim().length>0}function g(c){const{i18n:g}=m(),y=c.hasHolderName&&(!!c.holderName||!!c.data.holderName),[_,C]=o({}),[b,x]=o({...c.holderNameRequired&&{holderName:y}}),[A,R]=o({...c.hasHolderName&&{holderName:c.holderName||c.data.holderName}}),[j,q]=o(c.billingAddressRequired?c.data.billingAddress:null),[S,k]=o(!1),[v,w]=o(""),[V,P]=o(!1),E=e=>{q({...j,...e.data}),x({...b,billingAddress:e.isValid})},I=e=>{const o=e.target.value;R({...A,holderName:o}),C({..._,holderName:!!c.holderNameRequired&&!f(o)}),x({...b,holderName:!c.holderNameRequired||f(o,c.holderNameRequired)})},H=r(null),O=r(null),B=e=>{O.current=e},[L,M]=o("ready"),W=r({});return Object.keys(W.current).length||c.setComponentRef?.(W.current),W.current.showValidation=()=>{H.current.showValidation(),c.holderNameRequired&&!b.holderName&&C({..._,holderName:!0}),O.current&&O.current.showValidation()},W.current.setStatus=M,t((()=>(this.setFocusOn=H.current.setFocusOn,this.updateStyles=H.current.updateStyles,()=>{H.current.destroy()})),[]),t((()=>{const e=f(A.holderName,c.holderNameRequired),o=S,r=!c.billingAddressRequired||Boolean(b.billingAddress),t=o&&e&&r;c.onChange({data:A,isValid:t,billingAddress:j,storePaymentMethod:V})}),[A,b,_,V]),e("div",{className:"adyen-checkout__ach"},c.showFormInstruction&&e(N,null),e(s,{ref:H,...F(c),styles:{...u,...c.styles},onChange:e=>{const o=e,r=o.autoCompleteName?o.autoCompleteName:A.holderName;R({...A,...o.data,holderName:r}),C({..._,...o.errors}),x({...b,...o.valid,holderName:!c.holderNameRequired||f(r,c.holderNameRequired)}),k(o.isSfpValid)},onFocus:e=>{const o=!0===e.focus;w(e.currentFocusObject),o?c.onFocus(e):c.onBlur(e)},render:({setRootNode:o,setFocusOn:r},t)=>e("div",{ref:o,className:"adyen-checkout__ach-input sf-input__wrapper"},e(i,{status:t.status},e("div",{className:a(["adyen-checkout__fieldset","adyen-checkout__fieldset--ach"])},e("div",{className:"adyen-checkout__fieldset__title"},g.get("ach.bankAccount")),c.hasHolderName&&e(n,{label:g.get("ach.accountHolderNameField.title"),className:"adyen-checkout__pm__holderName",errorMessage:!!_.holderName&&g.get("ach.accountHolderNameField.invalid"),showContextualElement:c.showContextualElement,contextualText:g.get("ach.accountHolderNameField.contextualText"),isValid:!!b.holderName,name:"holderName"},e(p,{className:"adyen-checkout__pm__holderName__input adyen-checkout__input",placeholder:c?.placeholders?.holderName,value:A.holderName,required:c.holderNameRequired,onInput:I})),e(l,{focusedElement:v,onFocusField:r,errors:t.errors,valid:t.valid})),c.billingAddressRequired&&e(d,{label:"billingAddress",data:j,onChange:E,allowedCountries:c.billingAddressAllowedCountries,requiredFields:c.billingAddressRequiredFields,setComponentRef:B}),c.enableStoreDetails&&e(h,{onChange:P})))}),c.showPayButton&&c.payButton({status:L,label:g.get("confirmPurchase")}))}g.defaultProps=c;const F=e=>({autoFocus:e.autoFocus,clientKey:e.clientKey,i18n:e.i18n,keypadFix:e.keypadFix,legacyInputMode:e.legacyInputMode,loadingContext:e.loadingContext,onAllValid:e.onAllValid,onConfigSuccess:e.onConfigSuccess,onError:e.onError,onFieldValid:e.onFieldValid,onFocus:e.onFocus,onLoad:e.onLoad,showWarnings:e.showWarnings,styles:e.styles,type:e.type,forceCompat:e.forceCompat,resources:e.resources,placeholders:e.placeholders});export{g as default};
+import{createElement as e}from"../../../../external/preact/dist/preact.js";import{useState as o,useRef as r,useEffect as t}from"../../../../external/preact/hooks/dist/hooks.js";import a from"../../../../external/classnames/index.js";import l from"./components/AchSecuredFields.js";import s from"../../../internal/SecuredFields/SFP/SecuredFieldsProvider.js";import d from"../../../internal/Address/Address.js";import n from"../../../internal/FormFields/Field/Field.js";import i from"../../../internal/LoadingWrapper/LoadingWrapper.js";import c from"./defaultProps.js";import u from"./defaultStyles.js";import{useCoreContext as m}from"../../../../core/Context/CoreProvider.js";import h from"../../../internal/StoreDetails/StoreDetails.js";import p from"../../../internal/FormFields/InputText.js";import N from"../../../internal/FormInstruction/FormInstruction.js";function f(e,o=!1){return!o||!!e&&"string"==typeof e&&e.trim().length>0}function g(c){const{i18n:g}=m(),y=c.hasHolderName&&(!!c.holderName||!!c.data.holderName),[_,C]=o({}),[b,x]=o({...c.holderNameRequired&&{holderName:y}}),[A,R]=o({...c.hasHolderName&&{holderName:c.holderName||c.data.holderName}}),[j,q]=o(c.billingAddressRequired?c.data.billingAddress:null),[S,k]=o(!1),[v,w]=o(""),[V,P]=o(!1),E=e=>{q({...j,...e.data}),x({...b,billingAddress:e.isValid})},H=e=>{const o=e.target.value;R({...A,holderName:o}),C({..._,holderName:!!c.holderNameRequired&&!f(o)}),x({...b,holderName:!c.holderNameRequired||f(o,c.holderNameRequired)})},I=r(null),O=r(null),B=e=>{O.current=e},[L,M]=o("ready"),W=r({});return Object.keys(W.current).length||c.setComponentRef?.(W.current),W.current.showValidation=()=>{I.current.showValidation(),c.holderNameRequired&&!b.holderName&&C({..._,holderName:!0}),O.current&&O.current.showValidation()},W.current.setStatus=M,t((()=>(this.setFocusOn=I.current.setFocusOn,this.updateStyles=I.current.updateStyles,()=>{I.current.destroy()})),[]),t((()=>{const e=f(A.holderName,c.holderNameRequired),o=S,r=!c.billingAddressRequired||Boolean(b.billingAddress),t=o&&e&&r;c.onChange({data:A,isValid:t,billingAddress:j,storePaymentMethod:V})}),[A,b,_,V]),e("div",{className:"adyen-checkout__ach"},e(N,null),e(s,{ref:I,...F(c),styles:{...u,...c.styles},onChange:e=>{const o=e,r=o.autoCompleteName?o.autoCompleteName:A.holderName;R({...A,...o.data,holderName:r}),C({..._,...o.errors}),x({...b,...o.valid,holderName:!c.holderNameRequired||f(r,c.holderNameRequired)}),k(o.isSfpValid)},onFocus:e=>{const o=!0===e.focus;w(e.currentFocusObject),o?c.onFocus(e):c.onBlur(e)},render:({setRootNode:o,setFocusOn:r},t)=>e("div",{ref:o,className:"adyen-checkout__ach-input sf-input__wrapper"},e(i,{status:t.status},e("div",{className:a(["adyen-checkout__fieldset","adyen-checkout__fieldset--ach"])},e("div",{className:"adyen-checkout__fieldset__title"},g.get("ach.bankAccount")),c.hasHolderName&&e(n,{label:g.get("ach.accountHolderNameField.title"),className:"adyen-checkout__pm__holderName",errorMessage:!!_.holderName&&g.get("ach.accountHolderNameField.invalid"),showContextualElement:c.showContextualElement,contextualText:g.get("ach.accountHolderNameField.contextualText"),isValid:!!b.holderName,name:"holderName"},e(p,{className:"adyen-checkout__pm__holderName__input adyen-checkout__input",placeholder:c?.placeholders?.holderName,value:A.holderName,required:c.holderNameRequired,onInput:H})),e(l,{focusedElement:v,onFocusField:r,errors:t.errors,valid:t.valid})),c.billingAddressRequired&&e(d,{label:"billingAddress",data:j,onChange:E,allowedCountries:c.billingAddressAllowedCountries,requiredFields:c.billingAddressRequiredFields,setComponentRef:B}),c.enableStoreDetails&&e(h,{onChange:P})))}),c.showPayButton&&c.payButton({status:L,label:g.get("confirmPurchase")}))}g.defaultProps=c;const F=e=>({autoFocus:e.autoFocus,clientKey:e.clientKey,i18n:e.i18n,keypadFix:e.keypadFix,legacyInputMode:e.legacyInputMode,loadingContext:e.loadingContext,onAllValid:e.onAllValid,onConfigSuccess:e.onConfigSuccess,onError:e.onError,onFieldValid:e.onFieldValid,onFocus:e.onFocus,onLoad:e.onLoad,showWarnings:e.showWarnings,styles:e.styles,type:e.type,forceCompat:e.forceCompat,resources:e.resources,placeholders:e.placeholders});export{g as default};
 //# sourceMappingURL=AchInput.js.map

package/dist/es/components/Ach/components/AchInput/AchInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"AchInput.js","sources":["../../../../../../src/components/Ach/components/AchInput/AchInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useState, useEffect, useRef } from 'preact/hooks';\nimport classNames from 'classnames';\nimport AchSecuredFields from './components/AchSecuredFields';\nimport SecuredFieldsProvider from '../../../internal/SecuredFields/SFP/SecuredFieldsProvider';\nimport Address from '../../../internal/Address';\nimport Field from '../../../internal/FormFields/Field';\nimport LoadingWrapper from '../../../internal/LoadingWrapper/LoadingWrapper';\nimport defaultProps from './defaultProps';\nimport defaultStyles from './defaultStyles';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport './AchInput.scss';\nimport { ACHInputDataState, ACHInputProps, ACHInputStateError, ACHInputStateValid } from './types';\nimport StoreDetails from '../../../internal/StoreDetails';\nimport InputText from '../../../internal/FormFields/InputText';\nimport FormInstruction from '../../../internal/FormInstruction';\nimport { ComponentMethodsRef } from '../../../internal/UIElement/types';\n\nfunction validateHolderName(holderName, holderNameRequired = false) {\n    if (holderNameRequired) {\n        return !!holderName && typeof holderName === 'string' && holderName.trim().length > 0;\n    }\n    return true;\n}\n\nfunction AchInput(props: ACHInputProps) {\n    const { i18n } = useCoreContext();\n\n    const holderNameIsValid = props.hasHolderName && (!!props.holderName || !!props.data.holderName);\n\n    const [errors, setErrors] = useState<ACHInputStateError>({});\n    const [valid, setValid] = useState<ACHInputStateValid>({\n        ...(props.holderNameRequired && { holderName: holderNameIsValid })\n    });\n    const [data, setData] = useState<ACHInputDataState>({\n        ...(props.hasHolderName && { holderName: props.holderName || props.data.holderName })\n    });\n\n    const [billingAddress, setBillingAddress] = useState(props.billingAddressRequired ? props.data.billingAddress : null);\n    const [isSfpValid, setIsSfpValid] = useState(false);\n    const [focusedElement, setFocusedElement] = useState('');\n    const [storePaymentMethod, setStorePaymentMethod] = useState(false);\n\n    const handleFocus = e => {\n        const isFocused = e.focus === true;\n\n        setFocusedElement(e.currentFocusObject);\n\n        if (isFocused) {\n            props.onFocus(e);\n        } else {\n            props.onBlur(e);\n        }\n    };\n\n    const handleAddress = address => {\n        setBillingAddress({ ...billingAddress, ...address.data });\n        setValid({ ...valid, billingAddress: address.isValid });\n    };\n\n    const handleHolderName = e => {\n        const holderName = e.target.value;\n\n        setData({ ...data, holderName });\n        setErrors({ ...errors, holderName: props.holderNameRequired ? !validateHolderName(holderName) : false });\n        setValid({ ...valid, holderName: props.holderNameRequired ? validateHolderName(holderName, props.holderNameRequired) : true });\n    };\n\n    const handleSecuredFieldsChange = newState => {\n        const sfState = newState;\n\n        const tempHolderName = sfState.autoCompleteName ? sfState.autoCompleteName : data.holderName;\n\n        setData({ ...data, ...sfState.data, holderName: tempHolderName });\n        setErrors({ ...errors, ...sfState.errors });\n        setValid({\n            ...valid,\n            ...sfState.valid,\n            holderName: props.holderNameRequired ? validateHolderName(tempHolderName, props.holderNameRequired) : true\n        });\n\n        setIsSfpValid(sfState.isSfpValid);\n    };\n\n    // Refs\n    const sfp = useRef(null);\n    const billingAddressRef = useRef(null);\n    const setAddressRef = ref => {\n        billingAddressRef.current = ref;\n    };\n\n    const [status, setStatus] = useState('ready');\n\n    /** An object by which to expose 'public' members to the parent UIElement */\n    const achRef = useRef<ComponentMethodsRef>({});\n    // Just call once\n    if (!Object.keys(achRef.current).length) {\n        props.setComponentRef?.(achRef.current);\n    }\n\n    achRef.current.showValidation = () => {\n        // Validate SecuredFields\n        sfp.current.showValidation();\n\n        // Validate holderName\n        if (props.holderNameRequired && !valid.holderName) {\n            setErrors({ ...errors, holderName: true });\n        }\n\n        // Validate Address\n        if (billingAddressRef.current) billingAddressRef.current.showValidation();\n    };\n\n    achRef.current.setStatus = setStatus;\n\n    useEffect(() => {\n        this.setFocusOn = sfp.current.setFocusOn;\n        this.updateStyles = sfp.current.updateStyles;\n\n        return () => {\n            sfp.current.destroy();\n        };\n    }, []);\n\n    // Run when state.data, -errors or -valid change\n    useEffect(() => {\n        // Validate whole component i.e holderName + securedFields + address\n        const holderNameValid = validateHolderName(data.holderName, props.holderNameRequired);\n        const sfpValid = isSfpValid;\n        const billingAddressValid = props.billingAddressRequired ? Boolean(valid.billingAddress) : true;\n\n        const isValid = sfpValid && holderNameValid && billingAddressValid;\n\n        props.onChange({ data, isValid, billingAddress, storePaymentMethod });\n    }, [data, valid, errors, storePaymentMethod]);\n\n    return (\n        <div className=\"adyen-checkout__ach\">\n            {props.showFormInstruction && <FormInstruction />}\n            <SecuredFieldsProvider\n                ref={sfp}\n                {...extractPropsForSFP(props)}\n                styles={{ ...defaultStyles, ...props.styles }}\n                onChange={handleSecuredFieldsChange}\n                onFocus={handleFocus}\n                render={({ setRootNode, setFocusOn }, sfpState) => (\n                    <div ref={setRootNode} className=\"adyen-checkout__ach-input sf-input__wrapper\">\n                        <LoadingWrapper status={sfpState.status}>\n                            <div className={classNames(['adyen-checkout__fieldset', 'adyen-checkout__fieldset--ach'])}>\n                                {<div className=\"adyen-checkout__fieldset__title\">{i18n.get('ach.bankAccount')}</div>}\n\n                                {props.hasHolderName && (\n                                    <Field\n                                        label={i18n.get('ach.accountHolderNameField.title')}\n                                        className={'adyen-checkout__pm__holderName'}\n                                        errorMessage={!!errors.holderName && i18n.get('ach.accountHolderNameField.invalid')}\n                                        showContextualElement={props.showContextualElement}\n                                        contextualText={i18n.get('ach.accountHolderNameField.contextualText')}\n                                        isValid={!!valid.holderName}\n                                        name={'holderName'}\n                                    >\n                                        <InputText\n                                            className=\"adyen-checkout__pm__holderName__input adyen-checkout__input\"\n                                            placeholder={props?.placeholders?.holderName}\n                                            value={data.holderName}\n                                            required={props.holderNameRequired}\n                                            onInput={handleHolderName}\n                                        />\n                                    </Field>\n                                )}\n\n                                <AchSecuredFields\n                                    focusedElement={focusedElement}\n                                    onFocusField={setFocusOn}\n                                    errors={sfpState.errors}\n                                    valid={sfpState.valid}\n                                />\n                            </div>\n\n                            {props.billingAddressRequired && (\n                                <Address\n                                    label=\"billingAddress\"\n                                    data={billingAddress}\n                                    onChange={handleAddress}\n                                    allowedCountries={props.billingAddressAllowedCountries}\n                                    requiredFields={props.billingAddressRequiredFields}\n                                    setComponentRef={setAddressRef}\n                                />\n                            )}\n\n                            {props.enableStoreDetails && <StoreDetails onChange={setStorePaymentMethod} />}\n                        </LoadingWrapper>\n                    </div>\n                )}\n            />\n            {props.showPayButton && props.payButton({ status, label: i18n.get('confirmPurchase') })}\n        </div>\n    );\n}\n\nAchInput.defaultProps = defaultProps;\n\nexport default AchInput;\n\nconst extractPropsForSFP = (props: ACHInputProps) => {\n    return {\n        autoFocus: props.autoFocus,\n        clientKey: props.clientKey,\n        i18n: props.i18n,\n        keypadFix: props.keypadFix,\n        legacyInputMode: props.legacyInputMode,\n        loadingContext: props.loadingContext,\n        onAllValid: props.onAllValid,\n        onConfigSuccess: props.onConfigSuccess,\n        onError: props.onError,\n        onFieldValid: props.onFieldValid,\n        onFocus: props.onFocus,\n        onLoad: props.onLoad,\n        showWarnings: props.showWarnings,\n        styles: props.styles,\n        type: props.type,\n        forceCompat: props.forceCompat,\n        resources: props.resources,\n        placeholders: props.placeholders\n    };\n};\n"],"names":["validateHolderName","holderName","holderNameRequired","trim","length","AchInput","props","i18n","useCoreContext","holderNameIsValid","hasHolderName","data","errors","setErrors","useState","valid","setValid","setData","billingAddress","setBillingAddress","billingAddressRequired","isSfpValid","setIsSfpValid","focusedElement","setFocusedElement","storePaymentMethod","setStorePaymentMethod","handleAddress","address","isValid","handleHolderName","e","target","value","sfp","useRef","billingAddressRef","setAddressRef","ref","current","status","setStatus","achRef","Object","keys","setComponentRef","showValidation","useEffect","this","setFocusOn","updateStyles","destroy","holderNameValid","sfpValid","billingAddressValid","Boolean","onChange","h","div","className","showFormInstruction","FormInstruction","SecuredFieldsProvider","extractPropsForSFP","styles","defaultStyles","newState","sfState","tempHolderName","autoCompleteName","onFocus","isFocused","focus","currentFocusObject","onBlur","render","setRootNode","sfpState","LoadingWrapper","classNames","get","Field","label","errorMessage","showContextualElement","contextualText","name","InputText","placeholder","placeholders","required","onInput","AchSecuredFields","onFocusField","Address","allowedCountries","billingAddressAllowedCountries","requiredFields","billingAddressRequiredFields","enableStoreDetails","StoreDetails","showPayButton","payButton","defaultProps","autoFocus","clientKey","keypadFix","legacyInputMode","loadingContext","onAllValid","onConfigSuccess","onError","onFieldValid","onLoad","showWarnings","type","forceCompat","resources"],"mappings":"81BAkBA,SAASA,EAAmBC,EAAYC,GAAqB,GACzD,OAAIA,KACSD,GAAoC,iBAAfA,GAA2BA,EAAWE,OAAOC,OAAS,CAG5F,CAEA,SAASC,EAASC,GACd,MAAMC,KAAEA,GAASC,IAEXC,EAAoBH,EAAMI,kBAAoBJ,EAAML,cAAgBK,EAAMK,KAAKV,aAE9EW,EAAQC,GAAaC,EAA6B,CAAC,IACnDC,EAAOC,GAAYF,EAA6B,IAC/CR,EAAMJ,oBAAsB,CAAED,WAAYQ,MAE3CE,EAAMM,GAAWH,EAA4B,IAC5CR,EAAMI,eAAiB,CAAET,WAAYK,EAAML,YAAcK,EAAMK,KAAKV,eAGrEiB,EAAgBC,GAAqBL,EAASR,EAAMc,uBAAyBd,EAAMK,KAAKO,eAAiB,OACzGG,EAAYC,GAAiBR,GAAS,IACtCS,EAAgBC,GAAqBV,EAAS,KAC9CW,EAAoBC,GAAyBZ,GAAS,GAcvDa,EAAgBC,IAClBT,EAAkB,IAAKD,KAAmBU,EAAQjB,OAClDK,EAAS,IAAKD,EAAOG,eAAgBU,EAAQC,SAAQ,EAGnDC,EAAmBC,IACrB,MAAM9B,EAAa8B,EAAEC,OAAOC,MAE5BhB,EAAQ,IAAKN,EAAMV,eACnBY,EAAU,IAAKD,EAAQX,aAAYK,EAAMJ,qBAAsBF,EAAmBC,KAClFe,EAAS,IAAKD,EAAOd,YAAYK,EAAMJ,oBAAqBF,EAAmBC,EAAYK,EAAMJ,qBAA2B,EAoB1HgC,EAAMC,EAAO,MACbC,EAAoBD,EAAO,MAC3BE,EAAgBC,IAClBF,EAAkBG,QAAUD,CAAAA,GAGzBE,EAAQC,GAAa3B,EAAS,SAG/B4B,EAASP,EAA4B,CAAA,GA0C3C,OAxCKQ,OAAOC,KAAKF,EAAOH,SAASnC,QAC7BE,EAAMuC,kBAAkBH,EAAOH,SAGnCG,EAAOH,QAAQO,eAAiB,KAE5BZ,EAAIK,QAAQO,iBAGRxC,EAAMJ,qBAAuBa,EAAMd,YACnCY,EAAU,IAAKD,EAAQX,YAAY,IAInCmC,EAAkBG,SAASH,EAAkBG,QAAQO,gBAAc,EAG3EJ,EAAOH,QAAQE,UAAYA,EAE3BM,GAAU,KACNC,KAAKC,WAAaf,EAAIK,QAAQU,WAC9BD,KAAKE,aAAehB,EAAIK,QAAQW,aAEzB,KACHhB,EAAIK,QAAQY,SAAO,IAExB,IAGHJ,GAAU,KAEN,MAAMK,EAAkBpD,EAAmBW,EAAKV,WAAYK,EAAMJ,oBAC5DmD,EAAWhC,EACXiC,GAAsBhD,EAAMc,wBAAyBmC,QAAQxC,EAAMG,gBAEnEW,EAAUwB,GAAYD,GAAmBE,EAE/ChD,EAAMkD,SAAS,CAAE7C,OAAMkB,UAASX,iBAAgBO,sBAAmB,GACpE,CAACd,EAAMI,EAAOH,EAAQa,IAGrBgC,EAACC,MAAAA,CAAIC,UAAU,uBACVrD,EAAMsD,qBAAuBH,EAACI,EAAAA,MAC/BJ,EAACK,EAAAA,CACGxB,IAAKJ,KACD6B,EAAmBzD,GACvB0D,OAAQ,IAAKC,KAAkB3D,EAAM0D,QACrCR,SA3EsBU,IAC9B,MAAMC,EAAUD,EAEVE,EAAiBD,EAAQE,iBAAmBF,EAAQE,iBAAmB1D,EAAKV,WAElFgB,EAAQ,IAAKN,KAASwD,EAAQxD,KAAMV,WAAYmE,IAChDvD,EAAU,IAAKD,KAAWuD,EAAQvD,SAClCI,EAAS,IACFD,KACAoD,EAAQpD,MACXd,YAAYK,EAAMJ,oBAAqBF,EAAmBoE,EAAgB9D,EAAMJ,sBAGpFoB,EAAc6C,EAAQ9C,WAAU,EA+DxBiD,QArGQvC,IAChB,MAAMwC,GAAwB,IAAZxC,EAAEyC,MAEpBhD,EAAkBO,EAAE0C,oBAEhBF,EACAjE,EAAMgE,QAAQvC,GAEdzB,EAAMoE,OAAO3C,EACjB,EA6FQ4C,OAAQ,EAAGC,cAAa3B,cAAc4B,IAClCpB,EAACC,MAAAA,CAAIpB,IAAKsC,EAAajB,UAAU,+CAC7BF,EAACqB,EAAAA,CAAetC,OAAQqC,EAASrC,QAC7BiB,EAACC,MAAAA,CAAIC,UAAWoB,EAAW,CAAC,2BAA4B,mCACnDtB,EAACC,MAAAA,CAAIC,UAAU,mCAAmCpD,EAAKyE,IAAI,oBAE3D1E,EAAMI,eACH+C,EAACwB,EAAAA,CACGC,MAAO3E,EAAKyE,IAAI,oCAChBrB,UAAW,iCACXwB,eAAgBvE,EAAOX,YAAcM,EAAKyE,IAAI,sCAC9CI,sBAAuB9E,EAAM8E,sBAC7BC,eAAgB9E,EAAKyE,IAAI,6CACzBnD,UAAWd,EAAMd,WACjBqF,KAAM,cAEN7B,EAAC8B,EAAAA,CACG5B,UAAU,8DACV6B,YAAalF,GAAOmF,cAAcxF,WAClCgC,MAAOtB,EAAKV,WACZyF,SAAUpF,EAAMJ,mBAChByF,QAAS7D,KAKrB2B,EAACmC,EAAAA,CACGrE,eAAgBA,EAChBsE,aAAc5C,EACdrC,OAAQiE,EAASjE,OACjBG,MAAO8D,EAAS9D,SAIvBT,EAAMc,wBACHqC,EAACqC,EAAAA,CACGZ,MAAM,iBACNvE,KAAMO,EACNsC,SAAU7B,EACVoE,iBAAkBzF,EAAM0F,+BACxBC,eAAgB3F,EAAM4F,6BACtBrD,gBAAiBR,IAIxB/B,EAAM6F,oBAAsB1C,EAAC2C,EAAAA,CAAa5C,SAAU9B,QAKpEpB,EAAM+F,eAAiB/F,EAAMgG,UAAU,CAAE9D,SAAQ0C,MAAO3E,EAAKyE,IAAI,qBAG9E,CAEA3E,EAASkG,aAAeA,EAIxB,MAAMxC,EAAsBzD,IACjB,CACHkG,UAAWlG,EAAMkG,UACjBC,UAAWnG,EAAMmG,UACjBlG,KAAMD,EAAMC,KACZmG,UAAWpG,EAAMoG,UACjBC,gBAAiBrG,EAAMqG,gBACvBC,eAAgBtG,EAAMsG,eACtBC,WAAYvG,EAAMuG,WAClBC,gBAAiBxG,EAAMwG,gBACvBC,QAASzG,EAAMyG,QACfC,aAAc1G,EAAM0G,aACpB1C,QAAShE,EAAMgE,QACf2C,OAAQ3G,EAAM2G,OACdC,aAAc5G,EAAM4G,aACpBlD,OAAQ1D,EAAM0D,OACdmD,KAAM7G,EAAM6G,KACZC,YAAa9G,EAAM8G,YACnBC,UAAW/G,EAAM+G,UACjB5B,aAAcnF,EAAMmF"}
+{"version":3,"file":"AchInput.js","sources":["../../../../../../src/components/Ach/components/AchInput/AchInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useState, useEffect, useRef } from 'preact/hooks';\nimport classNames from 'classnames';\nimport AchSecuredFields from './components/AchSecuredFields';\nimport SecuredFieldsProvider from '../../../internal/SecuredFields/SFP/SecuredFieldsProvider';\nimport Address from '../../../internal/Address';\nimport Field from '../../../internal/FormFields/Field';\nimport LoadingWrapper from '../../../internal/LoadingWrapper/LoadingWrapper';\nimport defaultProps from './defaultProps';\nimport defaultStyles from './defaultStyles';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport './AchInput.scss';\nimport { ACHInputDataState, ACHInputProps, ACHInputStateError, ACHInputStateValid } from './types';\nimport StoreDetails from '../../../internal/StoreDetails';\nimport InputText from '../../../internal/FormFields/InputText';\nimport FormInstruction from '../../../internal/FormInstruction';\nimport { ComponentMethodsRef } from '../../../internal/UIElement/types';\n\nfunction validateHolderName(holderName, holderNameRequired = false) {\n    if (holderNameRequired) {\n        return !!holderName && typeof holderName === 'string' && holderName.trim().length > 0;\n    }\n    return true;\n}\n\nfunction AchInput(props: ACHInputProps) {\n    const { i18n } = useCoreContext();\n\n    const holderNameIsValid = props.hasHolderName && (!!props.holderName || !!props.data.holderName);\n\n    const [errors, setErrors] = useState<ACHInputStateError>({});\n    const [valid, setValid] = useState<ACHInputStateValid>({\n        ...(props.holderNameRequired && { holderName: holderNameIsValid })\n    });\n    const [data, setData] = useState<ACHInputDataState>({\n        ...(props.hasHolderName && { holderName: props.holderName || props.data.holderName })\n    });\n\n    const [billingAddress, setBillingAddress] = useState(props.billingAddressRequired ? props.data.billingAddress : null);\n    const [isSfpValid, setIsSfpValid] = useState(false);\n    const [focusedElement, setFocusedElement] = useState('');\n    const [storePaymentMethod, setStorePaymentMethod] = useState(false);\n\n    const handleFocus = e => {\n        const isFocused = e.focus === true;\n\n        setFocusedElement(e.currentFocusObject);\n\n        if (isFocused) {\n            props.onFocus(e);\n        } else {\n            props.onBlur(e);\n        }\n    };\n\n    const handleAddress = address => {\n        setBillingAddress({ ...billingAddress, ...address.data });\n        setValid({ ...valid, billingAddress: address.isValid });\n    };\n\n    const handleHolderName = e => {\n        const holderName = e.target.value;\n\n        setData({ ...data, holderName });\n        setErrors({ ...errors, holderName: props.holderNameRequired ? !validateHolderName(holderName) : false });\n        setValid({ ...valid, holderName: props.holderNameRequired ? validateHolderName(holderName, props.holderNameRequired) : true });\n    };\n\n    const handleSecuredFieldsChange = newState => {\n        const sfState = newState;\n\n        const tempHolderName = sfState.autoCompleteName ? sfState.autoCompleteName : data.holderName;\n\n        setData({ ...data, ...sfState.data, holderName: tempHolderName });\n        setErrors({ ...errors, ...sfState.errors });\n        setValid({\n            ...valid,\n            ...sfState.valid,\n            holderName: props.holderNameRequired ? validateHolderName(tempHolderName, props.holderNameRequired) : true\n        });\n\n        setIsSfpValid(sfState.isSfpValid);\n    };\n\n    // Refs\n    const sfp = useRef(null);\n    const billingAddressRef = useRef(null);\n    const setAddressRef = ref => {\n        billingAddressRef.current = ref;\n    };\n\n    const [status, setStatus] = useState('ready');\n\n    /** An object by which to expose 'public' members to the parent UIElement */\n    const achRef = useRef<ComponentMethodsRef>({});\n    // Just call once\n    if (!Object.keys(achRef.current).length) {\n        props.setComponentRef?.(achRef.current);\n    }\n\n    achRef.current.showValidation = () => {\n        // Validate SecuredFields\n        sfp.current.showValidation();\n\n        // Validate holderName\n        if (props.holderNameRequired && !valid.holderName) {\n            setErrors({ ...errors, holderName: true });\n        }\n\n        // Validate Address\n        if (billingAddressRef.current) billingAddressRef.current.showValidation();\n    };\n\n    achRef.current.setStatus = setStatus;\n\n    useEffect(() => {\n        this.setFocusOn = sfp.current.setFocusOn;\n        this.updateStyles = sfp.current.updateStyles;\n\n        return () => {\n            sfp.current.destroy();\n        };\n    }, []);\n\n    // Run when state.data, -errors or -valid change\n    useEffect(() => {\n        // Validate whole component i.e holderName + securedFields + address\n        const holderNameValid = validateHolderName(data.holderName, props.holderNameRequired);\n        const sfpValid = isSfpValid;\n        const billingAddressValid = props.billingAddressRequired ? Boolean(valid.billingAddress) : true;\n\n        const isValid = sfpValid && holderNameValid && billingAddressValid;\n\n        props.onChange({ data, isValid, billingAddress, storePaymentMethod });\n    }, [data, valid, errors, storePaymentMethod]);\n\n    return (\n        <div className=\"adyen-checkout__ach\">\n            <FormInstruction />\n\n            <SecuredFieldsProvider\n                ref={sfp}\n                {...extractPropsForSFP(props)}\n                styles={{ ...defaultStyles, ...props.styles }}\n                onChange={handleSecuredFieldsChange}\n                onFocus={handleFocus}\n                render={({ setRootNode, setFocusOn }, sfpState) => (\n                    <div ref={setRootNode} className=\"adyen-checkout__ach-input sf-input__wrapper\">\n                        <LoadingWrapper status={sfpState.status}>\n                            <div className={classNames(['adyen-checkout__fieldset', 'adyen-checkout__fieldset--ach'])}>\n                                {<div className=\"adyen-checkout__fieldset__title\">{i18n.get('ach.bankAccount')}</div>}\n\n                                {props.hasHolderName && (\n                                    <Field\n                                        label={i18n.get('ach.accountHolderNameField.title')}\n                                        className={'adyen-checkout__pm__holderName'}\n                                        errorMessage={!!errors.holderName && i18n.get('ach.accountHolderNameField.invalid')}\n                                        showContextualElement={props.showContextualElement}\n                                        contextualText={i18n.get('ach.accountHolderNameField.contextualText')}\n                                        isValid={!!valid.holderName}\n                                        name={'holderName'}\n                                    >\n                                        <InputText\n                                            className=\"adyen-checkout__pm__holderName__input adyen-checkout__input\"\n                                            placeholder={props?.placeholders?.holderName}\n                                            value={data.holderName}\n                                            required={props.holderNameRequired}\n                                            onInput={handleHolderName}\n                                        />\n                                    </Field>\n                                )}\n\n                                <AchSecuredFields\n                                    focusedElement={focusedElement}\n                                    onFocusField={setFocusOn}\n                                    errors={sfpState.errors}\n                                    valid={sfpState.valid}\n                                />\n                            </div>\n\n                            {props.billingAddressRequired && (\n                                <Address\n                                    label=\"billingAddress\"\n                                    data={billingAddress}\n                                    onChange={handleAddress}\n                                    allowedCountries={props.billingAddressAllowedCountries}\n                                    requiredFields={props.billingAddressRequiredFields}\n                                    setComponentRef={setAddressRef}\n                                />\n                            )}\n\n                            {props.enableStoreDetails && <StoreDetails onChange={setStorePaymentMethod} />}\n                        </LoadingWrapper>\n                    </div>\n                )}\n            />\n            {props.showPayButton && props.payButton({ status, label: i18n.get('confirmPurchase') })}\n        </div>\n    );\n}\n\nAchInput.defaultProps = defaultProps;\n\nexport default AchInput;\n\nconst extractPropsForSFP = (props: ACHInputProps) => {\n    return {\n        autoFocus: props.autoFocus,\n        clientKey: props.clientKey,\n        i18n: props.i18n,\n        keypadFix: props.keypadFix,\n        legacyInputMode: props.legacyInputMode,\n        loadingContext: props.loadingContext,\n        onAllValid: props.onAllValid,\n        onConfigSuccess: props.onConfigSuccess,\n        onError: props.onError,\n        onFieldValid: props.onFieldValid,\n        onFocus: props.onFocus,\n        onLoad: props.onLoad,\n        showWarnings: props.showWarnings,\n        styles: props.styles,\n        type: props.type,\n        forceCompat: props.forceCompat,\n        resources: props.resources,\n        placeholders: props.placeholders\n    };\n};\n"],"names":["validateHolderName","holderName","holderNameRequired","trim","length","AchInput","props","i18n","useCoreContext","holderNameIsValid","hasHolderName","data","errors","setErrors","useState","valid","setValid","setData","billingAddress","setBillingAddress","billingAddressRequired","isSfpValid","setIsSfpValid","focusedElement","setFocusedElement","storePaymentMethod","setStorePaymentMethod","handleAddress","address","isValid","handleHolderName","e","target","value","sfp","useRef","billingAddressRef","setAddressRef","ref","current","status","setStatus","achRef","Object","keys","setComponentRef","showValidation","useEffect","this","setFocusOn","updateStyles","destroy","holderNameValid","sfpValid","billingAddressValid","Boolean","onChange","h","div","className","FormInstruction","SecuredFieldsProvider","extractPropsForSFP","styles","defaultStyles","newState","sfState","tempHolderName","autoCompleteName","onFocus","isFocused","focus","currentFocusObject","onBlur","render","setRootNode","sfpState","LoadingWrapper","classNames","get","Field","label","errorMessage","showContextualElement","contextualText","name","InputText","placeholder","placeholders","required","onInput","AchSecuredFields","onFocusField","Address","allowedCountries","billingAddressAllowedCountries","requiredFields","billingAddressRequiredFields","enableStoreDetails","StoreDetails","showPayButton","payButton","defaultProps","autoFocus","clientKey","keypadFix","legacyInputMode","loadingContext","onAllValid","onConfigSuccess","onError","onFieldValid","onLoad","showWarnings","type","forceCompat","resources"],"mappings":"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"}

package/dist/es/components/Ach/components/AchInput/defaultProps.js

@@ -1,2 +1,2 @@
-var e={type:"ach",hasHolderName:!0,holderNameRequired:!0,billingAddressRequired:!0,billingAddressAllowedCountries:["US","PR"],showFormInstruction:!0,showContextualElement:!0,onLoad:()=>{},onConfigSuccess:()=>{},onAllValid:()=>{},onFieldValid:()=>{},onError:()=>{},onBlur:()=>{},onFocus:()=>{},onChange:()=>{},holderName:"",data:{holderName:"",billingAddress:{}},styles:{},placeholders:{}};export{e as default};
+var e={type:"ach",hasHolderName:!0,holderNameRequired:!0,billingAddressRequired:!0,billingAddressAllowedCountries:["US","PR"],showContextualElement:!0,onLoad:()=>{},onConfigSuccess:()=>{},onAllValid:()=>{},onFieldValid:()=>{},onError:()=>{},onBlur:()=>{},onFocus:()=>{},onChange:()=>{},holderName:"",data:{holderName:"",billingAddress:{}},styles:{},placeholders:{}};export{e as default};
 //# sourceMappingURL=defaultProps.js.map

package/dist/es/components/Ach/components/AchInput/defaultProps.js.map

@@ -1 +1 @@
-{"version":3,"file":"defaultProps.js","sources":["../../../../../../src/components/Ach/components/AchInput/defaultProps.ts"],"sourcesContent":["export default {\n    type: 'ach',\n\n    // Settings\n    hasHolderName: true,\n    holderNameRequired: true,\n    billingAddressRequired: true,\n    billingAddressAllowedCountries: ['US', 'PR'],\n    showFormInstruction: true,\n    showContextualElement: true,\n\n    // Events\n    onLoad: () => {},\n    onConfigSuccess: () => {},\n    onAllValid: () => {},\n    onFieldValid: () => {},\n    onError: () => {},\n    onBlur: () => {},\n    onFocus: () => {},\n    onChange: () => {},\n\n    // Values\n    holderName: '',\n    data: {\n        holderName: '',\n        billingAddress: {}\n    },\n\n    // Customization\n    styles: {},\n    placeholders: {}\n};\n"],"names":["defaultProps","type","hasHolderName","holderNameRequired","billingAddressRequired","billingAddressAllowedCountries","showFormInstruction","showContextualElement","onLoad","onConfigSuccess","onAllValid","onFieldValid","onError","onBlur","onFocus","onChange","holderName","data","billingAddress","styles","placeholders"],"mappings":"AAAA,IAAeA,EAAA,CACXC,KAAM,MAGNC,eAAe,EACfC,oBAAoB,EACpBC,wBAAwB,EACxBC,+BAAgC,CAAC,KAAM,MACvCC,qBAAqB,EACrBC,uBAAuB,EAGvBC,OAAQ,OACRC,gBAAiB,OACjBC,WAAY,OACZC,aAAc,OACdC,QAAS,OACTC,OAAQ,OACRC,QAAS,OACTC,SAAU,OAGVC,WAAY,GACZC,KAAM,CACFD,WAAY,GACZE,eAAgB,CAAC,GAIrBC,OAAQ,CAAC,EACTC,aAAc,CAAC"}
+{"version":3,"file":"defaultProps.js","sources":["../../../../../../src/components/Ach/components/AchInput/defaultProps.ts"],"sourcesContent":["export default {\n    type: 'ach',\n\n    // Settings\n    hasHolderName: true,\n    holderNameRequired: true,\n    billingAddressRequired: true,\n    billingAddressAllowedCountries: ['US', 'PR'],\n    showContextualElement: true,\n\n    // Events\n    onLoad: () => {},\n    onConfigSuccess: () => {},\n    onAllValid: () => {},\n    onFieldValid: () => {},\n    onError: () => {},\n    onBlur: () => {},\n    onFocus: () => {},\n    onChange: () => {},\n\n    // Values\n    holderName: '',\n    data: {\n        holderName: '',\n        billingAddress: {}\n    },\n\n    // Customization\n    styles: {},\n    placeholders: {}\n};\n"],"names":["defaultProps","type","hasHolderName","holderNameRequired","billingAddressRequired","billingAddressAllowedCountries","showContextualElement","onLoad","onConfigSuccess","onAllValid","onFieldValid","onError","onBlur","onFocus","onChange","holderName","data","billingAddress","styles","placeholders"],"mappings":"AAAA,IAAeA,EAAA,CACXC,KAAM,MAGNC,eAAe,EACfC,oBAAoB,EACpBC,wBAAwB,EACxBC,+BAAgC,CAAC,KAAM,MACvCC,uBAAuB,EAGvBC,OAAQ,OACRC,gBAAiB,OACjBC,WAAY,OACZC,aAAc,OACdC,QAAS,OACTC,OAAQ,OACRC,QAAS,OACTC,SAAU,OAGVC,WAAY,GACZC,KAAM,CACFD,WAAY,GACZE,eAAgB,CAAC,GAIrBC,OAAQ,CAAC,EACTC,aAAc,CAAC"}

package/dist/es/components/AfterPay/AfterPayB2B.js

@@ -1,2 +1,2 @@
-import e from"../helpers/OpenInvoiceContainer/OpenInvoiceContainer.js";import{TxVariants as t}from"../tx-variants.js";import{ALLOWED_COUNTRIES as r}from"./config.js";class s extends e{static type=t.afterpay_b2b;static defaultProps={onChange:()=>{},data:{companyDetails:{},personalDetails:{},billingAddress:{},deliveryAddress:{}},visibility:{companyDetails:"editable",personalDetails:"editable",billingAddress:"editable",deliveryAddress:"editable"},showFormInstruction:!0};formatProps(e){return{...super.formatProps(e),allowedCountries:e.countryCode?[e.countryCode]:r}}}export{s as default};
+import e from"../helpers/OpenInvoiceContainer/OpenInvoiceContainer.js";import{TxVariants as t}from"../tx-variants.js";import{ALLOWED_COUNTRIES as r}from"./config.js";class s extends e{static type=t.afterpay_b2b;static defaultProps={onChange:()=>{},data:{companyDetails:{},personalDetails:{},billingAddress:{},deliveryAddress:{}},visibility:{companyDetails:"editable",personalDetails:"editable",billingAddress:"editable",deliveryAddress:"editable"}};formatProps(e){return{...super.formatProps(e),allowedCountries:e.countryCode?[e.countryCode]:r}}}export{s as default};
 //# sourceMappingURL=AfterPayB2B.js.map

package/dist/es/components/AfterPay/AfterPayB2B.js.map

@@ -1 +1 @@
-{"version":3,"file":"AfterPayB2B.js","sources":["../../../../src/components/AfterPay/AfterPayB2B.tsx"],"sourcesContent":["import OpenInvoiceContainer from '../helpers/OpenInvoiceContainer';\nimport { TxVariants } from '../tx-variants';\nimport { OpenInvoiceConfiguration } from '../helpers/OpenInvoiceContainer/types';\nimport { ALLOWED_COUNTRIES } from './config';\n\nexport default class AfterPayB2B extends OpenInvoiceContainer {\n    public static type = TxVariants.afterpay_b2b;\n\n    protected static defaultProps: Partial<OpenInvoiceConfiguration> = {\n        onChange: () => {},\n        data: { companyDetails: {}, personalDetails: {}, billingAddress: {}, deliveryAddress: {} },\n        visibility: {\n            companyDetails: 'editable',\n            personalDetails: 'editable',\n            billingAddress: 'editable',\n            deliveryAddress: 'editable'\n        },\n        showFormInstruction: true\n    };\n\n    formatProps(props) {\n        return {\n            ...super.formatProps(props),\n            allowedCountries: props.countryCode ? [props.countryCode] : ALLOWED_COUNTRIES\n        };\n    }\n}\n"],"names":["AfterPayB2B","OpenInvoiceContainer","static","TxVariants","afterpay_b2b","onChange","data","companyDetails","personalDetails","billingAddress","deliveryAddress","visibility","showFormInstruction","formatProps","props","super","allowedCountries","countryCode","ALLOWED_COUNTRIES"],"mappings":"sKAKe,MAAMA,UAAoBC,EACrCC,YAAqBC,EAAWC,aAEhCF,oBAAmE,CAC/DG,SAAU,OACVC,KAAM,CAAEC,eAAgB,CAAC,EAAGC,gBAAiB,CAAC,EAAGC,eAAgB,CAAC,EAAGC,gBAAiB,CAAC,GACvFC,WAAY,CACRJ,eAAgB,WAChBC,gBAAiB,WACjBC,eAAgB,WAChBC,gBAAiB,YAErBE,qBAAqB,GAGzBC,WAAAA,CAAYC,GACR,MAAO,IACAC,MAAMF,YAAYC,GACrBE,iBAAkBF,EAAMG,YAAc,CAACH,EAAMG,aAAeC,EAEpE"}
+{"version":3,"file":"AfterPayB2B.js","sources":["../../../../src/components/AfterPay/AfterPayB2B.tsx"],"sourcesContent":["import OpenInvoiceContainer from '../helpers/OpenInvoiceContainer';\nimport { TxVariants } from '../tx-variants';\nimport { OpenInvoiceConfiguration } from '../helpers/OpenInvoiceContainer/types';\nimport { ALLOWED_COUNTRIES } from './config';\n\nexport default class AfterPayB2B extends OpenInvoiceContainer {\n    public static type = TxVariants.afterpay_b2b;\n\n    protected static defaultProps: Partial<OpenInvoiceConfiguration> = {\n        onChange: () => {},\n        data: { companyDetails: {}, personalDetails: {}, billingAddress: {}, deliveryAddress: {} },\n        visibility: {\n            companyDetails: 'editable',\n            personalDetails: 'editable',\n            billingAddress: 'editable',\n            deliveryAddress: 'editable'\n        }\n    };\n\n    formatProps(props) {\n        return {\n            ...super.formatProps(props),\n            allowedCountries: props.countryCode ? [props.countryCode] : ALLOWED_COUNTRIES\n        };\n    }\n}\n"],"names":["AfterPayB2B","OpenInvoiceContainer","static","TxVariants","afterpay_b2b","onChange","data","companyDetails","personalDetails","billingAddress","deliveryAddress","visibility","formatProps","props","super","allowedCountries","countryCode","ALLOWED_COUNTRIES"],"mappings":"sKAKe,MAAMA,UAAoBC,EACrCC,YAAqBC,EAAWC,aAEhCF,oBAAmE,CAC/DG,SAAU,OACVC,KAAM,CAAEC,eAAgB,CAAC,EAAGC,gBAAiB,CAAC,EAAGC,eAAgB,CAAC,EAAGC,gBAAiB,CAAC,GACvFC,WAAY,CACRJ,eAAgB,WAChBC,gBAAiB,WACjBC,eAAgB,WAChBC,gBAAiB,aAIzBE,WAAAA,CAAYC,GACR,MAAO,IACAC,MAAMF,YAAYC,GACrBE,iBAAkBF,EAAMG,YAAc,CAACH,EAAMG,aAAeC,EAEpE"}

package/dist/es/components/BacsDD/BacsDD.js

@@ -1,2 +1,2 @@
-import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as e}from"../internal/UIElement/UIElement.js";import a from"./components/BacsInput.js";import{CoreProvider as s}from"../../core/Context/CoreProvider.js";import o from"./components/BacsResult.js";import r from"../internal/PayButton/PayButton.js";import{TxVariants as i}from"../tx-variants.js";class n extends e{static type=i.directdebit_GB;static defaultProps={showFormInstruction:!0};formatData(){return{paymentMethod:{type:n.type,...this.state.data?.holderName&&{holderName:this.state.data.holderName},...this.state.data?.bankAccountNumber&&{bankAccountNumber:this.state.data.bankAccountNumber},...this.state.data?.bankLocationId&&{bankLocationId:this.state.data.bankLocationId}},...this.state.data?.shopperEmail&&{shopperEmail:this.state.data.shopperEmail}}}get isValid(){return!!this.state.isValid}payButton=e=>t(r,{amount:this.props.amount,onClick:this.submit,...e});render(){return t(s,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},this.props.url?t(o,{ref:t=>{this.componentRef=t},icon:this.icon,url:this.props.url,paymentMethodType:this.props.paymentMethodType}):t(a,{ref:t=>{this.componentRef=t},...this.props,onChange:this.setState,payButton:this.payButton,onSubmit:this.submit}))}}export{n as default};
+import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as e}from"../internal/UIElement/UIElement.js";import a from"./components/BacsInput.js";import{CoreProvider as s}from"../../core/Context/CoreProvider.js";import o from"./components/BacsResult.js";import r from"../internal/PayButton/PayButton.js";import{TxVariants as i}from"../tx-variants.js";class n extends e{static type=i.directdebit_GB;formatData(){return{paymentMethod:{type:n.type,...this.state.data?.holderName&&{holderName:this.state.data.holderName},...this.state.data?.bankAccountNumber&&{bankAccountNumber:this.state.data.bankAccountNumber},...this.state.data?.bankLocationId&&{bankLocationId:this.state.data.bankLocationId}},...this.state.data?.shopperEmail&&{shopperEmail:this.state.data.shopperEmail}}}get isValid(){return!!this.state.isValid}payButton=e=>t(r,{amount:this.props.amount,onClick:this.submit,...e});render(){return t(s,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},this.props.url?t(o,{ref:t=>{this.componentRef=t},icon:this.icon,url:this.props.url,paymentMethodType:this.props.paymentMethodType}):t(a,{ref:t=>{this.componentRef=t},...this.props,onChange:this.setState,payButton:this.payButton,onSubmit:this.submit}))}}export{n as default};
 //# sourceMappingURL=BacsDD.js.map

package/dist/es/components/BacsDD/BacsDD.js.map

@@ -1 +1 @@
-{"version":3,"file":"BacsDD.js","sources":["../../../../src/components/BacsDD/BacsDD.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport BacsInput from './components/BacsInput';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport BacsResult from './components/BacsResult';\nimport PayButton from '../internal/PayButton';\nimport { TxVariants } from '../tx-variants';\nimport { VoucherConfiguration } from '../internal/Voucher/types';\nimport { BacsElementData } from './types';\n\nclass BacsElement extends UIElement<VoucherConfiguration> {\n    public static type = TxVariants.directdebit_GB;\n\n    protected static defaultProps = {\n        showFormInstruction: true\n    };\n\n    formatData(): BacsElementData {\n        return {\n            paymentMethod: {\n                type: BacsElement.type,\n                ...(this.state.data?.holderName && { holderName: this.state.data.holderName }),\n                ...(this.state.data?.bankAccountNumber && { bankAccountNumber: this.state.data.bankAccountNumber }),\n                ...(this.state.data?.bankLocationId && { bankLocationId: this.state.data.bankLocationId })\n            },\n            ...(this.state.data?.shopperEmail && { shopperEmail: this.state.data.shopperEmail })\n        };\n    }\n\n    get isValid(): boolean {\n        return !!this.state.isValid;\n    }\n\n    public payButton = props => {\n        return <PayButton amount={this.props.amount} onClick={this.submit} {...props} />;\n    };\n\n    render() {\n        return (\n            <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                {this.props.url ? (\n                    <BacsResult\n                        ref={ref => {\n                            this.componentRef = ref;\n                        }}\n                        icon={this.icon}\n                        url={this.props.url}\n                        paymentMethodType={this.props.paymentMethodType}\n                    />\n                ) : (\n                    <BacsInput\n                        // @ts-ignore ref is internal from the Component\n                        ref={ref => {\n                            this.componentRef = ref;\n                        }}\n                        {...this.props}\n                        onChange={this.setState}\n                        payButton={this.payButton}\n                        onSubmit={this.submit}\n                    />\n                )}\n            </CoreProvider>\n        );\n    }\n}\n\nexport default BacsElement;\n"],"names":["BacsElement","UIElement","static","TxVariants","directdebit_GB","showFormInstruction","formatData","paymentMethod","type","this","state","data","holderName","bankAccountNumber","bankLocationId","shopperEmail","isValid","payButton","props","h","PayButton","amount","onClick","submit","render","CoreProvider","i18n","loadingContext","resources","url","BacsResult","ref","componentRef","icon","paymentMethodType","BacsInput","onChange","setState","onSubmit"],"mappings":"0XAUA,MAAMA,UAAoBC,EACtBC,YAAqBC,EAAWC,eAEhCF,oBAAgC,CAC5BG,qBAAqB,GAGzBC,UAAAA,GACI,MAAO,CACHC,cAAe,CACXC,KAAMR,EAAYQ,QACdC,KAAKC,MAAMC,MAAMC,YAAc,CAAEA,WAAYH,KAAKC,MAAMC,KAAKC,eAC7DH,KAAKC,MAAMC,MAAME,mBAAqB,CAAEA,kBAAmBJ,KAAKC,MAAMC,KAAKE,sBAC3EJ,KAAKC,MAAMC,MAAMG,gBAAkB,CAAEA,eAAgBL,KAAKC,MAAMC,KAAKG,oBAEzEL,KAAKC,MAAMC,MAAMI,cAAgB,CAAEA,aAAcN,KAAKC,MAAMC,KAAKI,cAE7E,CAEA,WAAIC,GACA,QAASP,KAAKC,MAAMM,OACxB,CAEOC,UAAYC,GACRC,EAACC,EAAAA,CAAUC,OAAQZ,KAAKS,MAAMG,OAAQC,QAASb,KAAKc,UAAYL,IAG3EM,MAAAA,GACI,OACIL,EAACM,EAAAA,CAAaC,KAAMjB,KAAKS,MAAMQ,KAAMC,eAAgBlB,KAAKS,MAAMS,eAAgBC,UAAWnB,KAAKmB,WAC3FnB,KAAKS,MAAMW,IACRV,EAACW,EAAAA,CACGC,IAAKA,IACDtB,KAAKuB,aAAeD,CAAAA,EAExBE,KAAMxB,KAAKwB,KACXJ,IAAKpB,KAAKS,MAAMW,IAChBK,kBAAmBzB,KAAKS,MAAMgB,oBAGlCf,EAACgB,EAAAA,CAEGJ,IAAKA,IACDtB,KAAKuB,aAAeD,CAAAA,KAEpBtB,KAAKS,MACTkB,SAAU3B,KAAK4B,SACfpB,UAAWR,KAAKQ,UAChBqB,SAAU7B,KAAKc,SAKnC"}
+{"version":3,"file":"BacsDD.js","sources":["../../../../src/components/BacsDD/BacsDD.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport BacsInput from './components/BacsInput';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport BacsResult from './components/BacsResult';\nimport PayButton from '../internal/PayButton';\nimport { TxVariants } from '../tx-variants';\nimport { VoucherConfiguration } from '../internal/Voucher/types';\nimport { BacsElementData } from './types';\n\nclass BacsElement extends UIElement<VoucherConfiguration> {\n    public static type = TxVariants.directdebit_GB;\n\n    formatData(): BacsElementData {\n        return {\n            paymentMethod: {\n                type: BacsElement.type,\n                ...(this.state.data?.holderName && { holderName: this.state.data.holderName }),\n                ...(this.state.data?.bankAccountNumber && { bankAccountNumber: this.state.data.bankAccountNumber }),\n                ...(this.state.data?.bankLocationId && { bankLocationId: this.state.data.bankLocationId })\n            },\n            ...(this.state.data?.shopperEmail && { shopperEmail: this.state.data.shopperEmail })\n        };\n    }\n\n    get isValid(): boolean {\n        return !!this.state.isValid;\n    }\n\n    public payButton = props => {\n        return <PayButton amount={this.props.amount} onClick={this.submit} {...props} />;\n    };\n\n    render() {\n        return (\n            <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                {this.props.url ? (\n                    <BacsResult\n                        ref={ref => {\n                            this.componentRef = ref;\n                        }}\n                        icon={this.icon}\n                        url={this.props.url}\n                        paymentMethodType={this.props.paymentMethodType}\n                    />\n                ) : (\n                    <BacsInput\n                        // @ts-ignore ref is internal from the Component\n                        ref={ref => {\n                            this.componentRef = ref;\n                        }}\n                        {...this.props}\n                        onChange={this.setState}\n                        payButton={this.payButton}\n                        onSubmit={this.submit}\n                    />\n                )}\n            </CoreProvider>\n        );\n    }\n}\n\nexport default BacsElement;\n"],"names":["BacsElement","UIElement","static","TxVariants","directdebit_GB","formatData","paymentMethod","type","this","state","data","holderName","bankAccountNumber","bankLocationId","shopperEmail","isValid","payButton","props","h","PayButton","amount","onClick","submit","render","CoreProvider","i18n","loadingContext","resources","url","BacsResult","ref","componentRef","icon","paymentMethodType","BacsInput","onChange","setState","onSubmit"],"mappings":"0XAUA,MAAMA,UAAoBC,EACtBC,YAAqBC,EAAWC,eAEhCC,UAAAA,GACI,MAAO,CACHC,cAAe,CACXC,KAAMP,EAAYO,QACdC,KAAKC,MAAMC,MAAMC,YAAc,CAAEA,WAAYH,KAAKC,MAAMC,KAAKC,eAC7DH,KAAKC,MAAMC,MAAME,mBAAqB,CAAEA,kBAAmBJ,KAAKC,MAAMC,KAAKE,sBAC3EJ,KAAKC,MAAMC,MAAMG,gBAAkB,CAAEA,eAAgBL,KAAKC,MAAMC,KAAKG,oBAEzEL,KAAKC,MAAMC,MAAMI,cAAgB,CAAEA,aAAcN,KAAKC,MAAMC,KAAKI,cAE7E,CAEA,WAAIC,GACA,QAASP,KAAKC,MAAMM,OACxB,CAEOC,UAAYC,GACRC,EAACC,EAAAA,CAAUC,OAAQZ,KAAKS,MAAMG,OAAQC,QAASb,KAAKc,UAAYL,IAG3EM,MAAAA,GACI,OACIL,EAACM,EAAAA,CAAaC,KAAMjB,KAAKS,MAAMQ,KAAMC,eAAgBlB,KAAKS,MAAMS,eAAgBC,UAAWnB,KAAKmB,WAC3FnB,KAAKS,MAAMW,IACRV,EAACW,EAAAA,CACGC,IAAKA,IACDtB,KAAKuB,aAAeD,CAAAA,EAExBE,KAAMxB,KAAKwB,KACXJ,IAAKpB,KAAKS,MAAMW,IAChBK,kBAAmBzB,KAAKS,MAAMgB,oBAGlCf,EAACgB,EAAAA,CAEGJ,IAAKA,IACDtB,KAAKuB,aAAeD,CAAAA,KAEpBtB,KAAKS,MACTkB,SAAU3B,KAAK4B,SACfpB,UAAWR,KAAKQ,UAChBqB,SAAU7B,KAAKc,SAKnC"}

package/dist/es/components/BacsDD/components/BacsInput.js

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../external/preact/dist/preact.js";import{useState as a,useEffect as o}from"../../../external/preact/hooks/dist/hooks.js";import n from"../../../external/classnames/index.js";import{useCoreContext as t}from"../../../core/Context/CoreProvider.js";import r from"../../internal/FormFields/Field/Field.js";import c from"../../internal/FormFields/ConsentCheckbox/ConsentCheckbox.js";import{bacsFormatters as i,bacsValidationRules as s}from"./validate.js";import l from"../../../utils/useForm/useForm.js";import d from"../../../core/Context/useImage.js";import u from"../../internal/FormFields/InputText.js";import m from"../../internal/FormFields/InputEmail.js";import b from"../../internal/FormInstruction/FormInstruction.js";import{getErrorMessage as h}from"../../../utils/getErrorMessage.js";import{PREFIX as p}from"../../internal/Icon/constants.js";const k="enter-data",g="confirm-data";function f(f){const{i18n:N}=t(),_=d(),{handleChangeFor:C,triggerValidation:y,data:v,valid:I,errors:x,isValid:E}=l({schema:["holderName","bankAccountNumber","bankLocationId","shopperEmail","amountConsentCheckbox","accountConsentCheckbox"],defaultData:f.data,formatters:i,rules:s}),[F,j]=a(k);this.setStatus=j,this.showValidation=y;return o((()=>{f.onChange({data:v,valid:I,errors:x,isValid:E})}),[v,I,x,E]),e("div",{className:n({"adyen-checkout__bacs":!0,"adyen-checkout__bacs--confirm":F===g||"loading"===F})},f.showFormInstruction&&e(b,null),F==g&&e("div",{className:n({"adyen-checkout__bacs--edit":!0,"adyen-checkout__bacs--edit-dropin":f.isDropin})},e(u,{name:"bacsEdit",className:"adyen-checkout__bacs--edit-button",value:N.get("edit"),"aria-label":N.get("edit"),readonly:!0,onClick:()=>this.setStatus(k)})),e(r,{className:n({"adyen-checkout__bacs--holder-name":!0,"adyen-checkout__field--inactive":F===g||"loading"===F}),label:N.get("bacs.accountHolderName"),errorMessage:!!x.holderName&&N.get("bacs.accountHolderName.invalid"),isValid:I.holderName,name:"accountHolderName",i18n:N},e(u,{name:"bacs.accountHolderName",className:"adyen-checkout__bacs-input--holder-name",placeholder:f.placeholders.holderName,value:v.holderName,"aria-invalid":!I.holderName,"aria-label":N.get("bacs.accountHolderName"),"aria-required":"true",required:!0,readonly:F===g||"loading"===F,autocorrect:"off",onBlur:C("holderName","blur"),onInput:C("holderName","input")})),e("div",{className:"adyen-checkout__bacs__num-id adyen-checkout__field-wrapper"},e(r,{errorMessage:!!x.bankAccountNumber&&N.get("bacs.accountNumber.invalid"),label:N.get("bacs.accountNumber"),className:n({"adyen-checkout__bacs--bank-account-number":!0,"adyen-checkout__field--inactive":F===g||"loading"===F}),classNameModifiers:["col-70"],isValid:I.bankAccountNumber,name:"bankAccountNumber",i18n:N},e(u,{value:v.bankAccountNumber,className:"adyen-checkout__bacs-input--bank-account-number",placeholder:f.placeholders.bankAccountNumber,"aria-invalid":!I.bankAccountNumber,"aria-label":N.get("bacs.accountNumber"),"aria-required":"true",required:!0,readonly:F===g||"loading"===F,autocorrect:"off",onBlur:C("bankAccountNumber","blur"),onInput:C("bankAccountNumber","input")})),e(r,{errorMessage:!!x.bankLocationId&&N.get("bacs.bankLocationId.invalid"),label:N.get("bacs.bankLocationId"),className:n({"adyen-checkout__bacs--bank-location-id":!0,"adyen-checkout__field--inactive":F===g||"loading"===F}),classNameModifiers:["col-30"],isValid:I.bankLocationId,name:"bankLocationId",i18n:N},e(u,{value:v.bankLocationId,className:"adyen-checkout__bacs-input--bank-location-id",placeholder:f.placeholders.bankLocationId,"aria-invalid":!I.bankLocationId,"aria-label":N.get("bacs.bankLocationId"),"aria-required":"true",required:!0,readonly:F===g||"loading"===F,autocorrect:"off",onBlur:C("bankLocationId","blur"),onInput:C("bankLocationId","input")}))),e(r,{errorMessage:h(N,x.shopperEmail,N.get("shopperEmail")),label:N.get("shopperEmail"),className:n({"adyen-checkout__bacs--shopper-email":!0,"adyen-checkout__field--inactive":F===g||"loading"===F}),isValid:I.shopperEmail,name:"emailAddress",i18n:N},e(m,{value:v.shopperEmail,name:"shopperEmail",className:"adyen-checkout__bacs-input--shopper-email",classNameModifiers:["large"],placeholder:f.placeholders.shopperEmail,spellcheck:!1,"aria-invalid":!I.shopperEmail,"aria-label":N.get("shopperEmail"),"aria-required":"true",required:!0,readonly:F===g||"loading"===F,autocorrect:"off",onInput:C("shopperEmail","input"),onBlur:C("shopperEmail","blur")})),F===k&&e(c,{classNameModifiers:["amountConsentCheckbox"],errorMessage:!!x.amountConsentCheckbox,label:N.get("bacs.consent.amount"),onChange:C("amountConsentCheckbox"),checked:!!v.amountConsentCheckbox,i18n:N}),F===k&&e(c,{classNameModifiers:["accountConsentCheckbox"],errorMessage:!!x.accountConsentCheckbox,label:N.get("bacs.consent.account"),onChange:C("accountConsentCheckbox"),checked:!!v.accountConsentCheckbox,i18n:N}),f.showPayButton&&f.payButton({status:F,label:F===k?N.get("continue"):`${N.get("bacs.confirm")} ${f.amount?.value&&f.amount?.currency?N.amount(f.amount.value,f.amount.currency):""}`,icon:_({imageFolder:"components/"})(`${p}lock`),onClick:()=>E?F===k?this.setStatus(g):F===g?f.onSubmit():void 0:this.showValidation()}))}f.defaultProps={data:{},placeholders:{}};export{f as default};
+import{createElement as e}from"../../../external/preact/dist/preact.js";import{useState as a,useEffect as o}from"../../../external/preact/hooks/dist/hooks.js";import n from"../../../external/classnames/index.js";import{useCoreContext as t}from"../../../core/Context/CoreProvider.js";import c from"../../internal/FormFields/Field/Field.js";import r from"../../internal/FormFields/ConsentCheckbox/ConsentCheckbox.js";import{bacsFormatters as i,bacsValidationRules as s}from"./validate.js";import l from"../../../utils/useForm/useForm.js";import d from"../../../core/Context/useImage.js";import u from"../../internal/FormFields/InputText.js";import m from"../../internal/FormFields/InputEmail.js";import b from"../../internal/FormInstruction/FormInstruction.js";import{getErrorMessage as h}from"../../../utils/getErrorMessage.js";import{PREFIX as p}from"../../internal/Icon/constants.js";const k="enter-data",g="confirm-data";function f(f){const{i18n:N}=t(),_=d(),{handleChangeFor:C,triggerValidation:y,data:v,valid:I,errors:x,isValid:E}=l({schema:["holderName","bankAccountNumber","bankLocationId","shopperEmail","amountConsentCheckbox","accountConsentCheckbox"],defaultData:f.data,formatters:i,rules:s}),[F,j]=a(k);this.setStatus=j,this.showValidation=y;return o((()=>{f.onChange({data:v,valid:I,errors:x,isValid:E})}),[v,I,x,E]),e("div",{className:n({"adyen-checkout__bacs":!0,"adyen-checkout__bacs--confirm":F===g||"loading"===F})},e(b,null),F==g&&e("div",{className:n({"adyen-checkout__bacs--edit":!0,"adyen-checkout__bacs--edit-dropin":f.isDropin})},e(u,{name:"bacsEdit",className:"adyen-checkout__bacs--edit-button",value:N.get("edit"),"aria-label":N.get("edit"),readonly:!0,onClick:()=>this.setStatus(k)})),e(c,{className:n({"adyen-checkout__bacs--holder-name":!0,"adyen-checkout__field--inactive":F===g||"loading"===F}),label:N.get("bacs.accountHolderName"),errorMessage:!!x.holderName&&N.get("bacs.accountHolderName.invalid"),isValid:I.holderName,name:"accountHolderName",i18n:N},e(u,{name:"bacs.accountHolderName",className:"adyen-checkout__bacs-input--holder-name",placeholder:f.placeholders.holderName,value:v.holderName,"aria-invalid":!I.holderName,"aria-label":N.get("bacs.accountHolderName"),"aria-required":"true",required:!0,readonly:F===g||"loading"===F,autocorrect:"off",onBlur:C("holderName","blur"),onInput:C("holderName","input")})),e("div",{className:"adyen-checkout__bacs__num-id adyen-checkout__field-wrapper"},e(c,{errorMessage:!!x.bankAccountNumber&&N.get("bacs.accountNumber.invalid"),label:N.get("bacs.accountNumber"),className:n({"adyen-checkout__bacs--bank-account-number":!0,"adyen-checkout__field--inactive":F===g||"loading"===F}),classNameModifiers:["col-70"],isValid:I.bankAccountNumber,name:"bankAccountNumber",i18n:N},e(u,{value:v.bankAccountNumber,className:"adyen-checkout__bacs-input--bank-account-number",placeholder:f.placeholders.bankAccountNumber,"aria-invalid":!I.bankAccountNumber,"aria-label":N.get("bacs.accountNumber"),"aria-required":"true",required:!0,readonly:F===g||"loading"===F,autocorrect:"off",onBlur:C("bankAccountNumber","blur"),onInput:C("bankAccountNumber","input")})),e(c,{errorMessage:!!x.bankLocationId&&N.get("bacs.bankLocationId.invalid"),label:N.get("bacs.bankLocationId"),className:n({"adyen-checkout__bacs--bank-location-id":!0,"adyen-checkout__field--inactive":F===g||"loading"===F}),classNameModifiers:["col-30"],isValid:I.bankLocationId,name:"bankLocationId",i18n:N},e(u,{value:v.bankLocationId,className:"adyen-checkout__bacs-input--bank-location-id",placeholder:f.placeholders.bankLocationId,"aria-invalid":!I.bankLocationId,"aria-label":N.get("bacs.bankLocationId"),"aria-required":"true",required:!0,readonly:F===g||"loading"===F,autocorrect:"off",onBlur:C("bankLocationId","blur"),onInput:C("bankLocationId","input")}))),e(c,{errorMessage:h(N,x.shopperEmail,N.get("shopperEmail")),label:N.get("shopperEmail"),className:n({"adyen-checkout__bacs--shopper-email":!0,"adyen-checkout__field--inactive":F===g||"loading"===F}),isValid:I.shopperEmail,name:"emailAddress",i18n:N},e(m,{value:v.shopperEmail,name:"shopperEmail",className:"adyen-checkout__bacs-input--shopper-email",classNameModifiers:["large"],placeholder:f.placeholders.shopperEmail,spellcheck:!1,"aria-invalid":!I.shopperEmail,"aria-label":N.get("shopperEmail"),"aria-required":"true",required:!0,readonly:F===g||"loading"===F,autocorrect:"off",onInput:C("shopperEmail","input"),onBlur:C("shopperEmail","blur")})),F===k&&e(r,{classNameModifiers:["amountConsentCheckbox"],errorMessage:!!x.amountConsentCheckbox,label:N.get("bacs.consent.amount"),onChange:C("amountConsentCheckbox"),checked:!!v.amountConsentCheckbox,i18n:N}),F===k&&e(r,{classNameModifiers:["accountConsentCheckbox"],errorMessage:!!x.accountConsentCheckbox,label:N.get("bacs.consent.account"),onChange:C("accountConsentCheckbox"),checked:!!v.accountConsentCheckbox,i18n:N}),f.showPayButton&&f.payButton({status:F,label:F===k?N.get("continue"):`${N.get("bacs.confirm")} ${f.amount?.value&&f.amount?.currency?N.amount(f.amount.value,f.amount.currency):""}`,icon:_({imageFolder:"components/"})(`${p}lock`),onClick:()=>E?F===k?this.setStatus(g):F===g?f.onSubmit():void 0:this.showValidation()}))}f.defaultProps={data:{},placeholders:{}};export{f as default};
 //# sourceMappingURL=BacsInput.js.map

package/dist/es/components/BacsDD/components/BacsInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"BacsInput.js","sources":["../../../../../src/components/BacsDD/components/BacsInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useState, useEffect } from 'preact/hooks';\nimport classNames from 'classnames';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport Field from '../../internal/FormFields/Field';\nimport ConsentCheckbox from '../../internal/FormFields/ConsentCheckbox';\nimport { bacsValidationRules, bacsFormatters } from './validate';\nimport { BacsDataState, BacsInputProps } from './types';\nimport './BacsInput.scss';\n\nimport useForm from '../../../utils/useForm';\nimport useImage from '../../../core/Context/useImage';\nimport InputText from '../../internal/FormFields/InputText';\nimport InputEmail from '../../internal/FormFields/InputEmail';\nimport FormInstruction from '../../internal/FormInstruction';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport { PREFIX } from '../../internal/Icon/constants';\n\nconst ENTER_STATE = 'enter-data';\nconst CONFIRM_STATE = 'confirm-data';\n\nfunction BacsInput(props: BacsInputProps) {\n    const { i18n } = useCoreContext();\n    const getImage = useImage();\n\n    const { handleChangeFor, triggerValidation, data, valid, errors, isValid } = useForm<BacsDataState>({\n        schema: ['holderName', 'bankAccountNumber', 'bankLocationId', 'shopperEmail', 'amountConsentCheckbox', 'accountConsentCheckbox'],\n        defaultData: props.data,\n        formatters: bacsFormatters,\n        rules: bacsValidationRules\n    });\n\n    const [status, setStatus] = useState(ENTER_STATE);\n    this.setStatus = setStatus;\n    this.showValidation = triggerValidation;\n\n    const handlePayButton = () => {\n        if (!isValid) return this.showValidation();\n\n        if (status === ENTER_STATE) {\n            return this.setStatus(CONFIRM_STATE);\n        } else if (status === CONFIRM_STATE) {\n            return props.onSubmit();\n        }\n    };\n\n    const handleEdit = () => {\n        return this.setStatus(ENTER_STATE);\n    };\n\n    useEffect(() => {\n        props.onChange({ data, valid, errors, isValid });\n    }, [data, valid, errors, isValid]);\n\n    return (\n        <div\n            className={classNames({\n                'adyen-checkout__bacs': true,\n                'adyen-checkout__bacs--confirm': status === CONFIRM_STATE || status === 'loading'\n            })}\n        >\n            {props.showFormInstruction && <FormInstruction />}\n            {status == CONFIRM_STATE && (\n                <div\n                    className={classNames({\n                        'adyen-checkout__bacs--edit': true,\n                        'adyen-checkout__bacs--edit-dropin': props.isDropin\n                    })}\n                >\n                    <InputText\n                        name={'bacsEdit'}\n                        className={'adyen-checkout__bacs--edit-button'}\n                        value={i18n.get('edit')}\n                        aria-label={i18n.get('edit')}\n                        readonly={true}\n                        onClick={handleEdit}\n                    />\n                </div>\n            )}\n\n            <Field\n                className={classNames({\n                    'adyen-checkout__bacs--holder-name': true,\n                    'adyen-checkout__field--inactive': status === CONFIRM_STATE || status === 'loading'\n                })}\n                label={i18n.get('bacs.accountHolderName')}\n                errorMessage={errors.holderName ? i18n.get('bacs.accountHolderName.invalid') : false}\n                isValid={valid.holderName}\n                name={'accountHolderName'}\n                i18n={i18n}\n            >\n                <InputText\n                    name={'bacs.accountHolderName'}\n                    className={'adyen-checkout__bacs-input--holder-name'}\n                    placeholder={props.placeholders.holderName}\n                    value={data.holderName}\n                    aria-invalid={!valid.holderName}\n                    aria-label={i18n.get('bacs.accountHolderName')}\n                    aria-required={'true'}\n                    required={true}\n                    readonly={status === CONFIRM_STATE || status === 'loading'}\n                    autocorrect={'off'}\n                    onBlur={handleChangeFor('holderName', 'blur')}\n                    onInput={handleChangeFor('holderName', 'input')}\n                />\n            </Field>\n\n            <div className=\"adyen-checkout__bacs__num-id adyen-checkout__field-wrapper\">\n                <Field\n                    errorMessage={!!errors.bankAccountNumber && i18n.get('bacs.accountNumber.invalid')}\n                    label={i18n.get('bacs.accountNumber')}\n                    className={classNames({\n                        'adyen-checkout__bacs--bank-account-number': true,\n                        'adyen-checkout__field--inactive': status === CONFIRM_STATE || status === 'loading'\n                    })}\n                    classNameModifiers={['col-70']}\n                    isValid={valid.bankAccountNumber}\n                    name={'bankAccountNumber'}\n                    i18n={i18n}\n                >\n                    <InputText\n                        value={data.bankAccountNumber}\n                        className={'adyen-checkout__bacs-input--bank-account-number'}\n                        placeholder={props.placeholders.bankAccountNumber}\n                        aria-invalid={!valid.bankAccountNumber}\n                        aria-label={i18n.get('bacs.accountNumber')}\n                        aria-required={'true'}\n                        required={true}\n                        readonly={status === CONFIRM_STATE || status === 'loading'}\n                        autocorrect={'off'}\n                        onBlur={handleChangeFor('bankAccountNumber', 'blur')}\n                        onInput={handleChangeFor('bankAccountNumber', 'input')}\n                    />\n                </Field>\n\n                <Field\n                    errorMessage={!!errors.bankLocationId && i18n.get('bacs.bankLocationId.invalid')}\n                    label={i18n.get('bacs.bankLocationId')}\n                    className={classNames({\n                        'adyen-checkout__bacs--bank-location-id': true,\n                        'adyen-checkout__field--inactive': status === CONFIRM_STATE || status === 'loading'\n                    })}\n                    classNameModifiers={['col-30']}\n                    isValid={valid.bankLocationId}\n                    name={'bankLocationId'}\n                    i18n={i18n}\n                >\n                    <InputText\n                        value={data.bankLocationId}\n                        className={'adyen-checkout__bacs-input--bank-location-id'}\n                        placeholder={props.placeholders.bankLocationId}\n                        aria-invalid={!valid.bankLocationId}\n                        aria-label={i18n.get('bacs.bankLocationId')}\n                        aria-required={'true'}\n                        required={true}\n                        readonly={status === CONFIRM_STATE || status === 'loading'}\n                        autocorrect={'off'}\n                        onBlur={handleChangeFor('bankLocationId', 'blur')}\n                        onInput={handleChangeFor('bankLocationId', 'input')}\n                    />\n                </Field>\n            </div>\n\n            <Field\n                errorMessage={getErrorMessage(i18n, errors.shopperEmail, i18n.get('shopperEmail'))}\n                label={i18n.get('shopperEmail')}\n                className={classNames({\n                    'adyen-checkout__bacs--shopper-email': true,\n                    'adyen-checkout__field--inactive': status === CONFIRM_STATE || status === 'loading'\n                })}\n                isValid={valid.shopperEmail}\n                name={'emailAddress'}\n                i18n={i18n}\n            >\n                <InputEmail\n                    value={data.shopperEmail}\n                    name={'shopperEmail'}\n                    className={'adyen-checkout__bacs-input--shopper-email'}\n                    classNameModifiers={['large']}\n                    placeholder={props.placeholders.shopperEmail}\n                    spellcheck={false}\n                    aria-invalid={!valid.shopperEmail}\n                    aria-label={i18n.get('shopperEmail')}\n                    aria-required={'true'}\n                    required={true}\n                    readonly={status === CONFIRM_STATE || status === 'loading'}\n                    autocorrect={'off'}\n                    onInput={handleChangeFor('shopperEmail', 'input')}\n                    onBlur={handleChangeFor('shopperEmail', 'blur')}\n                />\n            </Field>\n\n            {status === ENTER_STATE && (\n                <ConsentCheckbox\n                    classNameModifiers={['amountConsentCheckbox']}\n                    errorMessage={!!errors.amountConsentCheckbox}\n                    label={i18n.get('bacs.consent.amount')}\n                    onChange={handleChangeFor('amountConsentCheckbox')}\n                    checked={!!data.amountConsentCheckbox}\n                    i18n={i18n}\n                />\n            )}\n\n            {status === ENTER_STATE && (\n                <ConsentCheckbox\n                    classNameModifiers={['accountConsentCheckbox']}\n                    errorMessage={!!errors.accountConsentCheckbox}\n                    label={i18n.get('bacs.consent.account')}\n                    onChange={handleChangeFor('accountConsentCheckbox')}\n                    checked={!!data.accountConsentCheckbox}\n                    i18n={i18n}\n                />\n            )}\n\n            {props.showPayButton &&\n                props.payButton({\n                    status,\n                    label:\n                        status === ENTER_STATE\n                            ? i18n.get('continue')\n                            : `${i18n.get('bacs.confirm')} ${\n                                  !!props.amount?.value && !!props.amount?.currency ? i18n.amount(props.amount.value, props.amount.currency) : ''\n                              }`,\n                    icon: getImage({ imageFolder: 'components/' })(`${PREFIX}lock`),\n                    onClick: handlePayButton\n                })}\n        </div>\n    );\n}\n\nBacsInput.defaultProps = {\n    data: {},\n    placeholders: {}\n};\n\nexport default BacsInput;\n"],"names":["ENTER_STATE","CONFIRM_STATE","BacsInput","props","i18n","useCoreContext","getImage","useImage","handleChangeFor","triggerValidation","data","valid","errors","isValid","useForm","schema","defaultData","formatters","bacsFormatters","rules","bacsValidationRules","status","setStatus","useState","this","showValidation","useEffect","onChange","h","div","className","classNames","showFormInstruction","FormInstruction","isDropin","InputText","name","value","get","aria-label","readonly","onClick","Field","label","errorMessage","holderName","placeholder","placeholders","aria-invalid","aria-required","required","autocorrect","onBlur","onInput","bankAccountNumber","classNameModifiers","bankLocationId","getErrorMessage","shopperEmail","InputEmail","spellcheck","ConsentCheckbox","amountConsentCheckbox","checked","accountConsentCheckbox","showPayButton","payButton","amount","currency","icon","imageFolder","PREFIX","onSubmit","defaultProps"],"mappings":"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"}
+{"version":3,"file":"BacsInput.js","sources":["../../../../../src/components/BacsDD/components/BacsInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useState, useEffect } from 'preact/hooks';\nimport classNames from 'classnames';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport Field from '../../internal/FormFields/Field';\nimport ConsentCheckbox from '../../internal/FormFields/ConsentCheckbox';\nimport { bacsValidationRules, bacsFormatters } from './validate';\nimport { BacsDataState, BacsInputProps } from './types';\nimport './BacsInput.scss';\n\nimport useForm from '../../../utils/useForm';\nimport useImage from '../../../core/Context/useImage';\nimport InputText from '../../internal/FormFields/InputText';\nimport InputEmail from '../../internal/FormFields/InputEmail';\nimport FormInstruction from '../../internal/FormInstruction';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport { PREFIX } from '../../internal/Icon/constants';\n\nconst ENTER_STATE = 'enter-data';\nconst CONFIRM_STATE = 'confirm-data';\n\nfunction BacsInput(props: BacsInputProps) {\n    const { i18n } = useCoreContext();\n    const getImage = useImage();\n\n    const { handleChangeFor, triggerValidation, data, valid, errors, isValid } = useForm<BacsDataState>({\n        schema: ['holderName', 'bankAccountNumber', 'bankLocationId', 'shopperEmail', 'amountConsentCheckbox', 'accountConsentCheckbox'],\n        defaultData: props.data,\n        formatters: bacsFormatters,\n        rules: bacsValidationRules\n    });\n\n    const [status, setStatus] = useState(ENTER_STATE);\n    this.setStatus = setStatus;\n    this.showValidation = triggerValidation;\n\n    const handlePayButton = () => {\n        if (!isValid) return this.showValidation();\n\n        if (status === ENTER_STATE) {\n            return this.setStatus(CONFIRM_STATE);\n        } else if (status === CONFIRM_STATE) {\n            return props.onSubmit();\n        }\n    };\n\n    const handleEdit = () => {\n        return this.setStatus(ENTER_STATE);\n    };\n\n    useEffect(() => {\n        props.onChange({ data, valid, errors, isValid });\n    }, [data, valid, errors, isValid]);\n\n    return (\n        <div\n            className={classNames({\n                'adyen-checkout__bacs': true,\n                'adyen-checkout__bacs--confirm': status === CONFIRM_STATE || status === 'loading'\n            })}\n        >\n            <FormInstruction />\n\n            {status == CONFIRM_STATE && (\n                <div\n                    className={classNames({\n                        'adyen-checkout__bacs--edit': true,\n                        'adyen-checkout__bacs--edit-dropin': props.isDropin\n                    })}\n                >\n                    <InputText\n                        name={'bacsEdit'}\n                        className={'adyen-checkout__bacs--edit-button'}\n                        value={i18n.get('edit')}\n                        aria-label={i18n.get('edit')}\n                        readonly={true}\n                        onClick={handleEdit}\n                    />\n                </div>\n            )}\n\n            <Field\n                className={classNames({\n                    'adyen-checkout__bacs--holder-name': true,\n                    'adyen-checkout__field--inactive': status === CONFIRM_STATE || status === 'loading'\n                })}\n                label={i18n.get('bacs.accountHolderName')}\n                errorMessage={errors.holderName ? i18n.get('bacs.accountHolderName.invalid') : false}\n                isValid={valid.holderName}\n                name={'accountHolderName'}\n                i18n={i18n}\n            >\n                <InputText\n                    name={'bacs.accountHolderName'}\n                    className={'adyen-checkout__bacs-input--holder-name'}\n                    placeholder={props.placeholders.holderName}\n                    value={data.holderName}\n                    aria-invalid={!valid.holderName}\n                    aria-label={i18n.get('bacs.accountHolderName')}\n                    aria-required={'true'}\n                    required={true}\n                    readonly={status === CONFIRM_STATE || status === 'loading'}\n                    autocorrect={'off'}\n                    onBlur={handleChangeFor('holderName', 'blur')}\n                    onInput={handleChangeFor('holderName', 'input')}\n                />\n            </Field>\n\n            <div className=\"adyen-checkout__bacs__num-id adyen-checkout__field-wrapper\">\n                <Field\n                    errorMessage={!!errors.bankAccountNumber && i18n.get('bacs.accountNumber.invalid')}\n                    label={i18n.get('bacs.accountNumber')}\n                    className={classNames({\n                        'adyen-checkout__bacs--bank-account-number': true,\n                        'adyen-checkout__field--inactive': status === CONFIRM_STATE || status === 'loading'\n                    })}\n                    classNameModifiers={['col-70']}\n                    isValid={valid.bankAccountNumber}\n                    name={'bankAccountNumber'}\n                    i18n={i18n}\n                >\n                    <InputText\n                        value={data.bankAccountNumber}\n                        className={'adyen-checkout__bacs-input--bank-account-number'}\n                        placeholder={props.placeholders.bankAccountNumber}\n                        aria-invalid={!valid.bankAccountNumber}\n                        aria-label={i18n.get('bacs.accountNumber')}\n                        aria-required={'true'}\n                        required={true}\n                        readonly={status === CONFIRM_STATE || status === 'loading'}\n                        autocorrect={'off'}\n                        onBlur={handleChangeFor('bankAccountNumber', 'blur')}\n                        onInput={handleChangeFor('bankAccountNumber', 'input')}\n                    />\n                </Field>\n\n                <Field\n                    errorMessage={!!errors.bankLocationId && i18n.get('bacs.bankLocationId.invalid')}\n                    label={i18n.get('bacs.bankLocationId')}\n                    className={classNames({\n                        'adyen-checkout__bacs--bank-location-id': true,\n                        'adyen-checkout__field--inactive': status === CONFIRM_STATE || status === 'loading'\n                    })}\n                    classNameModifiers={['col-30']}\n                    isValid={valid.bankLocationId}\n                    name={'bankLocationId'}\n                    i18n={i18n}\n                >\n                    <InputText\n                        value={data.bankLocationId}\n                        className={'adyen-checkout__bacs-input--bank-location-id'}\n                        placeholder={props.placeholders.bankLocationId}\n                        aria-invalid={!valid.bankLocationId}\n                        aria-label={i18n.get('bacs.bankLocationId')}\n                        aria-required={'true'}\n                        required={true}\n                        readonly={status === CONFIRM_STATE || status === 'loading'}\n                        autocorrect={'off'}\n                        onBlur={handleChangeFor('bankLocationId', 'blur')}\n                        onInput={handleChangeFor('bankLocationId', 'input')}\n                    />\n                </Field>\n            </div>\n\n            <Field\n                errorMessage={getErrorMessage(i18n, errors.shopperEmail, i18n.get('shopperEmail'))}\n                label={i18n.get('shopperEmail')}\n                className={classNames({\n                    'adyen-checkout__bacs--shopper-email': true,\n                    'adyen-checkout__field--inactive': status === CONFIRM_STATE || status === 'loading'\n                })}\n                isValid={valid.shopperEmail}\n                name={'emailAddress'}\n                i18n={i18n}\n            >\n                <InputEmail\n                    value={data.shopperEmail}\n                    name={'shopperEmail'}\n                    className={'adyen-checkout__bacs-input--shopper-email'}\n                    classNameModifiers={['large']}\n                    placeholder={props.placeholders.shopperEmail}\n                    spellcheck={false}\n                    aria-invalid={!valid.shopperEmail}\n                    aria-label={i18n.get('shopperEmail')}\n                    aria-required={'true'}\n                    required={true}\n                    readonly={status === CONFIRM_STATE || status === 'loading'}\n                    autocorrect={'off'}\n                    onInput={handleChangeFor('shopperEmail', 'input')}\n                    onBlur={handleChangeFor('shopperEmail', 'blur')}\n                />\n            </Field>\n\n            {status === ENTER_STATE && (\n                <ConsentCheckbox\n                    classNameModifiers={['amountConsentCheckbox']}\n                    errorMessage={!!errors.amountConsentCheckbox}\n                    label={i18n.get('bacs.consent.amount')}\n                    onChange={handleChangeFor('amountConsentCheckbox')}\n                    checked={!!data.amountConsentCheckbox}\n                    i18n={i18n}\n                />\n            )}\n\n            {status === ENTER_STATE && (\n                <ConsentCheckbox\n                    classNameModifiers={['accountConsentCheckbox']}\n                    errorMessage={!!errors.accountConsentCheckbox}\n                    label={i18n.get('bacs.consent.account')}\n                    onChange={handleChangeFor('accountConsentCheckbox')}\n                    checked={!!data.accountConsentCheckbox}\n                    i18n={i18n}\n                />\n            )}\n\n            {props.showPayButton &&\n                props.payButton({\n                    status,\n                    label:\n                        status === ENTER_STATE\n                            ? i18n.get('continue')\n                            : `${i18n.get('bacs.confirm')} ${\n                                  !!props.amount?.value && !!props.amount?.currency ? i18n.amount(props.amount.value, props.amount.currency) : ''\n                              }`,\n                    icon: getImage({ imageFolder: 'components/' })(`${PREFIX}lock`),\n                    onClick: handlePayButton\n                })}\n        </div>\n    );\n}\n\nBacsInput.defaultProps = {\n    data: {},\n    placeholders: {}\n};\n\nexport default BacsInput;\n"],"names":["ENTER_STATE","CONFIRM_STATE","BacsInput","props","i18n","useCoreContext","getImage","useImage","handleChangeFor","triggerValidation","data","valid","errors","isValid","useForm","schema","defaultData","formatters","bacsFormatters","rules","bacsValidationRules","status","setStatus","useState","this","showValidation","useEffect","onChange","h","div","className","classNames","FormInstruction","isDropin","InputText","name","value","get","aria-label","readonly","onClick","Field","label","errorMessage","holderName","placeholder","placeholders","aria-invalid","aria-required","required","autocorrect","onBlur","onInput","bankAccountNumber","classNameModifiers","bankLocationId","getErrorMessage","shopperEmail","InputEmail","spellcheck","ConsentCheckbox","amountConsentCheckbox","checked","accountConsentCheckbox","showPayButton","payButton","amount","currency","icon","imageFolder","PREFIX","onSubmit","defaultProps"],"mappings":"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"}

package/dist/es/components/BankTransfer/BankTransfer.js

@@ -1,2 +1,2 @@
-import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as s}from"../internal/UIElement/UIElement.js";import{CoreProvider as e}from"../../core/Context/CoreProvider.js";import r from"../internal/RedirectButton/RedirectButton.js";import o from"./components/BankTransferResult/BankTransferResult.js";import i from"./components/BankTransferInput/BankTransferInput.js";import{TxVariants as n}from"../tx-variants.js";class a extends s{static type=n.bankTransfer_IBAN;static defaultProps={showEmailAddress:!0};state={isValid:!this.props.showEmailAddress,data:{}};get isValid(){return!!this.state.isValid}formatData(){const{shopperEmail:t}=this.state.data;return{paymentMethod:{type:a.type},...t&&{shopperEmail:t}}}handleRef=t=>{this.componentRef=t};render(){return this.props.reference?t(e,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},t(o,{ref:this.handleRef,...this.props})):t(e,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},this.props.showEmailAddress&&t(i,{ref:this.handleRef,...this.props,onChange:this.setState}),this.props.showPayButton&&t(r,{...this.props,name:this.displayName,onSubmit:this.submit,payButton:this.payButton}))}}export{a as BankTransferElement,a as default};
+import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as s}from"../internal/UIElement/UIElement.js";import{CoreProvider as e}from"../../core/Context/CoreProvider.js";import r from"../internal/RedirectButton/RedirectButton.js";import o from"./components/BankTransferResult/BankTransferResult.js";import n from"./components/BankTransferInput/BankTransferInput.js";import{TxVariants as a}from"../tx-variants.js";class i extends s{static type=a.bankTransfer_IBAN;static defaultProps={showEmailAddress:!0};state={isValid:!this.props.showEmailAddress,data:{}};get isValid(){return!!this.state.isValid}formatData(){const{shopperEmail:t}=this.state.data;return{paymentMethod:{type:i.type},...t&&{shopperEmail:t}}}handleRef=t=>{this.componentRef=t};render(){return this.props.reference?t(e,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},t(o,{ref:this.handleRef,...this.props})):t(e,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},this.props.showEmailAddress&&t(n,{ref:this.handleRef,...this.props,onChange:this.setState}),t(r,{...this.props,showPayButton:this.props.showPayButton,name:this.displayName,onSubmit:this.submit,payButton:this.payButton}))}}export{i as BankTransferElement,i as default};
 //# sourceMappingURL=BankTransfer.js.map

package/dist/es/components/BankTransfer/BankTransfer.js.map

@@ -1 +1 @@
-{"version":3,"file":"BankTransfer.js","sources":["../../../../src/components/BankTransfer/BankTransfer.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport RedirectButton from '../internal/RedirectButton';\nimport { BankTransferConfiguration, BankTransferState } from './types';\nimport BankTransferResult from './components/BankTransferResult';\nimport BankTransferInput from './components/BankTransferInput';\nimport { TxVariants } from '../tx-variants';\n\nexport class BankTransferElement extends UIElement<BankTransferConfiguration> {\n    public static type = TxVariants.bankTransfer_IBAN;\n\n    public static defaultProps = {\n        showEmailAddress: true\n    };\n\n    // @ts-ignore Double check why state extends all props\n    public state: BankTransferState = {\n        isValid: !this.props.showEmailAddress,\n        data: {}\n    };\n\n    get isValid() {\n        return !!this.state.isValid;\n    }\n\n    /**\n     * Formats the component data output\n     */\n    formatData() {\n        const { shopperEmail } = this.state.data;\n\n        return {\n            paymentMethod: {\n                type: BankTransferElement.type\n            },\n            ...(shopperEmail && { shopperEmail })\n        };\n    }\n\n    private handleRef = ref => {\n        this.componentRef = ref;\n    };\n\n    render() {\n        if (this.props.reference) {\n            return (\n                <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                    <BankTransferResult ref={this.handleRef} {...this.props} />\n                </CoreProvider>\n            );\n        }\n\n        return (\n            <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                {this.props.showEmailAddress && <BankTransferInput ref={this.handleRef} {...this.props} onChange={this.setState} />}\n                {this.props.showPayButton && (\n                    <RedirectButton {...this.props} name={this.displayName} onSubmit={this.submit} payButton={this.payButton} />\n                )}\n            </CoreProvider>\n        );\n    }\n}\n\nexport default BankTransferElement;\n"],"names":["BankTransferElement","UIElement","static","TxVariants","bankTransfer_IBAN","showEmailAddress","state","isValid","this","props","data","formatData","shopperEmail","paymentMethod","type","handleRef","ref","componentRef","render","reference","h","CoreProvider","i18n","loadingContext","resources","BankTransferResult","BankTransferInput","onChange","setState","showPayButton","RedirectButton","name","displayName","onSubmit","submit","payButton"],"mappings":"ybASO,MAAMA,UAA4BC,EACrCC,YAAqBC,EAAWC,kBAEhCF,oBAA6B,CACzBG,kBAAkB,GAIfC,MAA2B,CAC9BC,SAAUC,KAAKC,MAAMJ,iBACrBK,KAAM,CAAC,GAGX,WAAIH,GACA,QAASC,KAAKF,MAAMC,OACxB,CAKAI,UAAAA,GACI,MAAMC,aAAEA,GAAiBJ,KAAKF,MAAMI,KAEpC,MAAO,CACHG,cAAe,CACXC,KAAMd,EAAoBc,SAE1BF,GAAgB,CAAEA,gBAE9B,CAEQG,UAAYC,IAChBR,KAAKS,aAAeD,CAAAA,EAGxBE,MAAAA,GACI,OAAIV,KAAKC,MAAMU,UAEPC,EAACC,EAAAA,CAAaC,KAAMd,KAAKC,MAAMa,KAAMC,eAAgBf,KAAKC,MAAMc,eAAgBC,UAAWhB,KAAKgB,WAC5FJ,EAACK,EAAAA,CAAmBT,IAAKR,KAAKO,aAAeP,KAAKC,SAM1DW,EAACC,EAAAA,CAAaC,KAAMd,KAAKC,MAAMa,KAAMC,eAAgBf,KAAKC,MAAMc,eAAgBC,UAAWhB,KAAKgB,WAC3FhB,KAAKC,MAAMJ,kBAAoBe,EAACM,EAAAA,CAAkBV,IAAKR,KAAKO,aAAeP,KAAKC,MAAOkB,SAAUnB,KAAKoB,WACtGpB,KAAKC,MAAMoB,eACRT,EAACU,EAAAA,IAAmBtB,KAAKC,MAAOsB,KAAMvB,KAAKwB,YAAaC,SAAUzB,KAAK0B,OAAQC,UAAW3B,KAAK2B,YAI/G"}
+{"version":3,"file":"BankTransfer.js","sources":["../../../../src/components/BankTransfer/BankTransfer.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport RedirectButton from '../internal/RedirectButton';\nimport { BankTransferConfiguration, BankTransferState } from './types';\nimport BankTransferResult from './components/BankTransferResult';\nimport BankTransferInput from './components/BankTransferInput';\nimport { TxVariants } from '../tx-variants';\n\nexport class BankTransferElement extends UIElement<BankTransferConfiguration> {\n    public static type = TxVariants.bankTransfer_IBAN;\n\n    public static defaultProps = {\n        showEmailAddress: true\n    };\n\n    // @ts-ignore Double check why state extends all props\n    public state: BankTransferState = {\n        isValid: !this.props.showEmailAddress,\n        data: {}\n    };\n\n    get isValid() {\n        return !!this.state.isValid;\n    }\n\n    /**\n     * Formats the component data output\n     */\n    formatData() {\n        const { shopperEmail } = this.state.data;\n\n        return {\n            paymentMethod: {\n                type: BankTransferElement.type\n            },\n            ...(shopperEmail && { shopperEmail })\n        };\n    }\n\n    private handleRef = ref => {\n        this.componentRef = ref;\n    };\n\n    render() {\n        if (this.props.reference) {\n            return (\n                <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                    <BankTransferResult ref={this.handleRef} {...this.props} />\n                </CoreProvider>\n            );\n        }\n\n        return (\n            <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                {this.props.showEmailAddress && <BankTransferInput ref={this.handleRef} {...this.props} onChange={this.setState} />}\n                <RedirectButton\n                    {...this.props}\n                    showPayButton={this.props.showPayButton}\n                    name={this.displayName}\n                    onSubmit={this.submit}\n                    payButton={this.payButton}\n                />\n            </CoreProvider>\n        );\n    }\n}\n\nexport default BankTransferElement;\n"],"names":["BankTransferElement","UIElement","static","TxVariants","bankTransfer_IBAN","showEmailAddress","state","isValid","this","props","data","formatData","shopperEmail","paymentMethod","type","handleRef","ref","componentRef","render","reference","h","CoreProvider","i18n","loadingContext","resources","BankTransferResult","BankTransferInput","onChange","setState","RedirectButton","showPayButton","name","displayName","onSubmit","submit","payButton"],"mappings":"ybASO,MAAMA,UAA4BC,EACrCC,YAAqBC,EAAWC,kBAEhCF,oBAA6B,CACzBG,kBAAkB,GAIfC,MAA2B,CAC9BC,SAAUC,KAAKC,MAAMJ,iBACrBK,KAAM,CAAC,GAGX,WAAIH,GACA,QAASC,KAAKF,MAAMC,OACxB,CAKAI,UAAAA,GACI,MAAMC,aAAEA,GAAiBJ,KAAKF,MAAMI,KAEpC,MAAO,CACHG,cAAe,CACXC,KAAMd,EAAoBc,SAE1BF,GAAgB,CAAEA,gBAE9B,CAEQG,UAAYC,IAChBR,KAAKS,aAAeD,CAAAA,EAGxBE,MAAAA,GACI,OAAIV,KAAKC,MAAMU,UAEPC,EAACC,EAAAA,CAAaC,KAAMd,KAAKC,MAAMa,KAAMC,eAAgBf,KAAKC,MAAMc,eAAgBC,UAAWhB,KAAKgB,WAC5FJ,EAACK,EAAAA,CAAmBT,IAAKR,KAAKO,aAAeP,KAAKC,SAM1DW,EAACC,EAAAA,CAAaC,KAAMd,KAAKC,MAAMa,KAAMC,eAAgBf,KAAKC,MAAMc,eAAgBC,UAAWhB,KAAKgB,WAC3FhB,KAAKC,MAAMJ,kBAAoBe,EAACM,EAAAA,CAAkBV,IAAKR,KAAKO,aAAeP,KAAKC,MAAOkB,SAAUnB,KAAKoB,WACvGR,EAACS,EAAAA,IACOrB,KAAKC,MACTqB,cAAetB,KAAKC,MAAMqB,cAC1BC,KAAMvB,KAAKwB,YACXC,SAAUzB,KAAK0B,OACfC,UAAW3B,KAAK2B,YAIhC"}

package/dist/es/components/Blik/Blik.js

@@ -1,2 +1,2 @@
-import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as e}from"../internal/UIElement/UIElement.js";import o from"./components/BlikInput.js";import s from"../internal/Await/Await.js";import{CoreProvider as r}from"../../core/Context/CoreProvider.js";import i from"./config.js";import n from"../internal/RedirectButton/RedirectButton.js";import p from"../../core/Errors/SRPanelProvider.js";import{TxVariants as a}from"../tx-variants.js";class m extends e{static type=a.blik;formatData(){const t=!!this.props.storedPaymentMethodId;return{paymentMethod:{type:m.type,...!t&&{blikCode:this.state?.data?.blikCode},...t&&{storedPaymentMethodId:this.props.storedPaymentMethodId}}}}get isValid(){return!!this.props.storedPaymentMethodId||!!this.state.isValid}get displayName(){return this.props.storedPaymentMethodId&&this.props.label?this.props.label:this.props.name}get additionalInfo(){return this.props.storedPaymentMethodId&&this.props.label?this.props.name:null}render(){return this.props.paymentData?t(r,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},t(p,{srPanel:this.props.modules.srPanel},t(s,{ref:t=>{this.componentRef=t},clientKey:this.props.clientKey,paymentData:this.props.paymentData,onError:this.handleError,onComplete:this.onComplete,brandLogo:this.icon,type:i.type,messageText:this.props.i18n.get(i.messageTextId),awaitText:this.props.i18n.get(i.awaitTextId),showCountdownTimer:i.showCountdownTimer,delay:i.STATUS_INTERVAL,countdownTime:i.COUNTDOWN_MINUTES,throttleTime:i.THROTTLE_TIME,throttleInterval:i.THROTTLE_INTERVAL,onActionHandled:this.props.onActionHandled}))):t(r,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},this.props.storedPaymentMethodId?t(n,{name:this.displayName,amount:this.props.amount,payButton:this.payButton,onSubmit:this.submit,ref:t=>{this.componentRef=t}}):t(o,{ref:t=>{this.componentRef=t},...this.props,onChange:this.setState,onSubmit:this.submit,payButton:this.payButton}))}}export{m as default};
+import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as e}from"../internal/UIElement/UIElement.js";import o from"./components/BlikInput.js";import s from"../internal/Await/Await.js";import{CoreProvider as r}from"../../core/Context/CoreProvider.js";import i from"./config.js";import n from"../internal/RedirectButton/RedirectButton.js";import p from"../../core/Errors/SRPanelProvider.js";import{TxVariants as a}from"../tx-variants.js";class h extends e{static type=a.blik;formatData(){const t=!!this.props.storedPaymentMethodId;return{paymentMethod:{type:h.type,...!t&&{blikCode:this.state?.data?.blikCode},...t&&{storedPaymentMethodId:this.props.storedPaymentMethodId}}}}get isValid(){return!!this.props.storedPaymentMethodId||!!this.state.isValid}get displayName(){return this.props.storedPaymentMethodId&&this.props.label?this.props.label:this.props.name}get additionalInfo(){return this.props.storedPaymentMethodId&&this.props.label?this.props.name:null}render(){return this.props.paymentData?t(r,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},t(p,{srPanel:this.props.modules.srPanel},t(s,{ref:t=>{this.componentRef=t},clientKey:this.props.clientKey,paymentData:this.props.paymentData,onError:this.handleError,onComplete:this.onComplete,brandLogo:this.icon,type:i.type,messageText:this.props.i18n.get(i.messageTextId),awaitText:this.props.i18n.get(i.awaitTextId),showCountdownTimer:i.showCountdownTimer,delay:i.STATUS_INTERVAL,countdownTime:i.COUNTDOWN_MINUTES,throttleTime:i.THROTTLE_TIME,throttleInterval:i.THROTTLE_INTERVAL,onActionHandled:this.props.onActionHandled}))):t(r,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},this.props.storedPaymentMethodId?t(n,{showPayButton:this.props.showPayButton,name:this.displayName,amount:this.props.amount,payButton:this.payButton,onSubmit:this.submit,ref:t=>{this.componentRef=t}}):t(o,{ref:t=>{this.componentRef=t},...this.props,onChange:this.setState,onSubmit:this.submit,payButton:this.payButton}))}}export{h as default};
 //# sourceMappingURL=Blik.js.map

package/dist/es/components/Blik/Blik.js.map

@@ -1 +1 @@
-{"version":3,"file":"Blik.js","sources":["../../../../src/components/Blik/Blik.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport BlikInput from '../../components/Blik/components/BlikInput';\nimport Await from '../internal/Await';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport config from './config';\nimport RedirectButton from '../../components/internal/RedirectButton';\nimport SRPanelProvider from '../../core/Errors/SRPanelProvider';\nimport { TxVariants } from '../tx-variants';\nimport { AwaitConfiguration } from '../internal/Await/types';\n\ninterface BlikElementData {\n    paymentMethod: {\n        type: string;\n        blikCode: string;\n    };\n}\n\nclass BlikElement extends UIElement<AwaitConfiguration> {\n    public static type = TxVariants.blik;\n\n    formatData(): BlikElementData {\n        const recurringPayment = !!this.props.storedPaymentMethodId;\n\n        return {\n            paymentMethod: {\n                type: BlikElement.type,\n                ...(!recurringPayment && { blikCode: this.state?.data?.blikCode }),\n                ...(recurringPayment && { storedPaymentMethodId: this.props.storedPaymentMethodId })\n            }\n        };\n    }\n\n    get isValid(): boolean {\n        if (this.props.storedPaymentMethodId) {\n            return true;\n        }\n\n        return !!this.state.isValid;\n    }\n\n    get displayName() {\n        if (this.props.storedPaymentMethodId && this.props.label) {\n            return this.props.label;\n        }\n        return this.props.name;\n    }\n\n    get additionalInfo() {\n        if (this.props.storedPaymentMethodId && this.props.label) {\n            return this.props.name;\n        }\n        return null;\n    }\n\n    /**\n     * NOTE: for future reference:\n     *  this.props.onComplete (which is called from this.onComplete) equates to the merchant defined onAdditionalDetails callback\n     *  (the initial /payments response defines an \"await\" action, actionTypes.ts translates this to \"onComplete: props.onAdditionalDetails\")\n     */\n    render() {\n        if (this.props.paymentData) {\n            return (\n                <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                    <SRPanelProvider srPanel={this.props.modules.srPanel}>\n                        <Await\n                            ref={ref => {\n                                this.componentRef = ref;\n                            }}\n                            clientKey={this.props.clientKey}\n                            paymentData={this.props.paymentData}\n                            onError={this.handleError}\n                            onComplete={this.onComplete}\n                            brandLogo={this.icon}\n                            type={config.type}\n                            messageText={this.props.i18n.get(config.messageTextId)}\n                            awaitText={this.props.i18n.get(config.awaitTextId)}\n                            showCountdownTimer={config.showCountdownTimer}\n                            delay={config.STATUS_INTERVAL}\n                            countdownTime={config.COUNTDOWN_MINUTES}\n                            throttleTime={config.THROTTLE_TIME}\n                            throttleInterval={config.THROTTLE_INTERVAL}\n                            onActionHandled={this.props.onActionHandled}\n                        />\n                    </SRPanelProvider>\n                </CoreProvider>\n            );\n        }\n\n        return (\n            <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                {this.props.storedPaymentMethodId ? (\n                    <RedirectButton\n                        name={this.displayName}\n                        amount={this.props.amount}\n                        payButton={this.payButton}\n                        onSubmit={this.submit}\n                        ref={ref => {\n                            this.componentRef = ref;\n                        }}\n                    />\n                ) : (\n                    <BlikInput\n                        // @ts-ignore Ref is used by preact component\n                        ref={ref => {\n                            this.componentRef = ref;\n                        }}\n                        {...this.props}\n                        onChange={this.setState}\n                        onSubmit={this.submit}\n                        payButton={this.payButton}\n                    />\n                )}\n            </CoreProvider>\n        );\n    }\n}\n\nexport default BlikElement;\n"],"names":["BlikElement","UIElement","static","TxVariants","blik","formatData","recurringPayment","this","props","storedPaymentMethodId","paymentMethod","type","blikCode","state","data","isValid","displayName","label","name","additionalInfo","render","paymentData","h","CoreProvider","i18n","loadingContext","resources","SRPanelProvider","srPanel","modules","Await","ref","componentRef","clientKey","onError","handleError","onComplete","brandLogo","icon","config","messageText","get","messageTextId","awaitText","awaitTextId","showCountdownTimer","delay","STATUS_INTERVAL","countdownTime","COUNTDOWN_MINUTES","throttleTime","THROTTLE_TIME","throttleInterval","THROTTLE_INTERVAL","onActionHandled","RedirectButton","amount","payButton","onSubmit","submit","BlikInput","onChange","setState"],"mappings":"mdAkBA,MAAMA,UAAoBC,EACtBC,YAAqBC,EAAWC,KAEhCC,UAAAA,GACI,MAAMC,IAAqBC,KAAKC,MAAMC,sBAEtC,MAAO,CACHC,cAAe,CACXC,KAAMX,EAAYW,SACbL,GAAoB,CAAEM,SAAUL,KAAKM,OAAOC,MAAMF,aACnDN,GAAoB,CAAEG,sBAAuBF,KAAKC,MAAMC,wBAGxE,CAEA,WAAIM,GACA,QAAIR,KAAKC,MAAMC,yBAINF,KAAKM,MAAME,OACxB,CAEA,eAAIC,GACA,OAAIT,KAAKC,MAAMC,uBAAyBF,KAAKC,MAAMS,MACxCV,KAAKC,MAAMS,MAEfV,KAAKC,MAAMU,IACtB,CAEA,kBAAIC,GACA,OAAIZ,KAAKC,MAAMC,uBAAyBF,KAAKC,MAAMS,MACxCV,KAAKC,MAAMU,KAEf,IACX,CAOAE,MAAAA,GACI,OAAIb,KAAKC,MAAMa,YAEPC,EAACC,EAAAA,CAAaC,KAAMjB,KAAKC,MAAMgB,KAAMC,eAAgBlB,KAAKC,MAAMiB,eAAgBC,UAAWnB,KAAKmB,WAC5FJ,EAACK,EAAAA,CAAgBC,QAASrB,KAAKC,MAAMqB,QAAQD,SACzCN,EAACQ,EAAAA,CACGC,IAAKA,IACDxB,KAAKyB,aAAeD,CAAAA,EAExBE,UAAW1B,KAAKC,MAAMyB,UACtBZ,YAAad,KAAKC,MAAMa,YACxBa,QAAS3B,KAAK4B,YACdC,WAAY7B,KAAK6B,WACjBC,UAAW9B,KAAK+B,KAChB3B,KAAM4B,EAAO5B,KACb6B,YAAajC,KAAKC,MAAMgB,KAAKiB,IAAIF,EAAOG,eACxCC,UAAWpC,KAAKC,MAAMgB,KAAKiB,IAAIF,EAAOK,aACtCC,mBAAoBN,EAAOM,mBAC3BC,MAAOP,EAAOQ,gBACdC,cAAeT,EAAOU,kBACtBC,aAAcX,EAAOY,cACrBC,iBAAkBb,EAAOc,kBACzBC,gBAAiB/C,KAAKC,MAAM8C,oBAQ5ChC,EAACC,EAAAA,CAAaC,KAAMjB,KAAKC,MAAMgB,KAAMC,eAAgBlB,KAAKC,MAAMiB,eAAgBC,UAAWnB,KAAKmB,WAC3FnB,KAAKC,MAAMC,sBACRa,EAACiC,EAAAA,CACGrC,KAAMX,KAAKS,YACXwC,OAAQjD,KAAKC,MAAMgD,OACnBC,UAAWlD,KAAKkD,UAChBC,SAAUnD,KAAKoD,OACf5B,IAAKA,IACDxB,KAAKyB,aAAeD,CAAAA,IAI5BT,EAACsC,EAAAA,CAEG7B,IAAKA,IACDxB,KAAKyB,aAAeD,CAAAA,KAEpBxB,KAAKC,MACTqD,SAAUtD,KAAKuD,SACfJ,SAAUnD,KAAKoD,OACfF,UAAWlD,KAAKkD,YAKpC"}
+{"version":3,"file":"Blik.js","sources":["../../../../src/components/Blik/Blik.tsx"],"sourcesContent":["import { h } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport BlikInput from '../../components/Blik/components/BlikInput';\nimport Await from '../internal/Await';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport config from './config';\nimport RedirectButton from '../../components/internal/RedirectButton';\nimport SRPanelProvider from '../../core/Errors/SRPanelProvider';\nimport { TxVariants } from '../tx-variants';\nimport { AwaitConfiguration } from '../internal/Await/types';\n\ninterface BlikElementData {\n    paymentMethod: {\n        type: string;\n        blikCode: string;\n    };\n}\n\nclass BlikElement extends UIElement<AwaitConfiguration> {\n    public static type = TxVariants.blik;\n\n    formatData(): BlikElementData {\n        const recurringPayment = !!this.props.storedPaymentMethodId;\n\n        return {\n            paymentMethod: {\n                type: BlikElement.type,\n                ...(!recurringPayment && { blikCode: this.state?.data?.blikCode }),\n                ...(recurringPayment && { storedPaymentMethodId: this.props.storedPaymentMethodId })\n            }\n        };\n    }\n\n    get isValid(): boolean {\n        if (this.props.storedPaymentMethodId) {\n            return true;\n        }\n\n        return !!this.state.isValid;\n    }\n\n    get displayName() {\n        if (this.props.storedPaymentMethodId && this.props.label) {\n            return this.props.label;\n        }\n        return this.props.name;\n    }\n\n    get additionalInfo() {\n        if (this.props.storedPaymentMethodId && this.props.label) {\n            return this.props.name;\n        }\n        return null;\n    }\n\n    /**\n     * NOTE: for future reference:\n     *  this.props.onComplete (which is called from this.onComplete) equates to the merchant defined onAdditionalDetails callback\n     *  (the initial /payments response defines an \"await\" action, actionTypes.ts translates this to \"onComplete: props.onAdditionalDetails\")\n     */\n    render() {\n        if (this.props.paymentData) {\n            return (\n                <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                    <SRPanelProvider srPanel={this.props.modules.srPanel}>\n                        <Await\n                            ref={ref => {\n                                this.componentRef = ref;\n                            }}\n                            clientKey={this.props.clientKey}\n                            paymentData={this.props.paymentData}\n                            onError={this.handleError}\n                            onComplete={this.onComplete}\n                            brandLogo={this.icon}\n                            type={config.type}\n                            messageText={this.props.i18n.get(config.messageTextId)}\n                            awaitText={this.props.i18n.get(config.awaitTextId)}\n                            showCountdownTimer={config.showCountdownTimer}\n                            delay={config.STATUS_INTERVAL}\n                            countdownTime={config.COUNTDOWN_MINUTES}\n                            throttleTime={config.THROTTLE_TIME}\n                            throttleInterval={config.THROTTLE_INTERVAL}\n                            onActionHandled={this.props.onActionHandled}\n                        />\n                    </SRPanelProvider>\n                </CoreProvider>\n            );\n        }\n\n        return (\n            <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n                {this.props.storedPaymentMethodId ? (\n                    <RedirectButton\n                        showPayButton={this.props.showPayButton}\n                        name={this.displayName}\n                        amount={this.props.amount}\n                        payButton={this.payButton}\n                        onSubmit={this.submit}\n                        ref={ref => {\n                            this.componentRef = ref;\n                        }}\n                    />\n                ) : (\n                    <BlikInput\n                        // @ts-ignore Ref is used by preact component\n                        ref={ref => {\n                            this.componentRef = ref;\n                        }}\n                        {...this.props}\n                        onChange={this.setState}\n                        onSubmit={this.submit}\n                        payButton={this.payButton}\n                    />\n                )}\n            </CoreProvider>\n        );\n    }\n}\n\nexport default BlikElement;\n"],"names":["BlikElement","UIElement","static","TxVariants","blik","formatData","recurringPayment","this","props","storedPaymentMethodId","paymentMethod","type","blikCode","state","data","isValid","displayName","label","name","additionalInfo","render","paymentData","h","CoreProvider","i18n","loadingContext","resources","SRPanelProvider","srPanel","modules","Await","ref","componentRef","clientKey","onError","handleError","onComplete","brandLogo","icon","config","messageText","get","messageTextId","awaitText","awaitTextId","showCountdownTimer","delay","STATUS_INTERVAL","countdownTime","COUNTDOWN_MINUTES","throttleTime","THROTTLE_TIME","throttleInterval","THROTTLE_INTERVAL","onActionHandled","RedirectButton","showPayButton","amount","payButton","onSubmit","submit","BlikInput","onChange","setState"],"mappings":"mdAkBA,MAAMA,UAAoBC,EACtBC,YAAqBC,EAAWC,KAEhCC,UAAAA,GACI,MAAMC,IAAqBC,KAAKC,MAAMC,sBAEtC,MAAO,CACHC,cAAe,CACXC,KAAMX,EAAYW,SACbL,GAAoB,CAAEM,SAAUL,KAAKM,OAAOC,MAAMF,aACnDN,GAAoB,CAAEG,sBAAuBF,KAAKC,MAAMC,wBAGxE,CAEA,WAAIM,GACA,QAAIR,KAAKC,MAAMC,yBAINF,KAAKM,MAAME,OACxB,CAEA,eAAIC,GACA,OAAIT,KAAKC,MAAMC,uBAAyBF,KAAKC,MAAMS,MACxCV,KAAKC,MAAMS,MAEfV,KAAKC,MAAMU,IACtB,CAEA,kBAAIC,GACA,OAAIZ,KAAKC,MAAMC,uBAAyBF,KAAKC,MAAMS,MACxCV,KAAKC,MAAMU,KAEf,IACX,CAOAE,MAAAA,GACI,OAAIb,KAAKC,MAAMa,YAEPC,EAACC,EAAAA,CAAaC,KAAMjB,KAAKC,MAAMgB,KAAMC,eAAgBlB,KAAKC,MAAMiB,eAAgBC,UAAWnB,KAAKmB,WAC5FJ,EAACK,EAAAA,CAAgBC,QAASrB,KAAKC,MAAMqB,QAAQD,SACzCN,EAACQ,EAAAA,CACGC,IAAKA,IACDxB,KAAKyB,aAAeD,CAAAA,EAExBE,UAAW1B,KAAKC,MAAMyB,UACtBZ,YAAad,KAAKC,MAAMa,YACxBa,QAAS3B,KAAK4B,YACdC,WAAY7B,KAAK6B,WACjBC,UAAW9B,KAAK+B,KAChB3B,KAAM4B,EAAO5B,KACb6B,YAAajC,KAAKC,MAAMgB,KAAKiB,IAAIF,EAAOG,eACxCC,UAAWpC,KAAKC,MAAMgB,KAAKiB,IAAIF,EAAOK,aACtCC,mBAAoBN,EAAOM,mBAC3BC,MAAOP,EAAOQ,gBACdC,cAAeT,EAAOU,kBACtBC,aAAcX,EAAOY,cACrBC,iBAAkBb,EAAOc,kBACzBC,gBAAiB/C,KAAKC,MAAM8C,oBAQ5ChC,EAACC,EAAAA,CAAaC,KAAMjB,KAAKC,MAAMgB,KAAMC,eAAgBlB,KAAKC,MAAMiB,eAAgBC,UAAWnB,KAAKmB,WAC3FnB,KAAKC,MAAMC,sBACRa,EAACiC,EAAAA,CACGC,cAAejD,KAAKC,MAAMgD,cAC1BtC,KAAMX,KAAKS,YACXyC,OAAQlD,KAAKC,MAAMiD,OACnBC,UAAWnD,KAAKmD,UAChBC,SAAUpD,KAAKqD,OACf7B,IAAKA,IACDxB,KAAKyB,aAAeD,CAAAA,IAI5BT,EAACuC,EAAAA,CAEG9B,IAAKA,IACDxB,KAAKyB,aAAeD,CAAAA,KAEpBxB,KAAKC,MACTsD,SAAUvD,KAAKwD,SACfJ,SAAUpD,KAAKqD,OACfF,UAAWnD,KAAKmD,YAKpC"}

package/dist/es/components/Blik/components/BlikInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"BlikInput.js","sources":["../../../../../src/components/Blik/components/BlikInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useState, useEffect } from 'preact/hooks';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport Field from '../../internal/FormFields/Field';\nimport './BlikInput.scss';\nimport useForm from '../../../utils/useForm';\nimport { digitsOnlyFormatter } from '../../../utils/Formatters/formatters';\nimport useImage from '../../../core/Context/useImage';\nimport InputText from '../../internal/FormFields/InputText';\nimport { UIElementProps } from '../../internal/UIElement/types';\nimport { PREFIX } from '../../internal/Icon/constants';\n\ninterface BlikInputProps extends UIElementProps {\n    data?: BlikInputDataState;\n    placeholders?: BlikInputDataState;\n}\n\ninterface BlikInputDataState {\n    blikCode: string;\n}\n\nfunction BlikInput(props: BlikInputProps) {\n    const { i18n } = useCoreContext();\n    const getImage = useImage();\n    const { handleChangeFor, triggerValidation, data, valid, errors, isValid } = useForm<BlikInputDataState>({\n        schema: ['blikCode'],\n        rules: {\n            blikCode: {\n                validate: code => code?.length === 6,\n                errorMessage: 'blik.invalid',\n                modes: ['blur']\n            }\n        },\n        formatters: {\n            blikCode: digitsOnlyFormatter\n        }\n    });\n\n    useEffect(() => {\n        props.onChange({ data, errors, valid, isValid }, this);\n    }, [data, valid, errors, isValid]);\n\n    const [status, setStatus] = useState('ready');\n    this.setStatus = setStatus;\n    this.showValidation = triggerValidation;\n\n    return (\n        <div className=\"adyen-checkout__blik\">\n            <p className=\"adyen-checkout__blik__helper\">{i18n.get('blik.help')}</p>\n            <Field\n                errorMessage={!!errors.blikCode && i18n.get(errors.blikCode.errorMessage)}\n                label={i18n.get('blik.code')}\n                classNameModifiers={['blikCode', '50']}\n                isValid={valid.blikCode}\n                dir={'ltr'}\n                name={'blikCode'}\n            >\n                <InputText\n                    value={data.blikCode}\n                    name={'blikCode'}\n                    spellcheck={false}\n                    required={true}\n                    autocorrect={'off'}\n                    autocomplete={'off'}\n                    onInput={handleChangeFor('blikCode', 'input')}\n                    onBlur={handleChangeFor('blikCode', 'blur')}\n                    placeholder={props?.placeholders?.blikCode}\n                    inputMode={'numeric'}\n                    maxLength={6}\n                />\n            </Field>\n\n            {props.showPayButton &&\n                props.payButton({\n                    status,\n                    icon: getImage({ imageFolder: 'components/' })(`${PREFIX}lock`)\n                })}\n        </div>\n    );\n}\n\nBlikInput.defaultProps = { data: { blikCode: '' } };\n\nexport default BlikInput;\n"],"names":["BlikInput","props","i18n","useCoreContext","getImage","useImage","handleChangeFor","triggerValidation","data","valid","errors","isValid","useForm","schema","rules","blikCode","validate","code","length","errorMessage","modes","formatters","digitsOnlyFormatter","useEffect","onChange","this","status","setStatus","useState","showValidation","h","div","className","p","get","Field","label","classNameModifiers","dir","name","InputText","value","spellcheck","required","autocorrect","autocomplete","onInput","onBlur","placeholder","placeholders","inputMode","maxLength","showPayButton","payButton","icon","imageFolder","PREFIX","defaultProps"],"mappings":"8jBAqBA,SAASA,EAAUC,GACf,MAAMC,KAAEA,GAASC,IACXC,EAAWC,KACXC,gBAAEA,EAAeC,kBAAEA,EAAiBC,KAAEA,EAAIC,MAAEA,EAAKC,OAAEA,EAAMC,QAAEA,GAAYC,EAA4B,CACrGC,OAAQ,CAAC,YACTC,MAAO,CACHC,SAAU,CACNC,SAAUC,GAAyB,IAAjBA,GAAMC,OACxBC,aAAc,eACdC,MAAO,CAAC,UAGhBC,WAAY,CACRN,SAAUO,KAIlBC,GAAU,KACNtB,EAAMuB,SAAS,CAAEhB,OAAME,SAAQD,QAAOE,WAAWc,KAAI,GACtD,CAACjB,EAAMC,EAAOC,EAAQC,IAEzB,MAAOe,EAAQC,GAAaC,EAAS,SAIrC,OAHAH,KAAKE,UAAYA,EACjBF,KAAKI,eAAiBtB,EAGlBuB,EAACC,MAAAA,CAAIC,UAAU,wBACXF,EAACG,IAAAA,CAAED,UAAU,gCAAgC9B,EAAKgC,IAAI,cACtDJ,EAACK,EAAAA,CACGhB,eAAgBT,EAAOK,UAAYb,EAAKgC,IAAIxB,EAAOK,SAASI,cAC5DiB,MAAOlC,EAAKgC,IAAI,aAChBG,mBAAoB,CAAC,WAAY,MACjC1B,QAASF,EAAMM,SACfuB,IAAK,MACLC,KAAM,YAENT,EAACU,EAAAA,CACGC,MAAOjC,EAAKO,SACZwB,KAAM,WACNG,YAAY,EACZC,UAAU,EACVC,YAAa,MACbC,aAAc,MACdC,QAASxC,EAAgB,WAAY,SACrCyC,OAAQzC,EAAgB,WAAY,QACpC0C,YAAa/C,GAAOgD,cAAclC,SAClCmC,UAAW,UACXC,UAAW,KAIlBlD,EAAMmD,eACHnD,EAAMoD,UAAU,CACZ3B,SACA4B,KAAMlD,EAAS,CAAEmD,YAAa,eAAxBnD,CAAyC,GAAGoD,WAItE,CAEAxD,EAAUyD,aAAe,CAAEjD,KAAM,CAAEO,SAAU"}
+{"version":3,"file":"BlikInput.js","sources":["../../../../../src/components/Blik/components/BlikInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useState, useEffect } from 'preact/hooks';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport Field from '../../internal/FormFields/Field';\nimport './BlikInput.scss';\nimport useForm from '../../../utils/useForm';\nimport { digitsOnlyFormatter } from '../../../utils/Formatters/formatters';\nimport useImage from '../../../core/Context/useImage';\nimport InputText from '../../internal/FormFields/InputText';\nimport { UIElementProps } from '../../internal/UIElement/types';\nimport { PREFIX } from '../../internal/Icon/constants';\n\ninterface BlikInputProps extends UIElementProps {\n    data?: BlikInputDataState;\n    placeholders?: BlikInputDataState;\n}\n\ninterface BlikInputDataState {\n    blikCode: string;\n}\n\nfunction BlikInput(props: BlikInputProps) {\n    const { i18n } = useCoreContext();\n    const getImage = useImage();\n    const { handleChangeFor, triggerValidation, data, valid, errors, isValid } = useForm<BlikInputDataState>({\n        schema: ['blikCode'],\n        rules: {\n            blikCode: {\n                validate: code => code?.length === 6,\n                errorMessage: 'blik.invalid',\n                modes: ['blur']\n            }\n        },\n        formatters: {\n            blikCode: digitsOnlyFormatter\n        }\n    });\n\n    useEffect(() => {\n        // @ts-ignore TODO: Fix this. Preact component types should not inherit from UIElementProps.\n        props.onChange({ data, errors, valid, isValid }, this);\n    }, [data, valid, errors, isValid]);\n\n    const [status, setStatus] = useState('ready');\n    this.setStatus = setStatus;\n    this.showValidation = triggerValidation;\n\n    return (\n        <div className=\"adyen-checkout__blik\">\n            <p className=\"adyen-checkout__blik__helper\">{i18n.get('blik.help')}</p>\n            <Field\n                errorMessage={!!errors.blikCode && i18n.get(errors.blikCode.errorMessage)}\n                label={i18n.get('blik.code')}\n                classNameModifiers={['blikCode', '50']}\n                isValid={valid.blikCode}\n                dir={'ltr'}\n                name={'blikCode'}\n            >\n                <InputText\n                    value={data.blikCode}\n                    name={'blikCode'}\n                    spellcheck={false}\n                    required={true}\n                    autocorrect={'off'}\n                    autocomplete={'off'}\n                    onInput={handleChangeFor('blikCode', 'input')}\n                    onBlur={handleChangeFor('blikCode', 'blur')}\n                    placeholder={props?.placeholders?.blikCode}\n                    inputMode={'numeric'}\n                    maxLength={6}\n                />\n            </Field>\n\n            {props.showPayButton &&\n                props.payButton({\n                    status,\n                    icon: getImage({ imageFolder: 'components/' })(`${PREFIX}lock`)\n                })}\n        </div>\n    );\n}\n\nBlikInput.defaultProps = { data: { blikCode: '' } };\n\nexport default BlikInput;\n"],"names":["BlikInput","props","i18n","useCoreContext","getImage","useImage","handleChangeFor","triggerValidation","data","valid","errors","isValid","useForm","schema","rules","blikCode","validate","code","length","errorMessage","modes","formatters","digitsOnlyFormatter","useEffect","onChange","this","status","setStatus","useState","showValidation","h","div","className","p","get","Field","label","classNameModifiers","dir","name","InputText","value","spellcheck","required","autocorrect","autocomplete","onInput","onBlur","placeholder","placeholders","inputMode","maxLength","showPayButton","payButton","icon","imageFolder","PREFIX","defaultProps"],"mappings":"8jBAqBA,SAASA,EAAUC,GACf,MAAMC,KAAEA,GAASC,IACXC,EAAWC,KACXC,gBAAEA,EAAeC,kBAAEA,EAAiBC,KAAEA,EAAIC,MAAEA,EAAKC,OAAEA,EAAMC,QAAEA,GAAYC,EAA4B,CACrGC,OAAQ,CAAC,YACTC,MAAO,CACHC,SAAU,CACNC,SAAUC,GAAyB,IAAjBA,GAAMC,OACxBC,aAAc,eACdC,MAAO,CAAC,UAGhBC,WAAY,CACRN,SAAUO,KAIlBC,GAAU,KAENtB,EAAMuB,SAAS,CAAEhB,OAAME,SAAQD,QAAOE,WAAWc,KAAI,GACtD,CAACjB,EAAMC,EAAOC,EAAQC,IAEzB,MAAOe,EAAQC,GAAaC,EAAS,SAIrC,OAHAH,KAAKE,UAAYA,EACjBF,KAAKI,eAAiBtB,EAGlBuB,EAACC,MAAAA,CAAIC,UAAU,wBACXF,EAACG,IAAAA,CAAED,UAAU,gCAAgC9B,EAAKgC,IAAI,cACtDJ,EAACK,EAAAA,CACGhB,eAAgBT,EAAOK,UAAYb,EAAKgC,IAAIxB,EAAOK,SAASI,cAC5DiB,MAAOlC,EAAKgC,IAAI,aAChBG,mBAAoB,CAAC,WAAY,MACjC1B,QAASF,EAAMM,SACfuB,IAAK,MACLC,KAAM,YAENT,EAACU,EAAAA,CACGC,MAAOjC,EAAKO,SACZwB,KAAM,WACNG,YAAY,EACZC,UAAU,EACVC,YAAa,MACbC,aAAc,MACdC,QAASxC,EAAgB,WAAY,SACrCyC,OAAQzC,EAAgB,WAAY,QACpC0C,YAAa/C,GAAOgD,cAAclC,SAClCmC,UAAW,UACXC,UAAW,KAIlBlD,EAAMmD,eACHnD,EAAMoD,UAAU,CACZ3B,SACA4B,KAAMlD,EAAS,CAAEmD,YAAa,eAAxBnD,CAAyC,GAAGoD,WAItE,CAEAxD,EAAUyD,aAAe,CAAEjD,KAAM,CAAEO,SAAU"}