@adyen/adyen-web 6.45.0 → 6.45.1

package/dist/es/components/internal/IbanInput/IbanInput.js

@@ -1,2 +1,2 @@
-import{Component as e,createElement as a}from"../../../external/preact/dist/preact.js";import{useCoreContext as t}from"../../../core/Context/CoreProvider.js";import r from"../FormFields/Field/Field.js";import{isValidHolder as s,checkIbanStatus as i}from"./validate.js";import{electronicFormat as n,formatIban as o,getCountryCode as l,getNextCursorPosition as d}from"./utils.js";import h from"../FormFields/Fieldset/Fieldset.js";import u from"../FormFields/InputText.js";function m(e,a,t){return a in e?Object.defineProperty(e,a,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[a]=t,e}const b={isValid:!1,errorMessage:"ach.accountHolderNameField.invalid",error:"ach.accountHolderNameField.invalid"},c={isValid:!1,errorMessage:"sepaDirectDebit.ibanField.invalid",error:"sepaDirectDebit.ibanField.invalid"};class p extends e{setStatus(e){this.setState({status:e})}onChange(){const e=!this.props.holderName||s(this.state.data.ownerName),a="valid"===i(this.state.data.ibanNumber).status&&e,t={data:this.state.data,isValid:a,errors:this.state.errors};this.props.onChange(t)}showValidation(){const e=i(this.state.data.ibanNumber).status,a=s(this.state.data.ownerName);this.setError("iban","valid"!==e?c:null);const t=a?null:b;this.setError("holder",t,this.onChange)}render({placeholders:e},{data:s,errors:i,valid:n}){const{i18n:o}=t();return a(h,{classNameModifiers:["iban-input"],label:this.props.label},this.props.holderName&&a(r,{className:"adyen-checkout__field--owner-name",label:o.get("sepa.ownerName"),filled:s.ownerName&&s.ownerName.length,errorMessage:!!i.holder&&o.get(i.holder.error),dir:"ltr",i18n:o,name:"ownerName"},a(u,{name:"ownerName",className:"adyen-checkout__iban-input__owner-name",placeholder:e?.ownerName,value:s.ownerName,"aria-invalid":!!this.state.errors.holder,"aria-label":o.get("sepa.ownerName"),onInput:e=>this.handleHolderInput(e.target.value),onBlur:e=>this.handleHolderInput(e.target.value),autocomplete:"name"})),a(r,{className:"adyen-checkout__field--iban-number",label:o.get("sepa.ibanNumber"),errorMessage:!!i.iban&&o.get(i.iban.error),filled:s.ibanNumber&&s.ibanNumber.length,isValid:n.iban,onBlur:this.handleIbanBlur,dir:"ltr",i18n:o,name:"ibanNumber"},a(u,{setRef:e=>{this.ibanNumber=e},name:"ibanNumber",className:"adyen-checkout__iban-input__iban-number",classNameModifiers:["large"],placeholder:e?.ibanNumber,value:s.ibanNumber,onInput:this.handleIbanInput,"aria-invalid":!!this.state.errors.iban,"aria-label":o.get("sepa.ibanNumber"),autocorrect:"off",spellcheck:!1,autocomplete:void 0})),this.props.showPayButton&&this.props.payButton({status:this.state.status}))}constructor(e){if(super(e),m(this,"ibanNumber",void 0),m(this,"setData",(e,a,t)=>{this.setState(t=>({data:{...t.data,[e]:a}}),t)}),m(this,"setError",(e,a,t)=>{this.setState(t=>({errors:{...t.errors,[e]:a}}),t)}),m(this,"setValid",(e,a,t)=>{this.setState(t=>({valid:{...t.valid,[e]:a}}),t)}),m(this,"handleHolderInput",e=>{this.setState(a=>({data:{...a.data,ownerName:e}}),()=>{const e=s(this.state.data.ownerName),a=null==e||e?null:b;this.setError("holder",a,this.onChange)})}),m(this,"handleIbanInput",e=>{const a=e.target.value,t=n(a),r=o(t),s=i(r).status,h=l(t),u=e.target.selectionStart,m=this.state.data.ibanNumber,b=d(u,r,m);this.setState(e=>({data:{...e.data,ibanNumber:r,countryCode:h},errors:{...e.errors,iban:"invalid"===s?c:null},valid:{...e.valid,iban:"valid"===s}}),()=>{e.target.setSelectionRange(b,b),this.onChange()})}),m(this,"handleIbanBlur",e=>{const a=e.target.value;if(a.length>0){const e=i(a).status;this.setError("iban","valid"!==e?c:null,this.onChange)}else this.setError("iban",null,this.onChange)}),this.state={status:"ready",data:{ownerName:e?.data?.ownerName||"",ibanNumber:e?.data?.ibanNumber||"",countryCode:e?.data?.countryCode||""},isValid:!1,cursor:0,errors:{},valid:{}},this.state.data.ibanNumber){const e=n(this.state.data.ibanNumber);this.state.data.ibanNumber=o(e)}if(this.state.data.ibanNumber||this.state.data.ownerName){const e=this.props.holderName?s(this.state.data.ownerName):"",a=(this.state.data.ibanNumber?"valid"===i(this.state.data.ibanNumber).status:"")&&e,t={data:this.state.data,isValid:a};this.props.onChange(t)}}}m(p,"defaultProps",{onChange:()=>{},countryCode:null,holderName:!0,placeholders:{},label:null});export{p as default};
+import{Component as e,createElement as a}from"../../../external/preact/dist/preact.js";import{useCoreContext as t}from"../../../core/Context/CoreProvider.js";import r from"../FormFields/Field/Field.js";import{isValidHolder as s,checkIbanStatus as i}from"./validate.js";import{electronicFormat as n,formatIban as o,getCountryCode as l,getNextCursorPosition as d}from"./utils.js";import h from"../FormFields/Fieldset/Fieldset.js";import u from"../FormFields/InputText.js";function m(e,a,t){return a in e?Object.defineProperty(e,a,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[a]=t,e}const b={isValid:!1,errorMessage:"ach.accountHolderNameField.invalid",error:"ach.accountHolderNameField.invalid"},c={isValid:!1,errorMessage:"sepaDirectDebit.ibanField.invalid",error:"sepaDirectDebit.ibanField.invalid"};class p extends e{setStatus(e){this.setState({status:e})}onChange(){const e=!this.props.holderName||s(this.state.data.ownerName),a="valid"===i(this.state.data.ibanNumber).status&&e,t={data:this.state.data,isValid:a,errors:this.state.errors};this.props.onChange(t)}showValidation(){const e=i(this.state.data.ibanNumber).status,a=s(this.state.data.ownerName);this.setError("iban","valid"===e?null:c);const t=a?null:b;this.setError("holder",t,this.onChange)}render({placeholders:e},{data:s,errors:i,valid:n}){const{i18n:o}=t();return a(h,{classNameModifiers:["iban-input"],label:this.props.label},this.props.holderName&&a(r,{className:"adyen-checkout__field--owner-name",label:o.get("sepa.ownerName"),filled:s.ownerName&&s.ownerName.length,errorMessage:!!i.holder&&o.get(i.holder.error),dir:"ltr",i18n:o,name:"ownerName"},a(u,{name:"ownerName",className:"adyen-checkout__iban-input__owner-name",placeholder:e?.ownerName,value:s.ownerName,"aria-invalid":!!this.state.errors.holder,"aria-label":o.get("sepa.ownerName"),onInput:e=>this.handleHolderInput(e.target.value),onBlur:e=>this.handleHolderInput(e.target.value),autocomplete:"name"})),a(r,{className:"adyen-checkout__field--iban-number",label:o.get("sepa.ibanNumber"),errorMessage:!!i.iban&&o.get(i.iban.error),filled:s.ibanNumber&&s.ibanNumber.length,isValid:n.iban,onBlur:this.handleIbanBlur,dir:"ltr",i18n:o,name:"ibanNumber"},a(u,{name:"ibanNumber",className:"adyen-checkout__iban-input__iban-number",classNameModifiers:["large"],placeholder:e?.ibanNumber,value:s.ibanNumber,onInput:this.handleIbanInput,"aria-invalid":!!this.state.errors.iban,"aria-label":o.get("sepa.ibanNumber"),autocorrect:"off",spellcheck:!1,autocomplete:void 0})),this.props.showPayButton&&this.props.payButton({status:this.state.status}))}constructor(e){if(super(e),m(this,"setError",(e,a,t)=>{this.setState(t=>({errors:{...t.errors,[e]:a}}),t)}),m(this,"handleHolderInput",e=>{this.setState(a=>({data:{...a.data,ownerName:e}}),()=>{const e=s(this.state.data.ownerName),a=e&&!e?b:null;this.setError("holder",a,this.onChange)})}),m(this,"handleIbanInput",e=>{const a=e.target.value,t=n(a),r=o(t),s=i(r).status,h=l(t),u=e.target.selectionStart,m=this.state.data.ibanNumber,b=d(u,r,m);this.setState(e=>({data:{...e.data,ibanNumber:r,countryCode:h},errors:{...e.errors,iban:"invalid"===s?c:null},valid:{...e.valid,iban:"valid"===s}}),()=>{e.target.setSelectionRange(b,b),this.onChange()})}),m(this,"handleIbanBlur",e=>{const a=e.target.value;if(a.length>0){const e=i(a).status;this.setError("iban","valid"===e?null:c,this.onChange)}else this.setError("iban",null,this.onChange)}),this.state={status:"ready",data:{ownerName:e?.data?.ownerName||"",ibanNumber:e?.data?.ibanNumber||"",countryCode:e?.data?.countryCode||""},isValid:!1,cursor:0,errors:{},valid:{}},this.state.data.ibanNumber){const e=n(this.state.data.ibanNumber);this.state.data.ibanNumber=o(e)}if(this.state.data.ibanNumber||this.state.data.ownerName){const e=!this.props.holderName||s(this.state.data.ownerName),a=!!this.state.data.ibanNumber&&"valid"===i(this.state.data.ibanNumber).status&&e,t={data:this.state.data,isValid:a};this.props.onChange(t)}}}m(p,"defaultProps",{onChange:()=>{},countryCode:null,holderName:!0,placeholders:{},label:null});export{p as default};
 //# sourceMappingURL=IbanInput.js.map

package/dist/es/components/internal/IbanInput/IbanInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"IbanInput.js","sources":["../../../../../src/components/internal/IbanInput/IbanInput.tsx"],"sourcesContent":["import { Component, h } from 'preact';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport Field from '../FormFields/Field';\nimport { checkIbanStatus, isValidHolder } from './validate';\nimport { electronicFormat, formatIban, getCountryCode, getNextCursorPosition } from './utils';\nimport Fieldset from '../FormFields/Fieldset';\nimport { GenericError } from '../../../core/Errors/types';\nimport InputText from '../FormFields/InputText';\n\ninterface IbanInputProps {\n    holderName?: boolean;\n    placeholders?: Omit<IbanData, 'countryCode'>;\n    countryCode?: string;\n    showPayButton?: boolean;\n    payButton?: any;\n    onChange: (data) => void;\n    label: string;\n    data: IbanData;\n}\n\ninterface IbanData {\n    ownerName?: string;\n    ibanNumber?: string;\n    countryCode?: string;\n}\n\ninterface IbanInputState {\n    data: any;\n    errors: any;\n    valid: any;\n    status: string;\n    isValid: boolean;\n    cursor: number;\n}\n\nconst ibanHolderNameErrorObj: GenericError = {\n    isValid: false,\n    errorMessage: 'ach.accountHolderNameField.invalid', // TODO create bespoke translation key\n    error: 'ach.accountHolderNameField.invalid'\n};\n\nconst ibanErrorObj: GenericError = {\n    isValid: false,\n    errorMessage: 'sepaDirectDebit.ibanField.invalid',\n    error: 'sepaDirectDebit.ibanField.invalid'\n};\n\nclass IbanInput extends Component<Readonly<IbanInputProps>, IbanInputState> {\n    private ibanNumber: HTMLInputElement;\n\n    constructor(props) {\n        super(props);\n\n        this.state = {\n            status: 'ready',\n            data: {\n                ownerName: props?.data?.ownerName || '',\n                ibanNumber: props?.data?.ibanNumber || '',\n                countryCode: props?.data?.countryCode || ''\n            },\n            isValid: false,\n            cursor: 0,\n            errors: {},\n            valid: {}\n        };\n\n        if (this.state.data['ibanNumber']) {\n            const electronicFormatIban = electronicFormat(this.state.data['ibanNumber']); // example: NL13TEST0123456789\n            this.state.data['ibanNumber'] = formatIban(electronicFormatIban); // example: NL13 TEST 0123 4567 89\n        }\n\n        if (this.state.data['ibanNumber'] || this.state.data['ownerName']) {\n            const holderNameValid = this.props.holderName ? isValidHolder(this.state.data['ownerName']) : '';\n            const ibanValid = this.state.data['ibanNumber'] ? checkIbanStatus(this.state.data['ibanNumber']).status === 'valid' : '';\n            const isValid = ibanValid && holderNameValid;\n            const data = { data: this.state.data, isValid };\n\n            this.props.onChange(data);\n        }\n    }\n\n    public static readonly defaultProps = {\n        onChange: () => {},\n        countryCode: null,\n        holderName: true,\n        placeholders: {},\n        label: null\n    };\n\n    setStatus(status) {\n        this.setState({ status });\n    }\n\n    onChange() {\n        const holderNameValid = this.props.holderName ? isValidHolder(this.state.data['ownerName']) : true;\n        const ibanValid = checkIbanStatus(this.state.data['ibanNumber']).status === 'valid';\n        const isValid = ibanValid && holderNameValid;\n        const data = { data: this.state.data, isValid, errors: this.state.errors };\n\n        this.props.onChange(data);\n    }\n\n    public setData = (key, value, cb?) => {\n        this.setState(prevState => ({ data: { ...prevState.data, [key]: value } }), cb);\n    };\n\n    public setError = (key, value, cb?) => {\n        this.setState(prevState => ({ errors: { ...prevState.errors, [key]: value } }), cb);\n    };\n\n    public setValid = (key, value, cb?) => {\n        this.setState(prevState => ({ valid: { ...prevState.valid, [key]: value } }), cb);\n    };\n\n    public handleHolderInput = holder => {\n        this.setState(\n            prevState => ({ data: { ...prevState.data, ownerName: holder } }),\n            () => {\n                const holderStatus = isValidHolder(this.state.data['ownerName']);\n                const holderErr =\n                    holderStatus != null && !holderStatus // *don't* consider null, i.e. a value that has just been deleted, to be in error\n                        ? ibanHolderNameErrorObj\n                        : null;\n\n                this.setError('holder', holderErr, this.onChange);\n            }\n        );\n    };\n\n    public handleIbanInput = e => {\n        const inputValue = e.target.value;\n        const electronicFormatIban = electronicFormat(inputValue); // example: NL13TEST0123456789\n        const iban = formatIban(electronicFormatIban); // example: NL13 TEST 0123 4567 89\n        const validationStatus = checkIbanStatus(iban).status;\n\n        const countryCode = getCountryCode(electronicFormatIban);\n\n        // calculate cursor's new position\n        const cursor = e.target.selectionStart;\n        const previousIban = this.state.data['ibanNumber'];\n        const newCursorPosition = getNextCursorPosition(cursor, iban, previousIban);\n\n        this.setState(\n            prevState => ({\n                data: { ...prevState.data, ibanNumber: iban, countryCode: countryCode },\n                errors: {\n                    ...prevState.errors,\n                    iban: validationStatus === 'invalid' ? ibanErrorObj : null\n                },\n                valid: { ...prevState.valid, iban: validationStatus === 'valid' }\n            }),\n            () => {\n                e.target.setSelectionRange(newCursorPosition, newCursorPosition);\n                this.onChange();\n            }\n        );\n    };\n\n    public handleIbanBlur = e => {\n        const currentIban = e.target.value;\n\n        if (currentIban.length > 0) {\n            const validationStatus = checkIbanStatus(currentIban).status;\n            this.setError('iban', validationStatus !== 'valid' ? ibanErrorObj : null, this.onChange);\n        } else {\n            // Empty field is not in error\n            this.setError('iban', null, this.onChange);\n        }\n    };\n\n    showValidation() {\n        const validationStatus = checkIbanStatus(this.state.data['ibanNumber']).status;\n        const holderStatus = isValidHolder(this.state.data['ownerName']);\n        this.setError('iban', validationStatus !== 'valid' ? ibanErrorObj : null);\n\n        const holderErr = !holderStatus // *do* consider null, i.e. an empty field, to be in error\n            ? ibanHolderNameErrorObj\n            : null;\n\n        this.setError('holder', holderErr, this.onChange); // add callback param to force propagation of state to parent comp\n    }\n\n    render({ placeholders }: IbanInputProps, { data, errors, valid }) {\n        const { i18n } = useCoreContext();\n        return (\n            <Fieldset classNameModifiers={['iban-input']} label={this.props.label}>\n                {this.props.holderName && (\n                    <Field\n                        className={'adyen-checkout__field--owner-name'}\n                        label={i18n.get('sepa.ownerName')}\n                        filled={data['ownerName'] && data['ownerName'].length}\n                        errorMessage={errors.holder ? i18n.get(errors.holder.error) : false}\n                        dir={'ltr'}\n                        i18n={i18n}\n                        name={'ownerName'}\n                    >\n                        <InputText\n                            name={'ownerName'}\n                            className={'adyen-checkout__iban-input__owner-name'}\n                            placeholder={placeholders?.ownerName}\n                            value={data['ownerName']}\n                            aria-invalid={!!this.state.errors.holder}\n                            aria-label={i18n.get('sepa.ownerName')}\n                            onInput={e => this.handleHolderInput((e.target as HTMLInputElement).value)}\n                            onBlur={e => this.handleHolderInput((e.target as HTMLInputElement).value)}\n                            autocomplete={'name'}\n                        />\n                    </Field>\n                )}\n\n                <Field\n                    className={'adyen-checkout__field--iban-number'}\n                    label={i18n.get('sepa.ibanNumber')}\n                    errorMessage={errors.iban ? i18n.get(errors.iban.error) : false}\n                    filled={data['ibanNumber'] && data['ibanNumber'].length}\n                    isValid={valid.iban}\n                    onBlur={this.handleIbanBlur}\n                    dir={'ltr'}\n                    i18n={i18n}\n                    name={'ibanNumber'}\n                >\n                    <InputText\n                        setRef={ref => {\n                            this.ibanNumber = ref;\n                        }}\n                        name={'ibanNumber'}\n                        className={'adyen-checkout__iban-input__iban-number'}\n                        classNameModifiers={['large']}\n                        placeholder={placeholders?.ibanNumber}\n                        value={data['ibanNumber']}\n                        onInput={this.handleIbanInput}\n                        aria-invalid={!!this.state.errors.iban}\n                        aria-label={i18n.get('sepa.ibanNumber')}\n                        autocorrect={'off'}\n                        spellcheck={false}\n                        autocomplete={undefined}\n                    />\n                </Field>\n\n                {this.props.showPayButton && this.props.payButton({ status: this.state.status })}\n            </Fieldset>\n        );\n    }\n}\n\nexport default IbanInput;\n"],"names":["ibanHolderNameErrorObj","isValid","errorMessage","error","ibanErrorObj","IbanInput","Component","setStatus","status","this","setState","onChange","holderNameValid","props","holderName","isValidHolder","state","data","checkIbanStatus","errors","showValidation","validationStatus","holderStatus","setError","holderErr","render","placeholders","valid","i18n","useCoreContext","h","Fieldset","classNameModifiers","label","Field","className","get","filled","length","holder","dir","name","InputText","placeholder","ownerName","value","aria-invalid","aria-label","onInput","e","handleHolderInput","target","onBlur","autocomplete","iban","handleIbanBlur","setRef","ref","ibanNumber","handleIbanInput","autocorrect","spellcheck","undefined","showPayButton","payButton","constructor","super","_define_property","setData","key","cb","prevState","setValid","inputValue","electronicFormatIban","electronicFormat","formatIban","countryCode","getCountryCode","cursor","selectionStart","previousIban","newCursorPosition","getNextCursorPosition","setSelectionRange","currentIban","defaultProps"],"mappings":"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"}
+{"version":3,"file":"IbanInput.js","sources":["../../../../../src/components/internal/IbanInput/IbanInput.tsx"],"sourcesContent":["import { Component, h } from 'preact';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport Field from '../FormFields/Field';\nimport { checkIbanStatus, isValidHolder } from './validate';\nimport { electronicFormat, formatIban, getCountryCode, getNextCursorPosition } from './utils';\nimport Fieldset from '../FormFields/Fieldset';\nimport { GenericError } from '../../../core/Errors/types';\nimport InputText from '../FormFields/InputText';\nimport { UIElementStatus } from '../UIElement/types';\nimport { PayButtonProps } from '../PayButton/PayButton';\n\nexport interface IbanData {\n    ownerName?: string;\n    ibanNumber?: string;\n    countryCode?: string;\n}\n\ninterface IbanInputOnChangeData {\n    data: IbanData;\n    isValid: boolean;\n    errors?: Record<string, GenericError | null>;\n}\n\ninterface IbanInputProps {\n    holderName?: boolean;\n    placeholders?: Omit<IbanData, 'countryCode'>;\n    countryCode?: string;\n    showPayButton?: boolean;\n    payButton?: (props: PayButtonProps) => h.JSX.Element;\n    onChange: (data: IbanInputOnChangeData) => void;\n    label: string;\n    data?: IbanData;\n}\n\ninterface IbanInputState {\n    data: IbanData;\n    errors: Record<string, GenericError | null>;\n    valid: Record<string, boolean>;\n    status: string;\n    isValid: boolean;\n    cursor: number;\n}\n\nconst ibanHolderNameErrorObj: GenericError = {\n    isValid: false,\n    errorMessage: 'ach.accountHolderNameField.invalid', // TODO create bespoke translation key\n    error: 'ach.accountHolderNameField.invalid'\n};\n\nconst ibanErrorObj: GenericError = {\n    isValid: false,\n    errorMessage: 'sepaDirectDebit.ibanField.invalid',\n    error: 'sepaDirectDebit.ibanField.invalid'\n};\n\nclass IbanInput extends Component<Readonly<IbanInputProps>, IbanInputState> {\n    constructor(props) {\n        super(props);\n\n        this.state = {\n            status: 'ready',\n            data: {\n                ownerName: props?.data?.ownerName || '',\n                ibanNumber: props?.data?.ibanNumber || '',\n                countryCode: props?.data?.countryCode || ''\n            },\n            isValid: false,\n            cursor: 0,\n            errors: {},\n            valid: {}\n        };\n\n        if (this.state.data['ibanNumber']) {\n            const electronicFormatIban = electronicFormat(this.state.data['ibanNumber']); // example: NL13TEST0123456789\n            this.state.data['ibanNumber'] = formatIban(electronicFormatIban); // example: NL13 TEST 0123 4567 89\n        }\n\n        if (this.state.data['ibanNumber'] || this.state.data['ownerName']) {\n            const holderNameValid = this.props.holderName ? isValidHolder(this.state.data['ownerName']) : true;\n            const ibanValid = this.state.data['ibanNumber'] ? checkIbanStatus(this.state.data['ibanNumber']).status === 'valid' : false;\n            const isValid = ibanValid && holderNameValid;\n            const data = { data: this.state.data, isValid };\n\n            this.props.onChange(data);\n        }\n    }\n\n    public static readonly defaultProps = {\n        onChange: () => {},\n        countryCode: null,\n        holderName: true,\n        placeholders: {},\n        label: null\n    };\n\n    setStatus(status: UIElementStatus) {\n        this.setState({ status });\n    }\n\n    onChange() {\n        const holderNameValid = this.props.holderName ? isValidHolder(this.state.data['ownerName']) : true;\n        const ibanValid = checkIbanStatus(this.state.data['ibanNumber']).status === 'valid';\n        const isValid = ibanValid && holderNameValid;\n        const data = { data: this.state.data, isValid, errors: this.state.errors };\n\n        this.props.onChange(data);\n    }\n\n    public setError = (key, value, cb?) => {\n        this.setState(prevState => ({ errors: { ...prevState.errors, [key]: value } }), cb);\n    };\n\n    public handleHolderInput = holder => {\n        this.setState(\n            prevState => ({ data: { ...prevState.data, ownerName: holder } }),\n            () => {\n                const holderStatus = isValidHolder(this.state.data['ownerName']);\n                const holderErr = holderStatus && !holderStatus ? ibanHolderNameErrorObj : null;\n\n                this.setError('holder', holderErr, this.onChange);\n            }\n        );\n    };\n\n    public handleIbanInput = e => {\n        const inputValue = e.target.value;\n        const electronicFormatIban = electronicFormat(inputValue); // example: NL13TEST0123456789\n        const iban = formatIban(electronicFormatIban); // example: NL13 TEST 0123 4567 89\n        const validationStatus = checkIbanStatus(iban).status;\n\n        const countryCode = getCountryCode(electronicFormatIban);\n\n        // calculate cursor's new position\n        const cursor = e.target.selectionStart;\n        const previousIban = this.state.data['ibanNumber'];\n        const newCursorPosition = getNextCursorPosition(cursor, iban, previousIban);\n\n        this.setState(\n            prevState => ({\n                data: { ...prevState.data, ibanNumber: iban, countryCode: countryCode },\n                errors: {\n                    ...prevState.errors,\n                    iban: validationStatus === 'invalid' ? ibanErrorObj : null\n                },\n                valid: { ...prevState.valid, iban: validationStatus === 'valid' }\n            }),\n            () => {\n                e.target.setSelectionRange(newCursorPosition, newCursorPosition);\n                this.onChange();\n            }\n        );\n    };\n\n    public handleIbanBlur = e => {\n        const currentIban = e.target.value;\n\n        if (currentIban.length > 0) {\n            const validationStatus = checkIbanStatus(currentIban).status;\n            this.setError('iban', validationStatus === 'valid' ? null : ibanErrorObj, this.onChange);\n        } else {\n            // Empty field is not in error\n            this.setError('iban', null, this.onChange);\n        }\n    };\n\n    showValidation() {\n        const validationStatus = checkIbanStatus(this.state.data['ibanNumber']).status;\n        const holderStatus = isValidHolder(this.state.data['ownerName']);\n        this.setError('iban', validationStatus === 'valid' ? null : ibanErrorObj);\n\n        const holderErr = holderStatus ? null : ibanHolderNameErrorObj;\n\n        this.setError('holder', holderErr, this.onChange); // add callback param to force propagation of state to parent comp\n    }\n\n    render({ placeholders }: IbanInputProps, { data, errors, valid }) {\n        const { i18n } = useCoreContext();\n        return (\n            <Fieldset classNameModifiers={['iban-input']} label={this.props.label}>\n                {this.props.holderName && (\n                    <Field\n                        className={'adyen-checkout__field--owner-name'}\n                        label={i18n.get('sepa.ownerName')}\n                        filled={data['ownerName'] && data['ownerName'].length}\n                        errorMessage={errors.holder ? i18n.get(errors.holder.error) : false}\n                        dir={'ltr'}\n                        i18n={i18n}\n                        name={'ownerName'}\n                    >\n                        <InputText\n                            name={'ownerName'}\n                            className={'adyen-checkout__iban-input__owner-name'}\n                            placeholder={placeholders?.ownerName}\n                            value={data['ownerName']}\n                            aria-invalid={!!this.state.errors.holder}\n                            aria-label={i18n.get('sepa.ownerName')}\n                            onInput={e => this.handleHolderInput((e.target as HTMLInputElement).value)}\n                            onBlur={e => this.handleHolderInput((e.target as HTMLInputElement).value)}\n                            autocomplete={'name'}\n                        />\n                    </Field>\n                )}\n\n                <Field\n                    className={'adyen-checkout__field--iban-number'}\n                    label={i18n.get('sepa.ibanNumber')}\n                    errorMessage={errors.iban ? i18n.get(errors.iban.error) : false}\n                    filled={data['ibanNumber'] && data['ibanNumber'].length}\n                    isValid={valid.iban}\n                    onBlur={this.handleIbanBlur}\n                    dir={'ltr'}\n                    i18n={i18n}\n                    name={'ibanNumber'}\n                >\n                    <InputText\n                        name={'ibanNumber'}\n                        className={'adyen-checkout__iban-input__iban-number'}\n                        classNameModifiers={['large']}\n                        placeholder={placeholders?.ibanNumber}\n                        value={data['ibanNumber']}\n                        onInput={this.handleIbanInput}\n                        aria-invalid={!!this.state.errors.iban}\n                        aria-label={i18n.get('sepa.ibanNumber')}\n                        autocorrect={'off'}\n                        spellcheck={false}\n                        autocomplete={undefined}\n                    />\n                </Field>\n\n                {this.props.showPayButton && this.props.payButton({ status: this.state.status })}\n            </Fieldset>\n        );\n    }\n}\n\nexport default IbanInput;\n"],"names":["ibanHolderNameErrorObj","isValid","errorMessage","error","ibanErrorObj","IbanInput","Component","setStatus","status","this","setState","onChange","holderNameValid","props","holderName","isValidHolder","state","data","checkIbanStatus","errors","showValidation","validationStatus","holderStatus","setError","holderErr","render","placeholders","valid","i18n","useCoreContext","h","Fieldset","classNameModifiers","label","Field","className","get","filled","length","holder","dir","name","InputText","placeholder","ownerName","value","aria-invalid","aria-label","onInput","e","handleHolderInput","target","onBlur","autocomplete","iban","handleIbanBlur","ibanNumber","handleIbanInput","autocorrect","spellcheck","undefined","showPayButton","payButton","constructor","super","_define_property","key","cb","prevState","inputValue","electronicFormatIban","electronicFormat","formatIban","countryCode","getCountryCode","cursor","selectionStart","previousIban","newCursorPosition","getNextCursorPosition","setSelectionRange","currentIban","defaultProps"],"mappings":"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"}

package/dist/es/components/internal/IbanInput/validate.js

@@ -1,2 +1,2 @@
-import{electronicFormat as t,getCountryCode as n,getIbanCountrySpecification as e,iso13616Prepare as i,iso7064Mod97_10 as l,regex as s}from"./utils.js";import{isEmpty as o}from"../../../utils/validator-utils.js";function r(t,n=null){this.status=t,this.code=n}const a=n=>{const e=t(n),o=i(e);return 1===l(o)&&(t=>{const n=t.slice(0,2),e=s(t,n);return e.test&&e.test(t.slice(4))||!1})(e)},u=i=>{const l=t(i);if(i.length<2)return new r("no-validate","TOO_SHORT");const s=n(l),o=e(s);return o?l.length>o.length?new r("invalid","TOO_LONG"):l.length===o.length?a(i)?new r("valid","VALID"):new r("invalid","INVALID_IBAN"):new r("no-validate","UNKNOWN"):new r("invalid","INVALID_COUNTRY")},c=t=>!o(t)||null;export{u as checkIbanStatus,c as isValidHolder,a as isValidIBAN};
+import{electronicFormat as t,getCountryCode as n,getIbanCountrySpecification as e,iso13616Prepare as i,iso7064Mod97_10 as l,regex as s}from"./utils.js";import{isEmpty as o}from"../../../utils/validator-utils.js";function r(t,n=null){this.status=t,this.code=n}const a=n=>{const e=t(n),o=i(e);return 1===l(o)&&(t=>{const n=t.slice(0,2),e=s(t,n);return e.test&&e.test(t.slice(4))||!1})(e)},u=i=>{const l=t(i);if(i.length<2)return new r("no-validate","TOO_SHORT");const s=n(l),o=e(s);return o?l.length>o.length?new r("invalid","TOO_LONG"):l.length===o.length?a(i)?new r("valid","VALID"):new r("invalid","INVALID_IBAN"):new r("no-validate","UNKNOWN"):new r("invalid","INVALID_COUNTRY")},c=t=>!o(t);export{u as checkIbanStatus,c as isValidHolder,a as isValidIBAN};
 //# sourceMappingURL=validate.js.map

package/dist/es/components/internal/IbanInput/validate.js.map

@@ -1 +1 @@
-{"version":3,"file":"validate.js","sources":["../../../../../src/components/internal/IbanInput/validate.ts"],"sourcesContent":["import { iso13616Prepare, iso7064Mod97_10, electronicFormat, regex, getIbanCountrySpecification, getCountryCode } from './utils';\nimport { isEmpty } from '../../../utils/validator-utils';\n\n/**\n * Contains a validation status\n * @internal\n * @param status -\n * @param code -\n */\nfunction ValidationStatus(status, code = null) {\n    this.status = status;\n    this.code = code;\n}\n\n/**\n * Validates the format of an iban\n * @internal\n * @param iban -\n */\nconst checkIbanStructure = iban => {\n    const countryCode = iban.slice(0, 2);\n    const ibanRegex = regex(iban, countryCode);\n\n    return ((ibanRegex as RegExp).test && (ibanRegex as RegExp).test(iban.slice(4))) || false;\n};\n\n/**\n * Checks validity of an IBAN\n * @param iban -\n */\nexport const isValidIBAN = iban => {\n    const electronicFormatIban = electronicFormat(iban);\n    const preparedIban = iso13616Prepare(electronicFormatIban);\n    const isValidISO = iso7064Mod97_10(preparedIban) === 1;\n\n    return isValidISO && checkIbanStructure(electronicFormatIban);\n};\n\n/**\n * Checkss the validity status of an IBAN\n * @param iban -\n */\nexport const checkIbanStatus = iban => {\n    const electronicFormatIban = electronicFormat(iban);\n\n    if (iban.length < 2) {\n        return new ValidationStatus('no-validate', 'TOO_SHORT'); // A\n    }\n\n    const countryCode = getCountryCode(electronicFormatIban);\n    const countrySpecification = getIbanCountrySpecification(countryCode);\n\n    if (!countrySpecification) {\n        return new ValidationStatus('invalid', 'INVALID_COUNTRY'); // AA13TEST0123456789\n    }\n\n    if (electronicFormatIban.length > countrySpecification.length) {\n        return new ValidationStatus('invalid', 'TOO_LONG'); // NL13TEST01234567891\n    }\n\n    if (electronicFormatIban.length === countrySpecification.length) {\n        if (isValidIBAN(iban)) {\n            return new ValidationStatus('valid', 'VALID'); // NL13TEST0123456789\n        }\n\n        return new ValidationStatus('invalid', 'INVALID_IBAN'); // NL13TEST0123456781\n    }\n\n    return new ValidationStatus('no-validate', 'UNKNOWN'); // NL13TEST012345678\n};\n\n/**\n * Checks validity of a holder name\n */\nexport const isValidHolder = value => (isEmpty(value) ? null : true); // true, if there are chars other than spaces\n"],"names":["ValidationStatus","status","code","this","isValidIBAN","iban","electronicFormatIban","electronicFormat","preparedIban","iso13616Prepare","iso7064Mod97_10","countryCode","slice","ibanRegex","regex","test","checkIbanStructure","checkIbanStatus","length","getCountryCode","countrySpecification","getIbanCountrySpecification","isValidHolder","value","isEmpty"],"mappings":"oNASA,SAASA,EAAiBC,EAAQC,EAAO,MACrCC,KAAKF,OAASA,EACdE,KAAKD,KAAOA,CAChB,CAOA,MAWaE,EAAcC,IACvB,MAAMC,EAAuBC,EAAiBF,GACxCG,EAAeC,EAAgBH,GAGrC,OAFqD,IAAlCI,EAAgBF,IAdZH,CAAAA,IACvB,MAAMM,EAAcN,EAAKO,MAAM,EAAG,GAC5BC,EAAYC,EAAMT,EAAMM,GAE9B,OAASE,EAAqBE,MAASF,EAAqBE,KAAKV,EAAKO,MAAM,MAAQ,GAY/DI,CAAmBV,IAO/BW,EAAkBZ,IAC3B,MAAMC,EAAuBC,EAAiBF,GAE9C,GAAIA,EAAKa,OAAS,EACd,OAAO,IAAIlB,EAAiB,cAAe,aAG/C,MAAMW,EAAcQ,EAAeb,GAC7Bc,EAAuBC,EAA4BV,GAEzD,OAAKS,EAIDd,EAAqBY,OAASE,EAAqBF,OAC5C,IAAIlB,EAAiB,UAAW,YAGvCM,EAAqBY,SAAWE,EAAqBF,OACjDd,EAAYC,GACL,IAAIL,EAAiB,QAAS,SAGlC,IAAIA,EAAiB,UAAW,gBAGpC,IAAIA,EAAiB,cAAe,WAfhC,IAAIA,EAAiB,UAAW,oBAqBlCsB,EAAgBC,IAAUC,EAAQD,IAAS"}
+{"version":3,"file":"validate.js","sources":["../../../../../src/components/internal/IbanInput/validate.ts"],"sourcesContent":["import { iso13616Prepare, iso7064Mod97_10, electronicFormat, regex, getIbanCountrySpecification, getCountryCode } from './utils';\nimport { isEmpty } from '../../../utils/validator-utils';\n\n/**\n * Contains a validation status\n * @internal\n * @param status -\n * @param code -\n */\nfunction ValidationStatus(status, code = null) {\n    this.status = status;\n    this.code = code;\n}\n\n/**\n * Validates the format of an iban\n * @internal\n * @param iban -\n */\nconst checkIbanStructure = iban => {\n    const countryCode = iban.slice(0, 2);\n    const ibanRegex = regex(iban, countryCode);\n\n    return ((ibanRegex as RegExp).test && (ibanRegex as RegExp).test(iban.slice(4))) || false;\n};\n\n/**\n * Checks validity of an IBAN\n * @param iban -\n */\nexport const isValidIBAN = iban => {\n    const electronicFormatIban = electronicFormat(iban);\n    const preparedIban = iso13616Prepare(electronicFormatIban);\n    const isValidISO = iso7064Mod97_10(preparedIban) === 1;\n\n    return isValidISO && checkIbanStructure(electronicFormatIban);\n};\n\n/**\n * Checkss the validity status of an IBAN\n * @param iban -\n */\nexport const checkIbanStatus = iban => {\n    const electronicFormatIban = electronicFormat(iban);\n\n    if (iban.length < 2) {\n        return new ValidationStatus('no-validate', 'TOO_SHORT'); // A\n    }\n\n    const countryCode = getCountryCode(electronicFormatIban);\n    const countrySpecification = getIbanCountrySpecification(countryCode);\n\n    if (!countrySpecification) {\n        return new ValidationStatus('invalid', 'INVALID_COUNTRY'); // AA13TEST0123456789\n    }\n\n    if (electronicFormatIban.length > countrySpecification.length) {\n        return new ValidationStatus('invalid', 'TOO_LONG'); // NL13TEST01234567891\n    }\n\n    if (electronicFormatIban.length === countrySpecification.length) {\n        if (isValidIBAN(iban)) {\n            return new ValidationStatus('valid', 'VALID'); // NL13TEST0123456789\n        }\n\n        return new ValidationStatus('invalid', 'INVALID_IBAN'); // NL13TEST0123456781\n    }\n\n    return new ValidationStatus('no-validate', 'UNKNOWN'); // NL13TEST012345678\n};\n\n/**\n * Checks validity of a holder name\n */\nexport const isValidHolder = (value: string) => !isEmpty(value);\n"],"names":["ValidationStatus","status","code","this","isValidIBAN","iban","electronicFormatIban","electronicFormat","preparedIban","iso13616Prepare","iso7064Mod97_10","countryCode","slice","ibanRegex","regex","test","checkIbanStructure","checkIbanStatus","length","getCountryCode","countrySpecification","getIbanCountrySpecification","isValidHolder","value","isEmpty"],"mappings":"oNASA,SAASA,EAAiBC,EAAQC,EAAO,MACrCC,KAAKF,OAASA,EACdE,KAAKD,KAAOA,CAChB,CAOA,MAWaE,EAAcC,IACvB,MAAMC,EAAuBC,EAAiBF,GACxCG,EAAeC,EAAgBH,GAGrC,OAFqD,IAAlCI,EAAgBF,IAdZH,CAAAA,IACvB,MAAMM,EAAcN,EAAKO,MAAM,EAAG,GAC5BC,EAAYC,EAAMT,EAAMM,GAE9B,OAASE,EAAqBE,MAASF,EAAqBE,KAAKV,EAAKO,MAAM,MAAQ,GAY/DI,CAAmBV,IAO/BW,EAAkBZ,IAC3B,MAAMC,EAAuBC,EAAiBF,GAE9C,GAAIA,EAAKa,OAAS,EACd,OAAO,IAAIlB,EAAiB,cAAe,aAG/C,MAAMW,EAAcQ,EAAeb,GAC7Bc,EAAuBC,EAA4BV,GAEzD,OAAKS,EAIDd,EAAqBY,OAASE,EAAqBF,OAC5C,IAAIlB,EAAiB,UAAW,YAGvCM,EAAqBY,SAAWE,EAAqBF,OACjDd,EAAYC,GACL,IAAIL,EAAiB,QAAS,SAGlC,IAAIA,EAAiB,UAAW,gBAGpC,IAAIA,EAAiB,cAAe,WAfhC,IAAIA,EAAiB,UAAW,oBAqBlCsB,EAAiBC,IAAmBC,EAAQD"}

package/dist/es/components/internal/OpenInvoice/OpenInvoice.js

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../external/preact/dist/preact.js";import{useRef as s,useState as r,useEffect as o}from"../../../external/preact/hooks/dist/hooks.js";import{useCoreContext as i}from"../../../core/Context/CoreProvider.js";import n from"../CompanyDetails/CompanyDetails.js";import t from"../PersonalDetails/PersonalDetails.js";import a from"../Address/Address.js";import l from"../FormFields/Checkbox/Checkbox.js";import d from"../FormFields/ConsentCheckbox/ConsentCheckbox.js";import{getInitialActiveFieldsets as c,fieldsetsSchema as m,getActiveFieldsData as p}from"./utils.js";import u from"../IbanInput/IbanInput.js";import b from"../FormFields/Field/Field.js";import y from"../FormInstruction/FormInstruction.js";import C from"./useSRPanelForOpenInvoiceErrors.js";import h from"../../../_virtual/index.js";const f={isValid:!1,errorMessage:"consent.checkbox.invalid",error:"consent.checkbox.invalid"};function A(A){const{countryCode:v,visibility:k}=A,{i18n:g}=i(),x=s({});Object.keys(x.current).length||A.setComponentRef?.(x.current);const D=s(!1),j=s(null),F=c(k,A.data),[R,w]=r(F),{current:E}=s(m.reduce((e,s)=>(e[s]=e=>{E[s].current=e},e),{})),I=!!A.consentCheckboxLabel,S=!I&&Object.keys(R).every(e=>!R[e]),q="editable"===k.deliveryAddress&&"hidden"!==k.billingAddress,[P,V]=r({...A.data,...I&&{consentCheckbox:!1}}),[M,N]=r({}),[_,O]=r({}),[L,B]=r("ready");x.current.showValidation=()=>{D.current=!0,m.forEach(e=>{E[e].current&&E[e].current.showValidation()}),N({...I&&{consentCheckbox:P.consentCheckbox?null:f}})},x.current.setStatus=B,C({errors:M,data:P,props:A,isValidating:D,containerRef:j}),o(()=>{const e=Object.keys(R).every(e=>!R[e]||!!_[e]),s=!I||!!_.consentCheckbox,r=e&&s,o=p(R,P);A.onChange({data:o,errors:M,valid:_,isValid:r})},[P,R]);const z=e=>s=>{V(r=>({...r,[e]:s.data})),O(r=>({...r,[e]:s.isValid})),N(r=>({...r,[e]:s.errors}))};return e("div",{ref:j,className:h({"adyen-checkout__open-invoice":!0,"adyen-checkout__open-invoice--loading":"loading"===L})},e(y,null),R.companyDetails&&e(n,{data:A.data.companyDetails,label:"companyDetails",onChange:z("companyDetails"),setComponentRef:E.companyDetails,visibility:k.companyDetails}),R.personalDetails&&e(t,{data:A.data.personalDetails,requiredFields:A.personalDetailsRequiredFields,label:"personalDetails",onChange:z("personalDetails"),setComponentRef:E.personalDetails,visibility:k.personalDetails}),R.bankAccount&&e(u,{holderName:!0,label:"ach.bankAccount",data:P.bankAccount,onChange:z("bankAccount"),ref:E.bankAccount}),R.billingAddress&&e(a,{allowedCountries:A?.billingAddressSpecification?.allowedCountries??A.allowedCountries,countryCode:v,requiredFields:A.billingAddressRequiredFields,specifications:A.billingAddressSpecification,data:P.billingAddress,label:"billingAddress",onChange:z("billingAddress"),setComponentRef:E.billingAddress,visibility:k.billingAddress}),q&&e(b,{classNameModifiers:["separateDeliveryAddress","consentCheckbox"],name:"separateDeliveryAddress",useLabelElement:!1,showErrorElement:!1},e(l,{label:g.get("separateDeliveryAddress"),checked:R.deliveryAddress,classNameModifiers:["separateDeliveryAddress"],name:"separateDeliveryAddress",onChange:()=>{w(e=>({...e,deliveryAddress:!R.deliveryAddress}))}})),R.deliveryAddress&&e(a,{allowedCountries:A?.deliveryAddressSpecification?.allowedCountries??A.allowedCountries,countryCode:v,requiredFields:A.deliveryAddressRequiredFields,specifications:A.deliveryAddressSpecification,data:P.deliveryAddress,label:"deliveryAddress",onChange:z("deliveryAddress"),setComponentRef:E.deliveryAddress,visibility:k.deliveryAddress}),I&&e(d,{data:P,errorMessage:!!M.consentCheckbox,label:A.consentCheckboxLabel,onChange:e=>{const{checked:s}=e.target;V(e=>({...e,consentCheckbox:s})),O(e=>({...e,consentCheckbox:s})),N(e=>({...e,consentCheckbox:s?null:f}))},i18n:g}),A.showPayButton&&A.payButton({status:L,classNameModifiers:[...S?["standalone"]:[]],label:g.get("confirmPurchase")}))}export{A as default};
+import{createElement as e}from"../../../external/preact/dist/preact.js";import{useRef as s,useState as o,useEffect as r}from"../../../external/preact/hooks/dist/hooks.js";import i from"../../../_virtual/index.js";import{useCoreContext as n}from"../../../core/Context/CoreProvider.js";import a from"../CompanyDetails/CompanyDetails.js";import t from"../PersonalDetails/PersonalDetails.js";import l from"../Address/Address.js";import d from"../FormFields/Checkbox/Checkbox.js";import c from"../FormFields/ConsentCheckbox/ConsentCheckbox.js";import{getInitialActiveFieldsets as m,fieldsetsSchema as p,getActiveFieldsData as b}from"./utils.js";import u from"../IbanInput/IbanInput.js";import C from"../FormFields/Field/Field.js";import y from"../FormInstruction/FormInstruction.js";import h from"./useSRPanelForOpenInvoiceErrors.js";const f={isValid:!1,errorMessage:"consent.checkbox.invalid",error:"consent.checkbox.invalid"};function A(A){const{countryCode:v,visibility:k}=A,{i18n:g}=n(),x=s(!1),D=s(null),F=m(k,A.data),[j,R]=o(F),{current:w}=s(p.reduce((e,s)=>(e[s]=e=>{w[s].current=e},e),{})),E=!!A.consentCheckboxLabel,I=!E&&Object.keys(j).every(e=>!j[e]),S="editable"===k.deliveryAddress&&"hidden"!==k.billingAddress,[V,q]=o({...A.data,...E&&{consentCheckbox:!1}}),[P,M]=o({}),[N,_]=o({}),[L,O]=o("ready"),B=s({setStatus:O,showValidation:()=>{}});B.current.showValidation=()=>{x.current=!0,p.forEach(e=>{w[e].current&&w[e].current.showValidation()}),M({...E&&{consentCheckbox:V.consentCheckbox?null:f}})},r(()=>{A.setComponentRef?.(B.current)},[A.setComponentRef]),h({errors:P,data:V,props:A,isValidating:x,containerRef:D}),r(()=>{const e=Object.keys(j).every(e=>!j[e]||!!N[e]),s=!E||!!N.consentCheckbox,o=e&&s,r=b(j,V);A.onChange({data:r,errors:P,valid:N,isValid:o})},[V,j]);const z=e=>s=>{q(o=>({...o,[e]:s.data})),_(o=>({...o,[e]:s.isValid})),M(o=>({...o,[e]:s.errors}))};return e("div",{ref:D,className:i({"adyen-checkout__open-invoice":!0,"adyen-checkout__open-invoice--loading":"loading"===L})},e(y,null),j.companyDetails&&e(a,{data:A.data.companyDetails,label:"companyDetails",onChange:z("companyDetails"),setComponentRef:w.companyDetails,visibility:k.companyDetails}),j.personalDetails&&e(t,{data:A.data.personalDetails,requiredFields:A.personalDetailsRequiredFields,label:"personalDetails",onChange:z("personalDetails"),setComponentRef:w.personalDetails,visibility:k.personalDetails}),j.bankAccount&&e(u,{holderName:!0,label:"ach.bankAccount",data:V.bankAccount,onChange:z("bankAccount"),ref:w.bankAccount}),j.billingAddress&&e(l,{allowedCountries:A?.billingAddressSpecification?.allowedCountries??A.allowedCountries,countryCode:v,requiredFields:A.billingAddressRequiredFields,specifications:A.billingAddressSpecification,data:V.billingAddress,label:"billingAddress",onChange:z("billingAddress"),setComponentRef:w.billingAddress,visibility:k.billingAddress}),S&&e(C,{classNameModifiers:["separateDeliveryAddress","consentCheckbox"],name:"separateDeliveryAddress",useLabelElement:!1,showErrorElement:!1},e(d,{label:g.get("separateDeliveryAddress"),checked:j.deliveryAddress,classNameModifiers:["separateDeliveryAddress"],name:"separateDeliveryAddress",onChange:()=>{R(e=>({...e,deliveryAddress:!j.deliveryAddress}))}})),j.deliveryAddress&&e(l,{allowedCountries:A?.deliveryAddressSpecification?.allowedCountries??A.allowedCountries,countryCode:v,requiredFields:A.deliveryAddressRequiredFields,specifications:A.deliveryAddressSpecification,data:V.deliveryAddress,label:"deliveryAddress",onChange:z("deliveryAddress"),setComponentRef:w.deliveryAddress,visibility:k.deliveryAddress}),E&&e(c,{data:V,errorMessage:!!P.consentCheckbox,label:A.consentCheckboxLabel,onChange:e=>{const{checked:s}=e.target;q(e=>({...e,consentCheckbox:s})),_(e=>({...e,consentCheckbox:s})),M(e=>({...e,consentCheckbox:s?null:f}))},i18n:g}),A.showPayButton&&A.payButton({status:L,classNameModifiers:[...I?["standalone"]:[]],label:g.get("confirmPurchase")}))}export{A as default};
 //# sourceMappingURL=OpenInvoice.js.map

package/dist/es/components/internal/OpenInvoice/OpenInvoice.js.map

@@ -1 +1 @@
-{"version":3,"file":"OpenInvoice.js","sources":["../../../../../src/components/internal/OpenInvoice/OpenInvoice.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useRef, useState } from 'preact/hooks';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport CompanyDetails from '../CompanyDetails';\nimport PersonalDetails from '../PersonalDetails';\nimport Address from '../Address';\nimport Checkbox from '../FormFields/Checkbox';\nimport ConsentCheckbox from '../FormFields/ConsentCheckbox';\nimport { getActiveFieldsData, getInitialActiveFieldsets, fieldsetsSchema } from './utils';\nimport {\n    OpenInvoiceActiveFieldsets,\n    OpenInvoiceFieldsetsRefs,\n    OpenInvoiceProps,\n    OpenInvoiceStateData,\n    OpenInvoiceStateError,\n    OpenInvoiceStateValid\n} from './types';\nimport './OpenInvoice.scss';\nimport IbanInput from '../IbanInput';\nimport { GenericError } from '../../../core/Errors/types';\nimport Field from '../FormFields/Field';\nimport FormInstruction from '../FormInstruction';\nimport { ComponentMethodsRef } from '../UIElement/types';\nimport useSRPanelForOpenInvoiceErrors from './useSRPanelForOpenInvoiceErrors';\nimport classNames from 'classnames';\n\nconst consentCBErrorObj: GenericError = {\n    isValid: false,\n    errorMessage: 'consent.checkbox.invalid',\n    error: 'consent.checkbox.invalid'\n};\n\nexport default function OpenInvoice(props: Readonly<OpenInvoiceProps>) {\n    const { countryCode, visibility } = props;\n    const { i18n } = useCoreContext();\n\n    /** An object by which to expose 'public' members to the parent UIElement */\n    const openInvoiceRef = useRef<ComponentMethodsRef>({});\n    // Just call once\n    if (!Object.keys(openInvoiceRef.current).length) {\n        props.setComponentRef?.(openInvoiceRef.current);\n    }\n\n    const isValidating = useRef(false);\n    const containerRef = useRef<HTMLDivElement>(null);\n\n    const initialActiveFieldsets: OpenInvoiceActiveFieldsets = getInitialActiveFieldsets(visibility, props.data);\n    const [activeFieldsets, setActiveFieldsets] = useState<OpenInvoiceActiveFieldsets>(initialActiveFieldsets);\n\n    const { current: fieldsetsRefs } = useRef<OpenInvoiceFieldsetsRefs>(\n        fieldsetsSchema.reduce((acc, fieldset) => {\n            acc[fieldset] = ref => {\n                fieldsetsRefs[fieldset].current = ref;\n            };\n            return acc;\n        }, {})\n    );\n\n    const checkFieldsets = () => Object.keys(activeFieldsets).every(fieldset => !activeFieldsets[fieldset] || !!valid[fieldset]);\n    const hasConsentCheckbox = !!props.consentCheckboxLabel;\n    const isStandAloneButton = !hasConsentCheckbox && Object.keys(activeFieldsets).every(key => !activeFieldsets[key]);\n    const showSeparateDeliveryAddressCheckbox = visibility.deliveryAddress === 'editable' && visibility.billingAddress !== 'hidden';\n\n    const [data, setData] = useState<OpenInvoiceStateData>({\n        ...props.data,\n        ...(hasConsentCheckbox && { consentCheckbox: false })\n    });\n    const [errors, setErrors] = useState<OpenInvoiceStateError>({});\n    const [valid, setValid] = useState<OpenInvoiceStateValid>({});\n    const [status, setStatus] = useState('ready');\n\n    // Expose methods expected by parent\n    openInvoiceRef.current.showValidation = () => {\n        isValidating.current = true;\n        fieldsetsSchema.forEach(fieldset => {\n            if (fieldsetsRefs[fieldset].current) fieldsetsRefs[fieldset].current.showValidation();\n        });\n\n        setErrors({\n            ...(hasConsentCheckbox && { consentCheckbox: data.consentCheckbox ? null : consentCBErrorObj })\n        });\n    };\n\n    openInvoiceRef.current.setStatus = setStatus;\n\n    useSRPanelForOpenInvoiceErrors({ errors, data, props, isValidating, containerRef });\n\n    useEffect(() => {\n        const fieldsetsAreValid: boolean = checkFieldsets();\n        const consentCheckboxValid: boolean = !hasConsentCheckbox || !!valid.consentCheckbox;\n        const isValid: boolean = fieldsetsAreValid && consentCheckboxValid;\n        const newData: OpenInvoiceStateData = getActiveFieldsData(activeFieldsets, data);\n        props.onChange({ data: newData, errors, valid, isValid });\n    }, [data, activeFieldsets]);\n\n    const handleFieldset = key => state => {\n        setData(prevData => ({ ...prevData, [key]: state.data }));\n        setValid(prevValid => ({ ...prevValid, [key]: state.isValid }));\n        setErrors(prevErrors => ({ ...prevErrors, [key]: state.errors }));\n    };\n\n    const handleSeparateDeliveryAddress = () => {\n        setActiveFieldsets(prevActiveFields => ({\n            ...prevActiveFields,\n            deliveryAddress: !activeFieldsets.deliveryAddress\n        }));\n    };\n\n    const handleConsentCheckbox = e => {\n        const { checked } = e.target;\n        setData(prevData => ({ ...prevData, consentCheckbox: checked }));\n        setValid(prevValid => ({ ...prevValid, consentCheckbox: checked }));\n        setErrors(prevErrors => ({ ...prevErrors, ...{ consentCheckbox: !checked ? consentCBErrorObj : null } }));\n    };\n    return (\n        <div\n            ref={containerRef}\n            className={classNames({\n                'adyen-checkout__open-invoice': true,\n                'adyen-checkout__open-invoice--loading': status === 'loading'\n            })}\n        >\n            <FormInstruction />\n\n            {activeFieldsets.companyDetails && (\n                <CompanyDetails\n                    data={props.data.companyDetails}\n                    label=\"companyDetails\"\n                    onChange={handleFieldset('companyDetails')}\n                    setComponentRef={fieldsetsRefs.companyDetails}\n                    visibility={visibility.companyDetails}\n                />\n            )}\n\n            {activeFieldsets.personalDetails && (\n                <PersonalDetails\n                    data={props.data.personalDetails}\n                    requiredFields={props.personalDetailsRequiredFields}\n                    label=\"personalDetails\"\n                    onChange={handleFieldset('personalDetails')}\n                    setComponentRef={fieldsetsRefs.personalDetails}\n                    visibility={visibility.personalDetails}\n                />\n            )}\n\n            {activeFieldsets.bankAccount && (\n                <IbanInput\n                    holderName={true}\n                    label=\"ach.bankAccount\"\n                    data={data.bankAccount}\n                    onChange={handleFieldset('bankAccount')}\n                    ref={fieldsetsRefs.bankAccount}\n                />\n            )}\n\n            {activeFieldsets.billingAddress && (\n                <Address\n                    allowedCountries={props?.billingAddressSpecification?.allowedCountries ?? props.allowedCountries}\n                    countryCode={countryCode}\n                    requiredFields={props.billingAddressRequiredFields}\n                    specifications={props.billingAddressSpecification}\n                    data={data.billingAddress}\n                    label=\"billingAddress\"\n                    onChange={handleFieldset('billingAddress')}\n                    setComponentRef={fieldsetsRefs.billingAddress}\n                    visibility={visibility.billingAddress}\n                />\n            )}\n\n            {showSeparateDeliveryAddressCheckbox && (\n                <Field\n                    classNameModifiers={['separateDeliveryAddress', 'consentCheckbox']}\n                    name={'separateDeliveryAddress'}\n                    useLabelElement={false}\n                    showErrorElement={false}\n                >\n                    <Checkbox\n                        label={i18n.get('separateDeliveryAddress')}\n                        checked={activeFieldsets.deliveryAddress}\n                        classNameModifiers={['separateDeliveryAddress']}\n                        name={'separateDeliveryAddress'}\n                        onChange={handleSeparateDeliveryAddress}\n                    />\n                </Field>\n            )}\n\n            {activeFieldsets.deliveryAddress && (\n                <Address\n                    allowedCountries={props?.deliveryAddressSpecification?.allowedCountries ?? props.allowedCountries}\n                    countryCode={countryCode}\n                    requiredFields={props.deliveryAddressRequiredFields}\n                    specifications={props.deliveryAddressSpecification}\n                    data={data.deliveryAddress}\n                    label=\"deliveryAddress\"\n                    onChange={handleFieldset('deliveryAddress')}\n                    setComponentRef={fieldsetsRefs.deliveryAddress}\n                    visibility={visibility.deliveryAddress}\n                />\n            )}\n\n            {hasConsentCheckbox && (\n                <ConsentCheckbox\n                    data={data}\n                    errorMessage={!!errors.consentCheckbox}\n                    label={props.consentCheckboxLabel}\n                    onChange={handleConsentCheckbox}\n                    i18n={i18n}\n                />\n            )}\n\n            {props.showPayButton &&\n                props.payButton({\n                    status,\n                    classNameModifiers: [...(isStandAloneButton ? ['standalone'] : [])],\n                    label: i18n.get('confirmPurchase')\n                })}\n        </div>\n    );\n}\n"],"names":["consentCBErrorObj","isValid","errorMessage","error","OpenInvoice","props","countryCode","visibility","i18n","useCoreContext","openInvoiceRef","useRef","Object","keys","current","length","setComponentRef","isValidating","containerRef","initialActiveFieldsets","getInitialActiveFieldsets","data","activeFieldsets","setActiveFieldsets","useState","fieldsetsRefs","fieldsetsSchema","reduce","acc","fieldset","ref","hasConsentCheckbox","consentCheckboxLabel","isStandAloneButton","every","key","showSeparateDeliveryAddressCheckbox","deliveryAddress","billingAddress","setData","consentCheckbox","errors","setErrors","valid","setValid","status","setStatus","showValidation","forEach","useSRPanelForOpenInvoiceErrors","useEffect","fieldsetsAreValid","consentCheckboxValid","newData","getActiveFieldsData","onChange","handleFieldset","state","prevData","prevValid","prevErrors","h","div","className","classNames","FormInstruction","companyDetails","CompanyDetails","label","personalDetails","PersonalDetails","requiredFields","personalDetailsRequiredFields","bankAccount","IbanInput","holderName","Address","allowedCountries","billingAddressSpecification","billingAddressRequiredFields","specifications","Field","classNameModifiers","name","useLabelElement","showErrorElement","Checkbox","get","checked","prevActiveFields","deliveryAddressSpecification","deliveryAddressRequiredFields","ConsentCheckbox","e","target","showPayButton","payButton"],"mappings":"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"}
+{"version":3,"file":"OpenInvoice.js","sources":["../../../../../src/components/internal/OpenInvoice/OpenInvoice.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useRef, useState } from 'preact/hooks';\nimport classNames from 'classnames';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport CompanyDetails from '../CompanyDetails';\nimport PersonalDetails from '../PersonalDetails';\nimport Address from '../Address';\nimport Checkbox from '../FormFields/Checkbox';\nimport ConsentCheckbox from '../FormFields/ConsentCheckbox';\nimport { getActiveFieldsData, getInitialActiveFieldsets, fieldsetsSchema } from './utils';\nimport {\n    OpenInvoiceActiveFieldsets,\n    OpenInvoiceFieldsetsRefs,\n    OpenInvoiceProps,\n    OpenInvoiceStateData,\n    OpenInvoiceStateError,\n    OpenInvoiceStateValid\n} from './types';\nimport IbanInput from '../IbanInput';\nimport { GenericError } from '../../../core/Errors/types';\nimport Field from '../FormFields/Field';\nimport FormInstruction from '../FormInstruction';\nimport { ComponentMethodsRef } from '../UIElement/types';\nimport useSRPanelForOpenInvoiceErrors from './useSRPanelForOpenInvoiceErrors';\nimport './OpenInvoice.scss';\n\nconst consentCBErrorObj: GenericError = {\n    isValid: false,\n    errorMessage: 'consent.checkbox.invalid',\n    error: 'consent.checkbox.invalid'\n};\n\nexport default function OpenInvoice(props: Readonly<OpenInvoiceProps>) {\n    const { countryCode, visibility } = props;\n    const { i18n } = useCoreContext();\n\n    const isValidating = useRef(false);\n    const containerRef = useRef<HTMLDivElement>(null);\n\n    const initialActiveFieldsets: OpenInvoiceActiveFieldsets = getInitialActiveFieldsets(visibility, props.data);\n    const [activeFieldsets, setActiveFieldsets] = useState<OpenInvoiceActiveFieldsets>(initialActiveFieldsets);\n\n    const { current: fieldsetsRefs } = useRef<OpenInvoiceFieldsetsRefs>(\n        fieldsetsSchema.reduce((acc, fieldset) => {\n            acc[fieldset] = ref => {\n                fieldsetsRefs[fieldset].current = ref;\n            };\n            return acc;\n        }, {})\n    );\n\n    const checkFieldsets = () => Object.keys(activeFieldsets).every(fieldset => !activeFieldsets[fieldset] || !!valid[fieldset]);\n    const hasConsentCheckbox = !!props.consentCheckboxLabel;\n    const isStandAloneButton = !hasConsentCheckbox && Object.keys(activeFieldsets).every(key => !activeFieldsets[key]);\n    const showSeparateDeliveryAddressCheckbox = visibility.deliveryAddress === 'editable' && visibility.billingAddress !== 'hidden';\n\n    const [data, setData] = useState<OpenInvoiceStateData>({\n        ...props.data,\n        ...(hasConsentCheckbox && { consentCheckbox: false })\n    });\n    const [errors, setErrors] = useState<OpenInvoiceStateError>({});\n    const [valid, setValid] = useState<OpenInvoiceStateValid>({});\n    const [status, setStatus] = useState('ready');\n\n    const openInvoiceRef = useRef<ComponentMethodsRef>({\n        setStatus,\n        showValidation: () => {}\n    });\n\n    openInvoiceRef.current.showValidation = () => {\n        isValidating.current = true;\n        fieldsetsSchema.forEach(fieldset => {\n            if (fieldsetsRefs[fieldset].current) fieldsetsRefs[fieldset].current.showValidation();\n        });\n\n        setErrors({\n            ...(hasConsentCheckbox && { consentCheckbox: data.consentCheckbox ? null : consentCBErrorObj })\n        });\n    };\n\n    useEffect(() => {\n        props.setComponentRef?.(openInvoiceRef.current);\n    }, [props.setComponentRef]);\n\n    useSRPanelForOpenInvoiceErrors({ errors, data, props, isValidating, containerRef });\n\n    useEffect(() => {\n        const fieldsetsAreValid: boolean = checkFieldsets();\n        const consentCheckboxValid: boolean = !hasConsentCheckbox || !!valid.consentCheckbox;\n        const isValid: boolean = fieldsetsAreValid && consentCheckboxValid;\n        const newData: OpenInvoiceStateData = getActiveFieldsData(activeFieldsets, data);\n        props.onChange({ data: newData, errors, valid, isValid });\n    }, [data, activeFieldsets]);\n\n    const handleFieldset = key => state => {\n        setData(prevData => ({ ...prevData, [key]: state.data }));\n        setValid(prevValid => ({ ...prevValid, [key]: state.isValid }));\n        setErrors(prevErrors => ({ ...prevErrors, [key]: state.errors }));\n    };\n\n    const handleSeparateDeliveryAddress = () => {\n        setActiveFieldsets(prevActiveFields => ({\n            ...prevActiveFields,\n            deliveryAddress: !activeFieldsets.deliveryAddress\n        }));\n    };\n\n    const handleConsentCheckbox = e => {\n        const { checked } = e.target;\n        setData(prevData => ({ ...prevData, consentCheckbox: checked }));\n        setValid(prevValid => ({ ...prevValid, consentCheckbox: checked }));\n        setErrors(prevErrors => ({ ...prevErrors, ...{ consentCheckbox: !checked ? consentCBErrorObj : null } }));\n    };\n    return (\n        <div\n            ref={containerRef}\n            className={classNames({\n                'adyen-checkout__open-invoice': true,\n                'adyen-checkout__open-invoice--loading': status === 'loading'\n            })}\n        >\n            <FormInstruction />\n\n            {activeFieldsets.companyDetails && (\n                <CompanyDetails\n                    data={props.data.companyDetails}\n                    label=\"companyDetails\"\n                    onChange={handleFieldset('companyDetails')}\n                    setComponentRef={fieldsetsRefs.companyDetails}\n                    visibility={visibility.companyDetails}\n                />\n            )}\n\n            {activeFieldsets.personalDetails && (\n                <PersonalDetails\n                    data={props.data.personalDetails}\n                    requiredFields={props.personalDetailsRequiredFields}\n                    label=\"personalDetails\"\n                    onChange={handleFieldset('personalDetails')}\n                    setComponentRef={fieldsetsRefs.personalDetails}\n                    visibility={visibility.personalDetails}\n                />\n            )}\n\n            {activeFieldsets.bankAccount && (\n                <IbanInput\n                    holderName={true}\n                    label=\"ach.bankAccount\"\n                    data={data.bankAccount}\n                    onChange={handleFieldset('bankAccount')}\n                    ref={fieldsetsRefs.bankAccount}\n                />\n            )}\n\n            {activeFieldsets.billingAddress && (\n                <Address\n                    allowedCountries={props?.billingAddressSpecification?.allowedCountries ?? props.allowedCountries}\n                    countryCode={countryCode}\n                    requiredFields={props.billingAddressRequiredFields}\n                    specifications={props.billingAddressSpecification}\n                    data={data.billingAddress}\n                    label=\"billingAddress\"\n                    onChange={handleFieldset('billingAddress')}\n                    setComponentRef={fieldsetsRefs.billingAddress}\n                    visibility={visibility.billingAddress}\n                />\n            )}\n\n            {showSeparateDeliveryAddressCheckbox && (\n                <Field\n                    classNameModifiers={['separateDeliveryAddress', 'consentCheckbox']}\n                    name={'separateDeliveryAddress'}\n                    useLabelElement={false}\n                    showErrorElement={false}\n                >\n                    <Checkbox\n                        label={i18n.get('separateDeliveryAddress')}\n                        checked={activeFieldsets.deliveryAddress}\n                        classNameModifiers={['separateDeliveryAddress']}\n                        name={'separateDeliveryAddress'}\n                        onChange={handleSeparateDeliveryAddress}\n                    />\n                </Field>\n            )}\n\n            {activeFieldsets.deliveryAddress && (\n                <Address\n                    allowedCountries={props?.deliveryAddressSpecification?.allowedCountries ?? props.allowedCountries}\n                    countryCode={countryCode}\n                    requiredFields={props.deliveryAddressRequiredFields}\n                    specifications={props.deliveryAddressSpecification}\n                    data={data.deliveryAddress}\n                    label=\"deliveryAddress\"\n                    onChange={handleFieldset('deliveryAddress')}\n                    setComponentRef={fieldsetsRefs.deliveryAddress}\n                    visibility={visibility.deliveryAddress}\n                />\n            )}\n\n            {hasConsentCheckbox && (\n                <ConsentCheckbox\n                    data={data}\n                    errorMessage={!!errors.consentCheckbox}\n                    label={props.consentCheckboxLabel}\n                    onChange={handleConsentCheckbox}\n                    i18n={i18n}\n                />\n            )}\n\n            {props.showPayButton &&\n                props.payButton({\n                    status,\n                    classNameModifiers: [...(isStandAloneButton ? ['standalone'] : [])],\n                    label: i18n.get('confirmPurchase')\n                })}\n        </div>\n    );\n}\n"],"names":["consentCBErrorObj","isValid","errorMessage","error","OpenInvoice","props","countryCode","visibility","i18n","useCoreContext","isValidating","useRef","containerRef","initialActiveFieldsets","getInitialActiveFieldsets","data","activeFieldsets","setActiveFieldsets","useState","current","fieldsetsRefs","fieldsetsSchema","reduce","acc","fieldset","ref","hasConsentCheckbox","consentCheckboxLabel","isStandAloneButton","Object","keys","every","key","showSeparateDeliveryAddressCheckbox","deliveryAddress","billingAddress","setData","consentCheckbox","errors","setErrors","valid","setValid","status","setStatus","openInvoiceRef","showValidation","forEach","useEffect","setComponentRef","useSRPanelForOpenInvoiceErrors","fieldsetsAreValid","consentCheckboxValid","newData","getActiveFieldsData","onChange","handleFieldset","state","prevData","prevValid","prevErrors","h","div","className","classNames","FormInstruction","companyDetails","CompanyDetails","label","personalDetails","PersonalDetails","requiredFields","personalDetailsRequiredFields","bankAccount","IbanInput","holderName","Address","allowedCountries","billingAddressSpecification","billingAddressRequiredFields","specifications","Field","classNameModifiers","name","useLabelElement","showErrorElement","Checkbox","get","checked","prevActiveFields","deliveryAddressSpecification","deliveryAddressRequiredFields","ConsentCheckbox","e","target","showPayButton","payButton"],"mappings":"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"}

package/dist/es/components/internal/PhoneInput/PhoneInputForm.js

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../external/preact/dist/preact.js";import{useEffect as r,useRef as o,useCallback as t}from"../../../external/preact/hooks/dist/hooks.js";import s from"../../../utils/useForm/useForm.js";import"../SecuredFields/lib/CSF/utils/userAgent.js";import{useCoreContext as i}from"../../../core/Context/CoreProvider.js";import{phoneValidationRules as n,phoneFormatters as a}from"./validate.js";import l from"../FormFields/Fieldset/Fieldset.js";import m from"./PhoneInputFields.js";function u(u){const{i18n:d}=i(),p=u.requiredFields||[...u?.items?.length?["phonePrefix"]:[],"phoneNumber"],f=p.includes("phonePrefix")&&!!u?.items?.length,h=p.includes("phoneNumber"),c=s({...u,schema:p,defaultData:u.data,rules:n,formatters:a});r(()=>{c.setSchema(p)},[p.toString()]);const{data:g,valid:F,errors:b,isValid:j,triggerValidation:x}=c;r(()=>{u.onChange({data:g,valid:F,errors:b,isValid:j})},[g,F,b,j]);const C=o({showValidation:x});r(()=>{u.setComponentRef(C.current)},[u.setComponentRef]);const N=t(e=>{if(b[e]){const r="phoneNumber"===e?"phoneNumberErrorKey":"phonePrefixErrorKey",o=u[r]?u[r]:b[e].errorMessage;return d.get(o)??null}return null},[b]);return e(l,{classNameModifiers:["phone-input"]},e(m,{getError:N,showNumber:h,showPrefix:f,form:c,...u}))}u.defaultProps={phoneLabel:"telephoneNumber"};export{u as default};
+import{createElement as e}from"../../../external/preact/dist/preact.js";import{useEffect as r,useRef as t,useCallback as o}from"../../../external/preact/hooks/dist/hooks.js";import s from"../../../utils/useForm/useForm.js";import"../SecuredFields/lib/CSF/utils/userAgent.js";import{useCoreContext as i}from"../../../core/Context/CoreProvider.js";import{phoneValidationRules as n,phoneFormatters as a}from"./validate.js";import l from"../FormFields/Fieldset/Fieldset.js";import m from"./PhoneInputFields.js";function u(u){const{i18n:p}=i(),d=u.requiredFields||[...u?.items?.length?["phonePrefix"]:[],"phoneNumber"],f=d.includes("phonePrefix")&&!!u?.items?.length,h=d.includes("phoneNumber"),c=s({...u,schema:d,defaultData:u.data,rules:n,formatters:a});r(()=>{c.setSchema(d)},[d.toString()]);const{data:g,valid:F,errors:b,isValid:j,triggerValidation:x}=c;r(()=>{u.onChange({data:g,valid:F,errors:b,isValid:j})},[g,F,b,j]);const C=t({showValidation:x});r(()=>{u.setComponentRef(C.current)},[u.setComponentRef]);const N=o(e=>{if(b[e]){const r="phoneNumber"===e?"phoneNumberErrorKey":"phonePrefixErrorKey",t=u[r]?u[r]:b[e].errorMessage;return"string"==typeof t?p.get(t):null}return null},[b]);return e(l,{classNameModifiers:["phone-input"]},e(m,{getError:N,showNumber:h,showPrefix:f,form:c,...u}))}u.defaultProps={phoneLabel:"telephoneNumber"};export{u as default};
 //# sourceMappingURL=PhoneInputForm.js.map

package/dist/es/components/internal/PhoneInput/PhoneInputForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"PhoneInputForm.js","sources":["../../../../../src/components/internal/PhoneInput/PhoneInputForm.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useCallback, useRef } from 'preact/hooks';\nimport useForm from '../../../utils/useForm';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport './PhoneInput.scss';\nimport { phoneFormatters, phoneValidationRules } from './validate';\nimport { PhoneInputFormProps, PhoneInputSchema } from './types';\nimport Fieldset from '../FormFields/Fieldset';\nimport PhoneInputFields from './PhoneInputFields';\nimport { ComponentMethodsRef } from '../UIElement/types';\n\n/**\n *\n * @param PhoneInputFormProps\n * @constructor\n */\nfunction PhoneInputForm(props: Readonly<PhoneInputFormProps>) {\n    const { i18n } = useCoreContext();\n\n    const schema = props.requiredFields || [...(props?.items?.length ? ['phonePrefix'] : []), 'phoneNumber'];\n    const showPrefix = schema.includes('phonePrefix') && !!props?.items?.length;\n    const showNumber = schema.includes('phoneNumber');\n\n    const form = useForm<PhoneInputSchema>({\n        i18n,\n        ...props,\n        schema,\n        defaultData: props.data,\n        rules: phoneValidationRules,\n        formatters: phoneFormatters\n    });\n\n    useEffect(() => {\n        form.setSchema(schema);\n    }, [schema.toString()]);\n\n    const { data, valid, errors, isValid, triggerValidation } = form;\n\n    useEffect(() => {\n        props.onChange({ data, valid, errors, isValid });\n    }, [data, valid, errors, isValid]);\n\n    const componentRef = useRef<ComponentMethodsRef>({\n        showValidation: triggerValidation\n    });\n\n    useEffect(() => {\n        props.setComponentRef(componentRef.current);\n    }, [props.setComponentRef]);\n\n    // This is here for MBWay, prob should be moved up\n    // MBWay has a weird way of loading its error messages\n    // They come form the prop phoneNumberErrorKey: 'mobileNumber.invalid'\n    // Strangely it's defined as invalidPhoneNumber in the validation rules\n    const getPhoneFieldError = useCallback(\n        (field: string) => {\n            if (errors[field]) {\n                const propsField = field === 'phoneNumber' ? 'phoneNumberErrorKey' : 'phonePrefixErrorKey';\n                const key = props[propsField] ? props[propsField] : errors[field].errorMessage;\n                return i18n.get(key) ?? null;\n            }\n            return null;\n        },\n        [errors]\n    );\n\n    return (\n        <Fieldset classNameModifiers={['phone-input']}>\n            <PhoneInputFields getError={getPhoneFieldError} showNumber={showNumber} showPrefix={showPrefix} form={form} {...props} />\n        </Fieldset>\n    );\n}\n\nPhoneInputForm.defaultProps = {\n    phoneLabel: 'telephoneNumber'\n};\n\nexport default PhoneInputForm;\n"],"names":["PhoneInputForm","props","i18n","useCoreContext","schema","requiredFields","items","length","showPrefix","includes","showNumber","form","useForm","defaultData","data","rules","phoneValidationRules","formatters","phoneFormatters","useEffect","setSchema","toString","valid","errors","isValid","triggerValidation","onChange","componentRef","useRef","showValidation","setComponentRef","current","getPhoneFieldError","useCallback","field","propsField","key","errorMessage","get","h","Fieldset","classNameModifiers","PhoneInputFields","getError","defaultProps","phoneLabel"],"mappings":"2fAgBA,SAASA,EAAeC,GACpB,MAAMC,KAAEA,GAASC,IAEXC,EAASH,EAAMI,gBAAkB,IAAKJ,GAAOK,OAAOC,OAAS,CAAC,eAAiB,GAAK,eACpFC,EAAaJ,EAAOK,SAAS,kBAAoBR,GAAOK,OAAOC,OAC/DG,EAAaN,EAAOK,SAAS,eAE7BE,EAAOC,EAA0B,IAEhCX,EACHG,SACAS,YAAaZ,EAAMa,KACnBC,MAAOC,EACPC,WAAYC,IAGhBC,EAAU,KACNR,EAAKS,UAAUhB,IAChB,CAACA,EAAOiB,aAEX,MAAMP,KAAEA,EAAIQ,MAAEA,EAAKC,OAAEA,EAAMC,QAAEA,EAAOC,kBAAEA,GAAsBd,EAE5DQ,EAAU,KACNlB,EAAMyB,SAAS,CAAEZ,OAAMQ,QAAOC,SAAQC,aACvC,CAACV,EAAMQ,EAAOC,EAAQC,IAEzB,MAAMG,EAAeC,EAA4B,CAC7CC,eAAgBJ,IAGpBN,EAAU,KACNlB,EAAM6B,gBAAgBH,EAAaI,UACpC,CAAC9B,EAAM6B,kBAMV,MAAME,EAAqBC,EACtBC,IACG,GAAIX,EAAOW,GAAQ,CACf,MAAMC,EAAuB,gBAAVD,EAA0B,sBAAwB,sBAC/DE,EAAMnC,EAAMkC,GAAclC,EAAMkC,GAAcZ,EAAOW,GAAOG,aAClE,OAAOnC,EAAKoC,IAAIF,IAAQ,IAC5B,CACA,OAAO,MAEX,CAACb,IAGL,OACIgB,EAACC,EAAAA,CAASC,mBAAoB,CAAC,gBAC3BF,EAACG,EAAAA,CAAiBC,SAAUX,EAAoBtB,WAAYA,EAAYF,WAAYA,EAAYG,KAAMA,KAAUV,IAG5H,CAEAD,EAAe4C,aAAe,CAC1BC,WAAY"}
+{"version":3,"file":"PhoneInputForm.js","sources":["../../../../../src/components/internal/PhoneInput/PhoneInputForm.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useCallback, useRef } from 'preact/hooks';\nimport useForm from '../../../utils/useForm';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport './PhoneInput.scss';\nimport { phoneFormatters, phoneValidationRules } from './validate';\nimport { PhoneInputFormProps, PhoneInputSchema } from './types';\nimport Fieldset from '../FormFields/Fieldset';\nimport PhoneInputFields from './PhoneInputFields';\nimport { ComponentMethodsRef } from '../UIElement/types';\n\n/**\n *\n * @param PhoneInputFormProps\n * @constructor\n */\nfunction PhoneInputForm(props: Readonly<PhoneInputFormProps>) {\n    const { i18n } = useCoreContext();\n\n    const schema = props.requiredFields || [...(props?.items?.length ? ['phonePrefix'] : []), 'phoneNumber'];\n    const showPrefix = schema.includes('phonePrefix') && !!props?.items?.length;\n    const showNumber = schema.includes('phoneNumber');\n\n    const form = useForm<PhoneInputSchema>({\n        i18n,\n        ...props,\n        schema,\n        defaultData: props.data,\n        rules: phoneValidationRules,\n        formatters: phoneFormatters\n    });\n\n    useEffect(() => {\n        form.setSchema(schema);\n    }, [schema.toString()]);\n\n    const { data, valid, errors, isValid, triggerValidation } = form;\n\n    useEffect(() => {\n        props.onChange({ data, valid, errors, isValid });\n    }, [data, valid, errors, isValid]);\n\n    const componentRef = useRef<ComponentMethodsRef>({\n        showValidation: triggerValidation\n    });\n\n    useEffect(() => {\n        props.setComponentRef(componentRef.current);\n    }, [props.setComponentRef]);\n\n    // This is here for MBWay, prob should be moved up\n    // MBWay has a weird way of loading its error messages\n    // They come form the prop phoneNumberErrorKey: 'mobileNumber.invalid'\n    // Strangely it's defined as invalidPhoneNumber in the validation rules\n    const getPhoneFieldError = useCallback(\n        (field: string) => {\n            if (errors[field]) {\n                const propsField = field === 'phoneNumber' ? 'phoneNumberErrorKey' : 'phonePrefixErrorKey';\n                const key = props[propsField] ? props[propsField] : errors[field].errorMessage;\n                return typeof key === 'string' ? i18n.get(key) : null;\n            }\n            return null;\n        },\n        [errors]\n    );\n\n    return (\n        <Fieldset classNameModifiers={['phone-input']}>\n            <PhoneInputFields getError={getPhoneFieldError} showNumber={showNumber} showPrefix={showPrefix} form={form} {...props} />\n        </Fieldset>\n    );\n}\n\nPhoneInputForm.defaultProps = {\n    phoneLabel: 'telephoneNumber'\n};\n\nexport default PhoneInputForm;\n"],"names":["PhoneInputForm","props","i18n","useCoreContext","schema","requiredFields","items","length","showPrefix","includes","showNumber","form","useForm","defaultData","data","rules","phoneValidationRules","formatters","phoneFormatters","useEffect","setSchema","toString","valid","errors","isValid","triggerValidation","onChange","componentRef","useRef","showValidation","setComponentRef","current","getPhoneFieldError","useCallback","field","propsField","key","errorMessage","get","h","Fieldset","classNameModifiers","PhoneInputFields","getError","defaultProps","phoneLabel"],"mappings":"2fAgBA,SAASA,EAAeC,GACpB,MAAMC,KAAEA,GAASC,IAEXC,EAASH,EAAMI,gBAAkB,IAAKJ,GAAOK,OAAOC,OAAS,CAAC,eAAiB,GAAK,eACpFC,EAAaJ,EAAOK,SAAS,kBAAoBR,GAAOK,OAAOC,OAC/DG,EAAaN,EAAOK,SAAS,eAE7BE,EAAOC,EAA0B,IAEhCX,EACHG,SACAS,YAAaZ,EAAMa,KACnBC,MAAOC,EACPC,WAAYC,IAGhBC,EAAU,KACNR,EAAKS,UAAUhB,IAChB,CAACA,EAAOiB,aAEX,MAAMP,KAAEA,EAAIQ,MAAEA,EAAKC,OAAEA,EAAMC,QAAEA,EAAOC,kBAAEA,GAAsBd,EAE5DQ,EAAU,KACNlB,EAAMyB,SAAS,CAAEZ,OAAMQ,QAAOC,SAAQC,aACvC,CAACV,EAAMQ,EAAOC,EAAQC,IAEzB,MAAMG,EAAeC,EAA4B,CAC7CC,eAAgBJ,IAGpBN,EAAU,KACNlB,EAAM6B,gBAAgBH,EAAaI,UACpC,CAAC9B,EAAM6B,kBAMV,MAAME,EAAqBC,EACtBC,IACG,GAAIX,EAAOW,GAAQ,CACf,MAAMC,EAAuB,gBAAVD,EAA0B,sBAAwB,sBAC/DE,EAAMnC,EAAMkC,GAAclC,EAAMkC,GAAcZ,EAAOW,GAAOG,aAClE,MAAsB,iBAARD,EAAmBlC,EAAKoC,IAAIF,GAAO,IACrD,CACA,OAAO,MAEX,CAACb,IAGL,OACIgB,EAACC,EAAAA,CAASC,mBAAoB,CAAC,gBAC3BF,EAACG,EAAAA,CAAiBC,SAAUX,EAAoBtB,WAAYA,EAAYF,WAAYA,EAAYG,KAAMA,KAAUV,IAG5H,CAEAD,EAAe4C,aAAe,CAC1BC,WAAY"}

package/dist/es/components/internal/RedirectButton/RedirectButton.js

@@ -1,2 +1,2 @@
-import{createElement as t,Fragment as e}from"../../../external/preact/dist/preact.js";import{useCoreContext as o}from"../../../core/Context/CoreProvider.js";import{useState as a}from"../../../external/preact/hooks/dist/hooks.js";import{useAmount as r}from"../../../core/Context/AmountProvider.js";function n({label:n=null,icon:s=null,payButton:i,onSubmit:l,name:u,showPayButton:m,...c}){const{i18n:p}=o(),[d,f]=a("ready"),{amount:h}=r();this.setStatus=t=>{f(t)};if(m)return t(e,null,i({...c,status:d,icon:s,classNameModifiers:["standalone"],label:n||(h&&{}.hasOwnProperty.call(h,"value")&&0===h.value?`${p.get("preauthorizeWith")} ${u}`:`${p.get("continueTo")} ${u}`),onClick:l}))}export{n as default};
+import{createElement as e,Fragment as t}from"../../../external/preact/dist/preact.js";import{useCoreContext as o}from"../../../core/Context/CoreProvider.js";import{useState as a,useRef as r,useEffect as n}from"../../../external/preact/hooks/dist/hooks.js";import{useAmount as s}from"../../../core/Context/AmountProvider.js";function l({label:l=null,icon:u=null,payButton:i,onSubmit:c,name:m,showPayButton:f,setComponentRef:p,...d}){const{i18n:h}=o(),[x,C]=a("ready"),{amount:j}=s(),v=r({setStatus:C});n(()=>{p(v.current)},[p]);if(f)return e(t,null,i({...d,status:x,icon:u,classNameModifiers:["standalone"],label:l||(j&&{}.hasOwnProperty.call(j,"value")&&0===j.value?`${h.get("preauthorizeWith")} ${m}`:`${h.get("continueTo")} ${m}`),onClick:c}))}export{l as default};
 //# sourceMappingURL=RedirectButton.js.map

package/dist/es/components/internal/RedirectButton/RedirectButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"RedirectButton.js","sources":["../../../../../src/components/internal/RedirectButton/RedirectButton.tsx"],"sourcesContent":["import { h, Fragment, Ref } from 'preact';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { useState } from 'preact/hooks';\nimport { useAmount } from '../../../core/Context/AmountProvider';\n\n// TODO this should ideally be remove but we need let prop propagate down\n//  probably not worth changing this behaviour now\nexport interface RedirectButtonProps {\n    label?: string;\n    icon?: string;\n    payButton: Function;\n    onSubmit: Function;\n    name: string;\n    showPayButton: boolean;\n    ref?: Ref<typeof RedirectButton>;\n}\n\nfunction RedirectButton({ label = null, icon = null, payButton, onSubmit, name, showPayButton, ...props }: Readonly<RedirectButtonProps>) {\n    const { i18n } = useCoreContext();\n    const [status, setStatus] = useState('ready');\n    const { amount } = useAmount();\n\n    this.setStatus = newStatus => {\n        setStatus(newStatus);\n    };\n\n    const payButtonLabel = () => {\n        const isZeroAuth = amount && {}.hasOwnProperty.call(amount, 'value') && amount.value === 0;\n        if (isZeroAuth) return `${i18n.get('preauthorizeWith')} ${name}`;\n        return `${i18n.get('continueTo')} ${name}`;\n    };\n\n    if (!showPayButton) {\n        return;\n    }\n\n    return (\n        <Fragment>\n            {payButton({\n                ...props,\n                status,\n                icon,\n                classNameModifiers: ['standalone'],\n                label: label || payButtonLabel(),\n                onClick: onSubmit\n            })}\n        </Fragment>\n    );\n}\n\nexport default RedirectButton;\n"],"names":["RedirectButton","label","icon","payButton","onSubmit","name","showPayButton","props","i18n","useCoreContext","status","setStatus","useState","amount","useAmount","this","newStatus","h","Fragment","classNameModifiers","hasOwnProperty","call","value","get","onClick"],"mappings":"ySAiBA,SAASA,GAAeC,MAAEA,EAAQ,KAAIC,KAAEA,EAAO,KAAIC,UAAEA,EAASC,SAAEA,EAAQC,KAAEA,EAAIC,cAAEA,KAAkBC,IAC9F,MAAMC,KAAEA,GAASC,KACVC,EAAQC,GAAaC,EAAS,UAC/BC,OAAEA,GAAWC,IAEnBC,KAAKJ,UAAYK,IACbL,EAAUK,IASd,GAAKV,EAIL,OACIW,EAACC,OACIf,EAAU,IACJI,EACHG,SACAR,OACAiB,mBAAoB,CAAC,cACrBlB,MAAOA,IAhBIY,GAAU,CAAC,EAAEO,eAAeC,KAAKR,EAAQ,UAA6B,IAAjBA,EAAOS,MACxD,GAAGd,EAAKe,IAAI,uBAAuBlB,IACnD,GAAGG,EAAKe,IAAI,iBAAiBlB,KAe5BmB,QAASpB,IAIzB"}
+{"version":3,"file":"RedirectButton.js","sources":["../../../../../src/components/internal/RedirectButton/RedirectButton.tsx"],"sourcesContent":["import { h, Fragment } from 'preact';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { useEffect, useRef, useState } from 'preact/hooks';\nimport { useAmount } from '../../../core/Context/AmountProvider';\nimport { ComponentMethodsRef } from '../UIElement/types';\n\nexport interface RedirectButtonProps {\n    label?: string;\n    icon?: string;\n    payButton: Function;\n    onSubmit: Function;\n    name: string;\n    showPayButton: boolean;\n    setComponentRef: (ref: ComponentMethodsRef) => void;\n}\n\nfunction RedirectButton({\n    label = null,\n    icon = null,\n    payButton,\n    onSubmit,\n    name,\n    showPayButton,\n    setComponentRef,\n    ...props\n}: Readonly<RedirectButtonProps>) {\n    const { i18n } = useCoreContext();\n    const [status, setStatus] = useState('ready');\n    const { amount } = useAmount();\n\n    const redirectButtonRef = useRef<ComponentMethodsRef>({\n        setStatus: setStatus\n    });\n\n    useEffect(() => {\n        setComponentRef(redirectButtonRef.current);\n    }, [setComponentRef]);\n\n    const payButtonLabel = () => {\n        const isZeroAuth = amount && {}.hasOwnProperty.call(amount, 'value') && amount.value === 0;\n        if (isZeroAuth) return `${i18n.get('preauthorizeWith')} ${name}`;\n        return `${i18n.get('continueTo')} ${name}`;\n    };\n\n    if (!showPayButton) {\n        return;\n    }\n\n    return (\n        <Fragment>\n            {payButton({\n                ...props,\n                status,\n                icon,\n                classNameModifiers: ['standalone'],\n                label: label || payButtonLabel(),\n                onClick: onSubmit\n            })}\n        </Fragment>\n    );\n}\n\nexport default RedirectButton;\n"],"names":["RedirectButton","label","icon","payButton","onSubmit","name","showPayButton","setComponentRef","props","i18n","useCoreContext","status","setStatus","useState","amount","useAmount","redirectButtonRef","useRef","useEffect","current","h","Fragment","classNameModifiers","hasOwnProperty","call","value","get","onClick"],"mappings":"oUAgBA,SAASA,GAAeC,MACpBA,EAAQ,KAAIC,KACZA,EAAO,KAAIC,UACXA,EAASC,SACTA,EAAQC,KACRA,EAAIC,cACJA,EAAaC,gBACbA,KACGC,IAEH,MAAMC,KAAEA,GAASC,KACVC,EAAQC,GAAaC,EAAS,UAC/BC,OAAEA,GAAWC,IAEbC,EAAoBC,EAA4B,CAClDL,UAAWA,IAGfM,EAAU,KACNX,EAAgBS,EAAkBG,UACnC,CAACZ,IAQJ,GAAKD,EAIL,OACIc,EAACC,OACIlB,EAAU,IACJK,EACHG,SACAT,OACAoB,mBAAoB,CAAC,cACrBrB,MAAOA,IAhBIa,GAAU,CAAC,EAAES,eAAeC,KAAKV,EAAQ,UAA6B,IAAjBA,EAAOW,MACxD,GAAGhB,EAAKiB,IAAI,uBAAuBrB,IACnD,GAAGI,EAAKiB,IAAI,iBAAiBrB,KAe5BsB,QAASvB,IAIzB"}

package/dist/es/components/internal/SecuredFields/SFP/SecuredFieldsProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"SecuredFieldsProvider.js","sources":["../../../../../../src/components/internal/SecuredFields/SFP/SecuredFieldsProvider.ts"],"sourcesContent":["import { Component } from 'preact';\nimport { getErrorObject, getFields, getErrorReducer, validFieldsReducer } from './SFPUtils';\nimport initCSF from '../lib/CSF';\nimport handlers from './SecuredFieldsProviderHandlers';\nimport defaultProps from './defaultProps';\nimport { SFPProps, SFPState, SingleBrandResetObject } from './types';\nimport {\n    StylesObject,\n    CardErrorData,\n    CardFocusData,\n    CardBrandData,\n    CardAllValidData,\n    CardFieldValidData,\n    CardAutoCompleteData,\n    CardConfigSuccessData,\n    CardLoadData,\n    SFKeyDownObj,\n    SFFieldType\n} from '../lib/types';\nimport { CSFReturnObject, CSFSetupObject } from '../lib/CSF/types';\nimport { CVC_POLICY_REQUIRED, DATE_POLICY_REQUIRED, DEDICATED_CARD_COMPONENTS, ENCRYPTED_CARD_NUMBER, ENCRYPTED_PWD_FIELD } from '../lib/constants';\nimport { BinLookupResponse } from '../../../Card/types';\nimport AdyenCheckoutError from '../../../../core/Errors/AdyenCheckoutError';\nimport { SFStateErrorObj } from '../../../Card/components/CardInput/types';\nimport { resolveCVCErrorKey } from '../../../Card/components/CardInput/utils';\nimport { getErrorMessageFromCode } from '../../../../core/Errors/utils';\nimport { SF_ErrorCodes } from '../../../../core/Errors/constants';\nimport { TxVariants } from '../../../tx-variants';\n\n/**\n * SecuredFieldsProvider:\n * Initialises & handles the client-side part of SecuredFields\n */\nclass SecuredFieldsProvider extends Component<SFPProps, SFPState> {\n    private csfLoadFailTimeout: number;\n    private readonly csfLoadFailTimeoutMS: number;\n    private readonly csfConfigFailTimeout: number;\n    private readonly csfConfigFailTimeoutMS: number;\n    private numCharsInField: object;\n    private rootNode: HTMLElement;\n    private numDateFields: number;\n    private csf: CSFReturnObject;\n    private readonly handleOnLoad: (obj: CardLoadData) => void;\n    private readonly handleOnConfigSuccess: (obj: CardConfigSuccessData) => void;\n    private readonly handleOnFieldValid: (obj: CardFieldValidData) => void;\n    private readonly handleOnAllValid: (obj: CardAllValidData) => void;\n    private readonly handleOnBrand: (obj: CardBrandData) => void;\n    private readonly handleFocus: (obj: CardFocusData) => void;\n    private readonly handleOnError: (obj: CardErrorData, hasUnsupportedCard?: boolean) => void;\n    private readonly handleOnAutoComplete: (obj: CardAutoCompleteData) => void;\n    private readonly handleOnNoDataRequired: () => void;\n    private readonly handleOnTouchstartIOS: (obj) => void;\n    private readonly handleKeyDown: (obj: SFKeyDownObj) => void;\n    public state: SFPState;\n    public props: SFPProps;\n    private issuingCountryCode: string;\n\n    constructor(props: SFPProps) {\n        super(props);\n\n        const stateObj: SFPState = {\n            status: 'loading',\n            brand: props.type,\n            errors: {},\n            valid: {},\n            data: {},\n            cvcPolicy: CVC_POLICY_REQUIRED,\n            expiryDatePolicy: DATE_POLICY_REQUIRED,\n            isSfpValid: false,\n            hasKoreanFields: props.hasKoreanFields\n        };\n        this.state = stateObj;\n\n        this.csfLoadFailTimeout = null;\n        this.csfLoadFailTimeoutMS = 30000;\n\n        this.csfConfigFailTimeout = null;\n        this.csfConfigFailTimeoutMS = 15000;\n\n        this.numCharsInField = {};\n\n        // Handlers\n        this.handleOnLoad = handlers.handleOnLoad.bind(this);\n        this.handleOnConfigSuccess = handlers.handleOnConfigSuccess.bind(this);\n        this.handleOnFieldValid = handlers.handleOnFieldValid.bind(this);\n        this.handleOnAllValid = handlers.handleOnAllValid.bind(this);\n        this.handleOnBrand = handlers.handleOnBrand.bind(this);\n        this.handleFocus = handlers.handleFocus.bind(this);\n        this.handleOnError = handlers.handleOnError.bind(this);\n        this.handleOnNoDataRequired = handlers.handleOnNoDataRequired.bind(this);\n        this.handleOnAutoComplete = handlers.handleOnAutoComplete.bind(this);\n        this.handleOnTouchstartIOS = handlers.handleOnTouchstartIOS.bind(this); // Only called when iOS detected\n        this.handleKeyDown = handlers.handleKeyDown.bind(this);\n\n        this.processBinLookupResponse = this.processBinLookupResponse.bind(this);\n\n        // Bindings for functions exposed to users of this component: SecuredFields & CardInput\n        this.setFocusOn = this.setFocusOn.bind(this);\n        this.updateStyles = this.updateStyles.bind(this);\n        this.handleUnsupportedCard = this.handleUnsupportedCard.bind(this);\n        this.showValidation = this.showValidation.bind(this);\n        this.destroy = this.destroy.bind(this);\n    }\n\n    public static readonly defaultProps = defaultProps;\n\n    public componentDidMount(): void {\n        // When SFP instantiated through SecuredFieldsInput c.f. CardInput\n        if (this.props.rootNode) {\n            this.setRootNode(this.props.rootNode);\n        }\n\n        // Find encryptedFields and map them to the values we use to store valid states\n        const fields = getFields(this.rootNode);\n        const valid = fields.reduce(validFieldsReducer, {});\n\n        this.setState({ valid });\n\n        // Populate numCharsInField object\n        fields.forEach(field => {\n            this.numCharsInField[field] = 0;\n        });\n\n        // Store how many dateFields we are dealing with visually\n        this.numDateFields = fields.filter(f => f.match(/Expiry/)).length;\n\n        if (fields.length) {\n            this.destroy();\n            this.initializeCSF(this.rootNode);\n        } else {\n            if (this.props.componentType === (TxVariants.customCard as string)) {\n                console.debug(\n                    'You are trying to create a CustomCard component but the element into which you are trying to mount the CustomCard component does not contain any elements with a \"data-cse\" attribute e.g. <div data-cse=\"encryptedCardNumber\"></div>'\n                );\n            }\n            this.handleOnNoDataRequired();\n        }\n    }\n\n    public componentDidUpdate() {\n        this.checkForKCPFields();\n        // Pass all the state data up - Used right now for loading status\n        this.props.onStateUpdate?.(this.state);\n    }\n\n    public componentWillUnmount(): void {\n        this.csf = null;\n        clearTimeout(this.csfLoadFailTimeout);\n        clearTimeout(this.csfConfigFailTimeout);\n    }\n\n    private initializeCSF(root: HTMLElement): void {\n        let loadingContext = this.props.loadingContext;\n\n        // For loading securedFields from local server during development\n        if (process.env.NODE_ENV === 'development' && process.env.__SF_ENV__ !== 'build') {\n            loadingContext = process.env.__SF_ENV__;\n        }\n\n        const csfSetupObj: CSFSetupObject = {\n            rootNode: root,\n            type: this.props.type,\n            componentType: this.props.componentType,\n            clientKey: this.props.clientKey,\n            cardGroupTypes: this.props.brands,\n            autoFocus: this.props.autoFocus,\n            trimTrailingSeparator: this.props.trimTrailingSeparator,\n            loadingContext,\n            keypadFix: this.props.keypadFix,\n            showWarnings: this.props.showWarnings,\n            iframeUIConfig: {\n                sfStyles: this.props.styles\n            },\n            i18n: this.props.i18n,\n            onSubmitAnalytics: this.props.onSubmitAnalytics,\n            callbacks: {\n                onLoad: this.handleOnLoad,\n                onConfigSuccess: this.handleOnConfigSuccess,\n                onFieldValid: this.handleOnFieldValid,\n                onAllValid: this.handleOnAllValid,\n                onBrand: this.handleOnBrand,\n                onError: this.handleOnError,\n                onFocus: this.handleFocus,\n                onBinValue: this.props.onBinValue,\n                onAutoComplete: this.handleOnAutoComplete,\n                onAdditionalSFConfig: this.props.onAdditionalSFConfig,\n                onAdditionalSFRemoved: this.props.onAdditionalSFRemoved,\n                onTouchstartIOS: this.handleOnTouchstartIOS,\n                onKeyDown: this.handleKeyDown\n            },\n            isKCP: this.state.hasKoreanFields,\n            legacyInputMode: this.props.legacyInputMode,\n            minimumExpiryDate: this.props.minimumExpiryDate,\n            implementationType: this.props.implementationType || 'components', // to distinguish between 'regular' and 'custom' card component\n            forceCompat: this.props.forceCompat,\n            maskSecurityCode: this.props.maskSecurityCode,\n            exposeExpiryDate: this.props.exposeExpiryDate,\n            shouldDisableIOSArrowKeys: !!this.props.disableIOSArrowKeys, // convert whether function has been defined into a boolean\n            placeholders: this.props.placeholders ?? {},\n            showContextualElement: this.props.showContextualElement\n        };\n\n        this.csf = initCSF(csfSetupObj);\n\n        /**\n         * Expect to at least have had the handleOnLoad callback called within this time\n         * - if this hasn't happened then something has happened to interrupt the loading of the securedFields\n         * So we need to clear the loading spinner to see if the securedFields are reporting anything\n         */\n        // @ts-ignore - timout 'type' is a number\n        this.csfLoadFailTimeout = setTimeout(() => {\n            if (this.state.status !== 'ready') {\n                // Hide the spinner\n                this.setState({ status: 'csfLoadFailure' });\n                // Report the error\n                this.props.onError(new AdyenCheckoutError('ERROR', 'secured field iframes have failed to load'));\n            }\n        }, this.csfLoadFailTimeoutMS);\n    }\n\n    private checkForKCPFields() {\n        let needsKoreanFields = false;\n        if (this.props.koreanAuthenticationRequired) {\n            needsKoreanFields = this.issuingCountryCode ? this.issuingCountryCode === 'kr' : this.props.countryCode === 'kr';\n        }\n\n        // Was korean, now isn't - hide password field\n        if (this.state.hasKoreanFields && !needsKoreanFields) {\n            // Clear any stored data\n            const setRemovedFieldState = prevState => ({\n                data: { ...prevState.data, [ENCRYPTED_PWD_FIELD]: undefined },\n                valid: { ...prevState.valid, [ENCRYPTED_PWD_FIELD]: false },\n                errors: { ...prevState.errors, [ENCRYPTED_PWD_FIELD]: null },\n                hasKoreanFields: false\n            });\n\n            this.setState(setRemovedFieldState, () => {\n                this.props.onChange(this.state);\n            });\n\n            this.csf.removeSecuredField(ENCRYPTED_PWD_FIELD);\n            this.csf.setKCPStatus(false);\n        }\n\n        // Wasn't korean, now is - show password field\n        if (!this.state.hasKoreanFields && needsKoreanFields) {\n            const setAddedFieldState = prevState => ({\n                valid: { ...prevState.valid, [ENCRYPTED_PWD_FIELD]: false },\n                hasKoreanFields: true,\n                isSfpValid: false\n            });\n\n            this.setState(setAddedFieldState, () => {\n                this.props.onChange(this.state);\n            });\n\n            this.csf.addSecuredField(ENCRYPTED_PWD_FIELD);\n            this.csf.setKCPStatus(true);\n        }\n    }\n\n    public getChildContext(): object {\n        return { i18n: this.props.i18n };\n    }\n\n    public handleUnsupportedCard(errObj: CardErrorData): boolean {\n        const hasUnsupportedCard = !!errObj.error;\n\n        // Store the brand(s) we detected and which we don't support\n        if (hasUnsupportedCard) {\n            this.setState({ detectedUnsupportedBrands: errObj.detectedBrands });\n        }\n\n        errObj.rootNode = this.rootNode; // Needed for CustomCard\n        this.handleOnError(errObj, hasUnsupportedCard);\n        // Inform CSF that the number field has an unsupportedCard error (or that it has been cleared)\n        if (this.csf) {\n            this.csf.hasUnsupportedCard(ENCRYPTED_CARD_NUMBER, errObj.error);\n        }\n        return hasUnsupportedCard;\n    }\n\n    public setFocusOn(frame: SFFieldType): void {\n        if (this.csf) this.csf.setFocusOnFrame(frame);\n    }\n\n    public updateStyles(stylesObj: StylesObject): void {\n        if (this.csf) this.csf.updateStyles(stylesObj);\n    }\n\n    public sfIsOptionalOrHidden(fieldType: string): boolean {\n        return this.csf.sfIsOptionalOrHidden(fieldType as SFFieldType);\n    }\n\n    public destroy(): void {\n        if (this.csf) this.csf.destroy();\n    }\n\n    public getRootNode(): HTMLElement {\n        return this.rootNode;\n    }\n\n    public showValidation(): void {\n        const { numDateFields, state }: SecuredFieldsProvider = this;\n\n        Object.keys(state.valid)\n            .reduce(getErrorReducer(numDateFields, state), [])\n            .forEach((field: SFFieldType) => {\n                // For each detected error pass an error object to the handler (calls error callback & sets state)\n                const errorObj: CardErrorData = getErrorObject(field, this.rootNode, state);\n                this.handleOnError(errorObj, !!state.detectedUnsupportedBrands);\n                // Inform the secured-fields instance of which fields have been found to have errors\n                if (this.csf && this.csf.isValidated) {\n                    this.csf.isValidated(field, errorObj.error);\n                }\n            });\n    }\n\n    /**\n     * Map SF errors to ValidationRuleResult-like objects, for CardInput component\n     */\n    public mapErrorsToValidationRuleResult(): SFStateErrorObj {\n        const fieldNames: string[] = Object.keys(this.state.errors);\n\n        const sfStateErrorsObj = fieldNames.reduce((acc, fieldName) => {\n            const errorCode = this.state.errors[fieldName];\n            if (errorCode) {\n                acc[fieldName] = {\n                    isValid: false,\n                    errorMessage: getErrorMessageFromCode(errorCode, SF_ErrorCodes), // this is the human-readable, untranslated, explanation of the error that will exist on the error object in card.state.errors\n                    // For v5 the object found in state.errors should also contain the additional properties that used to be sent to the onError callback\n                    // namely: translation, errorCode, a ref to rootNode &, in the case of failed binLookup, an array of the detectedBrands\n                    // CVC's error copy is brand-dependent (Amex vs. others), so resolve the brand-aware\n                    // key here too - otherwise this errorI18n value (consumed by the SR-live-panel and\n                    // the public state.errors.<field>.errorI18n API) would always report the non-Amex text.\n                    errorI18n: this.props.i18n.get(resolveCVCErrorKey(errorCode, this.state.brand === 'amex')),\n                    error: errorCode,\n                    rootNode: this.rootNode,\n                    ...(this.state.detectedUnsupportedBrands && { detectedBrands: this.state.detectedUnsupportedBrands })\n                };\n            } else {\n                acc[fieldName] = null;\n            }\n            return acc;\n        }, {});\n        return sfStateErrorsObj;\n    }\n\n    public processBinLookupResponse(binLookupResponse: BinLookupResponse, resetObject: SingleBrandResetObject): void {\n        // If we were dealing with an unsupported card & now we have a valid /binLookup response (or a response triggering a reset of the UI),\n        // - reset state to clear the error & the stored unsupportedBrands and, in the case of a valid /binLookup response, inform CSF (via handleUnsupportedCard)\n        // (Scenario: from an unsupportedCard state the shopper has pasted another number long enough to trigger a /binLookup)\n        if (this.state.detectedUnsupportedBrands) {\n            this.setState(prevState => ({\n                errors: { ...prevState.errors, [ENCRYPTED_CARD_NUMBER]: null },\n                detectedUnsupportedBrands: null\n            }));\n\n            // If we have some sort of binLookupResponse object then this isn't the reset caused by digits dropping below a threshold\n            // - so call handleUnsupportedCard to clear the error\n            if (this.csf && binLookupResponse) {\n                const errObj: CardErrorData = {\n                    type: 'card',\n                    fieldType: 'encryptedCardNumber',\n                    error: ''\n                };\n                this.handleUnsupportedCard(errObj);\n            }\n        }\n\n        this.issuingCountryCode = binLookupResponse?.issuingCountryCode?.toLowerCase();\n\n        const hasBrandedResetObj = resetObject?.brand;\n\n        /**\n         * Are we dealing with a \"dedicated\" card scenario i.e a card component created as: checkout.create('bcmc') but which can accept multiple brands\n         * - in which case we will need to reset brand and pass on the resetObj to CSF\n         */\n        const mustResetDedicatedBrand = hasBrandedResetObj && DEDICATED_CARD_COMPONENTS.includes(resetObject.brand);\n\n        if (mustResetDedicatedBrand) {\n            // resetObject.brand will be the value of the brand whose logo we want to reshow in the UI\n            this.setState(resetObject, () => {\n                this.props.onChange(this.state);\n            });\n        }\n\n        /**\n         * Scenarios:\n         *\n         * - RESET (binLookupResponse === null): The number of digits in number field has dropped below threshold for BIN lookup\n         * - RESULT (binLookupResponse.supportedBrands.length === 1): binLookup has found a result so inform CSF\n         *\n         * In the RESET scenario, for \"dedicated\" card components we also need to pass on the resetObject since this contains information about\n         * the brand that CSF needs to reset to, internally.\n         */\n        if (this.csf) this.csf.brandsFromBinLookup(binLookupResponse, mustResetDedicatedBrand ? resetObject : null);\n    }\n\n    private setRootNode = (input: HTMLElement): void => {\n        this.rootNode = input;\n    };\n\n    public render(props, state: SFPState) {\n        return props.render({ setRootNode: this.setRootNode, setFocusOn: this.setFocusOn }, state);\n    }\n}\n\nexport default SecuredFieldsProvider;\n"],"names":["SecuredFieldsProvider","Component","componentDidMount","this","props","rootNode","setRootNode","fields","getFields","valid","reduce","validFieldsReducer","setState","forEach","field","numCharsInField","numDateFields","filter","f","match","length","destroy","initializeCSF","componentType","TxVariants","customCard","console","debug","handleOnNoDataRequired","componentDidUpdate","checkForKCPFields","onStateUpdate","state","componentWillUnmount","csf","clearTimeout","csfLoadFailTimeout","csfConfigFailTimeout","root","loadingContext","csfSetupObj","type","clientKey","cardGroupTypes","brands","autoFocus","trimTrailingSeparator","keypadFix","showWarnings","iframeUIConfig","sfStyles","styles","i18n","onSubmitAnalytics","callbacks","onLoad","handleOnLoad","onConfigSuccess","handleOnConfigSuccess","onFieldValid","handleOnFieldValid","onAllValid","handleOnAllValid","onBrand","handleOnBrand","onError","handleOnError","onFocus","handleFocus","onBinValue","onAutoComplete","handleOnAutoComplete","onAdditionalSFConfig","onAdditionalSFRemoved","onTouchstartIOS","handleOnTouchstartIOS","onKeyDown","handleKeyDown","isKCP","hasKoreanFields","legacyInputMode","minimumExpiryDate","implementationType","forceCompat","maskSecurityCode","exposeExpiryDate","shouldDisableIOSArrowKeys","disableIOSArrowKeys","placeholders","showContextualElement","initCSF","setTimeout","status","AdyenCheckoutError","csfLoadFailTimeoutMS","needsKoreanFields","koreanAuthenticationRequired","issuingCountryCode","countryCode","setRemovedFieldState","prevState","data","ENCRYPTED_PWD_FIELD","undefined","errors","onChange","removeSecuredField","setKCPStatus","setAddedFieldState","isSfpValid","addSecuredField","getChildContext","handleUnsupportedCard","errObj","hasUnsupportedCard","error","detectedUnsupportedBrands","detectedBrands","ENCRYPTED_CARD_NUMBER","setFocusOn","frame","setFocusOnFrame","updateStyles","stylesObj","sfIsOptionalOrHidden","fieldType","getRootNode","showValidation","Object","keys","getErrorReducer","errorObj","getErrorObject","isValidated","mapErrorsToValidationRuleResult","acc","fieldName","errorCode","isValid","errorMessage","getErrorMessageFromCode","SF_ErrorCodes","errorI18n","get","resolveCVCErrorKey","brand","processBinLookupResponse","binLookupResponse","resetObject","toLowerCase","hasBrandedResetObj","mustResetDedicatedBrand","DEDICATED_CARD_COMPONENTS","includes","brandsFromBinLookup","render","constructor","super","_define_property","csfConfigFailTimeoutMS","input","stateObj","cvcPolicy","CVC_POLICY_REQUIRED","expiryDatePolicy","DATE_POLICY_REQUIRED","handlers","bind","defaultProps"],"mappings":"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"}
+{"version":3,"file":"SecuredFieldsProvider.js","sources":["../../../../../../src/components/internal/SecuredFields/SFP/SecuredFieldsProvider.ts"],"sourcesContent":["import { Component } from 'preact';\nimport { getErrorObject, getFields, getErrorReducer, validFieldsReducer } from './SFPUtils';\nimport initCSF from '../lib/CSF';\nimport handlers from './SecuredFieldsProviderHandlers';\nimport defaultProps from './defaultProps';\nimport { SFPProps, SFPState, SingleBrandResetObject } from './types';\nimport {\n    StylesObject,\n    CardErrorData,\n    CardFocusData,\n    CardBrandData,\n    CardAllValidData,\n    CardFieldValidData,\n    CardAutoCompleteData,\n    CardConfigSuccessData,\n    CardLoadData,\n    SFKeyDownObj,\n    SFFieldType\n} from '../lib/types';\nimport { CSFReturnObject, CSFSetupObject } from '../lib/CSF/types';\nimport { CVC_POLICY_REQUIRED, DATE_POLICY_REQUIRED, DEDICATED_CARD_COMPONENTS, ENCRYPTED_CARD_NUMBER, ENCRYPTED_PWD_FIELD } from '../lib/constants';\nimport { BinLookupResponse } from '../../../Card/types';\nimport AdyenCheckoutError from '../../../../core/Errors/AdyenCheckoutError';\nimport { SFStateErrorObj } from '../../../Card/components/CardInput/types';\nimport { resolveCVCErrorKey } from '../../../Card/components/CardInput/utils';\nimport { getErrorMessageFromCode } from '../../../../core/Errors/utils';\nimport { SF_ErrorCodes } from '../../../../core/Errors/constants';\nimport { TxVariants } from '../../../tx-variants';\n\n/**\n * SecuredFieldsProvider:\n * Initialises & handles the client-side part of SecuredFields\n */\nclass SecuredFieldsProvider extends Component<SFPProps, SFPState> {\n    private readonly csfLoadFailTimeout: number;\n    private readonly csfLoadFailTimeoutMS: number;\n    private readonly csfConfigFailTimeout: number;\n    private readonly csfConfigFailTimeoutMS: number;\n    private numCharsInField: object;\n    private rootNode: HTMLElement;\n    private numDateFields: number;\n    private csf: CSFReturnObject;\n    private readonly handleOnLoad: (obj: CardLoadData) => void;\n    private readonly handleOnConfigSuccess: (obj: CardConfigSuccessData) => void;\n    private readonly handleOnFieldValid: (obj: CardFieldValidData) => void;\n    private readonly handleOnAllValid: (obj: CardAllValidData) => void;\n    private readonly handleOnBrand: (obj: CardBrandData) => void;\n    private readonly handleFocus: (obj: CardFocusData) => void;\n    private readonly handleOnError: (obj: CardErrorData, hasUnsupportedCard?: boolean) => void;\n    private readonly handleOnAutoComplete: (obj: CardAutoCompleteData) => void;\n    private readonly handleOnNoDataRequired: () => void;\n    private readonly handleOnTouchstartIOS: (obj) => void;\n    private readonly handleKeyDown: (obj: SFKeyDownObj) => void;\n    public state: SFPState;\n    public props: SFPProps;\n    private issuingCountryCode: string;\n\n    constructor(props: SFPProps) {\n        super(props);\n\n        const stateObj: SFPState = {\n            status: 'loading',\n            brand: props.type,\n            errors: {},\n            valid: {},\n            data: {},\n            cvcPolicy: CVC_POLICY_REQUIRED,\n            expiryDatePolicy: DATE_POLICY_REQUIRED,\n            isSfpValid: false,\n            hasKoreanFields: props.hasKoreanFields\n        };\n        this.state = stateObj;\n\n        this.csfLoadFailTimeout = null;\n        this.csfLoadFailTimeoutMS = 30000;\n\n        this.csfConfigFailTimeout = null;\n        this.csfConfigFailTimeoutMS = 15000;\n\n        this.numCharsInField = {};\n\n        // Handlers\n        this.handleOnLoad = handlers.handleOnLoad.bind(this);\n        this.handleOnConfigSuccess = handlers.handleOnConfigSuccess.bind(this);\n        this.handleOnFieldValid = handlers.handleOnFieldValid.bind(this);\n        this.handleOnAllValid = handlers.handleOnAllValid.bind(this);\n        this.handleOnBrand = handlers.handleOnBrand.bind(this);\n        this.handleFocus = handlers.handleFocus.bind(this);\n        this.handleOnError = handlers.handleOnError.bind(this);\n        this.handleOnNoDataRequired = handlers.handleOnNoDataRequired.bind(this);\n        this.handleOnAutoComplete = handlers.handleOnAutoComplete.bind(this);\n        this.handleOnTouchstartIOS = handlers.handleOnTouchstartIOS.bind(this); // Only called when iOS detected\n        this.handleKeyDown = handlers.handleKeyDown.bind(this);\n\n        this.processBinLookupResponse = this.processBinLookupResponse.bind(this);\n\n        // Bindings for functions exposed to users of this component: SecuredFields & CardInput\n        this.setFocusOn = this.setFocusOn.bind(this);\n        this.updateStyles = this.updateStyles.bind(this);\n        this.handleUnsupportedCard = this.handleUnsupportedCard.bind(this);\n        this.showValidation = this.showValidation.bind(this);\n        this.destroy = this.destroy.bind(this);\n    }\n\n    public static readonly defaultProps = defaultProps;\n\n    public componentDidMount(): void {\n        // When SFP instantiated through SecuredFieldsInput c.f. CardInput\n        if (this.props.rootNode) {\n            this.setRootNode(this.props.rootNode);\n        }\n\n        // Find encryptedFields and map them to the values we use to store valid states\n        const fields = getFields(this.rootNode);\n        const valid = fields.reduce(validFieldsReducer, {});\n\n        this.setState({ valid });\n\n        // Populate numCharsInField object\n        fields.forEach(field => {\n            this.numCharsInField[field] = 0;\n        });\n\n        // Store how many dateFields we are dealing with visually\n        this.numDateFields = fields.filter(f => f.match(/Expiry/)).length;\n\n        if (fields.length) {\n            this.destroy();\n            this.initializeCSF(this.rootNode);\n        } else {\n            if (this.props.componentType === (TxVariants.customCard as string)) {\n                console.debug(\n                    'You are trying to create a CustomCard component but the element into which you are trying to mount the CustomCard component does not contain any elements with a \"data-cse\" attribute e.g. <div data-cse=\"encryptedCardNumber\"></div>'\n                );\n            }\n            this.handleOnNoDataRequired();\n        }\n    }\n\n    public componentDidUpdate() {\n        this.checkForKCPFields();\n        // Pass all the state data up - Used right now for loading status\n        this.props.onStateUpdate?.(this.state);\n    }\n\n    public componentWillUnmount(): void {\n        this.csf = null;\n        clearTimeout(this.csfLoadFailTimeout);\n        clearTimeout(this.csfConfigFailTimeout);\n    }\n\n    private initializeCSF(root: HTMLElement): void {\n        let loadingContext = this.props.loadingContext;\n\n        // For loading securedFields from local server during development\n        if (process.env.NODE_ENV === 'development' && process.env.__SF_ENV__ !== 'build') {\n            loadingContext = process.env.__SF_ENV__;\n        }\n\n        const csfSetupObj: CSFSetupObject = {\n            rootNode: root,\n            type: this.props.type,\n            componentType: this.props.componentType,\n            clientKey: this.props.clientKey,\n            cardGroupTypes: this.props.brands,\n            autoFocus: this.props.autoFocus,\n            trimTrailingSeparator: this.props.trimTrailingSeparator,\n            loadingContext,\n            keypadFix: this.props.keypadFix,\n            showWarnings: this.props.showWarnings,\n            iframeUIConfig: {\n                sfStyles: this.props.styles\n            },\n            i18n: this.props.i18n,\n            onSubmitAnalytics: this.props.onSubmitAnalytics,\n            callbacks: {\n                onLoad: this.handleOnLoad,\n                onConfigSuccess: this.handleOnConfigSuccess,\n                onFieldValid: this.handleOnFieldValid,\n                onAllValid: this.handleOnAllValid,\n                onBrand: this.handleOnBrand,\n                onError: this.handleOnError,\n                onFocus: this.handleFocus,\n                onBinValue: this.props.onBinValue,\n                onAutoComplete: this.handleOnAutoComplete,\n                onAdditionalSFConfig: this.props.onAdditionalSFConfig,\n                onAdditionalSFRemoved: this.props.onAdditionalSFRemoved,\n                onTouchstartIOS: this.handleOnTouchstartIOS,\n                onKeyDown: this.handleKeyDown\n            },\n            isKCP: this.state.hasKoreanFields,\n            legacyInputMode: this.props.legacyInputMode,\n            minimumExpiryDate: this.props.minimumExpiryDate,\n            implementationType: this.props.implementationType || 'components', // to distinguish between 'regular' and 'custom' card component\n            forceCompat: this.props.forceCompat,\n            maskSecurityCode: this.props.maskSecurityCode,\n            exposeExpiryDate: this.props.exposeExpiryDate,\n            shouldDisableIOSArrowKeys: !!this.props.disableIOSArrowKeys, // convert whether function has been defined into a boolean\n            placeholders: this.props.placeholders ?? {},\n            showContextualElement: this.props.showContextualElement\n        };\n\n        this.csf = initCSF(csfSetupObj);\n\n        /**\n         * Expect to at least have had the handleOnLoad callback called within this time\n         * - if this hasn't happened then something has happened to interrupt the loading of the securedFields\n         * So we need to clear the loading spinner to see if the securedFields are reporting anything\n         */\n        // @ts-ignore - timout 'type' is a number\n        this.csfLoadFailTimeout = setTimeout(() => {\n            if (this.state.status !== 'ready') {\n                // Hide the spinner\n                this.setState({ status: 'csfLoadFailure' });\n                // Report the error\n                this.props.onError(new AdyenCheckoutError('ERROR', 'secured field iframes have failed to load'));\n            }\n        }, this.csfLoadFailTimeoutMS);\n    }\n\n    private checkForKCPFields() {\n        let needsKoreanFields = false;\n        if (this.props.koreanAuthenticationRequired) {\n            needsKoreanFields = this.issuingCountryCode ? this.issuingCountryCode === 'kr' : this.props.countryCode === 'kr';\n        }\n\n        // Was korean, now isn't - hide password field\n        if (this.state.hasKoreanFields && !needsKoreanFields) {\n            // Clear any stored data\n            const setRemovedFieldState = prevState => ({\n                data: { ...prevState.data, [ENCRYPTED_PWD_FIELD]: undefined },\n                valid: { ...prevState.valid, [ENCRYPTED_PWD_FIELD]: false },\n                errors: { ...prevState.errors, [ENCRYPTED_PWD_FIELD]: null },\n                hasKoreanFields: false\n            });\n\n            this.setState(setRemovedFieldState, () => {\n                this.props.onChange(this.state);\n            });\n\n            this.csf.removeSecuredField(ENCRYPTED_PWD_FIELD);\n            this.csf.setKCPStatus(false);\n        }\n\n        // Wasn't korean, now is - show password field\n        if (!this.state.hasKoreanFields && needsKoreanFields) {\n            const setAddedFieldState = prevState => ({\n                valid: { ...prevState.valid, [ENCRYPTED_PWD_FIELD]: false },\n                hasKoreanFields: true,\n                isSfpValid: false\n            });\n\n            this.setState(setAddedFieldState, () => {\n                this.props.onChange(this.state);\n            });\n\n            this.csf.addSecuredField(ENCRYPTED_PWD_FIELD);\n            this.csf.setKCPStatus(true);\n        }\n    }\n\n    public getChildContext(): object {\n        return { i18n: this.props.i18n };\n    }\n\n    public handleUnsupportedCard(errObj: CardErrorData): boolean {\n        const hasUnsupportedCard = !!errObj.error;\n\n        // Store the brand(s) we detected and which we don't support\n        if (hasUnsupportedCard) {\n            this.setState({ detectedUnsupportedBrands: errObj.detectedBrands });\n        }\n\n        errObj.rootNode = this.rootNode; // Needed for CustomCard\n        this.handleOnError(errObj, hasUnsupportedCard);\n        // Inform CSF that the number field has an unsupportedCard error (or that it has been cleared)\n        if (this.csf) {\n            this.csf.hasUnsupportedCard(ENCRYPTED_CARD_NUMBER, errObj.error);\n        }\n        return hasUnsupportedCard;\n    }\n\n    public setFocusOn(frame: SFFieldType): void {\n        if (this.csf) this.csf.setFocusOnFrame(frame);\n    }\n\n    public updateStyles(stylesObj: StylesObject): void {\n        if (this.csf) this.csf.updateStyles(stylesObj);\n    }\n\n    public sfIsOptionalOrHidden(fieldType: string): boolean {\n        return this.csf.sfIsOptionalOrHidden(fieldType as SFFieldType);\n    }\n\n    public destroy(): void {\n        if (this.csf) this.csf.destroy();\n    }\n\n    public getRootNode(): HTMLElement {\n        return this.rootNode;\n    }\n\n    public showValidation(): void {\n        const { numDateFields, state }: SecuredFieldsProvider = this;\n\n        Object.keys(state.valid)\n            .reduce(getErrorReducer(numDateFields, state), [])\n            .forEach((field: SFFieldType) => {\n                // For each detected error pass an error object to the handler (calls error callback & sets state)\n                const errorObj: CardErrorData = getErrorObject(field, this.rootNode, state);\n                this.handleOnError(errorObj, !!state.detectedUnsupportedBrands);\n                // Inform the secured-fields instance of which fields have been found to have errors\n                if (this.csf && this.csf.isValidated) {\n                    this.csf.isValidated(field, errorObj.error);\n                }\n            });\n    }\n\n    /**\n     * Map SF errors to ValidationRuleResult-like objects, for CardInput component\n     */\n    public mapErrorsToValidationRuleResult(): SFStateErrorObj {\n        const fieldNames: string[] = Object.keys(this.state.errors);\n\n        const sfStateErrorsObj = fieldNames.reduce((acc, fieldName) => {\n            const errorCode = this.state.errors[fieldName];\n            if (errorCode) {\n                acc[fieldName] = {\n                    isValid: false,\n                    errorMessage: getErrorMessageFromCode(errorCode, SF_ErrorCodes), // this is the human-readable, untranslated, explanation of the error that will exist on the error object in card.state.errors\n                    // For v5 the object found in state.errors should also contain the additional properties that used to be sent to the onError callback\n                    // namely: translation, errorCode, a ref to rootNode &, in the case of failed binLookup, an array of the detectedBrands\n                    // CVC's error copy is brand-dependent (Amex vs. others), so resolve the brand-aware\n                    // key here too - otherwise this errorI18n value (consumed by the SR-live-panel and\n                    // the public state.errors.<field>.errorI18n API) would always report the non-Amex text.\n                    errorI18n: this.props.i18n.get(resolveCVCErrorKey(errorCode, this.state.brand === 'amex')),\n                    error: errorCode,\n                    rootNode: this.rootNode,\n                    ...(this.state.detectedUnsupportedBrands && { detectedBrands: this.state.detectedUnsupportedBrands })\n                };\n            } else {\n                acc[fieldName] = null;\n            }\n            return acc;\n        }, {});\n        return sfStateErrorsObj;\n    }\n\n    public processBinLookupResponse(binLookupResponse: BinLookupResponse, resetObject: SingleBrandResetObject): void {\n        // If we were dealing with an unsupported card & now we have a valid /binLookup response (or a response triggering a reset of the UI),\n        // - reset state to clear the error & the stored unsupportedBrands and, in the case of a valid /binLookup response, inform CSF (via handleUnsupportedCard)\n        // (Scenario: from an unsupportedCard state the shopper has pasted another number long enough to trigger a /binLookup)\n        if (this.state.detectedUnsupportedBrands) {\n            this.setState(prevState => ({\n                errors: { ...prevState.errors, [ENCRYPTED_CARD_NUMBER]: null },\n                detectedUnsupportedBrands: null\n            }));\n\n            // If we have some sort of binLookupResponse object then this isn't the reset caused by digits dropping below a threshold\n            // - so call handleUnsupportedCard to clear the error\n            if (this.csf && binLookupResponse) {\n                const errObj: CardErrorData = {\n                    type: 'card',\n                    fieldType: 'encryptedCardNumber',\n                    error: ''\n                };\n                this.handleUnsupportedCard(errObj);\n            }\n        }\n\n        this.issuingCountryCode = binLookupResponse?.issuingCountryCode?.toLowerCase();\n\n        const hasBrandedResetObj = resetObject?.brand;\n\n        /**\n         * Are we dealing with a \"dedicated\" card scenario i.e a card component created as: checkout.create('bcmc') but which can accept multiple brands\n         * - in which case we will need to reset brand and pass on the resetObj to CSF\n         */\n        const mustResetDedicatedBrand = hasBrandedResetObj && DEDICATED_CARD_COMPONENTS.includes(resetObject.brand);\n\n        if (mustResetDedicatedBrand) {\n            // resetObject.brand will be the value of the brand whose logo we want to reshow in the UI\n            this.setState(resetObject, () => {\n                this.props.onChange(this.state);\n            });\n        }\n\n        /**\n         * Scenarios:\n         *\n         * - RESET (binLookupResponse === null): The number of digits in number field has dropped below threshold for BIN lookup\n         * - RESULT (binLookupResponse.supportedBrands.length === 1): binLookup has found a result so inform CSF\n         *\n         * In the RESET scenario, for \"dedicated\" card components we also need to pass on the resetObject since this contains information about\n         * the brand that CSF needs to reset to, internally.\n         */\n        if (this.csf) this.csf.brandsFromBinLookup(binLookupResponse, mustResetDedicatedBrand ? resetObject : null);\n    }\n\n    private readonly setRootNode = (input: HTMLElement): void => {\n        this.rootNode = input;\n    };\n\n    public render(props, state: SFPState) {\n        return props.render({ setRootNode: this.setRootNode, setFocusOn: this.setFocusOn }, state);\n    }\n}\n\nexport default SecuredFieldsProvider;\n"],"names":["SecuredFieldsProvider","Component","componentDidMount","this","props","rootNode","setRootNode","fields","getFields","valid","reduce","validFieldsReducer","setState","forEach","field","numCharsInField","numDateFields","filter","f","match","length","destroy","initializeCSF","componentType","TxVariants","customCard","console","debug","handleOnNoDataRequired","componentDidUpdate","checkForKCPFields","onStateUpdate","state","componentWillUnmount","csf","clearTimeout","csfLoadFailTimeout","csfConfigFailTimeout","root","loadingContext","csfSetupObj","type","clientKey","cardGroupTypes","brands","autoFocus","trimTrailingSeparator","keypadFix","showWarnings","iframeUIConfig","sfStyles","styles","i18n","onSubmitAnalytics","callbacks","onLoad","handleOnLoad","onConfigSuccess","handleOnConfigSuccess","onFieldValid","handleOnFieldValid","onAllValid","handleOnAllValid","onBrand","handleOnBrand","onError","handleOnError","onFocus","handleFocus","onBinValue","onAutoComplete","handleOnAutoComplete","onAdditionalSFConfig","onAdditionalSFRemoved","onTouchstartIOS","handleOnTouchstartIOS","onKeyDown","handleKeyDown","isKCP","hasKoreanFields","legacyInputMode","minimumExpiryDate","implementationType","forceCompat","maskSecurityCode","exposeExpiryDate","shouldDisableIOSArrowKeys","disableIOSArrowKeys","placeholders","showContextualElement","initCSF","setTimeout","status","AdyenCheckoutError","csfLoadFailTimeoutMS","needsKoreanFields","koreanAuthenticationRequired","issuingCountryCode","countryCode","setRemovedFieldState","prevState","data","ENCRYPTED_PWD_FIELD","undefined","errors","onChange","removeSecuredField","setKCPStatus","setAddedFieldState","isSfpValid","addSecuredField","getChildContext","handleUnsupportedCard","errObj","hasUnsupportedCard","error","detectedUnsupportedBrands","detectedBrands","ENCRYPTED_CARD_NUMBER","setFocusOn","frame","setFocusOnFrame","updateStyles","stylesObj","sfIsOptionalOrHidden","fieldType","getRootNode","showValidation","Object","keys","getErrorReducer","errorObj","getErrorObject","isValidated","mapErrorsToValidationRuleResult","acc","fieldName","errorCode","isValid","errorMessage","getErrorMessageFromCode","SF_ErrorCodes","errorI18n","get","resolveCVCErrorKey","brand","processBinLookupResponse","binLookupResponse","resetObject","toLowerCase","hasBrandedResetObj","mustResetDedicatedBrand","DEDICATED_CARD_COMPONENTS","includes","brandsFromBinLookup","render","constructor","super","_define_property","csfConfigFailTimeoutMS","input","stateObj","cvcPolicy","CVC_POLICY_REQUIRED","expiryDatePolicy","DATE_POLICY_REQUIRED","handlers","bind","defaultProps"],"mappings":"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"}

package/dist/es/components/internal/UIElement/UIElement.js

@@ -1,2 +1,2 @@
-import{createElement as e,createRef as t}from"../../../external/preact/dist/preact.js";import s,{NETWORK_ERROR as i}from"../../../core/Errors/AdyenCheckoutError.js";import o from"../../../core/Services/order-status.js";import{hasOwnProperty as n}from"../../../utils/hasOwnProperty.js";import r from"../BaseElement/BaseElement.js";import a from"../PayButton/PayButton.js";import{assertIsDropin as h,getRegulatoryDefaults as d,sanitizeResponse as l,verifyPaymentDidNotFail as p,cleanupFinalResult as m}from"./utils.js";import{AnalyticsErrorEvent as c,ErrorEventType as u}from"../../../core/Analytics/events/AnalyticsErrorEvent.js";import{AnalyticsInfoEvent as y,InfoEventType as f}from"../../../core/Analytics/events/AnalyticsInfoEvent.js";import{AnalyticsLogEvent as R,LogEventType as A}from"../../../core/Analytics/events/AnalyticsLogEvent.js";import b from"../../../core/Errors/CancelError.js";import{CoreProvider as P}from"../../../core/Context/CoreProvider.js";import g from"../../../core/Errors/SRPanelProvider.js";import{AmountProvider as E}from"../../../core/Context/AmountProvider.js";import{TxVariants as v}from"../../tx-variants.js";function w(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}class C extends r{createBeforeRenderHook(e){const t=this.render;this.render=(...s)=>(this.beforeRender(e),t.apply(this,s))}beforeRender(e){if(e?.originalAction)return;const t=new y({type:f.rendered,component:this.type,configData:{...e,showPayButton:this.props.showPayButton},...e?.oneClick&&{isStoredPaymentMethod:!0}});this.analytics.sendAnalytics(t)}reportIntegrationFlavor(){this.analytics.sendFlavor("components")}get analytics(){return this.core.modules.analytics}get srPanel(){return this.core.modules.srPanel}getPaymentMethodConfigFromResponse(e){return e?.storedPaymentMethodId?this.getStoredPaymentMethodDetails(e.storedPaymentMethodId):this.getPaymentMethodFromPaymentMethodsResponse(e?.type,e?.paymentMethodId)}buildElementProps(e){const t={showPayButton:!0,...this.core.getCorePropsForComponent(),...this.getPaymentMethodConfigFromResponse(e),...e},s=h(this);this.props=this.formatProps({...this.constructor.defaultProps,...d(this.core.options.countryCode,s),...t})}getStoredPaymentMethodDetails(e){return this.core.paymentMethodsResponse.findStoredPaymentMethod(e)}getPaymentMethodFromPaymentMethodsResponse(e,t){return t?this.core.paymentMethodsResponse.findById(t):this.core.paymentMethodsResponse?.find(e||this.constructor.type)}storeElementRefOnCore(e){e?.isDropin||this.core.storeElementReference(this)}isAvailable(){return Promise.resolve()}setState(e){this.state={...this.state,...e},this.onChange()}showValidation(){return this.componentRef&&this.componentRef.showValidation&&this.componentRef.showValidation(),this}updateAmount(e,t){this.props={...this.props,...e&&{amount:e},...t&&{secondaryAmount:t}},this.amountProviderRef.current?.update(e,t)}setElementStatus(e,t){return this.elementRef?.setStatus(e,t),this}setStatus(e,t){return this.componentRef?.setStatus&&this.componentRef.setStatus(e,t),this}onChange(){this.props.onChange?.({data:this.data,isValid:this.isValid,errors:this.state.errors,valid:this.state.valid},this.elementRef)}submitAnalytics(e){this.analytics.sendAnalytics(e)}submit(){if(this.isValid){if(this.props.onReview){const e=this.state.order??this.props.order,t=(e={})=>{this.submitAnalytics(new R({component:this.type,type:A.review,message:"Review flow triggered"})),this.props.onReview(this.data,this.elementRef,e)};return e?void o({clientKey:this.props.clientKey,loadingContext:this.props.loadingContext},e).then(e=>t({orderStatus:e})).catch(()=>t()):void t()}this.executePaymentsCall()}else this.showValidation()}executePaymentsCall(){this.makePaymentsCall().then(l).then(p).then(this.handleResponse).catch(e=>{e instanceof b?this.setElementStatus("ready"):this.handleFailedResult(e)})}makePaymentsCall(){if(this.setElementStatus("loading"),this.props.onSubmit)return this.submitUsingAdvancedFlow();if(this.core.session){return(this.props.beforeSubmit?new Promise((e,t)=>{this.props.beforeSubmit(this.data,this.elementRef,{resolve:e,reject:()=>t(new b("beforeSubmitRejected"))})}):Promise.resolve(this.data)).then(this.submitUsingSessionsFlow)}this.handleError(new s("IMPLEMENTATION_ERROR",'It can not perform /payments call. Callback "onSubmit" is missing or Checkout session is not available'))}async submitUsingAdvancedFlow(){const e=new R({component:this.type,type:A.submit,message:"Shopper clicked pay"});return this.submitAnalytics(e),new Promise((e,t)=>{this.props.onSubmit({data:this.data,isValid:this.isValid},this.elementRef,{resolve:e,reject:t})})}async submitUsingSessionsFlow(e){const t=new R({component:this.type,type:A.submit,message:"Shopper clicked pay"});this.submitAnalytics(t);try{return await this.core.session.submitPayment(e)}catch(e){return e instanceof s?this.handleError(e):this.handleError(new s("ERROR","Error when making /payments call",{cause:e})),Promise.reject(e)}}onComplete(e){this.handleAdditionalDetails(e)}handleAdditionalDetails(e){this.makeAdditionalDetailsCall(e).then(l).then(p).then(this.handleResponse).catch(this.handleFailedResult)}makeAdditionalDetailsCall(e){return this.props.onAdditionalDetails?new Promise((t,s)=>{this.props.onAdditionalDetails(e,this.elementRef,{resolve:t,reject:s})}):this.core.session?this.submitAdditionalDetailsUsingSessionsFlow(e.data):void this.handleError(new s("IMPLEMENTATION_ERROR",'It can not perform /payments/details call. Callback "onAdditionalDetails" is missing or Checkout session is not available'))}async submitAdditionalDetailsUsingSessionsFlow(e){try{return await this.core.session.submitDetails(e)}catch(e){return e instanceof s?this.handleError(e):this.handleError(new s("ERROR","Error when making /details call",{cause:e})),Promise.reject(e)}}handleAction(e,t={}){if(!e||!e.type){if(n(e,"action")&&n(e,"resultCode"))throw new Error('handleAction::Invalid Action - the passed action object itself has an "action" property and a "resultCode": have you passed in the whole response object by mistake?');throw new Error('handleAction::Invalid Action - the passed action object does not have a "type" property')}const s=this.core.createFromAction(e,{...this.elementRef.props,...t});return s?(this.unmount(),s.mount(this._node)):null}onActionHandled(e){this.props?.onActionHandled?.({originalAction:this.props.originalAction,...e})}setupSessionsDonation(){const{amount:e,donation:t}=this.props;if(!1!==t?.autoMount){const t=h(this.elementRef)?this.elementRef._node:this._node;new(this.core.getComponent(v.donation))(this.core,{rootNode:t,commercialTxAmount:e.value})}}handleResponse(e){e.action?this.core.options?.onAction?this.core.options.onAction(this.core.createFromAction(e.action,{...this.elementRef.props})):this.elementRef.handleAction(e.action):e.order?.remainingAmount?.value>0?this.handleOrder(e):this.handleSuccessResult(e)}handleKeyDown(e){"Enter"!==e.key&&"Enter"!==e.code||(e.preventDefault(),this.onEnterKeyPressed(document?.activeElement,this))}onEnterKeyPressed(e,t){this.props.onEnterKeyPressed?this.props.onEnterKeyPressed(e,t):(e.blur(),this.submit())}updateParent(e={}){return this.elementRef.core.update(e)}get isValid(){return!1}get icon(){const e=this.props.paymentMethodType||this.type;return this.props.icon??this.resources.getImage()(e)}get displayName(){const e=this.core.paymentMethodsResponse?.paymentMethods?.find(e=>e.type===this.type);return this.props.name||e?.name||this.type}get accessibleName(){return this.displayName}get additionalInfo(){return null}get type(){return this.props.type||this.constructor.type}async handleAdvanceFlowPaymentMethodsUpdate(e,t){return new Promise((t,s)=>{if(!this.props.onPaymentMethodsRequest)return t();this.props.onPaymentMethodsRequest({...e&&{order:{orderData:e.orderData,pspReference:e.pspReference}},locale:this.core.options.locale},{resolve:t,reject:s})}).catch(e=>{this.handleError(new s("IMPLEMENTATION_ERROR","Something failed during payment methods update or onPaymentMethodsRequest was not implemented",{cause:e}))}).then(s=>this.core.update({...s&&{paymentMethodsResponse:s},order:e,amount:e?e.remainingAmount:t}))}render(){return e(P,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources,analytics:this.analytics},e(g,{srPanel:this.srPanel},e(E,{amount:this.props.amount,secondaryAmount:this.props.secondaryAmount,providerRef:this.amountProviderRef},this.componentToRender())))}constructor(s,o){super(s,o),w(this,"componentRef",void 0),w(this,"resources",void 0),w(this,"elementRef",void 0),w(this,"amountProviderRef",t()),w(this,"handleError",e=>{if(this.setElementStatus("ready"),e.name===i&&e.options.code){const t=new c({component:this.type,errorType:u.apiError,code:e.options.code});this.submitAnalytics(t)}this.props.onError&&this.props.onError(e,this.elementRef)}),w(this,"handleOrder",e=>{const{order:t}=e;(this.core.session?this.core.update({order:t}):this.handleAdvanceFlowPaymentMethodsUpdate(t)).then(()=>{this.props.onOrderUpdated?.({order:t})})}),w(this,"handleFailedResult",e=>{h(this.elementRef)&&this.elementRef.displayFinalAnimation("error"),m(e),this.props.onPaymentFailed?.(e,this.elementRef)}),w(this,"handleSuccessResult",e=>{h(this.elementRef)&&this.elementRef.displayFinalAnimation("success"),m(e),this.core.session&&!0===e.askDonation&&this.setupSessionsDonation(),this.props.onPaymentCompleted?.(e,this.elementRef)}),w(this,"setComponentRef",e=>{this.componentRef=e}),w(this,"payButton",t=>e(a,{...t,onClick:this.submit,showReview:!!this.props.onReview})),this.core.register(this.constructor),this.submit=this.submit.bind(this),this.setState=this.setState.bind(this),this.onComplete=this.onComplete.bind(this),this.handleAction=this.handleAction.bind(this),this.handleOrder=this.handleOrder.bind(this),this.handleAdditionalDetails=this.handleAdditionalDetails.bind(this),this.handleResponse=this.handleResponse.bind(this),this.setElementStatus=this.setElementStatus.bind(this),this.submitAnalytics=this.submitAnalytics.bind(this),this.makePaymentsCall=this.makePaymentsCall.bind(this),this.makeAdditionalDetailsCall=this.makeAdditionalDetailsCall.bind(this),this.submitUsingSessionsFlow=this.submitUsingSessionsFlow.bind(this),this.updateAmount=this.updateAmount.bind(this),this.setupSessionsDonation=this.setupSessionsDonation.bind(this),this.elementRef=o&&o.elementRef||this,this.resources=this.props.modules?this.props.modules.resources:void 0,this.storeElementRefOnCore(this.props),this.onEnterKeyPressed=this.onEnterKeyPressed.bind(this),this.onActionHandled=this.onActionHandled.bind(this),this.createBeforeRenderHook(o),this.reportIntegrationFlavor()}}w(C,"type",void 0),w(C,"txVariants",[]);export{C as UIElement,C as default};
+import{createElement as e,createRef as t}from"../../../external/preact/dist/preact.js";import s,{NETWORK_ERROR as i}from"../../../core/Errors/AdyenCheckoutError.js";import o from"../../../core/Services/order-status.js";import{hasOwnProperty as n}from"../../../utils/hasOwnProperty.js";import r from"../BaseElement/BaseElement.js";import a from"../PayButton/PayButton.js";import{assertIsDropin as h,getRegulatoryDefaults as d,sanitizeResponse as l,verifyPaymentDidNotFail as p,cleanupFinalResult as m}from"./utils.js";import{AnalyticsErrorEvent as c,ErrorEventType as u}from"../../../core/Analytics/events/AnalyticsErrorEvent.js";import{AnalyticsInfoEvent as y,InfoEventType as f}from"../../../core/Analytics/events/AnalyticsInfoEvent.js";import{AnalyticsLogEvent as R,LogEventType as A}from"../../../core/Analytics/events/AnalyticsLogEvent.js";import b from"../../../core/Errors/CancelError.js";import{CoreProvider as P}from"../../../core/Context/CoreProvider.js";import g from"../../../core/Errors/SRPanelProvider.js";import{AmountProvider as E}from"../../../core/Context/AmountProvider.js";import{TxVariants as v}from"../../tx-variants.js";function w(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}class C extends r{createBeforeRenderHook(e){const t=this.render;this.render=(...s)=>(this.beforeRender(e),t.apply(this,s))}beforeRender(e){if(e?.originalAction)return;const t=new y({type:f.rendered,component:this.type,configData:{...e,showPayButton:this.props.showPayButton},...e?.oneClick&&{isStoredPaymentMethod:!0}});this.analytics.sendAnalytics(t)}reportIntegrationFlavor(){this.analytics.sendFlavor("components")}get analytics(){return this.core.modules.analytics}get srPanel(){return this.core.modules.srPanel}getPaymentMethodConfigFromResponse(e){return e?.storedPaymentMethodId?this.getStoredPaymentMethodDetails(e.storedPaymentMethodId):this.getPaymentMethodFromPaymentMethodsResponse(e?.type,e?.paymentMethodId)}buildElementProps(e){const t={showPayButton:!0,...this.core.getCorePropsForComponent(),...this.getPaymentMethodConfigFromResponse(e),...e},s=h(this);this.props=this.formatProps({...this.constructor.defaultProps,...d(this.core.options.countryCode,s),...t})}getStoredPaymentMethodDetails(e){return this.core.paymentMethodsResponse.findStoredPaymentMethod(e)}getPaymentMethodFromPaymentMethodsResponse(e,t){return t?this.core.paymentMethodsResponse.findById(t):this.core.paymentMethodsResponse?.find(e||this.constructor.type)}storeElementRefOnCore(e){e?.isDropin||this.core.storeElementReference(this)}isAvailable(){return Promise.resolve()}setState(e){this.state={...this.state,...e},this.onChange()}showValidation(){return this.componentRef?.showValidation?.(),this}updateAmount(e,t){this.props={...this.props,...e&&{amount:e},...t&&{secondaryAmount:t}},this.amountProviderRef.current?.update(e,t)}setElementStatus(e){return this.elementRef?.setStatus?.(e),this}setStatus(e){return this.componentRef?.setStatus?.(e),this}onChange(){this.props.onChange?.({data:this.data,isValid:this.isValid,errors:this.state.errors,valid:this.state.valid},this.elementRef)}submitAnalytics(e){this.analytics.sendAnalytics(e)}submit(){if(this.isValid){if(this.props.onReview){const e=this.state.order??this.props.order,t=(e={})=>{this.submitAnalytics(new R({component:this.type,type:A.review,message:"Review flow triggered"})),this.props.onReview(this.data,this.elementRef,e)};return e?void o({clientKey:this.props.clientKey,loadingContext:this.props.loadingContext},e).then(e=>t({orderStatus:e})).catch(()=>t()):void t()}this.executePaymentsCall()}else this.showValidation()}executePaymentsCall(){this.makePaymentsCall().then(l).then(p).then(this.handleResponse).catch(e=>{e instanceof b?this.setElementStatus("ready"):this.handleFailedResult(e)})}makePaymentsCall(){if(this.setElementStatus("loading"),this.props.onSubmit)return this.submitUsingAdvancedFlow();if(this.core.session){return(this.props.beforeSubmit?new Promise((e,t)=>{this.props.beforeSubmit(this.data,this.elementRef,{resolve:e,reject:()=>t(new b("beforeSubmitRejected"))})}):Promise.resolve(this.data)).then(this.submitUsingSessionsFlow)}this.handleError(new s("IMPLEMENTATION_ERROR",'It can not perform /payments call. Callback "onSubmit" is missing or Checkout session is not available'))}async submitUsingAdvancedFlow(){const e=new R({component:this.type,type:A.submit,message:"Shopper clicked pay"});return this.submitAnalytics(e),new Promise((e,t)=>{this.props.onSubmit({data:this.data,isValid:this.isValid},this.elementRef,{resolve:e,reject:t})})}async submitUsingSessionsFlow(e){const t=new R({component:this.type,type:A.submit,message:"Shopper clicked pay"});this.submitAnalytics(t);try{return await this.core.session.submitPayment(e)}catch(e){return e instanceof s?this.handleError(e):this.handleError(new s("ERROR","Error when making /payments call",{cause:e})),Promise.reject(e)}}onComplete(e){this.handleAdditionalDetails(e)}handleAdditionalDetails(e){this.makeAdditionalDetailsCall(e).then(l).then(p).then(this.handleResponse).catch(this.handleFailedResult)}makeAdditionalDetailsCall(e){return this.props.onAdditionalDetails?new Promise((t,s)=>{this.props.onAdditionalDetails(e,this.elementRef,{resolve:t,reject:s})}):this.core.session?this.submitAdditionalDetailsUsingSessionsFlow(e.data):void this.handleError(new s("IMPLEMENTATION_ERROR",'It can not perform /payments/details call. Callback "onAdditionalDetails" is missing or Checkout session is not available'))}async submitAdditionalDetailsUsingSessionsFlow(e){try{return await this.core.session.submitDetails(e)}catch(e){return e instanceof s?this.handleError(e):this.handleError(new s("ERROR","Error when making /details call",{cause:e})),Promise.reject(e)}}handleAction(e,t={}){if(!e||!e.type){if(n(e,"action")&&n(e,"resultCode"))throw new Error('handleAction::Invalid Action - the passed action object itself has an "action" property and a "resultCode": have you passed in the whole response object by mistake?');throw new Error('handleAction::Invalid Action - the passed action object does not have a "type" property')}const s=this.core.createFromAction(e,{...this.elementRef.props,...t});return s?(this.unmount(),s.mount(this._node)):null}onActionHandled(e){this.props?.onActionHandled?.({originalAction:this.props.originalAction,...e})}setupSessionsDonation(){const{amount:e,donation:t}=this.props;if(!1!==t?.autoMount){const t=h(this.elementRef)?this.elementRef._node:this._node;new(this.core.getComponent(v.donation))(this.core,{rootNode:t,commercialTxAmount:e.value})}}handleResponse(e){e.action?this.core.options?.onAction?this.core.options.onAction(this.core.createFromAction(e.action,{...this.elementRef.props})):this.elementRef.handleAction(e.action):e.order?.remainingAmount?.value>0?this.handleOrder(e):this.handleSuccessResult(e)}handleKeyDown(e){"Enter"!==e.key&&"Enter"!==e.code||(e.preventDefault(),this.onEnterKeyPressed(document?.activeElement,this))}onEnterKeyPressed(e,t){this.props.onEnterKeyPressed?this.props.onEnterKeyPressed(e,t):(e.blur(),this.submit())}updateParent(e={}){return this.elementRef.core.update(e)}get isValid(){return!1}get icon(){const e=this.props.paymentMethodType||this.type;return this.props.icon??this.resources.getImage()(e)}get displayName(){const e=this.core.paymentMethodsResponse?.paymentMethods?.find(e=>e.type===this.type);return this.props.name||e?.name||this.type}get accessibleName(){return this.displayName}get additionalInfo(){return null}get type(){return this.props.type||this.constructor.type}async handleAdvanceFlowPaymentMethodsUpdate(e,t){return new Promise((t,s)=>{if(!this.props.onPaymentMethodsRequest)return t();this.props.onPaymentMethodsRequest({...e&&{order:{orderData:e.orderData,pspReference:e.pspReference}},locale:this.core.options.locale},{resolve:t,reject:s})}).catch(e=>{this.handleError(new s("IMPLEMENTATION_ERROR","Something failed during payment methods update or onPaymentMethodsRequest was not implemented",{cause:e}))}).then(s=>this.core.update({...s&&{paymentMethodsResponse:s},order:e,amount:e?e.remainingAmount:t}))}render(){return e(P,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources,analytics:this.analytics},e(g,{srPanel:this.srPanel},e(E,{amount:this.props.amount,secondaryAmount:this.props.secondaryAmount,providerRef:this.amountProviderRef},this.componentToRender())))}constructor(s,o){super(s,o),w(this,"componentRef",void 0),w(this,"resources",void 0),w(this,"elementRef",void 0),w(this,"amountProviderRef",t()),w(this,"handleError",e=>{if(this.setElementStatus("ready"),e.name===i&&e.options.code){const t=new c({component:this.type,errorType:u.apiError,code:e.options.code});this.submitAnalytics(t)}this.props.onError&&this.props.onError(e,this.elementRef)}),w(this,"handleOrder",e=>{const{order:t}=e;(this.core.session?this.core.update({order:t}):this.handleAdvanceFlowPaymentMethodsUpdate(t)).then(()=>{this.props.onOrderUpdated?.({order:t})})}),w(this,"handleFailedResult",e=>{h(this.elementRef)&&this.elementRef.displayFinalAnimation("error"),m(e),this.props.onPaymentFailed?.(e,this.elementRef)}),w(this,"handleSuccessResult",e=>{h(this.elementRef)&&this.elementRef.displayFinalAnimation("success"),m(e),this.core.session&&!0===e.askDonation&&this.setupSessionsDonation(),this.props.onPaymentCompleted?.(e,this.elementRef)}),w(this,"setComponentRef",e=>{this.componentRef=e}),w(this,"payButton",t=>e(a,{...t,onClick:this.submit,showReview:!!this.props.onReview})),this.core.register(this.constructor),this.submit=this.submit.bind(this),this.setState=this.setState.bind(this),this.onComplete=this.onComplete.bind(this),this.handleAction=this.handleAction.bind(this),this.handleOrder=this.handleOrder.bind(this),this.handleAdditionalDetails=this.handleAdditionalDetails.bind(this),this.handleResponse=this.handleResponse.bind(this),this.setElementStatus=this.setElementStatus.bind(this),this.submitAnalytics=this.submitAnalytics.bind(this),this.makePaymentsCall=this.makePaymentsCall.bind(this),this.makeAdditionalDetailsCall=this.makeAdditionalDetailsCall.bind(this),this.submitUsingSessionsFlow=this.submitUsingSessionsFlow.bind(this),this.updateAmount=this.updateAmount.bind(this),this.setupSessionsDonation=this.setupSessionsDonation.bind(this),this.elementRef=o&&o.elementRef||this,this.resources=this.props.modules?this.props.modules.resources:void 0,this.storeElementRefOnCore(this.props),this.onEnterKeyPressed=this.onEnterKeyPressed.bind(this),this.onActionHandled=this.onActionHandled.bind(this),this.createBeforeRenderHook(o),this.reportIntegrationFlavor()}}w(C,"type",void 0),w(C,"txVariants",[]);export{C as UIElement,C as default};
 //# sourceMappingURL=UIElement.js.map