\n \n {label}\n \n
\n );\n },\n);\n\nButton.propTypes = {\n /**\n * The label to display on the button.\n */\n label: PropTypes.string,\n /**\n * The button type\n */\n type: PropTypes.string,\n /**\n * Whether the button should be disabled.\n */\n disabled: PropTypes.bool,\n /**\n * Whether the button must be displayed or not. Anyway it will be included in the DOM.\n */\n hideButton: PropTypes.bool,\n /**\n * The callback function to trigger when we click on the button.\n */\n onClick: PropTypes.func,\n /**\n * All the other props that can be passed to the button html element and not explicitly given in the props\n */\n props: PropTypes.object,\n};\n\nButton.defaultProps = {\n label: null,\n type: null,\n disabled: false,\n hideButton: false,\n onClick: null,\n};\n\nButton.displayName = 'Button';\n\nexport default Button;\n","// extracted by mini-css-extract-plugin\nexport default {\"tooltip\":\"Tooltip_tooltip__7nBuD\",\"icon\":\"Tooltip_icon__JNSN-\",\"content\":\"Tooltip_content__vpUuw\"};","import React from 'react';\n\nimport PropTypes from 'prop-types';\n\nimport Icon from 'lib/components/Icon';\nimport styles from './Tooltip.module.scss';\n\n/**\n * A basic tooltip to use to let the user be able to get more information about something.\n * It displays an icon with an interrogation point that let the information (children) display on click.\n */\nconst Tooltip = ({ children, alt }) => {\n const [isShown, setIsShown] = React.useState(false);\n\n if (!children) {\n return null;\n }\n\n return (\n \n setIsShown(!isShown)}\n >\n {children}\n
\n \n );\n};\n\nTooltip.propTypes = {\n /**\n * The component to include in this Tooltip component.\n * This what should be displayed when we hover or click on the tooltip icon.\n */\n children: PropTypes.node,\n /**\n * The html alt property to pass to the tooltip icon.\n */\n alt: PropTypes.string,\n};\n\nTooltip.defaultProps = {\n children: null,\n alt: null,\n};\n\nexport default Tooltip;\n","// extracted by mini-css-extract-plugin\nexport default {\"field\":\"FormField_field__yyo+p\",\"field_error\":\"FormField_field_error__2m2gb\",\"header\":\"FormField_header__d15m5\",\"left_wrapper\":\"FormField_left_wrapper__i9ld4\",\"tooltip\":\"FormField_tooltip__8jNYh\",\"right_wrapper\":\"FormField_right_wrapper__g92op\",\"component\":\"FormField_component__NMPAe\",\"asterisk\":\"FormField_asterisk__iRqbK\",\"checkbox_asterisk\":\"FormField_checkbox_asterisk__cJjYY\",\"field_input\":\"FormField_field_input__+W3Re\",\"field_input_error\":\"FormField_field_input_error__zmv1L\",\"field_input_checkbox\":\"FormField_field_input_checkbox__CtgCt\",\"field_input_checkbox_error\":\"FormField_field_input_checkbox_error__IdWU7\",\"field_input_select\":\"FormField_field_input_select__PUumS\",\"wz-lyriapay__form-field__input-select-error\":\"FormField_wz-lyriapay__form-field__input-select-error__UOmYZ\",\"field_input_select_error\":\"FormField_field_input_select_error__37xgg\",\"field_input_label_radio_checkbox\":\"FormField_field_input_label_radio_checkbox__Lv87-\",\"error\":\"FormField_error__isear\",\"error_item\":\"FormField_error_item__kaunI\",\"error_item_icon\":\"FormField_error_item_icon__q5LHa\",\"error_item_label\":\"FormField_error_item_label__wk04U\"};","import React from 'react';\n\nimport PropTypes from 'prop-types';\n\nimport Icon from 'lib/components/Icon';\nimport Tooltip from 'lib/components/Tooltip';\n\nimport styles from './FormField.module.scss';\n\n/**\n * This component is used as a common form field that can be used in any classical form.\n * For now, it does not provide a way to customize the data validation functions and the type of data allowed.\n */\nconst FormField = ({\n id,\n name,\n type,\n value,\n checked,\n options,\n label,\n required,\n disabled,\n placeholder,\n autoComplete,\n pattern,\n inputProps,\n onChange,\n onBlur,\n onFocus,\n formatAndValidate,\n TooltipProps,\n headerEndComponent,\n errors,\n errorIcon,\n shouldDisplayAsteriskIfRequired = true,\n}) => {\n const [inputValue, setInputValue] = React.useState(value);\n const [elementCaretPosition, setElementCaretPosition] = React.useState([null, null]);\n const isNotValid = errors && errors.length !== 0;\n\n React.useEffect(\n () => {\n setInputValue(formatAndValidate ? formatAndValidate(value) : value);\n },\n [value, formatAndValidate],\n );\n\n React.useEffect(\n () => {\n // https://stackoverflow.com/questions/512528/set-keyboard-caret-position-in-html-textbox\n const element = elementCaretPosition[0];\n const caretPosition = elementCaretPosition[1];\n if (element && (caretPosition || caretPosition === 0)) {\n // eslint-disable-next-line\n element.value = element.value;\n if (element.createTextRange) {\n let range = element.createTextRange();\n range.move('character', caretPosition);\n range.select();\n } else {\n if (element.selectionStart || element.selectionStart === 0) {\n element.focus();\n element.setSelectionRange(caretPosition, caretPosition);\n } else {\n element.focus();\n }\n }\n }\n },\n [elementCaretPosition],\n );\n\n const headerComponent = React.useMemo(\n () => (\n setIsShown(!isShown)} alt={alt}>\n
\n \n
\n ),\n [TooltipProps, headerEndComponent, id, name, label, shouldDisplayAsteriskIfRequired, required],\n );\n\n const errorsComponent = React.useMemo(\n () => (\n \n
\n {headerEndComponent && (\n \n \n
\n {shouldDisplayAsteriskIfRequired && required && (\n *
\n )}\n {TooltipProps?.children && (\n \n \n {TooltipProps.children}\n \n
\n )}\n \n
\n )}\n \n {headerEndComponent}\n
\n \n {errors && errors.map((error, index) => (\n \n
\n ))}\n \n ),\n [errors, errorIcon],\n );\n\n const onChangeInput = React.useCallback(\n (event) => {\n let caretPosition;\n let value;\n if (type === 'checkbox' || type === 'radio') {\n value = event.target.checked;\n caretPosition = null;\n } else {\n value = event.target.value;\n caretPosition = event.target.selectionStart;\n }\n let newValue = value;\n\n if (formatAndValidate) {\n const inputLength = value?.length || 0;\n newValue = formatAndValidate(value);\n caretPosition = caretPosition + ((newValue?.length || 0) - inputLength);\n }\n\n setInputValue(newValue);\n\n if (onChange) {\n onChange(event, newValue);\n }\n if (caretPosition || caretPosition === 0) {\n setElementCaretPosition([document.getElementById(event.target.id), caretPosition]);\n }\n },\n [onChange, formatAndValidate, type],\n );\n\n let classNameFormField = styles.field;\n let classNameFormFieldInput = styles.field_input;\n if (isNotValid) {\n classNameFormField = styles.field_error;\n classNameFormFieldInput = styles.field_input_error;\n }\n\n if (type === 'checkbox' || type === 'radio') {\n classNameFormFieldInput = styles.field_input_checkbox;\n if (isNotValid) {\n classNameFormFieldInput = styles.field_input_checkbox_error;\n }\n\n return (\n \n {errorIcon === 'alert' && (
\n \n {error}\n
\n \n
\n );\n }\n\n if (type === 'select') {\n classNameFormFieldInput = styles.field_input_select;\n if (isNotValid) {\n classNameFormFieldInput = styles.field_input_select_error;\n }\n\n return (\n \n
\n {isNotValid && errorsComponent}\n \n \n {shouldDisplayAsteriskIfRequired && required && (\n *\n )}\n
\n \n {headerComponent}\n
\n );\n }\n\n return (\n \n \n {options?.map((option) => (\n \n ))}\n \n
\n {isNotValid && errorsComponent}\n \n {headerComponent}\n
\n );\n};\n\nFormField.propTypes = {\n /**\n * id props to pass to the input for accessibility\n */\n id: PropTypes.string,\n /**\n * The form field name.\n */\n name: PropTypes.string.isRequired,\n /**\n * The value of the input to put by default.\n */\n value: PropTypes.string,\n /**\n * The input checked value for radio type.\n */\n checked: PropTypes.bool,\n /**\n * The list of options if the input type is a \"select\"\n */\n options: PropTypes.arrayOf(PropTypes.shape({\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n label: PropTypes.string,\n })),\n /**\n * The type of the input.\n */\n type: PropTypes.string,\n /**\n * The label to display related to the field.\n */\n label: PropTypes.string,\n /**\n * Whether the input must be required or not.\n */\n required: PropTypes.bool,\n /**\n * Whether the input must be disabled or not.\n */\n disabled: PropTypes.bool,\n /**\n * The placeholder to display in the input when it is empty.\n */\n placeholder: PropTypes.string,\n /**\n * The common key to use to autocomplete the input automatically by the browser.\n */\n autoComplete: PropTypes.string,\n /**\n * The pattern regexp to pass to the input to make validation and display appropriate keyboard.\n */\n pattern: PropTypes.string,\n /**\n * The callback function to trigger when the input is changing.\n */\n onChange: PropTypes.func,\n /**\n * The callback function to trigger when the input is blurred.\n */\n onBlur: PropTypes.func,\n /**\n * The callback function to trigger when the input is focused.\n */\n onFocus: PropTypes.func,\n /**\n * The format and validate function to apply on the input value.\n */\n formatAndValidate: PropTypes.func,\n /**\n * The rest of specific input props to pass to the input tag and that are not props of this component.\n */\n inputProps: PropTypes.object,\n /**\n * The content of the tooltip to display when we hover / click on the tooltip icon. If null, no tooltip displayed.\n */\n TooltipProps: PropTypes.shape(Tooltip.propTypes),\n /**\n * The component to display at the end of the header at the right side of the label.\n */\n headerEndComponent: PropTypes.node,\n /**\n * The list of errors to display related to the field.\n */\n errors: PropTypes.arrayOf(PropTypes.string),\n /**\n * The type of icon to display before the error label.\n */\n errorIcon: PropTypes.oneOf(['cross', 'alert']),\n /**\n * Whether we want to display an asterisk next to the label to notice the field is required or not.\n */\n shouldDisplayAsteriskIfRequired: PropTypes.bool,\n};\n\nFormField.defaultProps = {\n id: null,\n value: '',\n checked: false,\n options: [],\n type: 'text',\n label: null,\n required: false,\n disabled: false,\n placeholder: null,\n autoComplete: null,\n pattern: null,\n onChange: null,\n onBlur: null,\n onFocus: null,\n formatAndValidate: null,\n inputProps: {},\n TooltipProps: {},\n headerEndComponent: null,\n errors: [],\n errorIcon: 'alert',\n shouldDisplayAsteriskIfRequired: true,\n};\n\nFormField.displayName = 'FormField';\n\nexport default FormField;\n","import React from 'react';\nimport axios from 'axios';\n\nexport const useFormSave = (\n url,\n token,\n paymentRequestId,\n pspId,\n handleSuccess,\n handleError,\n) => {\n return React.useCallback((data) => {\n axios({\n method: 'post',\n url: url,\n headers: {\n 'Content-Type': 'application/json',\n },\n data: {\n data: data,\n request_token: token,\n payment_request_id: paymentRequestId,\n psp: pspId,\n },\n })\n .then(({data}) => {\n handleSuccess(data.data);\n })\n .catch((error) => {\n if (error.response?.status === 400) {\n handleError(error.response.data);\n } else {\n handleError({ code: 'internal' });\n console.error(error.response);\n }\n });\n },\n [\n url,\n token,\n paymentRequestId,\n pspId,\n handleSuccess,\n handleError,\n ]);\n\n};\n","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport Button from 'lib/components/Button';\nimport FormField from 'lib/components/FormField';\nimport { useFormSave } from 'lib/hooks/useFormSave';\n\nimport styles from 'lib/components/PspComposer/PspComposer.module.scss';\n\n/**\n * This component is one of the multiple available payment method in this project.\n * It represents a form including the Chilean RUT number and the bank account number,\n * only used to collect refund request data for now.\n */\nconst ChileanForm = React.forwardRef(\n (\n {\n pspId,\n token,\n paymentRequestId,\n lyriaUrl,\n hidePayButton,\n labelPayButton,\n onPaymentResult,\n },\n ref,\n ) => {\n const { t } = useTranslation();\n\n const formRef = React.useRef(null);\n const [formData, setFormData] = React.useState({\n firstName: '',\n lastName: '',\n rutNumber: '',\n bankName: '',\n bankAccountType: '',\n bankAccountNumber: '',\n email: '',\n });\n const [formFieldBlurState, setFormFieldBlurState] = React.useState({\n firstName: false,\n lastName: false,\n rutNumber: false,\n bankName: false,\n bankAccountType: false,\n bankAccountNumber: false,\n email: false,\n });\n const [errors, setErrors] = React.useState({});\n\n const handleSuccess = React.useCallback(\n (response) => {\n onPaymentResult({ success: true, data: response });\n },\n [onPaymentResult],\n );\n\n const handleError = React.useCallback(\n (response) => {\n if (response?.data) {\n const fieldErrors = {};\n Object\n .keys(response.data)\n .forEach((key) => {\n fieldErrors[key] = response.data[key] && response.data[key].map((error) => t([\n `chilean_form_${key}_error_${error.code}`,\n `error_${error.code}`,\n 'error_form',\n ]));\n });\n setErrors(fieldErrors);\n }\n onPaymentResult({\n success: false,\n data: response,\n });\n },\n [onPaymentResult, t],\n );\n const url = lyriaUrl + '/chilean-form/save';\n const saveForm = useFormSave(url, token, paymentRequestId, pspId, handleSuccess, handleError);\n\n const submitForm = React.useCallback(\n (event) => {\n event.preventDefault();\n event.stopPropagation();\n const data = {\n first_name: formData.firstName,\n last_name: formData.lastName,\n rut_number: formData.rutNumber,\n bank_name: formData.bankName,\n bank_account_type: formData.bankAccountType,\n bank_account_number: formData.bankAccountNumber,\n email: formData.email,\n };\n saveForm(data);\n },\n [formData, saveForm],\n );\n\n const formatAndValidateRutNumber = React.useCallback(\n (value) => {\n let newValue = value.toUpperCase().replace(/\\s+/g, '');\n const isNotValid = (\n (newValue?.length >= 9 || formFieldBlurState?.rutNumber)\n && !newValue.match(/^(\\d{1,2}\\.)?\\d{3}\\.\\d{3}-[\\dkK]$/g)\n );\n\n setErrors((prevState) => ({\n ...prevState,\n rut_number: isNotValid ? [t('chilean_form_rut_number_error_invalid')] : null,\n }));\n\n return newValue;\n },\n [t, formFieldBlurState?.rutNumber],\n );\n\n const onChangeFormField = React.useCallback(\n (fieldName) => (event, newValue) => {\n setFormData((prevState) => ({\n ...prevState,\n [fieldName]: newValue,\n }));\n\n },\n [],\n );\n\n const onBlurFormField = React.useCallback(\n (fieldName) => (_event) => {\n setFormFieldBlurState((prevState) => ({\n ...prevState,\n [fieldName]: true,\n }));\n },\n [],\n );\n\n React.useImperativeHandle(\n ref,\n () => ({\n pay() {\n return formRef.current.click();\n },\n canClickOnPay: Object.values(formData).every((value) => !!value),\n }),\n [formData],\n );\n\n return (\n \n
\n {isNotValid && errorsComponent}\n \n \n
\n );\n },\n);\n\nChileanForm.propTypes = {\n /**\n * The is of the PSP returned by the backend in order to be able to pass it when we submit the form data.\n */\n pspId: PropTypes.number.isRequired,\n /**\n * The token to use in order to be able to call the backend when we submit the form data.\n */\n token: PropTypes.string,\n /**\n * The paymentRequestID to use in order to be able to call the backend when we submit the data in the paymentPage.\n */\n paymentRequestId: PropTypes.string,\n /**\n * The backend url to use to pass the form data.\n */\n lyriaUrl: PropTypes.string.isRequired,\n /**\n * Whether the submit button must be displayed or not.\n */\n hidePayButton: PropTypes.bool,\n /**\n * The label of the 'pay' button to display. hidePayButton props must be false of course.\n */\n labelPayButton: PropTypes.string,\n /**\n * The callback function to trigger when the backend return the result of the form data submit.\n */\n onPaymentResult: PropTypes.func.isRequired,\n};\n\nChileanForm.defaultProps = {\n hidePayButton: false,\n labelPayButton: null, // Fallback on 'pay' or 'ask refund' label.\n};\n\nChileanForm.displayName = 'ChileanForm';\n\nexport default ChileanForm;\n","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport FormField from 'lib/components/FormField/FormField';\nimport Button from 'lib/components/Button';\nimport { useFormSave } from 'lib/hooks/useFormSave';\n\nimport styles from 'lib/components/PspComposer/PspComposer.module.scss';\n\nconst CURP_REGEX = /^([A-Z][AEIOUX][A-Z]{2}\\d{2}(?:0[1-9]|1[0-2])(?:0[1-9]|[12]\\d|3[01])[HM](?:AS|B[CS]|C[CLMSH]|D[FG]|G[TR]|HG|JC|M[CNS]|N[ETL]|OC|PL|Q[TR]|S[PLR]|T[CSL]|VZ|YN|ZS)[B-DF-HJ-NP-TV-Z]{3}[A-Z\\d])(\\d)$/;\n\n/**\n * This component is one of the multiple available payment method in this project.\n * It represents a CLABE (mexican bank system) form, only used to collect refund request data for now.\n */\nconst Clabe = React.forwardRef(\n (\n {\n pspId,\n token,\n paymentRequestId,\n lyriaUrl,\n hidePayButton,\n labelPayButton,\n onPaymentResult,\n },\n ref,\n ) => {\n const { t } = useTranslation();\n\n const formRef = React.useRef(null);\n const [formData, setFormData] = React.useState({\n firstName: '',\n lastName: '',\n clabeNumber: '',\n curpNumber: '',\n phoneNumber: '',\n bankCardType: '',\n });\n const [formFieldBlurState, setFormFieldBlurState] = React.useState({\n firstName: false,\n lastName: false,\n clabeNumber: false,\n curpNumber: false,\n phoneNumber: false,\n bankCardType: false,\n });\n const [errors, setErrors] = React.useState({});\n\n const handleSuccess = React.useCallback(\n (response) => {\n onPaymentResult({ success: true, data: response});\n },\n [onPaymentResult],\n );\n\n const handleError = React.useCallback(\n (response) => {\n if (response?.data) {\n const fieldErrors = {};\n Object\n .keys(response.data)\n .forEach((key) => {\n fieldErrors[key] = response.data[key] && response.data[key].map((error) => t([\n `clabe_${key}_error_${error.code}`,\n `error_${error.code}`,\n 'error_form',\n ]));\n });\n setErrors(fieldErrors);\n }\n onPaymentResult({\n success: false,\n data: response,\n });\n },\n [onPaymentResult, t],\n );\n\n const url = lyriaUrl + '/clabe/save';\n const saveForm = useFormSave(url, token, paymentRequestId, pspId, handleSuccess, handleError);\n\n const submitForm = React.useCallback(\n (event) => {\n event.preventDefault();\n event.stopPropagation();\n const data = {\n first_name: formData.firstName,\n last_name: formData.lastName,\n clabe_number: formData.clabeNumber,\n curp_number: formData.curpNumber,\n phone_number: formData.phoneNumber,\n bank_card_type: formData.bankCardType,\n };\n saveForm(data);\n },\n [formData, saveForm],\n );\n\n const formatAndValidateClabe = React.useCallback(\n (value) => {\n let newValue = value.toUpperCase().replace(/\\s+/g, '');\n let matches = newValue.match(/[0-9]+/g);\n newValue = (matches && matches.join('')) || '';\n\n setErrors((prevState) => ({\n ...prevState,\n clabe_number: newValue.length !== 18 ? [t('clabe_clabe_number_error_min_length')] : null,\n }));\n\n return newValue;\n },\n [t],\n );\n\n const formatAndValidateCurp = React.useCallback(\n (value) => {\n let newValue = value.toUpperCase().replace(/\\s+/g, '');\n let matches = newValue.substr(0, 18).match(/[A-Z0-9]/g);\n newValue = matches?.join('') || '';\n\n let curpError = null;\n if (newValue.length !== 18) {\n curpError = [t('clabe_curp_number_error_min_length')];\n } else if (!newValue.match(CURP_REGEX)) {\n curpError = [t('clabe_curp_number_error_invalid')];\n }\n\n setErrors((prevState) => ({\n ...prevState,\n curp_number: curpError,\n }));\n\n return newValue;\n },\n [t],\n );\n\n const onChangeFormField = React.useCallback(\n (fieldName) => (event, newValue) => {\n setFormData((prevState) => ({\n ...prevState,\n [fieldName]: newValue,\n }));\n },\n [],\n );\n\n const onBlurFormField = React.useCallback(\n (fieldName) => (_event) => {\n setFormFieldBlurState((prevState) => ({\n ...prevState,\n [fieldName]: true,\n }));\n },\n [],\n );\n\n React.useImperativeHandle(\n ref,\n () => ({\n pay() {\n return formRef.current.click();\n },\n canClickOnPay: Object.values(formData).every((value) => !!value),\n }),\n [formData],\n );\n\n return (\n \n \n
\n );\n },\n);\n\nClabe.propTypes = {\n /**\n * The id of the PSP returned by the backend in order to be able to pass it when we submit the form data.\n */\n pspId: PropTypes.number.isRequired,\n /**\n * The token to use in order to be able to call the backend when we submit the form data.\n */\n token: PropTypes.string,\n /**\n * The paymentRequestID to use in order to be able to call the backend when we submit the data in the paymentPage.\n */\n paymentRequestId: PropTypes.string,\n /**\n * The backend url to use to pass the form data.\n */\n lyriaUrl: PropTypes.string.isRequired,\n /**\n * Whether the submit button must be displayed or not.\n */\n hidePayButton: PropTypes.bool,\n /**\n * The label of the 'pay' button to display. hidePayButton props must be false of course.\n */\n labelPayButton: PropTypes.string,\n /**\n * The callback function to trigger when the backend return the result of the form data submit.\n */\n onPaymentResult: PropTypes.func.isRequired,\n};\n\nClabe.defaultProps = {\n hidePayButton: false,\n labelPayButton: null, // Fallback on 'pay' or 'ask refund' label.\n};\n\nClabe.displayName = 'Clabe';\n\nexport default Clabe;\n","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport Button from 'lib/components/Button';\nimport FormField from 'lib/components/FormField';\nimport { useFormSave } from 'lib/hooks/useFormSave';\n\nimport styles from 'lib/components/PspComposer/PspComposer.module.scss';\n\n/**\n * This component is one of the multiple available payment method in this project.\n * It represents a form used for Colombia including a list of Bank from Colombia, the bank account number,\n * and some information related to Colombia. It is only used to collect refund request data.\n */\nconst ColombianForm = React.forwardRef(\n (\n {\n pspId,\n token,\n paymentRequestId,\n lyriaUrl,\n hidePayButton,\n labelPayButton,\n onPaymentResult,\n },\n ref,\n ) => {\n const { t } = useTranslation();\n\n const formRef = React.useRef(null);\n const [formData, setFormData] = React.useState({\n bankAccountType: '',\n bankAccountNumber: '',\n bankAccountHolderName: '',\n bankName: '',\n documentNumber: '',\n documentType: '',\n });\n const [errors, setErrors] = React.useState({});\n\n const handleSuccess = React.useCallback(\n (response) => {\n onPaymentResult({ success: true, data: response });\n },\n [onPaymentResult],\n );\n\n const handleError = React.useCallback(\n (response) => {\n if (response?.data) {\n const fieldErrors = {};\n Object\n .keys(response.data)\n .forEach((key) => {\n fieldErrors[key] = response.data[key] && response.data[key].map((error) => t([\n `colombian_form_${key}_error_${error.code}`,\n `error_${error.code}`,\n 'error_form',\n ]));\n });\n setErrors(fieldErrors);\n }\n onPaymentResult({\n success: false,\n data: response,\n });\n },\n [onPaymentResult, t],\n );\n\n const url = lyriaUrl + '/colombian-form/save';\n const saveForm = useFormSave(url, token, paymentRequestId, pspId, handleSuccess, handleError);\n\n const submitForm = React.useCallback(\n (event) => {\n event.preventDefault();\n event.stopPropagation();\n const data = {\n bank_account_holder_name: formData.bankAccountHolderName,\n bank_account_number: formData.bankAccountNumber,\n bank_account_type: formData.bankAccountType,\n bank_name: formData.bankName,\n document_number: formData.documentNumber,\n document_type: formData.documentType,\n };\n saveForm(data);\n },\n [formData, saveForm],\n );\n\n const onChangeFormField = React.useCallback(\n (fieldName) => (event, newValue) => {\n setFormData((prevState) => ({\n ...prevState,\n [fieldName]: newValue,\n }));\n\n },\n [],\n );\n\n React.useImperativeHandle(\n ref,\n () => ({\n pay() {\n return formRef.current.click();\n },\n canClickOnPay: Object.values(formData).every((value) => !!value),\n }),\n [formData],\n );\n\n return (\n \n \n
\n );\n },\n);\n\nColombianForm.propTypes = {\n /**\n * The is of the PSP returned by the backend in order to be able to pass it when we submit the form data.\n */\n pspId: PropTypes.number.isRequired,\n /**\n * The token to use in order to be able to call the backend when we submit the form data.\n */\n token: PropTypes.string,\n /**\n * The paymentRequestID to use in order to be able to call the backend when we submit the data in the paymentPage.\n */\n paymentRequestId: PropTypes.string,\n /**\n * The backend url to use to pass the form data.\n */\n lyriaUrl: PropTypes.string.isRequired,\n /**\n * Whether the submit button must be displayed or not.\n */\n hidePayButton: PropTypes.bool,\n /**\n * The label of the 'pay' button to display. hidePayButton props must be false of course.\n */\n labelPayButton: PropTypes.string,\n /**\n * The callback function to trigger when the backend return the result of the form data submit.\n */\n onPaymentResult: PropTypes.func.isRequired,\n};\n\nColombianForm.defaultProps = {\n hidePayButton: false,\n labelPayButton: null, // Fallback on 'pay' or 'ask refund' label.\n};\n\nColombianForm.displayName = 'ColombianForm';\n\nexport default ColombianForm;\n","// extracted by mini-css-extract-plugin\nexport default {\"error_block\":\"ErrorBlock_error_block__RANag\",\"icon\":\"ErrorBlock_icon__hJMqU\",\"content\":\"ErrorBlock_content__bLpar\"};","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport Icon from 'lib/components/Icon';\nimport styles from './ErrorBlock.module.scss';\n\n/**\n * This component is used to display a clean error message that can be readable by users.\n * It's mainly used for global errors not related to a particular form field and to display at the top op the window.\n */\nconst ErrorBlock = ({ errorCode }) => {\n const { t } = useTranslation();\n\n return (\n \n
\n );\n};\n\nErrorBlock.propTypes = {\n /**\n * The error code to translate in a readable human message\n * */\n errorCode: PropTypes.string,\n};\n\nErrorBlock.defaultProps = {\n errorCode: null,\n};\n\nErrorBlock.displayName = 'ErrorBlock';\n\nexport default ErrorBlock;\n","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport {Trans, useTranslation} from 'react-i18next';\nimport InfoBlock from 'lib/components/InfoBlock';\nimport FormField from 'lib/components/FormField/FormField';\nimport Button from 'lib/components/Button';\nimport { useFormSave } from 'lib/hooks/useFormSave';\n\nimport styles from 'lib/components/PspComposer/PspComposer.module.scss';\n\n/**\n * This component is one of the multiple available payment method in this project.\n * It represents an IBAN form, only used to collect refund request data for now.\n */\nconst Iban = React.forwardRef(\n (\n {\n config,\n currency,\n pspId,\n token,\n paymentRequestId,\n lyriaUrl,\n hidePayButton,\n labelPayButton,\n onPaymentResult,\n },\n ref,\n ) => {\n const { t } = useTranslation();\n\n const formRef = React.useRef(null);\n const [formData, setFormData] = React.useState({\n iban: '',\n bic: '',\n holder: '',\n });\n const [formFieldBlurState, setFormFieldBlurState] = React.useState({\n iban: false,\n bic: false,\n holder: false,\n });\n const [errors, setErrors] = React.useState({});\n const [isBicRequired, setIsBicRequired] = React.useState(config?.collect_bic);\n\n const handleSuccess = React.useCallback(\n (response) => {\n onPaymentResult({ success: true, data: response });\n },\n [onPaymentResult],\n );\n\n const handleError = React.useCallback(\n (response) => {\n if (response?.data) {\n const fieldErrors = {};\n Object\n .keys(response.data)\n .forEach((key) => {\n fieldErrors[key] = response.data[key] && response.data[key].map((error) => t([\n `iban_${key}_error_${error.code}`,\n `error_${error.code}`,\n 'error_form',\n ]));\n });\n setErrors(fieldErrors);\n }\n onPaymentResult({\n success: false,\n data: response,\n });\n },\n [onPaymentResult, t],\n );\n\n const url = lyriaUrl + '/iban/save';\n const saveForm = useFormSave(url, token, paymentRequestId, pspId, handleSuccess, handleError);\n\n const submitForm = React.useCallback(\n (event) => {\n event.preventDefault();\n event.stopPropagation();\n const data = {\n iban: formData.iban.replace(/\\s+/g, ''),\n holder: formData.holder,\n };\n if (isBicRequired) {\n data['bic'] = formData.bic;\n }\n saveForm(data);\n },\n [isBicRequired, formData, saveForm],\n );\n\n const formatAndValidateIban = React.useCallback(\n (value) => {\n let newValue = value.toUpperCase().replace(/\\s+/g, '');\n let matches = newValue.match(/[0-9A-Z]+/g);\n let match = (matches && matches.join('')) || '';\n let valueFormatted = [];\n\n for (let i = 0, len = match.length; i < len; i += 4) {\n valueFormatted.push(match.substring(i, i + 4));\n }\n\n newValue = valueFormatted.length\n ? valueFormatted.join(' ')\n : newValue;\n const newValueWithNoWhiteSpace = valueFormatted.length\n ? valueFormatted.join('')\n : newValue.replace(/\\s+/g, '');\n\n let ibanError = null;\n if (newValueWithNoWhiteSpace.length > 34 || newValueWithNoWhiteSpace.length < 14) {\n ibanError = [t('iban_iban_error_invalid')];\n } else if (\n newValueWithNoWhiteSpace.length >= 2\n && config?.accepted_prefix\n && !config?.accepted_prefix.includes(newValueWithNoWhiteSpace.slice(0, 2))\n ) {\n ibanError = [t('iban_iban_error_invalid_iban_prefix')];\n // Special rules for currency CHF\n } else if (currency === 'CHF') {\n if (newValueWithNoWhiteSpace.startsWith('CH', 0)) {\n setIsBicRequired(false);\n ibanError = /CH[0-9A-Z]{2}3/g.test(newValueWithNoWhiteSpace)\n ? [t('iban_iban_error_invalid_iban_prefix')]\n : null;\n } else {\n setIsBicRequired(config?.collect_bic);\n }\n }\n\n setErrors((prevState) => ({\n ...prevState,\n iban: ibanError,\n }));\n\n return newValue;\n },\n [t, currency, config?.collect_bic, config?.accepted_prefix],\n );\n\n const onChangeFormField = React.useCallback(\n (fieldName) => (event, newValue) => {\n setFormData((prevState) => ({\n ...prevState,\n [fieldName]: newValue,\n }));\n },\n [],\n );\n\n const onBlurFormField = React.useCallback(\n (fieldName) => (_event) => {\n setFormFieldBlurState((prevState) => ({\n ...prevState,\n [fieldName]: true,\n }));\n },\n [],\n );\n\n React.useEffect(\n () => {\n setIsBicRequired(config?.collect_bic);\n },\n [config?.collect_bic],\n );\n\n React.useImperativeHandle(\n ref,\n () => ({\n pay() {\n return formRef.current.click();\n },\n canClickOnPay: formData.iban && !formData.holder && (!isBicRequired || formData.bic),\n }),\n [isBicRequired, formData],\n );\n\n return (\n \n
\n \n {t([`error_${errorCode}`, 'error_PSPError'])}\n
\n \n \n
\n );\n },\n);\n\nIban.propTypes = {\n /**\n * The specific configuration related to this payment method (IBAN).\n */\n config: PropTypes.object,\n /**\n * The ISO 4217 currency code.\n */\n currency: PropTypes.string,\n /**\n * The id of the PSP returned by the backend in order to be able to pass it when we submit the form data.\n */\n pspId: PropTypes.number.isRequired,\n /**\n * The token to use in order to be able to call the backend when we submit the form data.\n */\n token: PropTypes.string,\n /**\n * The paymentRequestID to use in order to be able to call the backend when we submit the data in the paymentPage.\n */\n paymentRequestId: PropTypes.string,\n /**\n * The backend url to use to pass the form data.\n */\n lyriaUrl: PropTypes.string.isRequired,\n /**\n * Whether the submit button must be displayed or not.\n */\n hidePayButton: PropTypes.bool,\n /**\n * The label of the 'pay' button to display. hidePayButton props must be false of course.\n */\n labelPayButton: PropTypes.string,\n /**\n * The callback function to trigger when the backend return the result of the form data submit.\n */\n onPaymentResult: PropTypes.func.isRequired,\n};\n\nIban.defaultProps = {\n config: {},\n currency: null,\n hidePayButton: false,\n labelPayButton: null, // Fallback on 'pay' or 'ask refund' label.\n};\n\nIban.displayName = 'Iban';\n\nexport default Iban;\n","// extracted by mini-css-extract-plugin\nexport default {\"button_link_content\":\"ButtonLink_button_link_content__RHy2B\"};","import React from 'react';\n\nimport PropTypes from 'prop-types';\n\nimport styles from './ButtonLink.module.scss';\n\n/**\n * This component is a button link style with a transparent style and an optional icon.\n */\nconst ButtonLink = React.forwardRef(\n (\n {\n label,\n type,\n disabled,\n startIcon,\n onClick,\n ...props // eslint-disable-line no-unused-vars\n },\n //todo: check this function: ref is not used, which should be the point of a ForwardRef\n ref, // eslint-disable-line no-unused-vars\n ) => {\n return (\n \n );\n },\n);\n\nButtonLink.propTypes = {\n /**\n * The label to display on the button.\n */\n label: PropTypes.string,\n /**\n * The button type\n */\n type: PropTypes.string,\n /**\n * Whether the button should be disabled.\n */\n disabled: PropTypes.bool,\n /**\n * The icon at the left of the button label.\n */\n startIcon: PropTypes.any,\n /**\n * The callback function to trigger when we click on the button.\n */\n onClick: PropTypes.func,\n /**\n * All the other props that can be passed to the button html element and not explicitly given in the props\n */\n props: PropTypes.object,\n};\n\nButtonLink.defaultProps = {\n label: null,\n type: null,\n disabled: false,\n startIcon: null,\n onClick: null,\n};\n\nButtonLink.displayName = 'ButtonLink';\n\nexport default ButtonLink;\n","/**\n * This file gather all the utils function related to bank / credit cards.\n */\n\nexport const keepOnlyDigits = (value) => {\n return value.replace(/[\\D]+/g, '');\n};\n\nexport const formatCreditCardNumber = (value) => {\n let matches = value.match(/\\d{4,19}/g);\n let match = (matches && matches.join('')) || '';\n let parts = [];\n\n for (let i = 0, len = match.length; i < len; i += 4) {\n parts.push(match.substring(i, i + 4));\n }\n\n if (parts.length) {\n return parts.join(' ');\n } else {\n return value;\n }\n};\n\nexport const findCardType = (cardNumber, cardTypes) => {\n for (const cardType of cardTypes) {\n for (const prefix of cardType.iin_prefixes) {\n if (cardNumber.indexOf(prefix) === 0) {\n return cardType;\n }\n }\n }\n return null;\n};\n\nexport const findTokenizer = (cardType, tokenizers, savedPaymentMethodUuid=undefined) => {\n for (const tokenizer of tokenizers) {\n if (savedPaymentMethodUuid) {\n if (tokenizer.uuid === savedPaymentMethodUuid && tokenizer.card_types.indexOf(cardType) >= 0) {\n return tokenizer;\n }\n } else {\n if (tokenizer.card_types.indexOf(cardType) >= 0) {\n return tokenizer;\n }\n }\n }\n return null;\n};\n\nexport const luhnValidate = (cardNumber) => {\n const length = cardNumber.length;\n let odd = false,\n total = 0,\n resOdd,\n resEven;\n for (let i = length; i > 0; i--) {\n resOdd = parseInt(cardNumber.charAt(i - 1));\n if (!odd) {\n total += resOdd;\n } else {\n resEven = resOdd * 2;\n\n switch (resEven) {\n case 10:\n resEven = 1;\n break;\n case 12:\n resEven = 3;\n break;\n case 14:\n resEven = 5;\n break;\n case 16:\n resEven = 7;\n break;\n case 18:\n resEven = 9;\n break;\n default:\n break;\n }\n total += resEven;\n }\n odd = !odd;\n }\n\n return total !== 0 && total % 10 === 0;\n};\n\n/**\n * This function is to parse an ISO string date to an expiry date according to the MM/YY format.\n * @param {string} expiryDate The ISO string date.\n * @return {string} The converted expiry date converted into the format MM/YY.\n */\nexport const formatExpiryDate = (expiryDate) => {\n const expiryDateSplit = expiryDate?.split('-');\n if (!expiryDateSplit || expiryDateSplit.length < 2) {\n return expiryDate;\n }\n return `${expiryDateSplit[1]}/${expiryDateSplit[0]?.substring(2, 4)}`;\n};\n","// extracted by mini-css-extract-plugin\nexport default {\"input\":\"SavedCardInput_input__dM-f-\",\"header\":\"SavedCardInput_header__e3SPO\",\"logo\":\"SavedCardInput_logo__NmTxX\",\"masked_number\":\"SavedCardInput_masked_number__SDLYk\",\"header_3\":\"SavedCardInput_header_3__0Pwft\",\"expiry\":\"SavedCardInput_expiry__Bk1WX\"};","import React from 'react';\n\nimport PropTypes from 'prop-types';\n\nimport Icon from 'lib/components/Icon';\nimport { formatExpiryDate } from 'lib/utils/cardUtils';\nimport styles from './SavedCardInput.module.scss';\n\n/**\n * This component is used as the main component to handle bank card information.\n */\nconst SavedCardInput = ({\n uuid,\n selected,\n onClickRadio,\n maskedCardNumber,\n displayExpiryDate,\n expiryDate,\n cardType,\n content,\n}) => {\n const [expiryDateValue, setExpiryDateValue] = React.useState(expiryDate);\n\n React.useEffect(\n () => {\n setExpiryDateValue(formatExpiryDate(expiryDate));\n },\n [expiryDate],\n );\n\n return (\n \n
\n \n
\n \n
\n {displayExpiryDate && (\n \n {maskedCardNumber?.replace(/X/g, '*')}\n
\n \n
\n )}\n \n {selected && content && (\n \n {expiryDateValue}\n
\n \n {content}\n
\n )}\n \n );\n};\n\nSavedCardInput.propTypes = {\n /**\n * The uuid of the saved card (in order to pass to the radio button value).\n */\n uuid: PropTypes.string,\n /**\n * Whether we want to select the saved card (expanded).\n * Note the selection and so the radio button value is managed outside the component.\n */\n selected: PropTypes.bool,\n /**\n * The callback function to trigger when we click on the radio button.\n * It should handle the uuid.\n */\n onClickRadio: PropTypes.func,\n /**\n * The card masked number to display.\n */\n maskedCardNumber: PropTypes.string,\n /**\n * If we have to display the expiry date on the header or not.\n */\n displayExpiryDate: PropTypes.bool,\n /**\n * The value of the expiry date to display.\n * The format must be XX/XX following the regexp ^(0[1-9]|1[0-2])\\/([0-9]{2})$\n */\n expiryDate: PropTypes.string,\n /**\n * The type of card.\n */\n cardType: PropTypes.string,\n /**\n * The content to display when we select ('selected' is true) the saved card.\n * Usually is to put the Cvx input.\n */\n content: PropTypes.node,\n};\n\nSavedCardInput.defaultProps = {\n uuid: null,\n selected: false,\n onClickRadio: null,\n maskedCardNumber: '',\n displayExpiryDate: true,\n expiryDate: '',\n cardType: '',\n content: null,\n};\n\nexport default SavedCardInput;\n","// extracted by mini-css-extract-plugin\nexport default {\"label\":\"Ingenico_label__aRHRD\",\"saved_payment_method\":\"Ingenico_saved_payment_method__T2hMy\",\"button_new_payment_method\":\"Ingenico_button_new_payment_method__syvJ5\"};","import React from 'react';\n\nimport axios from 'axios';\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport Button from 'lib/components/Button';\nimport ButtonLink from 'lib/components/ButtonLink';\nimport Icon from 'lib/components/Icon';\nimport Loader from 'lib/components/Loader';\nimport SavedCardInput from 'lib/components/SavedCardInput';\nimport { formatExpiryDate } from 'lib/utils/cardUtils';\nimport styles from './Ingenico.module.scss';\nimport styles_psp from 'lib/components/PspComposer/PspComposer.module.scss';\n\n/**\n * This component is one of the multiple available payment method in this project.\n * It represents the Ingenico PSP integration that can deal with multiple bank card types.\n */\nconst Ingenico = React.forwardRef(\n (\n {\n config,\n token,\n paymentRequestId,\n lyriaUrl,\n hidePayButton,\n labelPayButton,\n paymentMethods, // eslint-disable-line no-unused-vars\n onPaymentResult,\n themeMode,\n },\n ref,\n ) => {\n /* ------------ Initialization of the imports, the variables and the states ------------ */\n\n // Hooks\n const { t } = useTranslation();\n\n const [isReady, setIsReady] = React.useState(false);\n\n /* ------------ The main functions ------------ */\n\n // The api call to Lyria (backend) to trigger Ingenico payment process.\n const processPayment = React.useCallback(\n (urlToRedirect) => {\n axios({\n method: 'post',\n url: lyriaUrl + '/ingenico/process',\n headers: {\n 'Content-Type': 'application/json',\n },\n data: {\n request_token: token,\n payment_request_id: paymentRequestId,\n psp: config.id,\n },\n })\n .then((_res) => {\n window.top.location.href = urlToRedirect;\n setIsReady(true);\n })\n .catch((error) => {\n if (onPaymentResult) {\n onPaymentResult({ success: false, data: { code: 'internal' }});\n }\n console.info(error);\n });\n },\n [config.id, onPaymentResult, token, paymentRequestId, lyriaUrl],\n );\n\n /* ------------ The side effects and imperative handlers ------------ */\n\n // The handler to be able to external component to trigger 'pay' button actions.\n React.useImperativeHandle(\n ref,\n () => ({\n pay() {\n let urlToRedirect = config.no_card_hosted_checkout_url;\n if (config.saved_payment_methods_config?.length) {\n urlToRedirect = config.saved_payment_methods_config[0].url;\n }\n processPayment(urlToRedirect);\n },\n canClickOnPay: false,\n }),\n [config.no_card_hosted_checkout_url, config.saved_payment_methods_config, processPayment],\n );\n\n // Redirect immediately to Ingenico checkout page if there is no payment method saved and no .\n React.useEffect(\n () => {\n if (!config.saved_payment_methods_config?.length && hidePayButton) {\n processPayment(config.no_card_hosted_checkout_url);\n } else {\n setIsReady(true);\n }\n },\n [config.no_card_hosted_checkout_url, config.saved_payment_methods_config, processPayment, hidePayButton],\n );\n\n /* ------------ The JSX to return according to the logic above ------------ */\n if (!isReady) {\n return (\n \n
\n );\n }\n\n if (!config.saved_payment_methods_config?.length && !hidePayButton) {\n return (\n \n
\n );\n }\n\n return (\n \n {t('ingenico_label_checkout', { label: labelPayButton || t('payButton') })}\n
\n \n processPayment(config.no_card_hosted_checkout_url)}\n label={labelPayButton || t('payButton')}\n />\n
\n \n {!!config.saved_payment_methods_config?.length && config.saved_payment_methods_config.map((spmc) => (\n
\n );\n },\n);\n\nIngenico.propTypes = {\n /**\n * The specific configuration related to this payment method (IBAN).\n */\n config: PropTypes.object,\n /**\n * The token to pass to call the back-end.\n */\n token: PropTypes.string,\n /**\n * The paymentRequestID to use in order to be able to call the backend when we submit the data in the paymentPage.\n */\n paymentRequestId: PropTypes.string,\n /**\n * The url of lyria, the payment back-end.\n */\n lyriaUrl: PropTypes.string.isRequired,\n /**\n * Whether the submit button must be displayed or not.\n */\n hidePayButton: PropTypes.bool,\n /**\n * The label of the 'pay' button to display. hidePayButton props must be false of course.\n */\n labelPayButton: PropTypes.string,\n /**\n * The list of payment methods that belongs to the given payment method. That's a kind of sub payment method.\n * For example, for 'credit card' payment method we could have Visa, Mastercard and so on.\n */\n paymentMethods: PropTypes.arrayOf(\n PropTypes.shape({\n label: PropTypes.string.isRequired,\n payment_method: PropTypes.string.isRequired,\n }),\n ),\n /**\n * The callback function to trigger when the backend return the result of the form data submit.\n */\n onPaymentResult: PropTypes.func.isRequired,\n /**\n * The theme to use (dark or light).\n */\n themeMode: PropTypes.oneOf(['light', 'dark']),\n};\n\nIngenico.defaultProps = {\n config: {},\n hidePayButton: false,\n paymentMethods: [],\n onPaymentResult: null,\n themeMode: 'light',\n};\n\nIngenico.displayName = 'Ingenico';\n\nexport default Ingenico;\n","// extracted by mini-css-extract-plugin\nexport default {\"label\":\"IngenicoLegacy_label__hRrhI\"};","import React from 'react';\nimport PropTypes from 'prop-types';\n\nconst IngenicoLegacyForm = ({payload, formEl, config}) => {\n return (\n \n );\n};\n\nIngenicoLegacyForm.propTypes = {\n /**\n * The specific configuration related to this payment method (IBAN).\n */\n payload: PropTypes.object,\n formEl: PropTypes.object,\n config: PropTypes.object,\n};\n\nexport default IngenicoLegacyForm;\n","import React, { useRef } from 'react';\n\nimport axios from 'axios';\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport Button from 'lib/components/Button';\nimport Icon from 'lib/components/Icon';\nimport Loader from 'lib/components/Loader';\nimport styles from './IngenicoLegacy.module.scss';\nimport styles_psp from 'lib/components/PspComposer/PspComposer.module.scss';\nimport IngenicoLegacyForm from './IngenicoLegacyForm';\n\n/**\n * This component is one of the multiple available payment method in this project.\n * It represents the Ingenico PSP integration that can deal with multiple bank card types.\n */\nconst IngenicoLegacy = React.forwardRef(\n (\n {\n config,\n token,\n paymentRequestId,\n lyriaUrl,\n hidePayButton, // eslint-disable-line no-unused-vars\n labelPayButton,\n paymentMethods, // eslint-disable-line no-unused-vars\n onPaymentResult,\n themeMode,\n },\n //todo: check this function: ref is not used, which should be the point of a ForwardRef\n ref, // eslint-disable-line no-unused-vars\n ) => {\n /* ------------ Initialization of the imports, the variables and the states ------------ */\n\n // Hooks\n const { t } = useTranslation();\n\n const [isReady, setIsReady] = React.useState(true);\n const [payload, setPayload] = React.useState({});\n const formEl = useRef();\n /* ------------ The main functions ------------ */\n\n // The api call to Lyria (backend) to trigger Ingenico payment process.\n const getHostedInfo = React.useCallback(\n () => {\n axios({\n method: 'post',\n url: lyriaUrl + '/ingenico_legacy/process',\n headers: {\n 'Content-Type': 'application/json',\n },\n data: {\n payment_request_id: paymentRequestId,\n request_token: token,\n psp: config.id,\n lyria_url: lyriaUrl,\n },\n })\n .then((res) => {\n setIsReady(true);\n setPayload(res.data.payload);\n formEl.current && formEl.current.submit();\n })\n .catch((error) => {\n if (onPaymentResult) {\n onPaymentResult({ success: false, data: { code: 'internal' } });\n }\n console.info(error);\n });\n },\n [config.id, onPaymentResult, token, paymentRequestId, lyriaUrl],\n );\n\n /* ------------ The JSX to return according to the logic above ------------ */\n if (!isReady) {\n return (\n \n processPayment(spmc.url)}\n maskedCardNumber={spmc.masked_number}\n expiryDate={formatExpiryDate(spmc.expiry)}\n cardType={spmc.card_type}\n />\n
\n ))}\n \n processPayment(config.no_card_hosted_checkout_url)}\n label={t('useNewPaymentMethod')}\n startIcon={
\n \n
\n );\n }\n\n return (\n \n
\n );\n },\n);\n\nIngenicoLegacy.propTypes = {\n /**\n * The specific configuration related to this payment method (IBAN).\n */\n config: PropTypes.object,\n /**\n * The token to pass to call the back-end.\n */\n token: PropTypes.string,\n /**\n * The paymentRequestID to use in order to be able to call the backend when we submit the data in the paymentPage.\n */\n paymentRequestId: PropTypes.string,\n /**\n * The url of lyria, the payment back-end.\n */\n lyriaUrl: PropTypes.string.isRequired,\n /**\n * Whether the submit button must be displayed or not.\n */\n hidePayButton: PropTypes.bool,\n /**\n * The label of the 'pay' button to display. hidePayButton props must be false of course.\n */\n labelPayButton: PropTypes.string,\n /**\n * The list of payment methods that belongs to the given payment method. That's a kind of sub payment method.\n * For example, for 'credit card' payment method we could have Visa, Mastercard and so on.\n */\n paymentMethods: PropTypes.arrayOf(\n PropTypes.shape({\n label: PropTypes.string.isRequired,\n payment_method: PropTypes.string.isRequired,\n }),\n ),\n /**\n * The callback function to trigger when the backend return the result of the form data submit.\n */\n onPaymentResult: PropTypes.func.isRequired,\n /**\n * The theme to use (dark or light).\n */\n themeMode: PropTypes.oneOf(['light', 'dark']),\n};\n\nIngenicoLegacy.defaultProps = {\n config: {},\n hidePayButton: false,\n paymentMethods: [],\n onPaymentResult: null,\n themeMode: 'light',\n};\n\nIngenicoLegacy.displayName = 'IngenicoLegacy';\n\nexport default IngenicoLegacy;\n","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport Button from 'lib/components/Button';\nimport FormField from 'lib/components/FormField';\nimport { useFormSave } from 'lib/hooks/useFormSave';\n\nimport styles from 'lib/components/PspComposer/PspComposer.module.scss';\n\n/**\n * This component is one of the multiple available payment method in this project.\n * It represents an international bank form, only used to collect refund request data for now.\n */\nconst InternationalBank = React.forwardRef(\n (\n {\n pspId,\n token,\n paymentRequestId,\n lyriaUrl,\n hidePayButton,\n labelPayButton,\n onPaymentResult,\n },\n ref,\n ) => {\n const { t } = useTranslation();\n\n const formRef = React.useRef(null);\n const [formData, setFormData] = React.useState({\n firstName: '',\n lastName: '',\n bankName: '',\n accountNumber: '',\n swift: '',\n address: '',\n city: '',\n zipCode: '',\n region: '',\n country: '',\n });\n const [errors, setErrors] = React.useState({});\n\n const handleSuccess = React.useCallback(\n (response) => {\n onPaymentResult({ success: true, data: response });\n },\n [onPaymentResult],\n );\n\n const handleError = React.useCallback(\n (response) => {\n if (response?.data) {\n const fieldErrors = {};\n Object\n .keys(response.data)\n .forEach((key) => {\n fieldErrors[key] = response.data[key] && response.data[key].map((error) => t([\n `error_${error.code}`,\n 'error_form',\n ]));\n });\n setErrors(fieldErrors);\n }\n onPaymentResult({\n success: false,\n data: response,\n });\n },\n [onPaymentResult, t],\n );\n\n const url = lyriaUrl + '/internationalbank/save';\n const saveForm = useFormSave(url, token, paymentRequestId, pspId, handleSuccess, handleError);\n\n const submitForm = React.useCallback(\n (event) => {\n event.preventDefault();\n event.stopPropagation();\n const data = {\n first_name: formData.firstName,\n last_name: formData.lastName,\n bank_name: formData.bankName,\n account_number: formData.accountNumber,\n swift_code: formData.swift,\n address: formData.address,\n city: formData.city,\n zipcode: formData.zipCode,\n region: formData.region,\n country: formData.country,\n };\n\n saveForm(data);\n },\n [formData, saveForm],\n );\n\n const onChangeFormField = React.useCallback(\n (fieldName) => (event, newValue) => {\n setFormData((prevState) => ({\n ...prevState,\n [fieldName]: newValue,\n }));\n\n },\n [],\n );\n\n React.useImperativeHandle(\n ref,\n () => ({\n pay() {\n return formRef.current.click();\n },\n canClickOnPay: Object.values(formData).every((value) => !!value),\n }),\n [formData],\n );\n\n return (\n \n {t('ingenico_label_checkout', { label: labelPayButton || t('payButton') })}\n
\n \n {\n setIsReady(true);\n return getHostedInfo();\n }}\n label={labelPayButton || t('payButton')}\n startIcon={
\n \n \n
\n );\n },\n);\n\nInternationalBank.propTypes = {\n /**\n * The is of the PSP returned by the backend in order to be able to pass it when we submit the form data.\n */\n pspId: PropTypes.number.isRequired,\n /**\n * The token to use in order to be able to call the backend when we submit the form data.\n */\n token: PropTypes.string,\n /**\n * The paymentRequestID to use in order to be able to call the backend when we submit the data in the paymentPage.\n */\n paymentRequestId: PropTypes.string,\n /**\n * The backend url to use to pass the form data.\n */\n lyriaUrl: PropTypes.string.isRequired,\n /**\n * Whether the submit button must be displayed or not.\n */\n hidePayButton: PropTypes.bool,\n /**\n * The label of the 'pay' button to display. hidePayButton props must be false of course.\n */\n labelPayButton: PropTypes.string,\n /**\n * The callback function to trigger when the backend return the result of the form data submit.\n */\n onPaymentResult: PropTypes.func.isRequired,\n};\n\nInternationalBank.defaultProps = {\n hidePayButton: false,\n labelPayButton: null, // Fallback on 'pay' or 'ask refund' label.\n};\n\nInternationalBank.displayName = 'InternationalBank';\n\nexport default InternationalBank;\n","// extracted by mini-css-extract-plugin\nexport default {\"icon\":\"CardNumberInput_icon__lELlk\"};","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport FormField from 'lib/components/FormField';\nimport Icon from 'lib/components/Icon';\nimport {\n keepOnlyDigits,\n formatCreditCardNumber,\n findCardType,\n luhnValidate,\n} from 'lib/utils/cardUtils';\nimport styles from './CardNumberInput.module.scss';\n\nconst CardNumberInput = ({\n defaultCardNumber,\n configCardTypes,\n maskedNumber,\n onChange,\n disabled,\n forceDirty,\n}) => {\n const { t } = useTranslation();\n\n const [isValid, setValid] = React.useState(false);\n const [textValue, setTextValue] = React.useState(defaultCardNumber);\n const [isDirty, setDirty] = React.useState(false);\n const [cardTypeConfig, setCardTypeConfig] = React.useState(null);\n const [isFocused, setFocused] = React.useState(false);\n\n React.useEffect(() => {\n if (maskedNumber) {\n const ctc = findCardType(maskedNumber, configCardTypes);\n setCardTypeConfig(ctc);\n } else {\n setCardTypeConfig(null);\n }\n }, [maskedNumber, configCardTypes]);\n\n const cardIcon = React.useMemo(\n () => (\n \n cardTypeConfig?.type === configCardType.type)?.type} />\n
\n ),\n [cardTypeConfig, configCardTypes],\n );\n\n const formatAndValidateCardNumber = React.useCallback(\n (value) => {\n const cardNumberTextValue = value;\n const cardNumberCleanTextValue = keepOnlyDigits(cardNumberTextValue);\n const ctc = findCardType(cardNumberCleanTextValue, configCardTypes);\n let valid = !!ctc;\n if (ctc && ctc.validation === 'luhn') {\n valid = luhnValidate(cardNumberCleanTextValue);\n }\n setValid(valid);\n setCardTypeConfig(ctc);\n return formatCreditCardNumber(cardNumberCleanTextValue);\n },\n [configCardTypes],\n );\n\n const onChangeCardNumberInput = React.useCallback(\n (event, newValue) => {\n setDirty(true);\n setTextValue(newValue);\n },\n [],\n );\n\n React.useEffect(\n () => {\n if (onChange) {\n onChange({\n value: textValue?.replace(/\\s+/g, ''),\n isValid: isValid,\n cardTypeConfig: cardTypeConfig,\n });\n }\n },\n [onChange, isValid, textValue, cardTypeConfig],\n );\n\n if (maskedNumber) {\n return (\n \n
\n );\n }\n\n return (\n \n setFocused(false)}\n onFocus={() => setFocused(true)}\n onChange={onChangeCardNumberInput}\n formatAndValidate={formatAndValidateCardNumber}\n errors={\n (isDirty || forceDirty) && !isValid && !isFocused\n ? textValue === ''\n ? [t('cardNumberEmpty')]\n : cardTypeConfig\n ? [t('cardNumberInvalid')]\n : [t('cardNumberUnhandled')]\n : null\n }\n headerEndComponent={cardIcon}\n inputProps={{\n inputMode: 'numeric',\n }}\n />\n
\n );\n};\n\nCardNumberInput.propTypes = {\n /**\n * The default card number in the input\n */\n defaultCardNumber: PropTypes.string,\n /**\n * An array with the card types allowed and the config related to each type.\n */\n configCardTypes: PropTypes.arrayOf(PropTypes.object),\n /**\n * The masked number of the card to be displayed in the input.\n * That's mainly use to display a saved card without the possibility to modify it.\n */\n maskedNumber: PropTypes.string,\n /**\n * The callback function to trigger when the input is changed.\n * The function takes the arguments: value, isValid, cardType.\n */\n onChange: PropTypes.func,\n /**\n * Whether the input must be disabled (just in read only) or not.\n */\n disabled: PropTypes.bool,\n /**\n * Whether we want to set the input to be dirty (that is to say as it has already been touched by the user).\n * That's mainly for error display purpose.\n */\n forceDirty: PropTypes.bool,\n};\n\nCardNumberInput.defaultProps = {\n defaultCardNumber: '',\n configCardTypes: [],\n maskedNumber: null,\n onChange: null,\n disabled: false,\n forceDirty: false,\n};\n\nexport default CardNumberInput;\n","// extracted by mini-css-extract-plugin\nexport default {\"tooltip_content\":\"CvxInput_tooltip_content__-NQIA\"};","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { Trans, useTranslation } from 'react-i18next';\n\nimport FormField from 'lib/components/FormField';\nimport Icon from 'lib/components/Icon';\nimport styles from './CvxInput.module.scss';\n\n/**\n * The goal of this component is to provide an input to enter the CVV or CVC of a credit card.\n */\nconst CvxInput = ({\n defaultCvx,\n onChange,\n disabled,\n forceDirty,\n length,\n}) => {\n const { t } = useTranslation();\n\n const [textValue, setTextValue] = React.useState(defaultCvx);\n const [isDirty, setDirty] = React.useState(false);\n const [isFocused, setFocused] = React.useState(false);\n const [isValid, setValid] = React.useState(false);\n\n const minLength = Math.min(...length);\n const maxLength = Math.max(...length);\n\n const checkIsValid = React.useCallback(\n (value) => {\n return (\n maxLength === 0 ||\n (value.length >= minLength && value.length <= maxLength)\n );\n },\n [minLength, maxLength],\n );\n\n const tooltipContent = React.useMemo(\n () => {\n return (\n \n
\n );\n },\n [],\n );\n\n const formatAndValidateCvx = React.useCallback(\n (value) => {\n let cvxCleanTextValue = value;\n let matches = value.match(/^[0-9]*$/g);\n cvxCleanTextValue = (matches && matches.join('')) || '';\n\n if (cvxCleanTextValue.length >= maxLength) {\n cvxCleanTextValue = cvxCleanTextValue.substring(0, maxLength);\n }\n return cvxCleanTextValue;\n },\n [maxLength],\n );\n\n const onChangeCvxInput = React.useCallback(\n (event, newValue) => {\n const valid = checkIsValid(newValue);\n setDirty(true);\n setValid(valid);\n setTextValue(newValue);\n if (onChange) {\n onChange({\n value: newValue,\n isValid: valid,\n });\n }\n },\n [onChange, checkIsValid],\n );\n\n // For some card types (bancontact), this input is not required, so we don't want to return it\n if (maxLength === 0) {\n return null;\n }\n\n return (\n \n
\n \n
\n \n
\n \n setFocused(false)}\n onFocus={() => setFocused(true)}\n onChange={onChangeCvxInput}\n formatAndValidate={formatAndValidateCvx}\n errors={\n (isDirty || forceDirty) && !isValid && !isFocused\n ? textValue === ''\n ? [t('cvcEmpty')]\n : [t('cvcInvalid')]\n : null\n }\n TooltipProps={{\n alt: t('cvcTooltipTrigger'),\n iconClass: null,\n children: tooltipContent,\n }}\n inputProps={{\n inputMode: 'numeric',\n }}\n />\n
\n );\n};\n\nCvxInput.propTypes = {\n /**\n * The default value to put in the input for the cvx.\n */\n defaultCvx: PropTypes.string,\n /**\n * The callback function to trigger when the input is changed.\n * The function takes the arguments: value ({ month, year }), isValid.\n */\n onChange: PropTypes.func,\n /**\n * Whether the input must be disabled (just in read only) or not.\n */\n disabled: PropTypes.bool,\n /**\n * Whether we want to set the input to be dirty (that is to say as it has already been touched by the user).\n * That's mainly for error display purpose.\n */\n forceDirty: PropTypes.bool,\n /**\n * An array that contains the rules about the min length and the max length allowed for the input.\n */\n length: PropTypes.array,\n};\n\nCvxInput.defaultProps = {\n defaultCvx: '',\n onChange: null,\n disabled: false,\n forceDirty: false,\n length: [3, 4],\n};\n\nexport default CvxInput;\n","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport FormField from 'lib/components/FormField';\nimport './ExpiryInput.module.scss';\n\n/**\n * The goal of this component is to provide an input to enter the expiry date of a credit card.\n * The expiry date should and will be formatted thanks to the rule 'MM/YY'.\n */\nconst ExpiryInput = ({\n defaultExpiryDate,\n onChange,\n disabled,\n forceDirty,\n\n}) => {\n const { t } = useTranslation();\n\n const [textValue, setTextValue] = React.useState(defaultExpiryDate);\n const [isDirty, setIsDirty] = React.useState(false);\n const [isFocused, setIsFocused] = React.useState(false);\n const [isValid, setIsValid] = React.useState(true);\n\n const checkExpiryDateIsValid = React.useCallback(\n (month, year) => {\n const now = new Date();\n return (\n month && year && (\n year > now.getFullYear() || (\n year === now.getFullYear() && month >= now.getMonth() + 1\n )\n )\n );\n },\n [],\n );\n\n const onChangeExpiryInput = React.useCallback(\n () => (event, newValue) => {\n setIsDirty(true);\n setTextValue(newValue);\n },\n [],\n );\n\n const formatAndValidateExpiry = React.useCallback(\n (previousValue) => (value) => {\n const expiryTextValue = value || '';\n const expiryParsedTextValue = expiryTextValue.split('/');\n const parsedMonth = parseInt(expiryParsedTextValue[0]);\n const parsedYear = parseInt(expiryParsedTextValue[1]);\n const month = 0 < parsedMonth && parsedMonth <= 12 ? parsedMonth : null;\n const year = 21 <= parsedYear && parsedYear <= 99 ? parsedYear + 2000 : null;\n const isExpiryValid = checkExpiryDateIsValid(month, year);\n\n setIsValid(isExpiryValid);\n\n switch (expiryTextValue.length) {\n case 0:\n return '';\n case 1:\n if (expiryTextValue.match(/^[0-1]$/g)) {\n return expiryTextValue;\n } else {\n return previousValue;\n }\n case 2:\n if (expiryTextValue.match(/^(0[1-9]|1[0-2])$/g)) {\n return previousValue.length === 3\n ? expiryTextValue.substring(0, 1)\n : `${expiryTextValue}/`;\n } else {\n return previousValue;\n }\n case 3:\n if (expiryTextValue.match(/^(0[1-9]|1[0-2])\\/$/g)) {\n return expiryTextValue;\n } else {\n return previousValue;\n }\n case 4:\n if (expiryTextValue.match(/^(0[1-9]|1[0-2])\\/[0-9]$/g)) {\n return expiryTextValue;\n } else {\n return previousValue;\n }\n case 5:\n if (expiryTextValue.match(/^(0[1-9]|1[0-2])\\/([0-9]{2})$/g)) {\n return expiryTextValue;\n } else {\n return previousValue;\n }\n default:\n return previousValue;\n }\n },\n [checkExpiryDateIsValid],\n );\n\n React.useEffect(\n () => {\n if (onChange) {\n onChange({\n value: textValue,\n isValid: isValid,\n });\n }\n },\n [isValid, textValue, onChange],\n );\n\n return (\n \n setIsFocused(false)}\n onFocus={() => setIsFocused(true)}\n onChange={onChangeExpiryInput(textValue)}\n formatAndValidate={formatAndValidateExpiry(textValue)}\n errors={\n (isDirty || forceDirty) && !isFocused\n ? textValue\n ? isValid\n ? null\n : [t('expiryInvalid')]\n : [t('expiryEmpty')]\n : null\n }\n inputProps={{\n inputMode: 'numeric',\n }}\n />\n
\n );\n\n};\n\nExpiryInput.propTypes = {\n /**\n * The default value to put in the input for the expiry date including month and year.\n * The format must be XX/XX following the regexp ^(0[1-9]|1[0-2])\\/([0-9]{2})$\n */\n defaultExpiryDate: PropTypes.string,\n /**\n * The callback function to trigger when the input is changed.\n * The function takes the arguments: value ({ month, year }), isValid.\n */\n onChange: PropTypes.func,\n /**\n * Whether the input must be disabled (just in read only) or not.\n */\n disabled: PropTypes.bool,\n /**\n * Whether we want to set the input to be dirty (that is to say as it has already been touched by the user).\n * That's mainly for error display purpose.\n */\n forceDirty: PropTypes.bool,\n};\n\nExpiryInput.defaultProps = {\n defaultExpiryDate: null,\n onChange: null,\n disabled: false,\n forceDirty: false,\n};\n\nexport default ExpiryInput;\n","// extracted by mini-css-extract-plugin\nexport default {\"input\":\"CardInput_input__-EpxC\",\"input_row\":\"CardInput_input_row__y9VZ9\",\"input_row_column\":\"CardInput_input_row_column__7Alt8\",\"wz-lyriapay__card-input__row--column\":\"CardInput_wz-lyriapay__card-input__row--column__bdP1k\",\"wz-lyriapay__card-input__expiry-input\":\"CardInput_wz-lyriapay__card-input__expiry-input__5LX2T\",\"wz-lyriapay__card-input__cvx-input\":\"CardInput_wz-lyriapay__card-input__cvx-input__bxZwL\"};","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport FormField from 'lib/components/FormField';\nimport CardNumberInput from './components/CardNumberInput';\nimport CvxInput from './components/CvxInput';\nimport ExpiryInput from './components/ExpiryInput';\n\nimport styles from './CardInput.module.scss';\n/**\n * This component is used as the main component to handle bank card information.\n */\nconst CardInput = ({\n displaySavePaymentMethodCheckbox,\n onChangeSavePaymentMethod,\n defaultSavePaymentMethod,\n onChangeCardNumber,\n defaultCardNumber,\n configCardTypes,\n onChangeExpiryDate,\n defaultExpiryDate,\n onChangeCvx,\n defaultCvx,\n lengthCvx,\n disabled,\n forceDirty,\n}) => {\n const { t } = useTranslation();\n\n const [savePaymentMethod, setSavePaymentMethod] = React.useState(defaultSavePaymentMethod);\n\n const onChangeSavePaymentMethodValue = React.useCallback(\n (event, newValue) => {\n if (onChangeSavePaymentMethod) {\n onChangeSavePaymentMethod(newValue);\n }\n setSavePaymentMethod(newValue);\n },\n [onChangeSavePaymentMethod],\n );\n\n return (\n \n
\n );\n};\n\nCardInput.propTypes = {\n /**\n * Whether we have to display the checkbox to let the user choose if he wants to save his payment method.\n */\n displaySavePaymentMethodCheckbox: PropTypes.bool,\n /**\n * The callback to trigger when the user click on the checkbox to save his payment method.\n * It should handle the new boolean value.\n */\n onChangeSavePaymentMethod: PropTypes.func,\n /**\n * The default value of the checkbox about save payment method.\n */\n defaultSavePaymentMethod: PropTypes.bool,\n /**\n * The callback to trigger when the user change the card number input.\n */\n onChangeCardNumber: PropTypes.func,\n /**\n * The default value of the card number.\n */\n defaultCardNumber: PropTypes.string,\n /**\n * An array with the card types allowed and the config related to each type.\n */\n configCardTypes: PropTypes.arrayOf(PropTypes.object),\n /**\n * The callback to trigger when the user change the expiry date input.\n */\n onChangeExpiryDate: PropTypes.func,\n /**\n * The default value of the expiry date.\n * The format must be XX/XX following the regexp ^(0[1-9]|1[0-2])\\/([0-9]{2})$\n */\n defaultExpiryDate: PropTypes.string,\n /**\n * The callback to trigger when the user change the cvx input.\n */\n onChangeCvx: PropTypes.func,\n /**\n * The default value of the CVX.\n */\n defaultCvx: PropTypes.string,\n /**\n * An array that contains the rules about the min length and the max length allowed for the Cvx input.\n */\n lengthCvx: PropTypes.array,\n /**\n * Whether the inputs must be disabled (just in read only) or not.\n */\n disabled: PropTypes.bool,\n /**\n * Whether we want to set the inputs to be dirty (that is to say as it has already been touched by the user).\n * That's mainly for error display purpose.\n */\n forceDirty: PropTypes.bool,\n};\n\nCardInput.defaultProps = {\n displaySavePaymentMethodCheckbox: false,\n onChangeSavePaymentMethod: null,\n defaultSavePaymentMethod: false,\n onChangeCardNumber: null,\n defaultCardNumber: '',\n configCardTypes: [],\n onChangeExpiryDate: null,\n defaultExpiryDate: '',\n onChangeCvx: null,\n defaultCvx: '',\n disabled: false,\n forceDirty: false,\n lengthCvx: [3, 4],\n};\n\nexport default CardInput;\n","/**\n * This file gather all the utils function related to the browser.\n */\n\nexport const getClientCapabilities = () => {\n return {\n screen: {\n height: window.screen.height,\n width: window.screen.width,\n color_depth: window.screen.colorDepth,\n },\n java_enabled: window.navigator.javaEnabled(),\n timezone_offset: new Date().getTimezoneOffset(),\n is_in_iframe: window.location !== window.top.location,\n apple_pay: {\n can_make_payments: false,\n // window.ApplePaySession && window.ApplePaySession.canMakePayments()\n // ? true\n // : false\n },\n };\n};\n\n/**\n * This function take a color in hex, rgb or rgba format and return the components of it.\n * @param {string} color The color in hex, rgb or rgba format.\n * @return {(number|number)[]|*} An array with red, green, blue and opacity value for the given color.\n */\nexport const decomposeColor = (color) => {\n let red;\n let green;\n let blue;\n let opacity = 1;\n let cleanColor = color.replace(/\\s+/g, '');\n\n if (cleanColor.charAt(0) === '#') {\n cleanColor = cleanColor.replace(/#/, '');\n if (cleanColor.length >= 6) {\n red = parseInt(cleanColor.substring(0, 2), 16);\n green = parseInt(cleanColor.substring(2, 4), 16);\n blue = parseInt(cleanColor.substring(4, 6), 16);\n } else if (cleanColor.length >= 3) {\n red = parseInt(cleanColor.substring(0, 1), 16) * 17;\n green = parseInt(cleanColor.substring(1, 2), 16) * 17;\n blue = parseInt(cleanColor.substring(2, 3), 16) * 17;\n }\n } else if (cleanColor.indexOf('rgba') !== -1) {\n cleanColor = cleanColor.replace('rgba', '');\n cleanColor = cleanColor.replace('(', '');\n cleanColor = cleanColor.replace(')', '');\n [red, green, blue, opacity] = cleanColor.split(',');\n } else if (cleanColor.indexOf('rgb') !== -1) {\n cleanColor = cleanColor.replace('rgb', '');\n cleanColor = cleanColor.replace('(', '');\n cleanColor = cleanColor.replace(')', '');\n [red, green, blue] = cleanColor.split(',');\n } else {\n return [0, 0, 0, 1];\n }\n return [red, green, blue, opacity];\n};\n\n/**\n * This function take a color a return a new color variant more dark or more light.\n * @param {string} color The color in hex, rgb or rgba format.\n * @param {number} coefficient The coefficient between -1 and 1. If negative that means lighten, else darken.\n * @return The color variant in rgba format, lighten (if coefficient negative) or darken (if coefficient positive).\n */\nexport const lighenOrDarkenColor = (color, coefficient= 0) => {\n let [red, green, blue, opacity] = decomposeColor(color);\n\n if (coefficient < 0) {\n red += (255 - red) * -coefficient;\n green += (255 - green) * -coefficient;\n blue += (255 - blue) * -coefficient;\n } else {\n red = red * (1 - coefficient);\n green = green * (1 - coefficient);\n blue = blue * (1 - coefficient);\n }\n return `rgba(${red}, ${green}, ${blue}, ${opacity})`;\n};\n\n/**\n * This function take a background color and return the best text color to use to have a good contrast.\n * @param {string} backgroundColor The color in hex, rgb or rgba format.\n */\nexport const getContrastText = (backgroundColor) => {\n /* eslint-disable-next-line */\n let [red, green, blue, opacity] = decomposeColor(backgroundColor);\n let rgb = [red, green, blue];\n rgb = rgb.map((c) => c / 255).map((c) => c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4);\n const luminance = Number((0.2126 * rgb[0] + 0.7152 * rgb[1] + 0.0722 * rgb[2]).toFixed(3));\n const luminanceWhite = 1;\n return (Math.max(luminanceWhite, luminance) + 0.05) / (Math.min(luminanceWhite, luminance) + 0.05) >= 3\n ? '#ffffff'\n : '#000000';\n};\n","// extracted by mini-css-extract-plugin\nexport default {\"do_not_leave_message_container\":\"Payline_do_not_leave_message_container__MOJ7w\",\"do_not_leave_message\":\"Payline_do_not_leave_message__ahqk3\",\"do_not_leave\":\"Payline_do_not_leave__osSn1\",\"saved_payment_method\":\"Payline_saved_payment_method__TEFyo\",\"input\":\"Payline_input__aYdMq\",\"button_new_payment_method\":\"Payline_button_new_payment_method__P46Gp\"};","import React from 'react';\n\nimport axios from 'axios';\nimport PropTypes from 'prop-types';\nimport { Trans, useTranslation } from 'react-i18next';\n\nimport ApplePayButton from 'lib/components/ApplePayButton';\nimport Button from 'lib/components/Button';\nimport ButtonLink from 'lib/components/ButtonLink';\nimport CardInput from 'lib/components/CardInput';\nimport CvxInput from 'lib/components/CardInput/components/CvxInput';\nimport GooglePayButton from 'lib/components/GooglePayButton';\nimport ExpiryInput from 'lib/components/CardInput/components/ExpiryInput';\nimport Icon from 'lib/components/Icon';\nimport InfoBlock from 'lib/components/InfoBlock';\nimport SavedCardInput from 'lib/components/SavedCardInput';\nimport WaitingBlock from 'lib/components/WaitingBlock';\nimport { getClientCapabilities } from 'lib/utils/browserUtils';\nimport { findTokenizer, formatExpiryDate } from 'lib/utils/cardUtils';\nimport styles from './Payline.module.scss';\nimport styles_psp from 'lib/components/PspComposer/PspComposer.module.scss';\n\n/**\n * This component is one of the multiple available payment method in this project.\n * It represents the Payline PSP integration that can deal with multiple bank card types.\n */\nconst Payline = React.forwardRef(\n (\n {\n config,\n token,\n paymentRequestId,\n lyriaUrl,\n onPaymentResult,\n onPaymentStarted,\n hidePayButton,\n labelPayButton,\n labelPayButtonApplePayAndGooglePay,\n loader,\n savePaymentMethod,\n savedPaymentMethods,\n paymentCardInputWarningMessage,\n operation,\n lang,\n themeMode,\n onPaymentError,\n isDisabled,\n },\n ref,\n ) => {\n /* ------------ Initialization of the imports, the variables and the states ------------ */\n\n // Hooks\n const { t } = useTranslation();\n\n const iframe3ds = React.useRef(null);\n const iframe3dsmethod = React.useRef(null);\n const [attempts, setAttempts] = React.useState(0);\n // Display behavior states\n const [isIframeShown, showIframe] = React.useState(false);\n const [isFormVisible, showForm] = React.useState(true);\n const [isSpinnerVisible, showSpinner] = React.useState(false);\n const [displayDoNotLeaveWarning, setDisplayDoNotLeaveWarning] = React.useState(false);\n const [isReadOnly, setReadOnly] = React.useState(false);\n const [submitTried, setSubmitTried] = React.useState(false);\n // Payment method fields and fields related states\n const [card, setCard] = React.useState({\n value: '',\n isValid: false,\n cardTypeConfig: null,\n });\n const [expiry, setExpiry] = React.useState({\n value: '',\n isValid: false,\n });\n const [cvc, setCvc] = React.useState({\n value: '',\n isValid: false,\n });\n const [savePaymentMethodValue, setSavePaymentMethodValue] = React.useState(false);\n const [selectedPaymentMethodUuid, setSelectedPaymentMethodUuid] = React.useState(null);\n const [selectedPaymentMethod, setSelectedPaymentMethod] = React.useState(null);\n\n /* ------------ The main functions ------------ */\n\n // The function to trigger when Payline response is successful (payment ok).\n const handleSuccess = React.useCallback(\n (response) => {\n onPaymentResult({ success: true, data: response });\n showForm(false);\n showIframe(false);\n showSpinner(false);\n setDisplayDoNotLeaveWarning(false);\n },\n [onPaymentResult],\n );\n\n // The function to trigger when Payline response is not successful (payment ko).\n const handleError = React.useCallback(\n (response) => {\n setAttempts((attempts) => attempts + 1);\n showSpinner(false);\n setSubmitTried(false);\n setReadOnly(false);\n showForm(true);\n showIframe(false);\n setDisplayDoNotLeaveWarning(false);\n onPaymentResult({ success: false, data: response });\n onPaymentError(response);\n },\n [onPaymentResult, onPaymentError],\n );\n\n // The function to check the enrollment of the card when 3DS method happens.\n const verifyEnrollment = React.useCallback(\n (verifyParameters) => {\n showForm(false);\n setDisplayDoNotLeaveWarning(true);\n let iframe;\n if (verifyParameters.code === '03100') {\n iframe = iframe3dsmethod.current;\n showSpinner(true);\n showIframe(false);\n } else {\n iframe = iframe3ds.current;\n showIframe(true);\n }\n\n if (!iframe) {\n // Avoid sentry noise: but to investigate why the reference is null (maybe a rerender)\n console.error('Impossible to retrieve iframe');\n return;\n }\n const iframeContent = iframe.contentDocument;\n let form = iframeContent.createElement('form');\n form.setAttribute('method', verifyParameters.method);\n form.setAttribute('action', verifyParameters.url);\n let charsetField = iframeContent.createElement('input');\n charsetField.setAttribute('name', '_charset_');\n charsetField.setAttribute('type', 'hidden');\n charsetField.setAttribute('value', 'UTF-8');\n form.appendChild(charsetField);\n Object.keys(verifyParameters.data).forEach((key) => {\n let hiddenField = iframeContent.createElement('input');\n hiddenField.setAttribute('name', key);\n hiddenField.setAttribute('type', 'hidden');\n hiddenField.setAttribute('value', verifyParameters.data[key]);\n form.appendChild(hiddenField);\n });\n iframeContent.documentElement.appendChild(form);\n form.submit();\n if (verifyParameters.code !== '03100') {\n showSpinner(false);\n iframe.style.display = 'block';\n }\n },\n [],\n );\n\n // The message handler (to manage iframes)\n const postMessageHandler = React.useCallback(\n (message) => {\n if (message.origin === lyriaUrl && message.data) {\n if (message.data.status === 'success') {\n handleSuccess();\n } else if (message.data.status === 'error') {\n handleError(message.data.data);\n } else if (message.data.status === 'threedsmethod') {\n verifyEnrollment(message.data);\n }\n }\n },\n [handleError, handleSuccess, lyriaUrl, verifyEnrollment],\n );\n\n // The api call to Lyria (backend) to trigger Payline payment process.\n const process = React.useCallback(\n (pspId, data, extraBodyData = {}) => {\n if (isDisabled) {\n return;\n }\n return axios({\n method: 'post',\n url: lyriaUrl + '/payline/process',\n headers: {\n 'Content-Type': 'application/json',\n },\n data: {\n client_capabilities: getClientCapabilities(),\n request_token: token,\n payment_request_id: paymentRequestId,\n psp: pspId,\n data,\n ...extraBodyData,\n },\n })\n .then((res) => {\n showSpinner(false);\n setDisplayDoNotLeaveWarning(false);\n if (res?.data.status === 'V') {\n handleSuccess(res.data.data);\n } else if (res?.data.status === 'A') {\n handleError(res?.data.data);\n }\n return res;\n })\n .catch((error) => {\n if (\n error?.response?.data?.status === 'error'\n && error?.response?.data?.data?.code === 'verify_enrollment'\n ) {\n verifyEnrollment(error.response.data.data.action);\n } else {\n handleError({ code: 'internal' });\n console.info(error);\n }\n });\n },\n [handleError, handleSuccess, isDisabled, lyriaUrl, token, paymentRequestId, verifyEnrollment],\n );\n\n // The api call to Lyria (backend) to trigger Payline card save process.\n const saveTokenizedCard = React.useCallback(\n (pspId, data, extraBodyData = {}) => {\n if (isDisabled) {\n return;\n }\n return axios({\n method: 'post',\n url: lyriaUrl + '/payline/save_tokenized_card_data',\n headers: {\n 'Content-Type': 'application/json',\n },\n data: {\n request_token: token,\n payment_request_id: paymentRequestId,\n psp: pspId,\n data,\n ...extraBodyData,\n },\n })\n .then((res2) => {\n showSpinner(false);\n setDisplayDoNotLeaveWarning(false);\n if (res2?.data.status === 'success') {\n handleSuccess(res2.data);\n } else if (res2?.data.status === 'error') {\n handleError(res2?.data.data);\n }\n })\n .catch((error) => {\n handleError({ code: 'internal' });\n console.info(error);\n });\n },\n [handleError, handleSuccess, isDisabled, lyriaUrl, token, paymentRequestId],\n );\n\n\n // The callback logic to trigger when the user click on 'pay' button to submit the form for a new card.\n const submitForm = React.useCallback(\n () => {\n if (isDisabled) {\n return false;\n }\n setSubmitTried(true);\n\n if (!(card.isValid && expiry.isValid && cvc.isValid)) {\n return false;\n }\n\n if (card.cardTypeConfig === null) {\n return false;\n }\n\n const tokenizer = findTokenizer(\n card.cardTypeConfig.type,\n config.tokenizers,\n );\n\n if (tokenizer === null) {\n return false;\n }\n\n setReadOnly(true);\n showForm(false);\n showSpinner(true);\n setDisplayDoNotLeaveWarning(true);\n onPaymentStarted();\n\n axios({\n method: tokenizer.method,\n url: tokenizer.url,\n headers: {\n 'Content-Type': tokenizer.content_type,\n },\n data: tokenizer.data\n .replace('__card__', card.value.replace(/\\s/g, ''))\n .replace('__expiry__', expiry.value.replace('/', ''))\n .replace('__cvx__', cvc.value),\n })\n .then((res) => {\n if (operation === 'credit') {\n saveTokenizedCard(\n tokenizer.id,\n res?.data,\n ).then().catch();\n } else {\n process(\n tokenizer.id,\n res?.data,\n { save_payment_method: savePaymentMethodValue },\n ).then().catch();\n }\n })\n .catch((error) => {\n handleError({ code: 'internal' });\n console.info(error);\n });\n\n return true;\n },\n [\n card,\n config,\n cvc,\n expiry,\n handleError,\n isDisabled,\n operation,\n onPaymentStarted,\n process,\n savePaymentMethodValue,\n saveTokenizedCard,\n ],\n );\n\n // The callback logic to trigger when the user click on 'pay' button to submit the form for an existing card.\n const submitFormForPayingWithSavedCard = React.useCallback(\n () => {\n if (isDisabled) {\n return false;\n }\n setSubmitTried(true);\n\n if (!cvc.isValid) {\n return false;\n }\n\n const tokenizer = findTokenizer(\n selectedPaymentMethod.payment_method,\n config.tokenizers,\n selectedPaymentMethod.uuid,\n );\n\n if (tokenizer === null) {\n return false;\n }\n\n setReadOnly(true);\n showForm(false);\n showSpinner(true);\n setDisplayDoNotLeaveWarning(true);\n onPaymentStarted();\n\n axios({\n method: tokenizer.method,\n url: tokenizer.url,\n headers: {\n 'Content-Type': tokenizer.content_type,\n },\n data: tokenizer.data.replace('__cvx__', cvc.value),\n })\n .then((res) => {\n process(\n selectedPaymentMethod.psp,\n res?.data,\n {\n saved_payment_method: selectedPaymentMethod.uuid,\n cvx: cvc.value,\n },\n ).then().catch();\n })\n .catch((error) => {\n handleError({ code: 'internal' });\n console.info(error);\n });\n\n return true;\n },\n [cvc, isDisabled, onPaymentStarted, process, selectedPaymentMethod, config, handleError],\n );\n\n // The callback to trigger when the user click on 'pay' button to submit the form for a new card.\n const onClickOnPay = React.useCallback(\n (event) => {\n event.preventDefault();\n submitForm();\n },\n [submitForm],\n );\n\n // The callback to trigger when the user click on 'pay' button to submit the form for an existing card.\n const onClickOnPayWithSavedPaymentMethod = React.useCallback(\n (event) => {\n event.preventDefault();\n const processing = submitFormForPayingWithSavedCard();\n if (processing) {\n event.preventDefault();\n }\n },\n [submitFormForPayingWithSavedCard],\n );\n\n /* ------------ The side effects and imperative handlers ------------ */\n\n // The side effect to add a listener of message posted by Payline.\n React.useEffect(\n () => {\n window.addEventListener('message', postMessageHandler);\n return () => window.removeEventListener('message', postMessageHandler);\n },\n [postMessageHandler],\n );\n\n // Select by default the first saved payment method available.\n React.useEffect(\n () => {\n if (savedPaymentMethods.length) {\n setSelectedPaymentMethodUuid(savedPaymentMethods[0].uuid);\n }\n },\n [savedPaymentMethods],\n );\n\n // When we select the payment method, we get the full object with its config\n React.useEffect(\n () => {\n if (selectedPaymentMethodUuid) {\n const selectedSpm = savedPaymentMethods.find(spm => spm.uuid === selectedPaymentMethodUuid);\n setSelectedPaymentMethod(selectedSpm);\n setCard({\n value: '',\n isValid: false,\n cardTypeConfig: null,\n });\n setExpiry({\n value: '',\n isValid: false,\n });\n setCvc({\n value: '',\n isValid: false,\n });\n }\n },\n [selectedPaymentMethodUuid, savedPaymentMethods],\n );\n\n // The handler to be able to external component to trigger 'pay' button actions.\n React.useImperativeHandle(\n ref,\n () => ({\n pay() {\n if (selectedPaymentMethodUuid) {\n return submitFormForPayingWithSavedCard();\n }\n return submitForm();\n },\n canClickOnPay: selectedPaymentMethodUuid\n ? cvc.isValid\n : card.isValid && expiry.isValid && cvc.isValid,\n }),\n [\n card.isValid,\n cvc.isValid,\n expiry.isValid,\n selectedPaymentMethodUuid,\n submitForm,\n submitFormForPayingWithSavedCard,\n ],\n );\n\n /* ------------ The JSX to return according to the logic above ------------ */\n\n if (config.type === 'apple_pay') {\n return (\n \n
\n \n
\n {displaySavePaymentMethodCheckbox && (\n \n
\n \n
\n \n
\n )\n }\n \n {t('waitingPaymentResult')}\n
\n {displayDoNotLeaveWarning && (\n \n {t('waitingPaymentResultDoNotLeavePage')}\n
\n )}\n \n {isSpinnerVisible && (\n \n \n )}\n {!isSpinnerVisible && displayDoNotLeaveWarning && (\n
\n );\n },\n);\n\nPayline.propTypes = {\n /**\n * The specific configuration related to this payment method.\n */\n config: PropTypes.object,\n /**\n * The token to use in order to be able to call the backend when we submit the form data.\n */\n token: PropTypes.string,\n /**\n * The paymentRequestID to use in order to be able to call the backend when we submit the data in the paymentPage.\n */\n paymentRequestId: PropTypes.string,\n /**\n * The backend url to use to pass the form data.\n */\n lyriaUrl: PropTypes.string.isRequired,\n /**\n * Whether the submit button must be displayed or not.\n */\n hidePayButton: PropTypes.bool,\n /**\n * The label of the 'pay' button to display. hidePayButton props must be false of course.\n */\n labelPayButton: PropTypes.string,\n /**\n * The label of the 'pay' button to display for GogglePay and ApplePay.\n */\n labelPayButtonApplePayAndGooglePay: PropTypes.oneOf([\n 'buy',\n 'book',\n 'donate',\n 'order',\n 'pay',\n 'logoOnly',\n ]),\n /**\n * The callback function to trigger when the payment process is starting (to manage Payline exchanges).\n */\n onPaymentStarted: PropTypes.func.isRequired,\n /**\n * The callback function to trigger when the backend return the result of the form data submit.\n */\n onPaymentResult: PropTypes.func.isRequired,\n /**\n * The loader component to use when the payment or drop-in is loading.\n */\n loader: PropTypes.node,\n /**\n * Whether we want to check by default the checkbox to save the payment method.\n */\n savePaymentMethod: PropTypes.bool,\n /**\n * The list of saved payment methods available.\n * The goal is to be able to select one of them and avoid typing it again).\n */\n savedPaymentMethods: PropTypes.array,\n /**\n * A warning message to display for payment at the card input step (mainly to advise the user to save its payment method).\n */\n paymentCardInputWarningMessage: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n /**\n * The operation type to process.\n */\n operation: PropTypes.oneOf(['credit', 'payment', 'refund']),\n /**\n * The language of the user in order to display the appropriate translated drop-in (for Apple pay).\n */\n lang: PropTypes.string,\n /**\n * The theme to use (dark or light).\n */\n themeMode: PropTypes.oneOf(['light', 'dark']),\n /**\n * A fonction to call when we have a payment Error, like payment decline\n * payment aborted, or anything that can happen after you put in you credit\n * card number to make the transaction fail while you really want to buy\n * this concert ticket\n */\n onPaymentError: PropTypes.func,\n /**\n * Whether the payment method is disabled, and must not trigger payment or not.\n * Mainly used for Google Pay and Apple Pay buttons.\n */\n isDisabled: PropTypes.bool,\n};\n\nPayline.defaultProps = {\n config: {},\n labelPayButton: null,\n labelPayButtonApplePayAndGooglePay: 'buy',\n hidePayButton: false,\n loader: null,\n savePaymentMethod: false,\n savedPaymentMethods: [],\n paymentCardInputWarningMessage: null,\n operation: null,\n lang: 'fr',\n themeMode: 'light',\n onPaymentError: () => { },\n isDisabled: false,\n};\n\nPayline.displayName = 'Payline';\n\nexport default Payline;\n","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport Button from 'lib/components/Button';\nimport FormField from 'lib/components/FormField';\nimport { useFormSave } from 'lib/hooks/useFormSave';\n\nimport styles from 'lib/components/PspComposer/PspComposer.module.scss';\n\n/**\n * This component is one of the multiple available payment method in this project.\n * It represents the Form for PayPal refund considered as a PSP (but it's not a real PayPal integration).\n * The goal is to be able to refund user on its PayPal account.\n */\nconst PaypalForm = React.forwardRef(\n (\n {\n pspId,\n token,\n paymentRequestId,\n lyriaUrl,\n hidePayButton,\n labelPayButton,\n onPaymentResult,\n },\n ref,\n ) => {\n const { t } = useTranslation();\n\n const formRef = React.useRef(null);\n const [formData, setFormData] = React.useState({\n firstName: '',\n lastName: '',\n email: '',\n phoneNumber: '',\n });\n const [errors, setErrors] = React.useState({});\n\n const handleSuccess = React.useCallback(\n (response) => {\n onPaymentResult({ success: true, data: response });\n },\n [onPaymentResult],\n );\n\n const handleError = React.useCallback(\n (response) => {\n if (response?.data) {\n const fieldErrors = {};\n Object\n .keys(response.data)\n .forEach((key) => {\n fieldErrors[key] = response.data[key] && response.data[key].map((error) => t([\n `error_${error.code}`,\n 'error_form',\n ]));\n });\n setErrors(fieldErrors);\n }\n onPaymentResult({ success: false, data: response });\n },\n [onPaymentResult, t],\n );\n\n const url = lyriaUrl + '/paypal-form/save';\n const saveForm = useFormSave(url, token, paymentRequestId, pspId, handleSuccess, handleError);\n\n const submitForm = React.useCallback(\n (event) => {\n event.preventDefault();\n event.stopPropagation();\n const data = {\n first_name: formData.firstName,\n last_name: formData.lastName,\n email: formData.email,\n phone_number: formData.phoneNumber,\n };\n saveForm(data);\n },\n [formData, saveForm],\n );\n\n const onChangeFormField = React.useCallback(\n (fieldName) => (event, newValue) => {\n setFormData((prevState) => ({\n ...prevState,\n [fieldName]: newValue,\n }));\n },\n [],\n );\n\n React.useImperativeHandle(\n ref,\n () => ({\n pay() {\n return formRef.current.click();\n },\n canClickOnPay: Object.values(formData).every((value) => !!value),\n }),\n [formData],\n );\n\n return (\n \n {t('waitingPaymentResult')}\n
\n {displayDoNotLeaveWarning && (\n \n {t('waitingPaymentResultDoNotLeavePage')}\n
\n )}\n \n \n \n
\n )}\n {isFormVisible && (\n \n )}\n \n
\n \n \n
\n );\n },\n);\n\nPaypalForm.propTypes = {\n /**\n * The id of the PSP returned by the backend in order to be able to pass it when we submit the form data.\n */\n pspId: PropTypes.number.isRequired,\n /**\n * The token to use in order to be able to call the backend when we submit the form data.\n */\n token: PropTypes.string,\n /**\n * The paymentRequestID to use in order to be able to call the backend when we submit the data in the paymentPage.\n */\n paymentRequestId: PropTypes.string,\n /**\n * The backend url to use to pass the form data.\n */\n lyriaUrl: PropTypes.string.isRequired,\n /**\n * Whether the submit button must be displayed or not.\n */\n hidePayButton: PropTypes.bool,\n /**\n * The label of the 'pay' button to display. hidePayButton props must be false of course.\n */\n labelPayButton: PropTypes.string,\n /**\n * The callback function to trigger when the backend return the result of the form data submit.\n */\n onPaymentResult: PropTypes.func.isRequired,\n};\n\nPaypalForm.defaultProps = {\n hidePayButton: false,\n labelPayButton: null, // Fallback on 'pay' or 'ask refund' label.\n};\n\nPaypalForm.displayName = 'PaypalForm';\n\nexport default PaypalForm;\n","// extracted by mini-css-extract-plugin\nexport default {\"label\":\"PaymentsOSErrorLabel_label__aJ1I6\",\"icon\":\"PaymentsOSErrorLabel_icon__92SkV\",\"content\":\"PaymentsOSErrorLabel_content__gnsVL\"};","import React from 'react';\n\nimport PropTypes from 'prop-types';\n\nimport Icon from 'lib/components/Icon';\nimport styles from './PaymentsOSErrorLabel.module.scss';\n\nconst PaymentsOSErrorLabel = ({ errorContent, errorIcon }) => {\n if (!errorContent) {\n return null;\n }\n\n return (\n \n
\n );\n};\n\nPaymentsOSErrorLabel.propTypes = {\n /**\n * The error content to display.\n */\n errorContent: PropTypes.node,\n /**\n * The error icon to display on the left.\n */\n errorIcon: PropTypes.oneOf(['alert', 'cross']),\n};\n\nPaymentsOSErrorLabel.defaultProps = {\n errorContent: null,\n errorIcon: 'alert',\n};\n\nPaymentsOSErrorLabel.displayName = 'PaymentsOSErrorLabel';\n\nexport default PaymentsOSErrorLabel;\n","// extracted by mini-css-extract-plugin\nexport default {\"input\":\"PaymentsOSCardInput_input__gSkDI\",\"row\":\"PaymentsOSCardInput_row__0G-RB\",\"column\":\"PaymentsOSCardInput_column__lGYre\",\"external_field\":\"PaymentsOSCardInput_external_field__cBdEV\",\"wrapper\":\"PaymentsOSCardInput_wrapper__yA-mu\"};","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport FormField from 'lib/components/FormField';\nimport PaymentsOSErrorLabel from '../PaymentsOSErrorLabel';\nimport styles from './PaymentsOSCardInput.module.scss';\n\nconst PaymentsOSCardInput = React.forwardRef(\n (\n {\n config,\n displaySavePaymentMethodCheckbox,\n onChangeSavePaymentMethod,\n defaultSavePaymentMethod,\n onFormElementError,\n },\n ref,\n ) => {\n const { t } = useTranslation();\n\n const [cardNumber, setCardNumber] = React.useState(null);\n const [cardHolderName, setCardHolderName] = React.useState('');\n const [savePaymentMethod, setSavePaymentMethod] = React.useState(defaultSavePaymentMethod);\n\n const [isCardHolderNameDirty, setIsCardHolderNameDirty] = React.useState(false);\n const [submitTried, setSubmitTried] = React.useState(false);\n const [errorCardNumber, setErrorCardNumber] = React.useState(undefined);\n const [errorExpiryDate, setErrorExpiryDate] = React.useState(undefined);\n const [errorCvv, setErrorCvv] = React.useState(undefined);\n\n const onChangeSavePaymentMethodValue = React.useCallback(\n (event, newValue) => {\n if (onChangeSavePaymentMethod) {\n onChangeSavePaymentMethod(newValue);\n }\n setSavePaymentMethod(newValue);\n },\n [onChangeSavePaymentMethod],\n );\n\n const create = React.useCallback(\n () => {\n const fonts = [{ src: 'https://fonts.googleapis.com/css?family=Source+Code+Pro' }];\n\n const formElements = new window.POS.Fields(config.public_key, { fonts });\n\n const placeholders = {\n cardNumber: '1234 1234 1234 1234',\n expDate: 'MM/YY',\n cvv: '123',\n };\n\n // Instantiate the fields to show and mount them to the DOM.\n const cardNumberFormElement = formElements.create('cardNumber', { placeholders });\n cardNumberFormElement.mount('#card-number');\n cardNumberFormElement.on('change', (event) => {\n if (event.error === undefined) {\n setErrorCardNumber(undefined);\n onFormElementError({ card: undefined });\n } else {\n setErrorCardNumber(event.error?.pan);\n onFormElementError({ card: event.error?.pan });\n }\n\n });\n setCardNumber(cardNumberFormElement);\n\n const expiryFormElement = formElements.create('creditCardExpiry', { placeholders });\n expiryFormElement.mount('#exp-date');\n expiryFormElement.on('change', (event) => {\n if (event.error === undefined) {\n setErrorExpiryDate(undefined);\n onFormElementError({ expiry: undefined });\n } else {\n setErrorExpiryDate(event.error?.expiry);\n onFormElementError({ expiry: event.error?.expiry });\n }\n });\n\n const cvvFormElement = formElements.create('cvv', { placeholders });\n cvvFormElement.mount('#cvv');\n cvvFormElement.on('change', (event) => {\n if (event.error === undefined) {\n setErrorCvv(undefined);\n onFormElementError({ cvv: undefined });\n } else {\n setErrorCvv(event.error?.cvv);\n onFormElementError({ cvv: event.error?.cvv });\n }\n });\n },\n [config.public_key, onFormElementError],\n );\n\n /* ------------ The side effects and imperative handlers ------------ */\n\n React.useEffect(\n () => {\n const script = window.document.createElement('script');\n script.src = 'https://js.paymentsos.com/v3/latest/secure-fields.min.js';\n script.onload = create;\n window.document.body.appendChild(script);\n return () => window.document.body.removeChild(script);\n },\n [create],\n );\n\n React.useImperativeHandle(\n ref,\n () => ({\n tokenize() {\n const additionalData = {\n // Holder name field is mandatory\n holder_name: document.getElementById('cardholder-name').value,\n };\n return window.POS.createToken(\n cardNumber,\n {\n additionalData,\n // the PaymentsOS environment you're connecting to\n environment: config.production ? 'live' : 'test',\n },\n );\n },\n clickedSubmit() {\n setSubmitTried(true);\n },\n }),\n [cardNumber, config],\n );\n\n /* ------------ The JSX to return according to the logic above ------------ */\n\n return (\n \n {errorIcon === 'alert' && (
\n \n {errorContent}\n
\n \n
\n );\n });\n\nPaymentsOSCardInput.propTypes = {\n /**\n * The specific configuration related to this payment method (Payments OS).\n */\n config: PropTypes.object,\n /**\n * Whether we have to display the checkbox to let the user choose if he wants to save his payment method.\n */\n displaySavePaymentMethodCheckbox: PropTypes.bool,\n /**\n * The callback to trigger when the user click on the checkbox to save his payment method.\n * It should handle the new boolean value.\n */\n onChangeSavePaymentMethod: PropTypes.func,\n /**\n * The default value of the checkbox about save payment method.\n */\n defaultSavePaymentMethod: PropTypes.bool,\n onFormElementError: PropTypes.func,\n};\n\nPaymentsOSCardInput.defaultProps = {\n config: {},\n displaySavePaymentMethodCheckbox: false,\n onChangeSavePaymentMethod: null,\n defaultSavePaymentMethod: false,\n onFormElementError: null,\n};\n\nPaymentsOSCardInput.displayName = 'PaymentsOSCardInput';\n\nexport default PaymentsOSCardInput;\n","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport PaymentsOSErrorLabel from 'lib/components/PaymentsOS/components/PaymentsOSErrorLabel/PaymentsOSErrorLabel';\n\n/**\n * This component is the Payments OS Cvx form input for a given card.\n */\nconst PaymentsOSCvxInput = React.forwardRef(\n (\n {\n config,\n savedPaymentMethod,\n onResult,\n },\n ref,\n ) => {\n const { t } = useTranslation();\n\n const [errorCvv, setErrorCvv] = React.useState(undefined);\n\n const create = React.useCallback(\n () => {\n // Pass the public key\n window.POSC.setPublicKey(config.public_key);\n // Set the environment\n window.POSC.setEnvironment(config.production ? 'live' : 'test');\n // Pass the card's token\n window.POSC.setPaymentToken(savedPaymentMethod.token);\n // Set a placeholder\n window.POSC.setSecurityNumberPlaceholder('123');\n // Set style\n window.POSC.setStyle({\n base: {\n height: '16px',\n },\n });\n // Initialize the form's field\n window.POSC.initCvvEncryptor('cvv');\n\n },\n [config, savedPaymentMethod],\n );\n\n React.useEffect(\n () => {\n const script = window.document.createElement('script');\n script.src = 'https://js.paymentsos.com/cvv/latest/cvv-encryptor.min.js';\n script.onload = create;\n window.document.body.appendChild(script);\n return () => window.document.body.removeChild(script);\n },\n [create],\n );\n\n // The handler to be able to external component to trigger 'tokenize' and hasCvvError actions.\n React.useImperativeHandle(\n ref,\n () => ({\n tokenize() {\n try {\n return window.POSC.createTokenById(\n 'cvv',\n (result) => {\n onResult(result);\n },\n );\n } catch(error) {\n console.info(error);\n }\n },\n hasCvvError() {\n setErrorCvv('error');\n },\n }),\n [onResult],\n );\n\n return (\n \n {\n setIsCardHolderNameDirty(true);\n setCardHolderName(newValue);\n }}\n errors={(isCardHolderNameDirty || submitTried) && cardHolderName === '' ? [t('error_required')] : null}\n />\n
\n \n \n \n
\n \n
\n {displaySavePaymentMethodCheckbox && (\n \n \n \n
\n \n \n \n
\n \n
\n )}\n \n
\n );\n },\n);\n\nPaymentsOSCvxInput.propTypes = {\n /**\n * The specific configuration related to this payment method (Payments OS).\n */\n config: PropTypes.object,\n /**\n * The saved payment method for which we want to display the cvx inputt.\n */\n savedPaymentMethod: PropTypes.object,\n /**\n * The external callback to trigger when the tokenization of the cvx is processed.\n */\n onResult: PropTypes.func,\n};\n\nPaymentsOSCvxInput.displayName = 'PaymentsOSCvxInput';\n\nexport default PaymentsOSCvxInput;\n","// extracted by mini-css-extract-plugin\nexport default {\"input\":\"PaymentsOS_input__jxGGE\",\"button\":\"PaymentsOS_button__5qhn9\"};","import React from 'react';\n\nimport axios from 'axios';\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport Button from 'lib/components/Button';\nimport ButtonLink from 'lib/components/ButtonLink';\nimport Icon from 'lib/components/Icon';\nimport InfoBlock from 'lib/components/InfoBlock';\nimport PaymentsOSCardInput from './components/PaymentsOSCardInput';\nimport PaymentsOSCvvForm from './components/PaymentsOSCvxInput';\nimport SavedCardInput from 'lib/components/SavedCardInput';\nimport WaitingBlock from 'lib/components/WaitingBlock';\nimport { formatExpiryDate } from 'lib/utils/cardUtils';\nimport styles from './PaymentsOS.module.scss';\nimport styles_psp from 'lib/components/PspComposer/PspComposer.module.scss';\n\n/**\n * This component is one of the multiple available payment method in this project.\n * It represents the Payments OS PSP integration that can deal with multiple bank card types.\n */\nconst PaymentsOS = React.forwardRef(\n (\n {\n config,\n token,\n lyriaUrl,\n paymentRequestId,\n onPaymentStarted,\n onPaymentResult,\n hidePayButton,\n labelPayButton,\n loader,\n savePaymentMethod,\n savedPaymentMethods,\n paymentCardInputWarningMessage,\n operation, // eslint-disable-line no-unused-vars\n themeMode,\n onPaymentError,\n },\n ref,\n ) => {\n /* ------------ Initialization of the imports, the variables and the states ------------ */\n\n // Hooks\n const { t } = useTranslation();\n\n const iframe3ds = React.useRef(null);\n const [attempts, setAttempts] = React.useState(0);\n\n const paymentsOSCardFormRef = React.useRef();\n const paymentsOSCvvFormRef = React.useRef();\n // Display behavior states\n const [isIframeShown, showIframe] = React.useState(false);\n const [isFormVisible, showForm] = React.useState(true);\n const [isSpinnerVisible, showSpinner] = React.useState(false);\n // Payment method fields and fields related states\n const [cardNumberCorrect, setCardNumberCorrect] = React.useState(null);\n const [expiryDateCorrect, setExpiryDateCorrect] = React.useState(null);\n const [cvvCorrect, setCvvCorrect] = React.useState(null);\n const [savePaymentMethodValue, setSavePaymentMethodValue] = React.useState(false);\n const [selectedPaymentMethodUuid, setSelectedPaymentMethodUuid] = React.useState(null);\n\n /* ------------ The main functions ------------ */\n\n // The function to trigger when Payments OS response is successful (payment ok).\n const handleSuccess = React.useCallback(\n (response) => {\n onPaymentResult({ success: true, data: response });\n showForm(false);\n showIframe(false);\n showSpinner(false);\n },\n [onPaymentResult],\n );\n\n // The function to trigger when Payline response is not successful (payment ko).\n const handleError = React.useCallback(\n (response) => {\n setAttempts((attempts) => attempts + 1);\n showForm(true);\n showSpinner(false);\n onPaymentResult({ success: false, data: response });\n onPaymentError(response);\n },\n [onPaymentResult, onPaymentError],\n );\n\n const onFormElementError = React.useCallback(\n (error) => {\n if ('card' in error) {\n setCardNumberCorrect(!error.card);\n }\n if ('expiry' in error) {\n setExpiryDateCorrect(!error.expiry);\n }\n if ('cvv' in error) {\n setCvvCorrect(!error.cvv);\n }\n },\n [],\n );\n\n // The function to check the enrollment of the card when 3DS method happens.\n const verify3DS = React.useCallback(\n (redirect) => {\n showForm(false);\n\n let iframe;\n iframe = iframe3ds.current;\n showIframe(true);\n if (!iframe) {\n // Avoid sentry noise: but to investigate why the reference is null (maybe a rerender)\n console.error('Impossible to retrieve iframe');\n return;\n }\n\n const iframeContent = iframe.contentDocument;\n let form = iframeContent.createElement('form');\n form.setAttribute('method', 'GET');\n form.setAttribute('action', redirect.url);\n Object.keys(redirect.query_params).forEach((key) => {\n let hiddenField = iframeContent.createElement('input');\n hiddenField.setAttribute('name', key);\n hiddenField.setAttribute('type', 'hidden');\n hiddenField.setAttribute('value', redirect.query_params[key]);\n form.appendChild(hiddenField);\n });\n iframeContent.documentElement.appendChild(form);\n form.submit();\n showSpinner(false);\n },\n [],\n );\n\n // The message handler (to manage iframes)\n const postMessageHandler = React.useCallback(\n (message) => {\n if (message.origin === lyriaUrl && message.data) {\n if (message.data.status === 'success') {\n handleSuccess();\n } else if (message.data.status === 'error') {\n handleError(message.data.data);\n }\n }\n },\n [handleError, handleSuccess, lyriaUrl],\n );\n\n const onTokenizedCvv = React.useCallback(\n (tokenizedCvv) => {\n if (!tokenizedCvv) {\n return false;\n }\n\n const tokenizedCvvJson = JSON.parse(tokenizedCvv);\n\n if (tokenizedCvvJson.category) {\n paymentsOSCvvFormRef.current.hasCvvError();\n return false;\n }\n\n showForm(false);\n showSpinner(true);\n\n axios({\n method: 'post',\n url: lyriaUrl + '/paymentsos/process',\n headers: {\n 'Content-Type': 'application/json',\n },\n data: {\n request_token: token,\n payment_request_id: paymentRequestId,\n psp: config.id,\n cvx: tokenizedCvvJson.token,\n saved_payment_method: selectedPaymentMethodUuid,\n },\n })\n .then((res) => {\n showSpinner(false);\n if (res?.data.status === 'V') {\n handleSuccess();\n } else if (res?.data.status === 'A') {\n handleError(res?.data.data);\n }\n })\n .catch((error) => {\n if (\n error?.response?.data?.status === 'error'\n && error?.response?.data?.data?.code === '3DS_redirection'\n ) {\n verify3DS(error.response.data.data.action);\n } else {\n handleError({ code: 'internal' });\n console.info(error);\n }\n });\n },\n [config, handleError, handleSuccess, lyriaUrl, selectedPaymentMethodUuid, token, paymentRequestId, verify3DS],\n );\n\n // The callback logic to trigger when the user click on 'pay' button to submit the form for a new card.\n const submitForm = React.useCallback(\n async () => {\n const cardHolderName = document.getElementById('cardholder-name').value;\n paymentsOSCardFormRef.current.clickedSubmit();\n if (!cardHolderName || cardHolderName === '') {\n return false;\n }\n\n showForm(false);\n showSpinner(true);\n onPaymentStarted();\n\n const result = await paymentsOSCardFormRef.current.tokenize();\n\n axios({\n method: 'post',\n url: lyriaUrl + '/paymentsos/process',\n headers: {\n 'Content-Type': 'application/json',\n },\n data: {\n request_token: token,\n payment_request_id: paymentRequestId,\n psp: config.id,\n save_payment_method: savePaymentMethodValue,\n tokenized_data: JSON.parse(result),\n },\n })\n .then((res) => {\n showSpinner(false);\n if (res?.data.status === 'V') {\n handleSuccess(res.data.data);\n } else if (res?.data.status === 'A') {\n handleError(res?.data.data);\n }\n })\n .catch((error) => {\n if (\n error?.response?.data?.status === 'error'\n && error?.response?.data?.data?.code === '3DS_redirection'\n ) {\n verify3DS(error.response.data.data.action);\n } else {\n handleError({ code: 'internal' });\n console.info(error);\n }\n });\n\n return true;\n },\n [\n onPaymentStarted,\n lyriaUrl,\n token,\n paymentRequestId,\n config,\n savePaymentMethodValue,\n handleSuccess,\n handleError,\n verify3DS,\n ],\n );\n\n // The callback logic to trigger when the user click on 'pay' button to submit the form for an existing card.\n const submitFormForPayingWithSavedCard = React.useCallback(\n () => {\n paymentsOSCvvFormRef.current.tokenize();\n },\n [],\n );\n\n // The callback to trigger when the user click on 'pay' button to submit the form for a new card.\n const onClickOnPay = React.useCallback(\n (event) => {\n event.preventDefault();\n if (cardNumberCorrect && expiryDateCorrect && cvvCorrect) {\n submitForm().then().catch();\n }\n },\n [cardNumberCorrect, cvvCorrect, expiryDateCorrect, submitForm],\n );\n\n // The callback to trigger when the user click on 'pay' button to submit the form for an existing card.\n const onClickOnPayWithSavedPaymentMethod = React.useCallback(\n (event) => {\n event.preventDefault();\n submitFormForPayingWithSavedCard();\n },\n [submitFormForPayingWithSavedCard],\n );\n\n /* ------------ The side effects and imperative handlers ------------ */\n // The side effect to add a listener of message posted by Payline.\n\n React.useEffect(\n () => {\n window.addEventListener('message', postMessageHandler);\n return () => window.removeEventListener('message', postMessageHandler);\n },\n [postMessageHandler],\n );\n\n // Select by default the first saved payment method available.\n React.useEffect(\n () => {\n if (savedPaymentMethods.length) {\n setSelectedPaymentMethodUuid(savedPaymentMethods[0].uuid);\n }\n },\n [savedPaymentMethods],\n );\n\n // The handler to be able to external component to trigger 'pay' button actions.\n React.useImperativeHandle(\n ref,\n () => ({\n pay() {\n if (selectedPaymentMethodUuid) {\n return submitFormForPayingWithSavedCard();\n } else {\n if (cardNumberCorrect && expiryDateCorrect && cvvCorrect) {\n return submitForm();\n }\n }\n },\n canClickOnPay: !!selectedPaymentMethodUuid || (cardNumberCorrect && expiryDateCorrect && cvvCorrect),\n }),\n [\n cardNumberCorrect,\n cvvCorrect,\n expiryDateCorrect,\n selectedPaymentMethodUuid,\n submitForm,\n submitFormForPayingWithSavedCard,\n ],\n );\n\n /* ------------ The JSX to return according to the logic above ------------ */\n\n return (\n \n \n \n
\n \n {isSpinnerVisible && (\n \n {t('waitingPaymentProcess')}\n \n )}\n {isFormVisible && (\n \n )}\n
\n );\n },\n);\n\nPaymentsOS.propTypes = {\n /**\n * The specific configuration related to this payment method (Payments OS).\n */\n config: PropTypes.object,\n /**\n * The token to use in order to be able to call the backend when we submit the form data.\n */\n token: PropTypes.string,\n /**\n * The paymentRequestID to use in order to be able to call the backend when we submit the data in the paymentPage.\n */\n paymentRequestId: PropTypes.string,\n /**\n * The backend url to use to pass the form data.\n */\n lyriaUrl: PropTypes.string.isRequired,\n /**\n * Whether the submit button must be displayed or not.\n */\n hidePayButton: PropTypes.bool,\n /**\n * The label of the 'pay' button to display. hidePayButton props must be false of course.\n */\n labelPayButton: PropTypes.string,\n /**\n * The callback function to trigger when the payment process is starting (to manage Payline exchanges).\n */\n onPaymentStarted: PropTypes.func.isRequired,\n /**\n * The callback function to trigger when the backend return the result of the form data submit.\n */\n onPaymentResult: PropTypes.func.isRequired,\n /**\n * The loader component to use when the payment or drop-in is loading.\n */\n loader: PropTypes.node,\n /**\n * Whether we want to check by default the checkbox to save the payment method.\n */\n savePaymentMethod: PropTypes.bool,\n /**\n * The list of saved payment methods available.\n * The goal is to be able to select one of them and avoid typing it again.\n */\n savedPaymentMethods: PropTypes.array,\n /**\n * A warning message to display for payment at the card input step (mainly to advise the user to save its payment method).\n */\n paymentCardInputWarningMessage: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n /**\n * The operation type to process.\n */\n operation: PropTypes.oneOf(['credit', 'payment', 'refund']),\n /**\n * The theme to use (dark or light).\n */\n themeMode: PropTypes.oneOf(['light', 'dark']),\n /**\n * A function to call when we have a payment Error, like payment decline\n * payment aborted, or anything that can happen after you put in you credit\n * card number to make the transaction fail while you really want to buy\n * this concert ticket\n */\n onPaymentError: PropTypes.func,\n};\n\nPaymentsOS.defaultProps = {\n config: {},\n expiryAsText: false,\n hidePayButton: false,\n labelPayButton: null, // Fallback on 'pay' or 'ask refund' label.\n loader: null,\n savePaymentMethod: false,\n savedPaymentMethods: [],\n paymentCardInputWarningMessage: null,\n operation: null,\n themeMode: 'light',\n onPaymentError: () => {},\n};\n\nPaymentsOS.displayName = 'PaymentsOS';\n\nexport default PaymentsOS;\n","/**\n * Return the object without the entries for which the value is included in the forbidden values.\n * @param {Object} obj The object to filter / clean.\n * @param {Array.<*|null|undefined>} valuesToClean The forbidden values.\n * @return {Object} The filtered / clean object.\n */\nexport const cleanObjectOnValues = (obj, valuesToClean) => {\n if (typeof obj !== 'object' || !valuesToClean) {\n return obj;\n }\n return Object.fromEntries(Object.entries(obj).filter((entry) => !valuesToClean.includes(entry[1])));\n};\n","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport Button from 'lib/components/Button';\nimport FormField from 'lib/components/FormField';\nimport { cleanObjectOnValues } from 'lib/utils/objectUtils';\nimport { useFormSave } from 'lib/hooks/useFormSave';\n\nimport styles from 'lib/components/PspComposer/PspComposer.module.scss';\n\n/**\n * This component is one of the multiple available payment method in this project.\n * It represents a form used for Peru the bank account number,\n * and some information related to Peru. It is only used to collect refund request data.\n */\nconst PeruvianForm = React.forwardRef(\n (\n {\n pspId,\n token,\n paymentRequestId,\n lyriaUrl,\n hidePayButton,\n labelPayButton,\n onPaymentResult,\n },\n ref,\n ) => {\n const { t } = useTranslation();\n\n const formRef = React.useRef(null);\n const [formData, setFormData] = React.useState({\n bankName: '',\n bankAccountType: '',\n bankAccountNumber: '',\n bankCode: '',\n digitalPaymentApp: '',\n documentNumber: '',\n email: '',\n firstName: '',\n lastName: '',\n phoneNumber: '',\n });\n const [errors, setErrors] = React.useState({});\n\n const handleSuccess = React.useCallback(\n (response) => {\n onPaymentResult({ success: true, data: response });\n },\n [onPaymentResult],\n );\n\n const handleError = React.useCallback(\n (response) => {\n if (response?.data) {\n const fieldErrors = {};\n Object\n .keys(response.data)\n .forEach((key) => {\n fieldErrors[key] = response.data[key] && response.data[key].map((error) => t([\n `peruvian_form_${key}_error_${error.code}`,\n `error_${error.code}`,\n 'error_form',\n ]));\n });\n setErrors(fieldErrors);\n }\n onPaymentResult({\n success: false,\n data: response,\n });\n },\n [onPaymentResult, t],\n );\n\n const url = lyriaUrl + '/peruvian-form/save';\n const saveForm = useFormSave(url, token, paymentRequestId, pspId, handleSuccess, handleError);\n\n const submitForm = React.useCallback(\n (event) => {\n event.preventDefault();\n event.stopPropagation();\n const rawData = {\n first_name: formData.firstName,\n last_name: formData.lastName,\n bank_code: formData.bankCode,\n bank_account_number: formData.bankAccountNumber,\n document_number: formData.documentNumber,\n bank_name: formData.bankName,\n email: formData.email,\n phone_number: formData.phoneNumber,\n bank_account_type: formData.bankAccountType,\n digital_payment_app: formData.digitalPaymentApp,\n };\n\n const data = cleanObjectOnValues(rawData, ['', null]);\n saveForm(data);\n },\n [formData, saveForm],\n );\n\n const onChangeFormField = React.useCallback(\n (fieldName) => (event, newValue) => {\n setFormData((prevState) => ({\n ...prevState,\n [fieldName]: newValue,\n }));\n },\n [],\n );\n\n const formatAndValidateDNI = React.useCallback(\n (value) => value?.substring(0, 12),\n [],\n );\n\n const formatAndValidateBankAccountNumber = React.useCallback(\n (value) => value?.substring(0, 18),\n [],\n );\n\n const formatAndValidateBankCode = React.useCallback(\n (value) => value?.substring(0, 20),\n [],\n );\n\n React.useImperativeHandle(\n ref,\n () => ({\n pay() {\n return formRef.current.click();\n },\n canClickOnPay: Object.values(formData).every((value) => !!value),\n }),\n [formData],\n );\n\n const requiredFields = [\n 'bankAccountType',\n 'bankAccountNumber',\n 'bankCode',\n 'documentNumber',\n 'email',\n 'firstName',\n 'lastName',\n ];\n const hasRequiredFieldNotFilled = Object\n .values(\n Object.fromEntries(\n Object\n .entries(formData)\n .filter(([k, _v]) => requiredFields.includes(k)),\n ),\n )\n .some((value) => !value);\n\n return (\n \n \n
\n );\n },\n);\n\nPeruvianForm.propTypes = {\n /**\n * The is of the PSP returned by the backend in order to be able to pass it when we submit the form data.\n */\n pspId: PropTypes.number.isRequired,\n /**\n * The token to use in order to be able to call the backend when we submit the form data.\n */\n token: PropTypes.string,\n /**\n * The paymentRequestID to use in order to be able to call the backend when we submit the data in the paymentPage.\n */\n paymentRequestId: PropTypes.string,\n /**\n * The backend url to use to pass the form data.\n */\n lyriaUrl: PropTypes.string.isRequired,\n /**\n * Whether the submit button must be displayed or not.\n */\n hidePayButton: PropTypes.bool,\n /**\n * The label of the 'pay' button to display. hidePayButton props must be false of course.\n */\n labelPayButton: PropTypes.string,\n /**\n * The callback function to trigger when the backend return the result of the form data submit.\n */\n onPaymentResult: PropTypes.func.isRequired,\n};\n\nPeruvianForm.defaultProps = {\n hidePayButton: false,\n labelPayButton: null, // Fallback on 'pay' or 'ask refund' label.\n};\n\nPeruvianForm.displayName = 'PeruvianForm';\n\nexport default PeruvianForm;\n","// extracted by mini-css-extract-plugin\nexport default {\"header\":\"PaymentMethodOption_header__LbsB0\",\"header_disabled\":\"PaymentMethodOption_header_disabled__NhgG-\",\"header_and_content\":\"PaymentMethodOption_header_and_content__uXRxR\",\"header_main\":\"PaymentMethodOption_header_main__uHS99\",\"title_icon\":\"PaymentMethodOption_title_icon__R5XDr\",\"title\":\"PaymentMethodOption_title__p1XSt\",\"icon\":\"PaymentMethodOption_icon__oTmWg\",\"wrapper\":\"PaymentMethodOption_wrapper__xE8-y\",\"subtitles\":\"PaymentMethodOption_subtitles__FzumF\",\"item\":\"PaymentMethodOption_item__RVOJO\",\"arrow\":\"PaymentMethodOption_arrow__OKD2N\",\"arrow_wrapper\":\"PaymentMethodOption_arrow_wrapper__GamG4\",\"content\":\"PaymentMethodOption_content__qpkr+\",\"content_and_header\":\"PaymentMethodOption_content_and_header__WBwOz\"};","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { Trans } from 'react-i18next';\n\nimport Icon from 'lib/components/Icon';\nimport styles from './PaymentMethodOption.module.scss';\n\n/**\n * This component is a payment method choice / button expandable to display in the main component.\n * The user must select one payment method option to continue the flow (for payment or credit)\n */\nconst PaymentMethodOption = ({\n isSelected,\n isDisabled,\n isComponentOnly,\n shouldHideTheExpandableButtonWhenOpen,\n operationType,\n name,\n icons,\n paymentMethods = [], // eslint-disable-line no-unused-vars\n feesAmount,\n minimumAmount,\n onClick,\n paymentMethodComponent,\n themeMode,\n}) => {\n const [isExpanded, setIsExpanded] = React.useState(isSelected);\n\n const displayHeader = React.useMemo(\n () => !(shouldHideTheExpandableButtonWhenOpen && isExpanded),\n [shouldHideTheExpandableButtonWhenOpen, isExpanded],\n );\n\n const iconsComponents = React.useMemo(\n () => icons.map((icon) => (\n
,\n );\n }\n } else {\n if (feesAmount) {\n subtitles.push(\n \n
,\n );\n }\n }\n }\n return subtitles;\n },\n [feesAmount, minimumAmount, operationType, isDisabled],\n );\n\n React.useEffect(\n () => {\n if (isSelected !== null && isSelected !== undefined) {\n setIsExpanded(isSelected);\n }\n },\n [isSelected],\n );\n\n const onClickCallback = React.useCallback(\n () => {\n if (!isDisabled) {\n setIsExpanded((previous) => {\n if (onClick) {\n onClick(!previous);\n }\n return !previous;\n });\n }\n },\n [isDisabled, onClick],\n );\n\n let classNameHeader = styles.header;\n let classNameContent = styles.content;\n if (displayHeader && isExpanded && paymentMethodComponent) {\n classNameHeader = styles.header_and_content;\n } else if (isDisabled) {\n classNameHeader = styles.header_disabled;\n }\n if (displayHeader) {\n classNameContent = styles.content_and_header;\n }\n\n return (\n \n {displayHeader && !isComponentOnly && (\n
\n \n
\n )}\n \n
\n {!!subTitlesComponents?.length && (\n \n {name && (\n
\n )}\n \n {name}\n
\n )}\n {!!iconsComponents?.length && (\n \n {iconsComponents.map((iconComponent, index) => (\n \n {iconComponent}\n
\n ))}\n \n {subTitlesComponents.map((subTitlesComponent, index) => (\n \n {subTitlesComponent}\n
\n ))}\n \n
\n \n )}\n {isExpanded && !!paymentMethodComponent && !isComponentOnly && (\n \n {\n isExpanded && !!paymentMethodComponent\n ?
\n \n {paymentMethodComponent}\n
\n )}\n {isComponentOnly && (\n <>{paymentMethodComponent}\n )}\n \n );\n};\n\nPaymentMethodOption.propTypes = {\n /**\n * Whether the button is selected and should be expanded.\n */\n isSelected: PropTypes.bool,\n /**\n * Whether the button should be disabled and so not expandable or not.\n */\n isDisabled: PropTypes.bool,\n /**\n * Whether the component must be displayed alone with no wrapper.\n */\n isComponentOnly: PropTypes.bool,\n /**\n * Whether the expandable button 'header' should be hidden when the payment method is expanded (selected).\n */\n shouldHideTheExpandableButtonWhenOpen: PropTypes.bool,\n /**\n * In which context we are, the type of operation that will be processed.\n */\n operationType: PropTypes.oneOf(['credit', 'payment']),\n /**\n * The title of the payment method to display.\n */\n name: PropTypes.string,\n /**\n * The list of icons to display close to the name of the payment method.\n */\n icons: PropTypes.arrayOf(Icon.propTypes.id),\n /**\n * The list of payment methods that belongs to the given payment method. That's a kind of sub payment method.\n * For example, for 'credit card' payment method we could have Visa, Mastercard and so on.\n */\n paymentMethods: PropTypes.arrayOf(\n PropTypes.shape({\n label: PropTypes.string.isRequired,\n payment_method: PropTypes.string.isRequired,\n is_card: PropTypes.bool,\n }),\n ),\n /**\n * The fee amount that will be applied if this payment method is chosen. It is already formatted with symbol.\n */\n feesAmount: PropTypes.string,\n /**\n * The minimum amount required to be allowed to use this payment method. It is already formatted with symbol.\n * This is mainly used for 'credit' operation to avoid too low amounts that costs too much money for us.\n */\n minimumAmount: PropTypes.string,\n /**\n * The maximum amount required to be allowed to use this payment method. It is already formatted with symbol.\n * This is to prevent too high amounts we don't allow.\n */\n maximumAmount: PropTypes.string,\n /**\n * The callback function to trigger when we expand and collapse on the payment button (header).\n * The callback returns a boolean to say whether the component is expanded or not.\n */\n onClick: PropTypes.func,\n /**\n * The main business component to display when the button is expanded.\n * This is the component related to the payment method the user must fill to continue the process.\n */\n paymentMethodComponent: PropTypes.element,\n /**\n * The theme mode to display the appropriate version of the icon (if exist).\n */\n themeMode: PropTypes.oneOf(['light', 'dark']),\n};\n\nPaymentMethodOption.defaultProps = {\n isSelected: false,\n isDisabled: false,\n isComponentOnly: false,\n shouldHideTheExpandableButtonWhenOpen: false,\n operationType: null,\n name: null,\n icons: [],\n paymentMethods: [],\n feesAmount: null,\n minimumAmount: null,\n maximumAmount: null,\n onClick: null,\n paymentMethodComponent: null,\n themeMode: 'light',\n};\n\nexport default PaymentMethodOption;\n","import React from 'react';\n\nimport PropTypes from 'prop-types';\n\nimport styles from './PaymentMethodOptionExpress.module.scss';\nimport { Trans } from 'react-i18next';\n\n/**\n * This component is a payment express method container to display in the main component.\n * It will display all payment method 'on click' we want (basically Apple Pay and Google Pay).\n */\nconst PaymentMethodOptionExpress = ({\n paymentMethodComponents,\n shouldDisplayExpressCheckoutTitle,\n}) => {\n return (\n \n {shouldDisplayExpressCheckoutTitle && (\n
\n );\n};\n\nPaymentMethodOptionExpress.propTypes = {\n /**\n * The main business components to display inside the container.\n * This is the components related to the payment methods the user could select to continue the process.\n */\n paymentMethodComponents: PropTypes.arrayOf(PropTypes.element),\n /**\n * Whether we want to display the title about express payment method ('express checkout') above the buttons.\n */\n shouldDisplayExpressCheckoutTitle: PropTypes.bool,\n};\n\nPaymentMethodOptionExpress.defaultProps = {\n paymentMethodComponents: [],\n};\n\nexport default PaymentMethodOptionExpress;\n","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport Button from 'lib/components/Button';\nimport FormField from 'lib/components/FormField';\nimport { cleanObjectOnValues } from 'lib/utils/objectUtils';\nimport { useFormSave } from 'lib/hooks/useFormSave';\n\nimport styles from 'lib/components/PspComposer/PspComposer.module.scss';\n\n/**\n * This component is one of the multiple available payment method in this project.\n * It represents a form used for SouthAfrica the bank account number,\n * and some information related to SouthAfrica. It is only used to collect refund request data.\n */\nconst SouthAfricanForm = React.forwardRef(\n (\n {\n pspId,\n token,\n paymentRequestId,\n lyriaUrl,\n hidePayButton,\n labelPayButton,\n onPaymentResult,\n },\n ref,\n ) => {\n const { t } = useTranslation();\n\n const formRef = React.useRef(null);\n const [formData, setFormData] = React.useState({\n address: '',\n bankAccountHolderName: '',\n bankAccountNumber: '',\n bankBranchCode: '',\n country: '',\n email: '',\n phoneNumber: '',\n });\n const [errors, setErrors] = React.useState({});\n\n const handleSuccess = React.useCallback(\n (response) => {\n onPaymentResult({ success: true, data: response });\n },\n [onPaymentResult],\n );\n\n const handleError = React.useCallback(\n (response) => {\n if (response?.data) {\n const fieldErrors = {};\n Object\n .keys(response.data)\n .forEach((key) => {\n fieldErrors[key] = response.data[key] && response.data[key].map((error) => t([\n `south_african_form_${key}_error_${error.code}`,\n `error_${error.code}`,\n 'error_form',\n ]));\n });\n setErrors(fieldErrors);\n }\n onPaymentResult({\n success: false,\n data: response,\n });\n },\n [onPaymentResult, t],\n );\n\n const url = lyriaUrl + '/south-african-form/save';\n const saveForm = useFormSave(url, token, paymentRequestId, pspId, handleSuccess, handleError);\n\n const submitForm = React.useCallback(\n (event) => {\n event.preventDefault();\n event.stopPropagation();\n const rawData = {\n address: formData.address,\n bank_account_holder_name: formData.bankAccountHolderName,\n bank_account_number: formData.bankAccountNumber,\n bank_branch_code: formData.bankBranchCode,\n country: formData.country,\n email: formData.email,\n phone_number: formData.phoneNumber,\n };\n const data = cleanObjectOnValues(rawData, ['', null]);\n saveForm(data);\n },\n [formData, saveForm],\n );\n\n const onChangeFormField = React.useCallback(\n (fieldName) => (event, newValue) => {\n setFormData((prevState) => ({\n ...prevState,\n [fieldName]: newValue,\n }));\n\n },\n [],\n );\n\n React.useImperativeHandle(\n ref,\n () => ({\n pay() {\n return formRef.current.click();\n },\n canClickOnPay: Object.values(formData).every((value) => !!value),\n }),\n [formData],\n );\n\n const requiredFields = [\n 'address',\n 'bankAccountHolderName',\n 'bankAccountNumber',\n 'bankBranchCode',\n 'country',\n 'email',\n ];\n const hasRequiredFieldNotFilled = Object\n .values(\n Object.fromEntries(\n Object\n .entries(formData)\n .filter(([k, _]) => requiredFields.includes(k)),\n ),\n )\n .some((value) => !value);\n\n return (\n \n \n
\n )}\n \n\n {paymentMethodComponents && paymentMethodComponents.map((paymentMethodComponent, index) => (\n
\n \n {paymentMethodComponent}\n
\n ))}\n \n \n
\n );\n },\n);\n\nSouthAfricanForm.propTypes = {\n /**\n * The is of the PSP returned by the backend in order to be able to pass it when we submit the form data.\n */\n pspId: PropTypes.number.isRequired,\n /**\n * The token to use in order to be able to call the backend when we submit the form data.\n */\n token: PropTypes.string,\n /**\n * The paymentRequestID to use in order to be able to call the backend when we submit the data in the paymentPage.\n */\n paymentRequestId: PropTypes.string,\n /**\n * The backend url to use to pass the form data.\n */\n lyriaUrl: PropTypes.string.isRequired,\n /**\n * Whether the submit button must be displayed or not.\n */\n hidePayButton: PropTypes.bool,\n /**\n * The label of the 'pay' button to display. hidePayButton props must be false of course.\n */\n labelPayButton: PropTypes.string,\n /**\n * The callback function to trigger when the backend return the result of the form data submit.\n */\n onPaymentResult: PropTypes.func.isRequired,\n};\n\nSouthAfricanForm.defaultProps = {\n hidePayButton: false,\n labelPayButton: null, // Fallback on 'pay' or 'ask refund' label.\n};\n\nSouthAfricanForm.displayName = 'SouthAfricanForm';\n\nexport default SouthAfricanForm;\n","function _assertThisInitialized(e) {\n if (void 0 === e) throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n return e;\n}\nexport { _assertThisInitialized as default };","function _setPrototypeOf(t, e) {\n return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) {\n return t.__proto__ = e, t;\n }, _setPrototypeOf(t, e);\n}\nexport { _setPrototypeOf as default };","import setPrototypeOf from \"./setPrototypeOf.js\";\nfunction _inherits(t, e) {\n if (\"function\" != typeof e && null !== e) throw new TypeError(\"Super expression must either be null or a function\");\n t.prototype = Object.create(e && e.prototype, {\n constructor: {\n value: t,\n writable: !0,\n configurable: !0\n }\n }), Object.defineProperty(t, \"prototype\", {\n writable: !1\n }), e && setPrototypeOf(t, e);\n}\nexport { _inherits as default };","import _typeof from \"./typeof.js\";\nimport assertThisInitialized from \"./assertThisInitialized.js\";\nfunction _possibleConstructorReturn(t, e) {\n if (e && (\"object\" == _typeof(e) || \"function\" == typeof e)) return e;\n if (void 0 !== e) throw new TypeError(\"Derived constructors may only return object or undefined\");\n return assertThisInitialized(t);\n}\nexport { _possibleConstructorReturn as default };","function _getPrototypeOf(t) {\n return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) {\n return t.__proto__ || Object.getPrototypeOf(t);\n }, _getPrototypeOf(t);\n}\nexport { _getPrototypeOf as default };","import arrayWithHoles from \"./arrayWithHoles.js\";\nimport iterableToArray from \"./iterableToArray.js\";\nimport unsupportedIterableToArray from \"./unsupportedIterableToArray.js\";\nimport nonIterableRest from \"./nonIterableRest.js\";\nfunction _toArray(r) {\n return arrayWithHoles(r) || iterableToArray(r) || unsupportedIterableToArray(r) || nonIterableRest();\n}\nexport { _toArray as default };","function _iterableToArray(r) {\n if (\"undefined\" != typeof Symbol && null != r[Symbol.iterator] || null != r[\"@@iterator\"]) return Array.from(r);\n}\nexport { _iterableToArray as default };","import _typeof from '@babel/runtime/helpers/esm/typeof';\nimport _classCallCheck from '@babel/runtime/helpers/esm/classCallCheck';\nimport _createClass from '@babel/runtime/helpers/esm/createClass';\nimport _assertThisInitialized from '@babel/runtime/helpers/esm/assertThisInitialized';\nimport _inherits from '@babel/runtime/helpers/esm/inherits';\nimport _possibleConstructorReturn from '@babel/runtime/helpers/esm/possibleConstructorReturn';\nimport _getPrototypeOf from '@babel/runtime/helpers/esm/getPrototypeOf';\nimport _defineProperty from '@babel/runtime/helpers/esm/defineProperty';\nimport _toArray from '@babel/runtime/helpers/esm/toArray';\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nvar consoleLogger = {\n type: 'logger',\n log: function log(args) {\n this.output('log', args);\n },\n warn: function warn(args) {\n this.output('warn', args);\n },\n error: function error(args) {\n this.output('error', args);\n },\n output: function output(type, args) {\n if (console && console[type]) console[type].apply(console, args);\n }\n};\n\nvar Logger = function () {\n function Logger(concreteLogger) {\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n\n _classCallCheck(this, Logger);\n\n this.init(concreteLogger, options);\n }\n\n _createClass(Logger, [{\n key: \"init\",\n value: function init(concreteLogger) {\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n this.prefix = options.prefix || 'i18next:';\n this.logger = concreteLogger || consoleLogger;\n this.options = options;\n this.debug = options.debug;\n }\n }, {\n key: \"setDebug\",\n value: function setDebug(bool) {\n this.debug = bool;\n }\n }, {\n key: \"log\",\n value: function log() {\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n return this.forward(args, 'log', '', true);\n }\n }, {\n key: \"warn\",\n value: function warn() {\n for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {\n args[_key2] = arguments[_key2];\n }\n\n return this.forward(args, 'warn', '', true);\n }\n }, {\n key: \"error\",\n value: function error() {\n for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {\n args[_key3] = arguments[_key3];\n }\n\n return this.forward(args, 'error', '');\n }\n }, {\n key: \"deprecate\",\n value: function deprecate() {\n for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {\n args[_key4] = arguments[_key4];\n }\n\n return this.forward(args, 'warn', 'WARNING DEPRECATED: ', true);\n }\n }, {\n key: \"forward\",\n value: function forward(args, lvl, prefix, debugOnly) {\n if (debugOnly && !this.debug) return null;\n if (typeof args[0] === 'string') args[0] = \"\".concat(prefix).concat(this.prefix, \" \").concat(args[0]);\n return this.logger[lvl](args);\n }\n }, {\n key: \"create\",\n value: function create(moduleName) {\n return new Logger(this.logger, _objectSpread(_objectSpread({}, {\n prefix: \"\".concat(this.prefix, \":\").concat(moduleName, \":\")\n }), this.options));\n }\n }, {\n key: \"clone\",\n value: function clone(options) {\n options = options || this.options;\n options.prefix = options.prefix || this.prefix;\n return new Logger(this.logger, options);\n }\n }]);\n\n return Logger;\n}();\n\nvar baseLogger = new Logger();\n\nvar EventEmitter = function () {\n function EventEmitter() {\n _classCallCheck(this, EventEmitter);\n\n this.observers = {};\n }\n\n _createClass(EventEmitter, [{\n key: \"on\",\n value: function on(events, listener) {\n var _this = this;\n\n events.split(' ').forEach(function (event) {\n _this.observers[event] = _this.observers[event] || [];\n\n _this.observers[event].push(listener);\n });\n return this;\n }\n }, {\n key: \"off\",\n value: function off(event, listener) {\n if (!this.observers[event]) return;\n\n if (!listener) {\n delete this.observers[event];\n return;\n }\n\n this.observers[event] = this.observers[event].filter(function (l) {\n return l !== listener;\n });\n }\n }, {\n key: \"emit\",\n value: function emit(event) {\n for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {\n args[_key - 1] = arguments[_key];\n }\n\n if (this.observers[event]) {\n var cloned = [].concat(this.observers[event]);\n cloned.forEach(function (observer) {\n observer.apply(void 0, args);\n });\n }\n\n if (this.observers['*']) {\n var _cloned = [].concat(this.observers['*']);\n\n _cloned.forEach(function (observer) {\n observer.apply(observer, [event].concat(args));\n });\n }\n }\n }]);\n\n return EventEmitter;\n}();\n\nfunction defer() {\n var res;\n var rej;\n var promise = new Promise(function (resolve, reject) {\n res = resolve;\n rej = reject;\n });\n promise.resolve = res;\n promise.reject = rej;\n return promise;\n}\nfunction makeString(object) {\n if (object == null) return '';\n return '' + object;\n}\nfunction copy(a, s, t) {\n a.forEach(function (m) {\n if (s[m]) t[m] = s[m];\n });\n}\n\nfunction getLastOfPath(object, path, Empty) {\n function cleanKey(key) {\n return key && key.indexOf('###') > -1 ? key.replace(/###/g, '.') : key;\n }\n\n function canNotTraverseDeeper() {\n return !object || typeof object === 'string';\n }\n\n var stack = typeof path !== 'string' ? [].concat(path) : path.split('.');\n\n while (stack.length > 1) {\n if (canNotTraverseDeeper()) return {};\n var key = cleanKey(stack.shift());\n if (!object[key] && Empty) object[key] = new Empty();\n\n if (Object.prototype.hasOwnProperty.call(object, key)) {\n object = object[key];\n } else {\n object = {};\n }\n }\n\n if (canNotTraverseDeeper()) return {};\n return {\n obj: object,\n k: cleanKey(stack.shift())\n };\n}\n\nfunction setPath(object, path, newValue) {\n var _getLastOfPath = getLastOfPath(object, path, Object),\n obj = _getLastOfPath.obj,\n k = _getLastOfPath.k;\n\n obj[k] = newValue;\n}\nfunction pushPath(object, path, newValue, concat) {\n var _getLastOfPath2 = getLastOfPath(object, path, Object),\n obj = _getLastOfPath2.obj,\n k = _getLastOfPath2.k;\n\n obj[k] = obj[k] || [];\n if (concat) obj[k] = obj[k].concat(newValue);\n if (!concat) obj[k].push(newValue);\n}\nfunction getPath(object, path) {\n var _getLastOfPath3 = getLastOfPath(object, path),\n obj = _getLastOfPath3.obj,\n k = _getLastOfPath3.k;\n\n if (!obj) return undefined;\n return obj[k];\n}\nfunction getPathWithDefaults(data, defaultData, key) {\n var value = getPath(data, key);\n\n if (value !== undefined) {\n return value;\n }\n\n return getPath(defaultData, key);\n}\nfunction deepExtend(target, source, overwrite) {\n for (var prop in source) {\n if (prop !== '__proto__' && prop !== 'constructor') {\n if (prop in target) {\n if (typeof target[prop] === 'string' || target[prop] instanceof String || typeof source[prop] === 'string' || source[prop] instanceof String) {\n if (overwrite) target[prop] = source[prop];\n } else {\n deepExtend(target[prop], source[prop], overwrite);\n }\n } else {\n target[prop] = source[prop];\n }\n }\n }\n\n return target;\n}\nfunction regexEscape(str) {\n return str.replace(/[\\-\\[\\]\\/\\{\\}\\(\\)\\*\\+\\?\\.\\\\\\^\\$\\|]/g, '\\\\$&');\n}\nvar _entityMap = {\n '&': '&',\n '<': '<',\n '>': '>',\n '\"': '"',\n \"'\": ''',\n '/': '/'\n};\nfunction escape(data) {\n if (typeof data === 'string') {\n return data.replace(/[&<>\"'\\/]/g, function (s) {\n return _entityMap[s];\n });\n }\n\n return data;\n}\nvar isIE10 = typeof window !== 'undefined' && window.navigator && typeof window.navigator.userAgentData === 'undefined' && window.navigator.userAgent && window.navigator.userAgent.indexOf('MSIE') > -1;\nvar chars = [' ', ',', '?', '!', ';'];\nfunction looksLikeObjectPath(key, nsSeparator, keySeparator) {\n nsSeparator = nsSeparator || '';\n keySeparator = keySeparator || '';\n var possibleChars = chars.filter(function (c) {\n return nsSeparator.indexOf(c) < 0 && keySeparator.indexOf(c) < 0;\n });\n if (possibleChars.length === 0) return true;\n var r = new RegExp(\"(\".concat(possibleChars.map(function (c) {\n return c === '?' ? '\\\\?' : c;\n }).join('|'), \")\"));\n var matched = !r.test(key);\n\n if (!matched) {\n var ki = key.indexOf(keySeparator);\n\n if (ki > 0 && !r.test(key.substring(0, ki))) {\n matched = true;\n }\n }\n\n return matched;\n}\n\nfunction ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$1(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\n\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\n\nfunction deepFind(obj, path) {\n var keySeparator = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '.';\n if (!obj) return undefined;\n if (obj[path]) return obj[path];\n var paths = path.split(keySeparator);\n var current = obj;\n\n for (var i = 0; i < paths.length; ++i) {\n if (!current) return undefined;\n\n if (typeof current[paths[i]] === 'string' && i + 1 < paths.length) {\n return undefined;\n }\n\n if (current[paths[i]] === undefined) {\n var j = 2;\n var p = paths.slice(i, i + j).join(keySeparator);\n var mix = current[p];\n\n while (mix === undefined && paths.length > i + j) {\n j++;\n p = paths.slice(i, i + j).join(keySeparator);\n mix = current[p];\n }\n\n if (mix === undefined) return undefined;\n if (mix === null) return null;\n\n if (path.endsWith(p)) {\n if (typeof mix === 'string') return mix;\n if (p && typeof mix[p] === 'string') return mix[p];\n }\n\n var joinedPath = paths.slice(i + j).join(keySeparator);\n if (joinedPath) return deepFind(mix, joinedPath, keySeparator);\n return undefined;\n }\n\n current = current[paths[i]];\n }\n\n return current;\n}\n\nvar ResourceStore = function (_EventEmitter) {\n _inherits(ResourceStore, _EventEmitter);\n\n var _super = _createSuper(ResourceStore);\n\n function ResourceStore(data) {\n var _this;\n\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {\n ns: ['translation'],\n defaultNS: 'translation'\n };\n\n _classCallCheck(this, ResourceStore);\n\n _this = _super.call(this);\n\n if (isIE10) {\n EventEmitter.call(_assertThisInitialized(_this));\n }\n\n _this.data = data || {};\n _this.options = options;\n\n if (_this.options.keySeparator === undefined) {\n _this.options.keySeparator = '.';\n }\n\n if (_this.options.ignoreJSONStructure === undefined) {\n _this.options.ignoreJSONStructure = true;\n }\n\n return _this;\n }\n\n _createClass(ResourceStore, [{\n key: \"addNamespaces\",\n value: function addNamespaces(ns) {\n if (this.options.ns.indexOf(ns) < 0) {\n this.options.ns.push(ns);\n }\n }\n }, {\n key: \"removeNamespaces\",\n value: function removeNamespaces(ns) {\n var index = this.options.ns.indexOf(ns);\n\n if (index > -1) {\n this.options.ns.splice(index, 1);\n }\n }\n }, {\n key: \"getResource\",\n value: function getResource(lng, ns, key) {\n var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};\n var keySeparator = options.keySeparator !== undefined ? options.keySeparator : this.options.keySeparator;\n var ignoreJSONStructure = options.ignoreJSONStructure !== undefined ? options.ignoreJSONStructure : this.options.ignoreJSONStructure;\n var path = [lng, ns];\n if (key && typeof key !== 'string') path = path.concat(key);\n if (key && typeof key === 'string') path = path.concat(keySeparator ? key.split(keySeparator) : key);\n\n if (lng.indexOf('.') > -1) {\n path = lng.split('.');\n }\n\n var result = getPath(this.data, path);\n if (result || !ignoreJSONStructure || typeof key !== 'string') return result;\n return deepFind(this.data && this.data[lng] && this.data[lng][ns], key, keySeparator);\n }\n }, {\n key: \"addResource\",\n value: function addResource(lng, ns, key, value) {\n var options = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {\n silent: false\n };\n var keySeparator = this.options.keySeparator;\n if (keySeparator === undefined) keySeparator = '.';\n var path = [lng, ns];\n if (key) path = path.concat(keySeparator ? key.split(keySeparator) : key);\n\n if (lng.indexOf('.') > -1) {\n path = lng.split('.');\n value = ns;\n ns = path[1];\n }\n\n this.addNamespaces(ns);\n setPath(this.data, path, value);\n if (!options.silent) this.emit('added', lng, ns, key, value);\n }\n }, {\n key: \"addResources\",\n value: function addResources(lng, ns, resources) {\n var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {\n silent: false\n };\n\n for (var m in resources) {\n if (typeof resources[m] === 'string' || Object.prototype.toString.apply(resources[m]) === '[object Array]') this.addResource(lng, ns, m, resources[m], {\n silent: true\n });\n }\n\n if (!options.silent) this.emit('added', lng, ns, resources);\n }\n }, {\n key: \"addResourceBundle\",\n value: function addResourceBundle(lng, ns, resources, deep, overwrite) {\n var options = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : {\n silent: false\n };\n var path = [lng, ns];\n\n if (lng.indexOf('.') > -1) {\n path = lng.split('.');\n deep = resources;\n resources = ns;\n ns = path[1];\n }\n\n this.addNamespaces(ns);\n var pack = getPath(this.data, path) || {};\n\n if (deep) {\n deepExtend(pack, resources, overwrite);\n } else {\n pack = _objectSpread$1(_objectSpread$1({}, pack), resources);\n }\n\n setPath(this.data, path, pack);\n if (!options.silent) this.emit('added', lng, ns, resources);\n }\n }, {\n key: \"removeResourceBundle\",\n value: function removeResourceBundle(lng, ns) {\n if (this.hasResourceBundle(lng, ns)) {\n delete this.data[lng][ns];\n }\n\n this.removeNamespaces(ns);\n this.emit('removed', lng, ns);\n }\n }, {\n key: \"hasResourceBundle\",\n value: function hasResourceBundle(lng, ns) {\n return this.getResource(lng, ns) !== undefined;\n }\n }, {\n key: \"getResourceBundle\",\n value: function getResourceBundle(lng, ns) {\n if (!ns) ns = this.options.defaultNS;\n if (this.options.compatibilityAPI === 'v1') return _objectSpread$1(_objectSpread$1({}, {}), this.getResource(lng, ns));\n return this.getResource(lng, ns);\n }\n }, {\n key: \"getDataByLanguage\",\n value: function getDataByLanguage(lng) {\n return this.data[lng];\n }\n }, {\n key: \"hasLanguageSomeTranslations\",\n value: function hasLanguageSomeTranslations(lng) {\n var data = this.getDataByLanguage(lng);\n var n = data && Object.keys(data) || [];\n return !!n.find(function (v) {\n return data[v] && Object.keys(data[v]).length > 0;\n });\n }\n }, {\n key: \"toJSON\",\n value: function toJSON() {\n return this.data;\n }\n }]);\n\n return ResourceStore;\n}(EventEmitter);\n\nvar postProcessor = {\n processors: {},\n addPostProcessor: function addPostProcessor(module) {\n this.processors[module.name] = module;\n },\n handle: function handle(processors, value, key, options, translator) {\n var _this = this;\n\n processors.forEach(function (processor) {\n if (_this.processors[processor]) value = _this.processors[processor].process(value, key, options, translator);\n });\n return value;\n }\n};\n\nfunction ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$2(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nfunction _createSuper$1(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\n\nfunction _isNativeReflectConstruct$1() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\nvar checkedLoadedFor = {};\n\nvar Translator = function (_EventEmitter) {\n _inherits(Translator, _EventEmitter);\n\n var _super = _createSuper$1(Translator);\n\n function Translator(services) {\n var _this;\n\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n\n _classCallCheck(this, Translator);\n\n _this = _super.call(this);\n\n if (isIE10) {\n EventEmitter.call(_assertThisInitialized(_this));\n }\n\n copy(['resourceStore', 'languageUtils', 'pluralResolver', 'interpolator', 'backendConnector', 'i18nFormat', 'utils'], services, _assertThisInitialized(_this));\n _this.options = options;\n\n if (_this.options.keySeparator === undefined) {\n _this.options.keySeparator = '.';\n }\n\n _this.logger = baseLogger.create('translator');\n return _this;\n }\n\n _createClass(Translator, [{\n key: \"changeLanguage\",\n value: function changeLanguage(lng) {\n if (lng) this.language = lng;\n }\n }, {\n key: \"exists\",\n value: function exists(key) {\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {\n interpolation: {}\n };\n\n if (key === undefined || key === null) {\n return false;\n }\n\n var resolved = this.resolve(key, options);\n return resolved && resolved.res !== undefined;\n }\n }, {\n key: \"extractFromKey\",\n value: function extractFromKey(key, options) {\n var nsSeparator = options.nsSeparator !== undefined ? options.nsSeparator : this.options.nsSeparator;\n if (nsSeparator === undefined) nsSeparator = ':';\n var keySeparator = options.keySeparator !== undefined ? options.keySeparator : this.options.keySeparator;\n var namespaces = options.ns || this.options.defaultNS || [];\n var wouldCheckForNsInKey = nsSeparator && key.indexOf(nsSeparator) > -1;\n var seemsNaturalLanguage = !this.options.userDefinedKeySeparator && !options.keySeparator && !this.options.userDefinedNsSeparator && !options.nsSeparator && !looksLikeObjectPath(key, nsSeparator, keySeparator);\n\n if (wouldCheckForNsInKey && !seemsNaturalLanguage) {\n var m = key.match(this.interpolator.nestingRegexp);\n\n if (m && m.length > 0) {\n return {\n key: key,\n namespaces: namespaces\n };\n }\n\n var parts = key.split(nsSeparator);\n if (nsSeparator !== keySeparator || nsSeparator === keySeparator && this.options.ns.indexOf(parts[0]) > -1) namespaces = parts.shift();\n key = parts.join(keySeparator);\n }\n\n if (typeof namespaces === 'string') namespaces = [namespaces];\n return {\n key: key,\n namespaces: namespaces\n };\n }\n }, {\n key: \"translate\",\n value: function translate(keys, options, lastKey) {\n var _this2 = this;\n\n if (_typeof(options) !== 'object' && this.options.overloadTranslationOptionHandler) {\n options = this.options.overloadTranslationOptionHandler(arguments);\n }\n\n if (!options) options = {};\n if (keys === undefined || keys === null) return '';\n if (!Array.isArray(keys)) keys = [String(keys)];\n var returnDetails = options.returnDetails !== undefined ? options.returnDetails : this.options.returnDetails;\n var keySeparator = options.keySeparator !== undefined ? options.keySeparator : this.options.keySeparator;\n\n var _this$extractFromKey = this.extractFromKey(keys[keys.length - 1], options),\n key = _this$extractFromKey.key,\n namespaces = _this$extractFromKey.namespaces;\n\n var namespace = namespaces[namespaces.length - 1];\n var lng = options.lng || this.language;\n var appendNamespaceToCIMode = options.appendNamespaceToCIMode || this.options.appendNamespaceToCIMode;\n\n if (lng && lng.toLowerCase() === 'cimode') {\n if (appendNamespaceToCIMode) {\n var nsSeparator = options.nsSeparator || this.options.nsSeparator;\n\n if (returnDetails) {\n resolved.res = \"\".concat(namespace).concat(nsSeparator).concat(key);\n return resolved;\n }\n\n return \"\".concat(namespace).concat(nsSeparator).concat(key);\n }\n\n if (returnDetails) {\n resolved.res = key;\n return resolved;\n }\n\n return key;\n }\n\n var resolved = this.resolve(keys, options);\n var res = resolved && resolved.res;\n var resUsedKey = resolved && resolved.usedKey || key;\n var resExactUsedKey = resolved && resolved.exactUsedKey || key;\n var resType = Object.prototype.toString.apply(res);\n var noObject = ['[object Number]', '[object Function]', '[object RegExp]'];\n var joinArrays = options.joinArrays !== undefined ? options.joinArrays : this.options.joinArrays;\n var handleAsObjectInI18nFormat = !this.i18nFormat || this.i18nFormat.handleAsObject;\n var handleAsObject = typeof res !== 'string' && typeof res !== 'boolean' && typeof res !== 'number';\n\n if (handleAsObjectInI18nFormat && res && handleAsObject && noObject.indexOf(resType) < 0 && !(typeof joinArrays === 'string' && resType === '[object Array]')) {\n if (!options.returnObjects && !this.options.returnObjects) {\n if (!this.options.returnedObjectHandler) {\n this.logger.warn('accessing an object - but returnObjects options is not enabled!');\n }\n\n var r = this.options.returnedObjectHandler ? this.options.returnedObjectHandler(resUsedKey, res, _objectSpread$2(_objectSpread$2({}, options), {}, {\n ns: namespaces\n })) : \"key '\".concat(key, \" (\").concat(this.language, \")' returned an object instead of string.\");\n\n if (returnDetails) {\n resolved.res = r;\n return resolved;\n }\n\n return r;\n }\n\n if (keySeparator) {\n var resTypeIsArray = resType === '[object Array]';\n var copy = resTypeIsArray ? [] : {};\n var newKeyToUse = resTypeIsArray ? resExactUsedKey : resUsedKey;\n\n for (var m in res) {\n if (Object.prototype.hasOwnProperty.call(res, m)) {\n var deepKey = \"\".concat(newKeyToUse).concat(keySeparator).concat(m);\n copy[m] = this.translate(deepKey, _objectSpread$2(_objectSpread$2({}, options), {\n joinArrays: false,\n ns: namespaces\n }));\n if (copy[m] === deepKey) copy[m] = res[m];\n }\n }\n\n res = copy;\n }\n } else if (handleAsObjectInI18nFormat && typeof joinArrays === 'string' && resType === '[object Array]') {\n res = res.join(joinArrays);\n if (res) res = this.extendTranslation(res, keys, options, lastKey);\n } else {\n var usedDefault = false;\n var usedKey = false;\n var needsPluralHandling = options.count !== undefined && typeof options.count !== 'string';\n var hasDefaultValue = Translator.hasDefaultValue(options);\n var defaultValueSuffix = needsPluralHandling ? this.pluralResolver.getSuffix(lng, options.count, options) : '';\n var defaultValue = options[\"defaultValue\".concat(defaultValueSuffix)] || options.defaultValue;\n\n if (!this.isValidLookup(res) && hasDefaultValue) {\n usedDefault = true;\n res = defaultValue;\n }\n\n if (!this.isValidLookup(res)) {\n usedKey = true;\n res = key;\n }\n\n var missingKeyNoValueFallbackToKey = options.missingKeyNoValueFallbackToKey || this.options.missingKeyNoValueFallbackToKey;\n var resForMissing = missingKeyNoValueFallbackToKey && usedKey ? undefined : res;\n var updateMissing = hasDefaultValue && defaultValue !== res && this.options.updateMissing;\n\n if (usedKey || usedDefault || updateMissing) {\n this.logger.log(updateMissing ? 'updateKey' : 'missingKey', lng, namespace, key, updateMissing ? defaultValue : res);\n\n if (keySeparator) {\n var fk = this.resolve(key, _objectSpread$2(_objectSpread$2({}, options), {}, {\n keySeparator: false\n }));\n if (fk && fk.res) this.logger.warn('Seems the loaded translations were in flat JSON format instead of nested. Either set keySeparator: false on init or make sure your translations are published in nested format.');\n }\n\n var lngs = [];\n var fallbackLngs = this.languageUtils.getFallbackCodes(this.options.fallbackLng, options.lng || this.language);\n\n if (this.options.saveMissingTo === 'fallback' && fallbackLngs && fallbackLngs[0]) {\n for (var i = 0; i < fallbackLngs.length; i++) {\n lngs.push(fallbackLngs[i]);\n }\n } else if (this.options.saveMissingTo === 'all') {\n lngs = this.languageUtils.toResolveHierarchy(options.lng || this.language);\n } else {\n lngs.push(options.lng || this.language);\n }\n\n var send = function send(l, k, specificDefaultValue) {\n var defaultForMissing = hasDefaultValue && specificDefaultValue !== res ? specificDefaultValue : resForMissing;\n\n if (_this2.options.missingKeyHandler) {\n _this2.options.missingKeyHandler(l, namespace, k, defaultForMissing, updateMissing, options);\n } else if (_this2.backendConnector && _this2.backendConnector.saveMissing) {\n _this2.backendConnector.saveMissing(l, namespace, k, defaultForMissing, updateMissing, options);\n }\n\n _this2.emit('missingKey', l, namespace, k, res);\n };\n\n if (this.options.saveMissing) {\n if (this.options.saveMissingPlurals && needsPluralHandling) {\n lngs.forEach(function (language) {\n _this2.pluralResolver.getSuffixes(language, options).forEach(function (suffix) {\n send([language], key + suffix, options[\"defaultValue\".concat(suffix)] || defaultValue);\n });\n });\n } else {\n send(lngs, key, defaultValue);\n }\n }\n }\n\n res = this.extendTranslation(res, keys, options, resolved, lastKey);\n if (usedKey && res === key && this.options.appendNamespaceToMissingKey) res = \"\".concat(namespace, \":\").concat(key);\n\n if ((usedKey || usedDefault) && this.options.parseMissingKeyHandler) {\n if (this.options.compatibilityAPI !== 'v1') {\n res = this.options.parseMissingKeyHandler(this.options.appendNamespaceToMissingKey ? \"\".concat(namespace, \":\").concat(key) : key, usedDefault ? res : undefined);\n } else {\n res = this.options.parseMissingKeyHandler(res);\n }\n }\n }\n\n if (returnDetails) {\n resolved.res = res;\n return resolved;\n }\n\n return res;\n }\n }, {\n key: \"extendTranslation\",\n value: function extendTranslation(res, key, options, resolved, lastKey) {\n var _this3 = this;\n\n if (this.i18nFormat && this.i18nFormat.parse) {\n res = this.i18nFormat.parse(res, _objectSpread$2(_objectSpread$2({}, this.options.interpolation.defaultVariables), options), resolved.usedLng, resolved.usedNS, resolved.usedKey, {\n resolved: resolved\n });\n } else if (!options.skipInterpolation) {\n if (options.interpolation) this.interpolator.init(_objectSpread$2(_objectSpread$2({}, options), {\n interpolation: _objectSpread$2(_objectSpread$2({}, this.options.interpolation), options.interpolation)\n }));\n var skipOnVariables = typeof res === 'string' && (options && options.interpolation && options.interpolation.skipOnVariables !== undefined ? options.interpolation.skipOnVariables : this.options.interpolation.skipOnVariables);\n var nestBef;\n\n if (skipOnVariables) {\n var nb = res.match(this.interpolator.nestingRegexp);\n nestBef = nb && nb.length;\n }\n\n var data = options.replace && typeof options.replace !== 'string' ? options.replace : options;\n if (this.options.interpolation.defaultVariables) data = _objectSpread$2(_objectSpread$2({}, this.options.interpolation.defaultVariables), data);\n res = this.interpolator.interpolate(res, data, options.lng || this.language, options);\n\n if (skipOnVariables) {\n var na = res.match(this.interpolator.nestingRegexp);\n var nestAft = na && na.length;\n if (nestBef < nestAft) options.nest = false;\n }\n\n if (options.nest !== false) res = this.interpolator.nest(res, function () {\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n if (lastKey && lastKey[0] === args[0] && !options.context) {\n _this3.logger.warn(\"It seems you are nesting recursively key: \".concat(args[0], \" in key: \").concat(key[0]));\n\n return null;\n }\n\n return _this3.translate.apply(_this3, args.concat([key]));\n }, options);\n if (options.interpolation) this.interpolator.reset();\n }\n\n var postProcess = options.postProcess || this.options.postProcess;\n var postProcessorNames = typeof postProcess === 'string' ? [postProcess] : postProcess;\n\n if (res !== undefined && res !== null && postProcessorNames && postProcessorNames.length && options.applyPostProcessor !== false) {\n res = postProcessor.handle(postProcessorNames, res, key, this.options && this.options.postProcessPassResolved ? _objectSpread$2({\n i18nResolved: resolved\n }, options) : options, this);\n }\n\n return res;\n }\n }, {\n key: \"resolve\",\n value: function resolve(keys) {\n var _this4 = this;\n\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n var found;\n var usedKey;\n var exactUsedKey;\n var usedLng;\n var usedNS;\n if (typeof keys === 'string') keys = [keys];\n keys.forEach(function (k) {\n if (_this4.isValidLookup(found)) return;\n\n var extracted = _this4.extractFromKey(k, options);\n\n var key = extracted.key;\n usedKey = key;\n var namespaces = extracted.namespaces;\n if (_this4.options.fallbackNS) namespaces = namespaces.concat(_this4.options.fallbackNS);\n var needsPluralHandling = options.count !== undefined && typeof options.count !== 'string';\n\n var needsZeroSuffixLookup = needsPluralHandling && !options.ordinal && options.count === 0 && _this4.pluralResolver.shouldUseIntlApi();\n\n var needsContextHandling = options.context !== undefined && (typeof options.context === 'string' || typeof options.context === 'number') && options.context !== '';\n var codes = options.lngs ? options.lngs : _this4.languageUtils.toResolveHierarchy(options.lng || _this4.language, options.fallbackLng);\n namespaces.forEach(function (ns) {\n if (_this4.isValidLookup(found)) return;\n usedNS = ns;\n\n if (!checkedLoadedFor[\"\".concat(codes[0], \"-\").concat(ns)] && _this4.utils && _this4.utils.hasLoadedNamespace && !_this4.utils.hasLoadedNamespace(usedNS)) {\n checkedLoadedFor[\"\".concat(codes[0], \"-\").concat(ns)] = true;\n\n _this4.logger.warn(\"key \\\"\".concat(usedKey, \"\\\" for languages \\\"\").concat(codes.join(', '), \"\\\" won't get resolved as namespace \\\"\").concat(usedNS, \"\\\" was not yet loaded\"), 'This means something IS WRONG in your setup. You access the t function before i18next.init / i18next.loadNamespace / i18next.changeLanguage was done. Wait for the callback or Promise to resolve before accessing it!!!');\n }\n\n codes.forEach(function (code) {\n if (_this4.isValidLookup(found)) return;\n usedLng = code;\n var finalKeys = [key];\n\n if (_this4.i18nFormat && _this4.i18nFormat.addLookupKeys) {\n _this4.i18nFormat.addLookupKeys(finalKeys, key, code, ns, options);\n } else {\n var pluralSuffix;\n if (needsPluralHandling) pluralSuffix = _this4.pluralResolver.getSuffix(code, options.count, options);\n var zeroSuffix = \"\".concat(_this4.options.pluralSeparator, \"zero\");\n\n if (needsPluralHandling) {\n finalKeys.push(key + pluralSuffix);\n\n if (needsZeroSuffixLookup) {\n finalKeys.push(key + zeroSuffix);\n }\n }\n\n if (needsContextHandling) {\n var contextKey = \"\".concat(key).concat(_this4.options.contextSeparator).concat(options.context);\n finalKeys.push(contextKey);\n\n if (needsPluralHandling) {\n finalKeys.push(contextKey + pluralSuffix);\n\n if (needsZeroSuffixLookup) {\n finalKeys.push(contextKey + zeroSuffix);\n }\n }\n }\n }\n\n var possibleKey;\n\n while (possibleKey = finalKeys.pop()) {\n if (!_this4.isValidLookup(found)) {\n exactUsedKey = possibleKey;\n found = _this4.getResource(code, ns, possibleKey, options);\n }\n }\n });\n });\n });\n return {\n res: found,\n usedKey: usedKey,\n exactUsedKey: exactUsedKey,\n usedLng: usedLng,\n usedNS: usedNS\n };\n }\n }, {\n key: \"isValidLookup\",\n value: function isValidLookup(res) {\n return res !== undefined && !(!this.options.returnNull && res === null) && !(!this.options.returnEmptyString && res === '');\n }\n }, {\n key: \"getResource\",\n value: function getResource(code, ns, key) {\n var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};\n if (this.i18nFormat && this.i18nFormat.getResource) return this.i18nFormat.getResource(code, ns, key, options);\n return this.resourceStore.getResource(code, ns, key, options);\n }\n }], [{\n key: \"hasDefaultValue\",\n value: function hasDefaultValue(options) {\n var prefix = 'defaultValue';\n\n for (var option in options) {\n if (Object.prototype.hasOwnProperty.call(options, option) && prefix === option.substring(0, prefix.length) && undefined !== options[option]) {\n return true;\n }\n }\n\n return false;\n }\n }]);\n\n return Translator;\n}(EventEmitter);\n\nfunction capitalize(string) {\n return string.charAt(0).toUpperCase() + string.slice(1);\n}\n\nvar LanguageUtil = function () {\n function LanguageUtil(options) {\n _classCallCheck(this, LanguageUtil);\n\n this.options = options;\n this.supportedLngs = this.options.supportedLngs || false;\n this.logger = baseLogger.create('languageUtils');\n }\n\n _createClass(LanguageUtil, [{\n key: \"getScriptPartFromCode\",\n value: function getScriptPartFromCode(code) {\n if (!code || code.indexOf('-') < 0) return null;\n var p = code.split('-');\n if (p.length === 2) return null;\n p.pop();\n if (p[p.length - 1].toLowerCase() === 'x') return null;\n return this.formatLanguageCode(p.join('-'));\n }\n }, {\n key: \"getLanguagePartFromCode\",\n value: function getLanguagePartFromCode(code) {\n if (!code || code.indexOf('-') < 0) return code;\n var p = code.split('-');\n return this.formatLanguageCode(p[0]);\n }\n }, {\n key: \"formatLanguageCode\",\n value: function formatLanguageCode(code) {\n if (typeof code === 'string' && code.indexOf('-') > -1) {\n var specialCases = ['hans', 'hant', 'latn', 'cyrl', 'cans', 'mong', 'arab'];\n var p = code.split('-');\n\n if (this.options.lowerCaseLng) {\n p = p.map(function (part) {\n return part.toLowerCase();\n });\n } else if (p.length === 2) {\n p[0] = p[0].toLowerCase();\n p[1] = p[1].toUpperCase();\n if (specialCases.indexOf(p[1].toLowerCase()) > -1) p[1] = capitalize(p[1].toLowerCase());\n } else if (p.length === 3) {\n p[0] = p[0].toLowerCase();\n if (p[1].length === 2) p[1] = p[1].toUpperCase();\n if (p[0] !== 'sgn' && p[2].length === 2) p[2] = p[2].toUpperCase();\n if (specialCases.indexOf(p[1].toLowerCase()) > -1) p[1] = capitalize(p[1].toLowerCase());\n if (specialCases.indexOf(p[2].toLowerCase()) > -1) p[2] = capitalize(p[2].toLowerCase());\n }\n\n return p.join('-');\n }\n\n return this.options.cleanCode || this.options.lowerCaseLng ? code.toLowerCase() : code;\n }\n }, {\n key: \"isSupportedCode\",\n value: function isSupportedCode(code) {\n if (this.options.load === 'languageOnly' || this.options.nonExplicitSupportedLngs) {\n code = this.getLanguagePartFromCode(code);\n }\n\n return !this.supportedLngs || !this.supportedLngs.length || this.supportedLngs.indexOf(code) > -1;\n }\n }, {\n key: \"getBestMatchFromCodes\",\n value: function getBestMatchFromCodes(codes) {\n var _this = this;\n\n if (!codes) return null;\n var found;\n codes.forEach(function (code) {\n if (found) return;\n\n var cleanedLng = _this.formatLanguageCode(code);\n\n if (!_this.options.supportedLngs || _this.isSupportedCode(cleanedLng)) found = cleanedLng;\n });\n\n if (!found && this.options.supportedLngs) {\n codes.forEach(function (code) {\n if (found) return;\n\n var lngOnly = _this.getLanguagePartFromCode(code);\n\n if (_this.isSupportedCode(lngOnly)) return found = lngOnly;\n found = _this.options.supportedLngs.find(function (supportedLng) {\n if (supportedLng.indexOf(lngOnly) === 0) return supportedLng;\n });\n });\n }\n\n if (!found) found = this.getFallbackCodes(this.options.fallbackLng)[0];\n return found;\n }\n }, {\n key: \"getFallbackCodes\",\n value: function getFallbackCodes(fallbacks, code) {\n if (!fallbacks) return [];\n if (typeof fallbacks === 'function') fallbacks = fallbacks(code);\n if (typeof fallbacks === 'string') fallbacks = [fallbacks];\n if (Object.prototype.toString.apply(fallbacks) === '[object Array]') return fallbacks;\n if (!code) return fallbacks[\"default\"] || [];\n var found = fallbacks[code];\n if (!found) found = fallbacks[this.getScriptPartFromCode(code)];\n if (!found) found = fallbacks[this.formatLanguageCode(code)];\n if (!found) found = fallbacks[this.getLanguagePartFromCode(code)];\n if (!found) found = fallbacks[\"default\"];\n return found || [];\n }\n }, {\n key: \"toResolveHierarchy\",\n value: function toResolveHierarchy(code, fallbackCode) {\n var _this2 = this;\n\n var fallbackCodes = this.getFallbackCodes(fallbackCode || this.options.fallbackLng || [], code);\n var codes = [];\n\n var addCode = function addCode(c) {\n if (!c) return;\n\n if (_this2.isSupportedCode(c)) {\n codes.push(c);\n } else {\n _this2.logger.warn(\"rejecting language code not found in supportedLngs: \".concat(c));\n }\n };\n\n if (typeof code === 'string' && code.indexOf('-') > -1) {\n if (this.options.load !== 'languageOnly') addCode(this.formatLanguageCode(code));\n if (this.options.load !== 'languageOnly' && this.options.load !== 'currentOnly') addCode(this.getScriptPartFromCode(code));\n if (this.options.load !== 'currentOnly') addCode(this.getLanguagePartFromCode(code));\n } else if (typeof code === 'string') {\n addCode(this.formatLanguageCode(code));\n }\n\n fallbackCodes.forEach(function (fc) {\n if (codes.indexOf(fc) < 0) addCode(_this2.formatLanguageCode(fc));\n });\n return codes;\n }\n }]);\n\n return LanguageUtil;\n}();\n\nvar sets = [{\n lngs: ['ach', 'ak', 'am', 'arn', 'br', 'fil', 'gun', 'ln', 'mfe', 'mg', 'mi', 'oc', 'pt', 'pt-BR', 'tg', 'tl', 'ti', 'tr', 'uz', 'wa'],\n nr: [1, 2],\n fc: 1\n}, {\n lngs: ['af', 'an', 'ast', 'az', 'bg', 'bn', 'ca', 'da', 'de', 'dev', 'el', 'en', 'eo', 'es', 'et', 'eu', 'fi', 'fo', 'fur', 'fy', 'gl', 'gu', 'ha', 'hi', 'hu', 'hy', 'ia', 'it', 'kk', 'kn', 'ku', 'lb', 'mai', 'ml', 'mn', 'mr', 'nah', 'nap', 'nb', 'ne', 'nl', 'nn', 'no', 'nso', 'pa', 'pap', 'pms', 'ps', 'pt-PT', 'rm', 'sco', 'se', 'si', 'so', 'son', 'sq', 'sv', 'sw', 'ta', 'te', 'tk', 'ur', 'yo'],\n nr: [1, 2],\n fc: 2\n}, {\n lngs: ['ay', 'bo', 'cgg', 'fa', 'ht', 'id', 'ja', 'jbo', 'ka', 'km', 'ko', 'ky', 'lo', 'ms', 'sah', 'su', 'th', 'tt', 'ug', 'vi', 'wo', 'zh'],\n nr: [1],\n fc: 3\n}, {\n lngs: ['be', 'bs', 'cnr', 'dz', 'hr', 'ru', 'sr', 'uk'],\n nr: [1, 2, 5],\n fc: 4\n}, {\n lngs: ['ar'],\n nr: [0, 1, 2, 3, 11, 100],\n fc: 5\n}, {\n lngs: ['cs', 'sk'],\n nr: [1, 2, 5],\n fc: 6\n}, {\n lngs: ['csb', 'pl'],\n nr: [1, 2, 5],\n fc: 7\n}, {\n lngs: ['cy'],\n nr: [1, 2, 3, 8],\n fc: 8\n}, {\n lngs: ['fr'],\n nr: [1, 2],\n fc: 9\n}, {\n lngs: ['ga'],\n nr: [1, 2, 3, 7, 11],\n fc: 10\n}, {\n lngs: ['gd'],\n nr: [1, 2, 3, 20],\n fc: 11\n}, {\n lngs: ['is'],\n nr: [1, 2],\n fc: 12\n}, {\n lngs: ['jv'],\n nr: [0, 1],\n fc: 13\n}, {\n lngs: ['kw'],\n nr: [1, 2, 3, 4],\n fc: 14\n}, {\n lngs: ['lt'],\n nr: [1, 2, 10],\n fc: 15\n}, {\n lngs: ['lv'],\n nr: [1, 2, 0],\n fc: 16\n}, {\n lngs: ['mk'],\n nr: [1, 2],\n fc: 17\n}, {\n lngs: ['mnk'],\n nr: [0, 1, 2],\n fc: 18\n}, {\n lngs: ['mt'],\n nr: [1, 2, 11, 20],\n fc: 19\n}, {\n lngs: ['or'],\n nr: [2, 1],\n fc: 2\n}, {\n lngs: ['ro'],\n nr: [1, 2, 20],\n fc: 20\n}, {\n lngs: ['sl'],\n nr: [5, 1, 2, 3],\n fc: 21\n}, {\n lngs: ['he', 'iw'],\n nr: [1, 2, 20, 21],\n fc: 22\n}];\nvar _rulesPluralsTypes = {\n 1: function _(n) {\n return Number(n > 1);\n },\n 2: function _(n) {\n return Number(n != 1);\n },\n 3: function _(n) {\n return 0;\n },\n 4: function _(n) {\n return Number(n % 10 == 1 && n % 100 != 11 ? 0 : n % 10 >= 2 && n % 10 <= 4 && (n % 100 < 10 || n % 100 >= 20) ? 1 : 2);\n },\n 5: function _(n) {\n return Number(n == 0 ? 0 : n == 1 ? 1 : n == 2 ? 2 : n % 100 >= 3 && n % 100 <= 10 ? 3 : n % 100 >= 11 ? 4 : 5);\n },\n 6: function _(n) {\n return Number(n == 1 ? 0 : n >= 2 && n <= 4 ? 1 : 2);\n },\n 7: function _(n) {\n return Number(n == 1 ? 0 : n % 10 >= 2 && n % 10 <= 4 && (n % 100 < 10 || n % 100 >= 20) ? 1 : 2);\n },\n 8: function _(n) {\n return Number(n == 1 ? 0 : n == 2 ? 1 : n != 8 && n != 11 ? 2 : 3);\n },\n 9: function _(n) {\n return Number(n >= 2);\n },\n 10: function _(n) {\n return Number(n == 1 ? 0 : n == 2 ? 1 : n < 7 ? 2 : n < 11 ? 3 : 4);\n },\n 11: function _(n) {\n return Number(n == 1 || n == 11 ? 0 : n == 2 || n == 12 ? 1 : n > 2 && n < 20 ? 2 : 3);\n },\n 12: function _(n) {\n return Number(n % 10 != 1 || n % 100 == 11);\n },\n 13: function _(n) {\n return Number(n !== 0);\n },\n 14: function _(n) {\n return Number(n == 1 ? 0 : n == 2 ? 1 : n == 3 ? 2 : 3);\n },\n 15: function _(n) {\n return Number(n % 10 == 1 && n % 100 != 11 ? 0 : n % 10 >= 2 && (n % 100 < 10 || n % 100 >= 20) ? 1 : 2);\n },\n 16: function _(n) {\n return Number(n % 10 == 1 && n % 100 != 11 ? 0 : n !== 0 ? 1 : 2);\n },\n 17: function _(n) {\n return Number(n == 1 || n % 10 == 1 && n % 100 != 11 ? 0 : 1);\n },\n 18: function _(n) {\n return Number(n == 0 ? 0 : n == 1 ? 1 : 2);\n },\n 19: function _(n) {\n return Number(n == 1 ? 0 : n == 0 || n % 100 > 1 && n % 100 < 11 ? 1 : n % 100 > 10 && n % 100 < 20 ? 2 : 3);\n },\n 20: function _(n) {\n return Number(n == 1 ? 0 : n == 0 || n % 100 > 0 && n % 100 < 20 ? 1 : 2);\n },\n 21: function _(n) {\n return Number(n % 100 == 1 ? 1 : n % 100 == 2 ? 2 : n % 100 == 3 || n % 100 == 4 ? 3 : 0);\n },\n 22: function _(n) {\n return Number(n == 1 ? 0 : n == 2 ? 1 : (n < 0 || n > 10) && n % 10 == 0 ? 2 : 3);\n }\n};\nvar deprecatedJsonVersions = ['v1', 'v2', 'v3'];\nvar suffixesOrder = {\n zero: 0,\n one: 1,\n two: 2,\n few: 3,\n many: 4,\n other: 5\n};\n\nfunction createRules() {\n var rules = {};\n sets.forEach(function (set) {\n set.lngs.forEach(function (l) {\n rules[l] = {\n numbers: set.nr,\n plurals: _rulesPluralsTypes[set.fc]\n };\n });\n });\n return rules;\n}\n\nvar PluralResolver = function () {\n function PluralResolver(languageUtils) {\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n\n _classCallCheck(this, PluralResolver);\n\n this.languageUtils = languageUtils;\n this.options = options;\n this.logger = baseLogger.create('pluralResolver');\n\n if ((!this.options.compatibilityJSON || this.options.compatibilityJSON === 'v4') && (typeof Intl === 'undefined' || !Intl.PluralRules)) {\n this.options.compatibilityJSON = 'v3';\n this.logger.error('Your environment seems not to be Intl API compatible, use an Intl.PluralRules polyfill. Will fallback to the compatibilityJSON v3 format handling.');\n }\n\n this.rules = createRules();\n }\n\n _createClass(PluralResolver, [{\n key: \"addRule\",\n value: function addRule(lng, obj) {\n this.rules[lng] = obj;\n }\n }, {\n key: \"getRule\",\n value: function getRule(code) {\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n\n if (this.shouldUseIntlApi()) {\n try {\n return new Intl.PluralRules(code, {\n type: options.ordinal ? 'ordinal' : 'cardinal'\n });\n } catch (_unused) {\n return;\n }\n }\n\n return this.rules[code] || this.rules[this.languageUtils.getLanguagePartFromCode(code)];\n }\n }, {\n key: \"needsPlural\",\n value: function needsPlural(code) {\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n var rule = this.getRule(code, options);\n\n if (this.shouldUseIntlApi()) {\n return rule && rule.resolvedOptions().pluralCategories.length > 1;\n }\n\n return rule && rule.numbers.length > 1;\n }\n }, {\n key: \"getPluralFormsOfKey\",\n value: function getPluralFormsOfKey(code, key) {\n var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};\n return this.getSuffixes(code, options).map(function (suffix) {\n return \"\".concat(key).concat(suffix);\n });\n }\n }, {\n key: \"getSuffixes\",\n value: function getSuffixes(code) {\n var _this = this;\n\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n var rule = this.getRule(code, options);\n\n if (!rule) {\n return [];\n }\n\n if (this.shouldUseIntlApi()) {\n return rule.resolvedOptions().pluralCategories.sort(function (pluralCategory1, pluralCategory2) {\n return suffixesOrder[pluralCategory1] - suffixesOrder[pluralCategory2];\n }).map(function (pluralCategory) {\n return \"\".concat(_this.options.prepend).concat(pluralCategory);\n });\n }\n\n return rule.numbers.map(function (number) {\n return _this.getSuffix(code, number, options);\n });\n }\n }, {\n key: \"getSuffix\",\n value: function getSuffix(code, count) {\n var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};\n var rule = this.getRule(code, options);\n\n if (rule) {\n if (this.shouldUseIntlApi()) {\n return \"\".concat(this.options.prepend).concat(rule.select(count));\n }\n\n return this.getSuffixRetroCompatible(rule, count);\n }\n\n this.logger.warn(\"no plural rule found for: \".concat(code));\n return '';\n }\n }, {\n key: \"getSuffixRetroCompatible\",\n value: function getSuffixRetroCompatible(rule, count) {\n var _this2 = this;\n\n var idx = rule.noAbs ? rule.plurals(count) : rule.plurals(Math.abs(count));\n var suffix = rule.numbers[idx];\n\n if (this.options.simplifyPluralSuffix && rule.numbers.length === 2 && rule.numbers[0] === 1) {\n if (suffix === 2) {\n suffix = 'plural';\n } else if (suffix === 1) {\n suffix = '';\n }\n }\n\n var returnSuffix = function returnSuffix() {\n return _this2.options.prepend && suffix.toString() ? _this2.options.prepend + suffix.toString() : suffix.toString();\n };\n\n if (this.options.compatibilityJSON === 'v1') {\n if (suffix === 1) return '';\n if (typeof suffix === 'number') return \"_plural_\".concat(suffix.toString());\n return returnSuffix();\n } else if (this.options.compatibilityJSON === 'v2') {\n return returnSuffix();\n } else if (this.options.simplifyPluralSuffix && rule.numbers.length === 2 && rule.numbers[0] === 1) {\n return returnSuffix();\n }\n\n return this.options.prepend && idx.toString() ? this.options.prepend + idx.toString() : idx.toString();\n }\n }, {\n key: \"shouldUseIntlApi\",\n value: function shouldUseIntlApi() {\n return !deprecatedJsonVersions.includes(this.options.compatibilityJSON);\n }\n }]);\n\n return PluralResolver;\n}();\n\nfunction ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$3(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nvar Interpolator = function () {\n function Interpolator() {\n var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n\n _classCallCheck(this, Interpolator);\n\n this.logger = baseLogger.create('interpolator');\n this.options = options;\n\n this.format = options.interpolation && options.interpolation.format || function (value) {\n return value;\n };\n\n this.init(options);\n }\n\n _createClass(Interpolator, [{\n key: \"init\",\n value: function init() {\n var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n if (!options.interpolation) options.interpolation = {\n escapeValue: true\n };\n var iOpts = options.interpolation;\n this.escape = iOpts.escape !== undefined ? iOpts.escape : escape;\n this.escapeValue = iOpts.escapeValue !== undefined ? iOpts.escapeValue : true;\n this.useRawValueToEscape = iOpts.useRawValueToEscape !== undefined ? iOpts.useRawValueToEscape : false;\n this.prefix = iOpts.prefix ? regexEscape(iOpts.prefix) : iOpts.prefixEscaped || '{{';\n this.suffix = iOpts.suffix ? regexEscape(iOpts.suffix) : iOpts.suffixEscaped || '}}';\n this.formatSeparator = iOpts.formatSeparator ? iOpts.formatSeparator : iOpts.formatSeparator || ',';\n this.unescapePrefix = iOpts.unescapeSuffix ? '' : iOpts.unescapePrefix || '-';\n this.unescapeSuffix = this.unescapePrefix ? '' : iOpts.unescapeSuffix || '';\n this.nestingPrefix = iOpts.nestingPrefix ? regexEscape(iOpts.nestingPrefix) : iOpts.nestingPrefixEscaped || regexEscape('$t(');\n this.nestingSuffix = iOpts.nestingSuffix ? regexEscape(iOpts.nestingSuffix) : iOpts.nestingSuffixEscaped || regexEscape(')');\n this.nestingOptionsSeparator = iOpts.nestingOptionsSeparator ? iOpts.nestingOptionsSeparator : iOpts.nestingOptionsSeparator || ',';\n this.maxReplaces = iOpts.maxReplaces ? iOpts.maxReplaces : 1000;\n this.alwaysFormat = iOpts.alwaysFormat !== undefined ? iOpts.alwaysFormat : false;\n this.resetRegExp();\n }\n }, {\n key: \"reset\",\n value: function reset() {\n if (this.options) this.init(this.options);\n }\n }, {\n key: \"resetRegExp\",\n value: function resetRegExp() {\n var regexpStr = \"\".concat(this.prefix, \"(.+?)\").concat(this.suffix);\n this.regexp = new RegExp(regexpStr, 'g');\n var regexpUnescapeStr = \"\".concat(this.prefix).concat(this.unescapePrefix, \"(.+?)\").concat(this.unescapeSuffix).concat(this.suffix);\n this.regexpUnescape = new RegExp(regexpUnescapeStr, 'g');\n var nestingRegexpStr = \"\".concat(this.nestingPrefix, \"(.+?)\").concat(this.nestingSuffix);\n this.nestingRegexp = new RegExp(nestingRegexpStr, 'g');\n }\n }, {\n key: \"interpolate\",\n value: function interpolate(str, data, lng, options) {\n var _this = this;\n\n var match;\n var value;\n var replaces;\n var defaultData = this.options && this.options.interpolation && this.options.interpolation.defaultVariables || {};\n\n function regexSafe(val) {\n return val.replace(/\\$/g, '$$$$');\n }\n\n var handleFormat = function handleFormat(key) {\n if (key.indexOf(_this.formatSeparator) < 0) {\n var path = getPathWithDefaults(data, defaultData, key);\n return _this.alwaysFormat ? _this.format(path, undefined, lng, _objectSpread$3(_objectSpread$3(_objectSpread$3({}, options), data), {}, {\n interpolationkey: key\n })) : path;\n }\n\n var p = key.split(_this.formatSeparator);\n var k = p.shift().trim();\n var f = p.join(_this.formatSeparator).trim();\n return _this.format(getPathWithDefaults(data, defaultData, k), f, lng, _objectSpread$3(_objectSpread$3(_objectSpread$3({}, options), data), {}, {\n interpolationkey: k\n }));\n };\n\n this.resetRegExp();\n var missingInterpolationHandler = options && options.missingInterpolationHandler || this.options.missingInterpolationHandler;\n var skipOnVariables = options && options.interpolation && options.interpolation.skipOnVariables !== undefined ? options.interpolation.skipOnVariables : this.options.interpolation.skipOnVariables;\n var todos = [{\n regex: this.regexpUnescape,\n safeValue: function safeValue(val) {\n return regexSafe(val);\n }\n }, {\n regex: this.regexp,\n safeValue: function safeValue(val) {\n return _this.escapeValue ? regexSafe(_this.escape(val)) : regexSafe(val);\n }\n }];\n todos.forEach(function (todo) {\n replaces = 0;\n\n while (match = todo.regex.exec(str)) {\n var matchedVar = match[1].trim();\n value = handleFormat(matchedVar);\n\n if (value === undefined) {\n if (typeof missingInterpolationHandler === 'function') {\n var temp = missingInterpolationHandler(str, match, options);\n value = typeof temp === 'string' ? temp : '';\n } else if (options && options.hasOwnProperty(matchedVar)) {\n value = '';\n } else if (skipOnVariables) {\n value = match[0];\n continue;\n } else {\n _this.logger.warn(\"missed to pass in variable \".concat(matchedVar, \" for interpolating \").concat(str));\n\n value = '';\n }\n } else if (typeof value !== 'string' && !_this.useRawValueToEscape) {\n value = makeString(value);\n }\n\n var safeValue = todo.safeValue(value);\n str = str.replace(match[0], safeValue);\n\n if (skipOnVariables) {\n todo.regex.lastIndex += value.length;\n todo.regex.lastIndex -= match[0].length;\n } else {\n todo.regex.lastIndex = 0;\n }\n\n replaces++;\n\n if (replaces >= _this.maxReplaces) {\n break;\n }\n }\n });\n return str;\n }\n }, {\n key: \"nest\",\n value: function nest(str, fc) {\n var _this2 = this;\n\n var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};\n var match;\n var value;\n\n var clonedOptions = _objectSpread$3({}, options);\n\n clonedOptions.applyPostProcessor = false;\n delete clonedOptions.defaultValue;\n\n function handleHasOptions(key, inheritedOptions) {\n var sep = this.nestingOptionsSeparator;\n if (key.indexOf(sep) < 0) return key;\n var c = key.split(new RegExp(\"\".concat(sep, \"[ ]*{\")));\n var optionsString = \"{\".concat(c[1]);\n key = c[0];\n optionsString = this.interpolate(optionsString, clonedOptions);\n var matchedSingleQuotes = optionsString.match(/'/g);\n var matchedDoubleQuotes = optionsString.match(/\"/g);\n\n if (matchedSingleQuotes && matchedSingleQuotes.length % 2 === 0 && !matchedDoubleQuotes || matchedDoubleQuotes.length % 2 !== 0) {\n optionsString = optionsString.replace(/'/g, '\"');\n }\n\n try {\n clonedOptions = JSON.parse(optionsString);\n if (inheritedOptions) clonedOptions = _objectSpread$3(_objectSpread$3({}, inheritedOptions), clonedOptions);\n } catch (e) {\n this.logger.warn(\"failed parsing options string in nesting for key \".concat(key), e);\n return \"\".concat(key).concat(sep).concat(optionsString);\n }\n\n delete clonedOptions.defaultValue;\n return key;\n }\n\n while (match = this.nestingRegexp.exec(str)) {\n var formatters = [];\n var doReduce = false;\n\n if (match[0].indexOf(this.formatSeparator) !== -1 && !/{.*}/.test(match[1])) {\n var r = match[1].split(this.formatSeparator).map(function (elem) {\n return elem.trim();\n });\n match[1] = r.shift();\n formatters = r;\n doReduce = true;\n }\n\n value = fc(handleHasOptions.call(this, match[1].trim(), clonedOptions), clonedOptions);\n if (value && match[0] === str && typeof value !== 'string') return value;\n if (typeof value !== 'string') value = makeString(value);\n\n if (!value) {\n this.logger.warn(\"missed to resolve \".concat(match[1], \" for nesting \").concat(str));\n value = '';\n }\n\n if (doReduce) {\n value = formatters.reduce(function (v, f) {\n return _this2.format(v, f, options.lng, _objectSpread$3(_objectSpread$3({}, options), {}, {\n interpolationkey: match[1].trim()\n }));\n }, value.trim());\n }\n\n str = str.replace(match[0], value);\n this.regexp.lastIndex = 0;\n }\n\n return str;\n }\n }]);\n\n return Interpolator;\n}();\n\nfunction ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$4(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nfunction parseFormatStr(formatStr) {\n var formatName = formatStr.toLowerCase().trim();\n var formatOptions = {};\n\n if (formatStr.indexOf('(') > -1) {\n var p = formatStr.split('(');\n formatName = p[0].toLowerCase().trim();\n var optStr = p[1].substring(0, p[1].length - 1);\n\n if (formatName === 'currency' && optStr.indexOf(':') < 0) {\n if (!formatOptions.currency) formatOptions.currency = optStr.trim();\n } else if (formatName === 'relativetime' && optStr.indexOf(':') < 0) {\n if (!formatOptions.range) formatOptions.range = optStr.trim();\n } else {\n var opts = optStr.split(';');\n opts.forEach(function (opt) {\n if (!opt) return;\n\n var _opt$split = opt.split(':'),\n _opt$split2 = _toArray(_opt$split),\n key = _opt$split2[0],\n rest = _opt$split2.slice(1);\n\n var val = rest.join(':').trim().replace(/^'+|'+$/g, '');\n if (!formatOptions[key.trim()]) formatOptions[key.trim()] = val;\n if (val === 'false') formatOptions[key.trim()] = false;\n if (val === 'true') formatOptions[key.trim()] = true;\n if (!isNaN(val)) formatOptions[key.trim()] = parseInt(val, 10);\n });\n }\n }\n\n return {\n formatName: formatName,\n formatOptions: formatOptions\n };\n}\n\nfunction createCachedFormatter(fn) {\n var cache = {};\n return function invokeFormatter(val, lng, options) {\n var key = lng + JSON.stringify(options);\n var formatter = cache[key];\n\n if (!formatter) {\n formatter = fn(lng, options);\n cache[key] = formatter;\n }\n\n return formatter(val);\n };\n}\n\nvar Formatter = function () {\n function Formatter() {\n var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n\n _classCallCheck(this, Formatter);\n\n this.logger = baseLogger.create('formatter');\n this.options = options;\n this.formats = {\n number: createCachedFormatter(function (lng, options) {\n var formatter = new Intl.NumberFormat(lng, options);\n return function (val) {\n return formatter.format(val);\n };\n }),\n currency: createCachedFormatter(function (lng, options) {\n var formatter = new Intl.NumberFormat(lng, _objectSpread$4(_objectSpread$4({}, options), {}, {\n style: 'currency'\n }));\n return function (val) {\n return formatter.format(val);\n };\n }),\n datetime: createCachedFormatter(function (lng, options) {\n var formatter = new Intl.DateTimeFormat(lng, _objectSpread$4({}, options));\n return function (val) {\n return formatter.format(val);\n };\n }),\n relativetime: createCachedFormatter(function (lng, options) {\n var formatter = new Intl.RelativeTimeFormat(lng, _objectSpread$4({}, options));\n return function (val) {\n return formatter.format(val, options.range || 'day');\n };\n }),\n list: createCachedFormatter(function (lng, options) {\n var formatter = new Intl.ListFormat(lng, _objectSpread$4({}, options));\n return function (val) {\n return formatter.format(val);\n };\n })\n };\n this.init(options);\n }\n\n _createClass(Formatter, [{\n key: \"init\",\n value: function init(services) {\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {\n interpolation: {}\n };\n var iOpts = options.interpolation;\n this.formatSeparator = iOpts.formatSeparator ? iOpts.formatSeparator : iOpts.formatSeparator || ',';\n }\n }, {\n key: \"add\",\n value: function add(name, fc) {\n this.formats[name.toLowerCase().trim()] = fc;\n }\n }, {\n key: \"addCached\",\n value: function addCached(name, fc) {\n this.formats[name.toLowerCase().trim()] = createCachedFormatter(fc);\n }\n }, {\n key: \"format\",\n value: function format(value, _format, lng, options) {\n var _this = this;\n\n var formats = _format.split(this.formatSeparator);\n\n var result = formats.reduce(function (mem, f) {\n var _parseFormatStr = parseFormatStr(f),\n formatName = _parseFormatStr.formatName,\n formatOptions = _parseFormatStr.formatOptions;\n\n if (_this.formats[formatName]) {\n var formatted = mem;\n\n try {\n var valOptions = options && options.formatParams && options.formatParams[options.interpolationkey] || {};\n var l = valOptions.locale || valOptions.lng || options.locale || options.lng || lng;\n formatted = _this.formats[formatName](mem, l, _objectSpread$4(_objectSpread$4(_objectSpread$4({}, formatOptions), options), valOptions));\n } catch (error) {\n _this.logger.warn(error);\n }\n\n return formatted;\n } else {\n _this.logger.warn(\"there was no format function for \".concat(formatName));\n }\n\n return mem;\n }, value);\n return result;\n }\n }]);\n\n return Formatter;\n}();\n\nfunction ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$5(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nfunction _createSuper$2(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\n\nfunction _isNativeReflectConstruct$2() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\n\nfunction removePending(q, name) {\n if (q.pending[name] !== undefined) {\n delete q.pending[name];\n q.pendingCount--;\n }\n}\n\nvar Connector = function (_EventEmitter) {\n _inherits(Connector, _EventEmitter);\n\n var _super = _createSuper$2(Connector);\n\n function Connector(backend, store, services) {\n var _this;\n\n var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};\n\n _classCallCheck(this, Connector);\n\n _this = _super.call(this);\n\n if (isIE10) {\n EventEmitter.call(_assertThisInitialized(_this));\n }\n\n _this.backend = backend;\n _this.store = store;\n _this.services = services;\n _this.languageUtils = services.languageUtils;\n _this.options = options;\n _this.logger = baseLogger.create('backendConnector');\n _this.waitingReads = [];\n _this.maxParallelReads = options.maxParallelReads || 10;\n _this.readingCalls = 0;\n _this.maxRetries = options.maxRetries >= 0 ? options.maxRetries : 5;\n _this.retryTimeout = options.retryTimeout >= 1 ? options.retryTimeout : 350;\n _this.state = {};\n _this.queue = [];\n\n if (_this.backend && _this.backend.init) {\n _this.backend.init(services, options.backend, options);\n }\n\n return _this;\n }\n\n _createClass(Connector, [{\n key: \"queueLoad\",\n value: function queueLoad(languages, namespaces, options, callback) {\n var _this2 = this;\n\n var toLoad = {};\n var pending = {};\n var toLoadLanguages = {};\n var toLoadNamespaces = {};\n languages.forEach(function (lng) {\n var hasAllNamespaces = true;\n namespaces.forEach(function (ns) {\n var name = \"\".concat(lng, \"|\").concat(ns);\n\n if (!options.reload && _this2.store.hasResourceBundle(lng, ns)) {\n _this2.state[name] = 2;\n } else if (_this2.state[name] < 0) ; else if (_this2.state[name] === 1) {\n if (pending[name] === undefined) pending[name] = true;\n } else {\n _this2.state[name] = 1;\n hasAllNamespaces = false;\n if (pending[name] === undefined) pending[name] = true;\n if (toLoad[name] === undefined) toLoad[name] = true;\n if (toLoadNamespaces[ns] === undefined) toLoadNamespaces[ns] = true;\n }\n });\n if (!hasAllNamespaces) toLoadLanguages[lng] = true;\n });\n\n if (Object.keys(toLoad).length || Object.keys(pending).length) {\n this.queue.push({\n pending: pending,\n pendingCount: Object.keys(pending).length,\n loaded: {},\n errors: [],\n callback: callback\n });\n }\n\n return {\n toLoad: Object.keys(toLoad),\n pending: Object.keys(pending),\n toLoadLanguages: Object.keys(toLoadLanguages),\n toLoadNamespaces: Object.keys(toLoadNamespaces)\n };\n }\n }, {\n key: \"loaded\",\n value: function loaded(name, err, data) {\n var s = name.split('|');\n var lng = s[0];\n var ns = s[1];\n if (err) this.emit('failedLoading', lng, ns, err);\n\n if (data) {\n this.store.addResourceBundle(lng, ns, data);\n }\n\n this.state[name] = err ? -1 : 2;\n var loaded = {};\n this.queue.forEach(function (q) {\n pushPath(q.loaded, [lng], ns);\n removePending(q, name);\n if (err) q.errors.push(err);\n\n if (q.pendingCount === 0 && !q.done) {\n Object.keys(q.loaded).forEach(function (l) {\n if (!loaded[l]) loaded[l] = {};\n var loadedKeys = q.loaded[l];\n\n if (loadedKeys.length) {\n loadedKeys.forEach(function (ns) {\n if (loaded[l][ns] === undefined) loaded[l][ns] = true;\n });\n }\n });\n q.done = true;\n\n if (q.errors.length) {\n q.callback(q.errors);\n } else {\n q.callback();\n }\n }\n });\n this.emit('loaded', loaded);\n this.queue = this.queue.filter(function (q) {\n return !q.done;\n });\n }\n }, {\n key: \"read\",\n value: function read(lng, ns, fcName) {\n var _this3 = this;\n\n var tried = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;\n var wait = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : this.retryTimeout;\n var callback = arguments.length > 5 ? arguments[5] : undefined;\n if (!lng.length) return callback(null, {});\n\n if (this.readingCalls >= this.maxParallelReads) {\n this.waitingReads.push({\n lng: lng,\n ns: ns,\n fcName: fcName,\n tried: tried,\n wait: wait,\n callback: callback\n });\n return;\n }\n\n this.readingCalls++;\n return this.backend[fcName](lng, ns, function (err, data) {\n _this3.readingCalls--;\n\n if (_this3.waitingReads.length > 0) {\n var next = _this3.waitingReads.shift();\n\n _this3.read(next.lng, next.ns, next.fcName, next.tried, next.wait, next.callback);\n }\n\n if (err && data && tried < _this3.maxRetries) {\n setTimeout(function () {\n _this3.read.call(_this3, lng, ns, fcName, tried + 1, wait * 2, callback);\n }, wait);\n return;\n }\n\n callback(err, data);\n });\n }\n }, {\n key: \"prepareLoading\",\n value: function prepareLoading(languages, namespaces) {\n var _this4 = this;\n\n var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};\n var callback = arguments.length > 3 ? arguments[3] : undefined;\n\n if (!this.backend) {\n this.logger.warn('No backend was added via i18next.use. Will not load resources.');\n return callback && callback();\n }\n\n if (typeof languages === 'string') languages = this.languageUtils.toResolveHierarchy(languages);\n if (typeof namespaces === 'string') namespaces = [namespaces];\n var toLoad = this.queueLoad(languages, namespaces, options, callback);\n\n if (!toLoad.toLoad.length) {\n if (!toLoad.pending.length) callback();\n return null;\n }\n\n toLoad.toLoad.forEach(function (name) {\n _this4.loadOne(name);\n });\n }\n }, {\n key: \"load\",\n value: function load(languages, namespaces, callback) {\n this.prepareLoading(languages, namespaces, {}, callback);\n }\n }, {\n key: \"reload\",\n value: function reload(languages, namespaces, callback) {\n this.prepareLoading(languages, namespaces, {\n reload: true\n }, callback);\n }\n }, {\n key: \"loadOne\",\n value: function loadOne(name) {\n var _this5 = this;\n\n var prefix = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';\n var s = name.split('|');\n var lng = s[0];\n var ns = s[1];\n this.read(lng, ns, 'read', undefined, undefined, function (err, data) {\n if (err) _this5.logger.warn(\"\".concat(prefix, \"loading namespace \").concat(ns, \" for language \").concat(lng, \" failed\"), err);\n if (!err && data) _this5.logger.log(\"\".concat(prefix, \"loaded namespace \").concat(ns, \" for language \").concat(lng), data);\n\n _this5.loaded(name, err, data);\n });\n }\n }, {\n key: \"saveMissing\",\n value: function saveMissing(languages, namespace, key, fallbackValue, isUpdate) {\n var options = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : {};\n\n if (this.services.utils && this.services.utils.hasLoadedNamespace && !this.services.utils.hasLoadedNamespace(namespace)) {\n this.logger.warn(\"did not save key \\\"\".concat(key, \"\\\" as the namespace \\\"\").concat(namespace, \"\\\" was not yet loaded\"), 'This means something IS WRONG in your setup. You access the t function before i18next.init / i18next.loadNamespace / i18next.changeLanguage was done. Wait for the callback or Promise to resolve before accessing it!!!');\n return;\n }\n\n if (key === undefined || key === null || key === '') return;\n\n if (this.backend && this.backend.create) {\n this.backend.create(languages, namespace, key, fallbackValue, null, _objectSpread$5(_objectSpread$5({}, options), {}, {\n isUpdate: isUpdate\n }));\n }\n\n if (!languages || !languages[0]) return;\n this.store.addResource(languages[0], namespace, key, fallbackValue);\n }\n }]);\n\n return Connector;\n}(EventEmitter);\n\nfunction get() {\n return {\n debug: false,\n initImmediate: true,\n ns: ['translation'],\n defaultNS: ['translation'],\n fallbackLng: ['dev'],\n fallbackNS: false,\n supportedLngs: false,\n nonExplicitSupportedLngs: false,\n load: 'all',\n preload: false,\n simplifyPluralSuffix: true,\n keySeparator: '.',\n nsSeparator: ':',\n pluralSeparator: '_',\n contextSeparator: '_',\n partialBundledLanguages: false,\n saveMissing: false,\n updateMissing: false,\n saveMissingTo: 'fallback',\n saveMissingPlurals: true,\n missingKeyHandler: false,\n missingInterpolationHandler: false,\n postProcess: false,\n postProcessPassResolved: false,\n returnNull: true,\n returnEmptyString: true,\n returnObjects: false,\n joinArrays: false,\n returnedObjectHandler: false,\n parseMissingKeyHandler: false,\n appendNamespaceToMissingKey: false,\n appendNamespaceToCIMode: false,\n overloadTranslationOptionHandler: function handle(args) {\n var ret = {};\n if (_typeof(args[1]) === 'object') ret = args[1];\n if (typeof args[1] === 'string') ret.defaultValue = args[1];\n if (typeof args[2] === 'string') ret.tDescription = args[2];\n\n if (_typeof(args[2]) === 'object' || _typeof(args[3]) === 'object') {\n var options = args[3] || args[2];\n Object.keys(options).forEach(function (key) {\n ret[key] = options[key];\n });\n }\n\n return ret;\n },\n interpolation: {\n escapeValue: true,\n format: function format(value, _format, lng, options) {\n return value;\n },\n prefix: '{{',\n suffix: '}}',\n formatSeparator: ',',\n unescapePrefix: '-',\n nestingPrefix: '$t(',\n nestingSuffix: ')',\n nestingOptionsSeparator: ',',\n maxReplaces: 1000,\n skipOnVariables: true\n }\n };\n}\nfunction transformOptions(options) {\n if (typeof options.ns === 'string') options.ns = [options.ns];\n if (typeof options.fallbackLng === 'string') options.fallbackLng = [options.fallbackLng];\n if (typeof options.fallbackNS === 'string') options.fallbackNS = [options.fallbackNS];\n\n if (options.supportedLngs && options.supportedLngs.indexOf('cimode') < 0) {\n options.supportedLngs = options.supportedLngs.concat(['cimode']);\n }\n\n return options;\n}\n\nfunction ownKeys$6(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread$6(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$6(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$6(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nfunction _createSuper$3(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$3(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\n\nfunction _isNativeReflectConstruct$3() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\n\nfunction noop() {}\n\nfunction bindMemberFunctions(inst) {\n var mems = Object.getOwnPropertyNames(Object.getPrototypeOf(inst));\n mems.forEach(function (mem) {\n if (typeof inst[mem] === 'function') {\n inst[mem] = inst[mem].bind(inst);\n }\n });\n}\n\nvar I18n = function (_EventEmitter) {\n _inherits(I18n, _EventEmitter);\n\n var _super = _createSuper$3(I18n);\n\n function I18n() {\n var _this;\n\n var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n var callback = arguments.length > 1 ? arguments[1] : undefined;\n\n _classCallCheck(this, I18n);\n\n _this = _super.call(this);\n\n if (isIE10) {\n EventEmitter.call(_assertThisInitialized(_this));\n }\n\n _this.options = transformOptions(options);\n _this.services = {};\n _this.logger = baseLogger;\n _this.modules = {\n external: []\n };\n bindMemberFunctions(_assertThisInitialized(_this));\n\n if (callback && !_this.isInitialized && !options.isClone) {\n if (!_this.options.initImmediate) {\n _this.init(options, callback);\n\n return _possibleConstructorReturn(_this, _assertThisInitialized(_this));\n }\n\n setTimeout(function () {\n _this.init(options, callback);\n }, 0);\n }\n\n return _this;\n }\n\n _createClass(I18n, [{\n key: \"init\",\n value: function init() {\n var _this2 = this;\n\n var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n var callback = arguments.length > 1 ? arguments[1] : undefined;\n\n if (typeof options === 'function') {\n callback = options;\n options = {};\n }\n\n if (!options.defaultNS && options.defaultNS !== false && options.ns) {\n if (typeof options.ns === 'string') {\n options.defaultNS = options.ns;\n } else if (options.ns.indexOf('translation') < 0) {\n options.defaultNS = options.ns[0];\n }\n }\n\n var defOpts = get();\n this.options = _objectSpread$6(_objectSpread$6(_objectSpread$6({}, defOpts), this.options), transformOptions(options));\n\n if (this.options.compatibilityAPI !== 'v1') {\n this.options.interpolation = _objectSpread$6(_objectSpread$6({}, defOpts.interpolation), this.options.interpolation);\n }\n\n if (options.keySeparator !== undefined) {\n this.options.userDefinedKeySeparator = options.keySeparator;\n }\n\n if (options.nsSeparator !== undefined) {\n this.options.userDefinedNsSeparator = options.nsSeparator;\n }\n\n function createClassOnDemand(ClassOrObject) {\n if (!ClassOrObject) return null;\n if (typeof ClassOrObject === 'function') return new ClassOrObject();\n return ClassOrObject;\n }\n\n if (!this.options.isClone) {\n if (this.modules.logger) {\n baseLogger.init(createClassOnDemand(this.modules.logger), this.options);\n } else {\n baseLogger.init(null, this.options);\n }\n\n var formatter;\n\n if (this.modules.formatter) {\n formatter = this.modules.formatter;\n } else if (typeof Intl !== 'undefined') {\n formatter = Formatter;\n }\n\n var lu = new LanguageUtil(this.options);\n this.store = new ResourceStore(this.options.resources, this.options);\n var s = this.services;\n s.logger = baseLogger;\n s.resourceStore = this.store;\n s.languageUtils = lu;\n s.pluralResolver = new PluralResolver(lu, {\n prepend: this.options.pluralSeparator,\n compatibilityJSON: this.options.compatibilityJSON,\n simplifyPluralSuffix: this.options.simplifyPluralSuffix\n });\n\n if (formatter && (!this.options.interpolation.format || this.options.interpolation.format === defOpts.interpolation.format)) {\n s.formatter = createClassOnDemand(formatter);\n s.formatter.init(s, this.options);\n this.options.interpolation.format = s.formatter.format.bind(s.formatter);\n }\n\n s.interpolator = new Interpolator(this.options);\n s.utils = {\n hasLoadedNamespace: this.hasLoadedNamespace.bind(this)\n };\n s.backendConnector = new Connector(createClassOnDemand(this.modules.backend), s.resourceStore, s, this.options);\n s.backendConnector.on('*', function (event) {\n for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {\n args[_key - 1] = arguments[_key];\n }\n\n _this2.emit.apply(_this2, [event].concat(args));\n });\n\n if (this.modules.languageDetector) {\n s.languageDetector = createClassOnDemand(this.modules.languageDetector);\n s.languageDetector.init(s, this.options.detection, this.options);\n }\n\n if (this.modules.i18nFormat) {\n s.i18nFormat = createClassOnDemand(this.modules.i18nFormat);\n if (s.i18nFormat.init) s.i18nFormat.init(this);\n }\n\n this.translator = new Translator(this.services, this.options);\n this.translator.on('*', function (event) {\n for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {\n args[_key2 - 1] = arguments[_key2];\n }\n\n _this2.emit.apply(_this2, [event].concat(args));\n });\n this.modules.external.forEach(function (m) {\n if (m.init) m.init(_this2);\n });\n }\n\n this.format = this.options.interpolation.format;\n if (!callback) callback = noop;\n\n if (this.options.fallbackLng && !this.services.languageDetector && !this.options.lng) {\n var codes = this.services.languageUtils.getFallbackCodes(this.options.fallbackLng);\n if (codes.length > 0 && codes[0] !== 'dev') this.options.lng = codes[0];\n }\n\n if (!this.services.languageDetector && !this.options.lng) {\n this.logger.warn('init: no languageDetector is used and no lng is defined');\n }\n\n var storeApi = ['getResource', 'hasResourceBundle', 'getResourceBundle', 'getDataByLanguage'];\n storeApi.forEach(function (fcName) {\n _this2[fcName] = function () {\n var _this2$store;\n\n return (_this2$store = _this2.store)[fcName].apply(_this2$store, arguments);\n };\n });\n var storeApiChained = ['addResource', 'addResources', 'addResourceBundle', 'removeResourceBundle'];\n storeApiChained.forEach(function (fcName) {\n _this2[fcName] = function () {\n var _this2$store2;\n\n (_this2$store2 = _this2.store)[fcName].apply(_this2$store2, arguments);\n\n return _this2;\n };\n });\n var deferred = defer();\n\n var load = function load() {\n var finish = function finish(err, t) {\n if (_this2.isInitialized && !_this2.initializedStoreOnce) _this2.logger.warn('init: i18next is already initialized. You should call init just once!');\n _this2.isInitialized = true;\n if (!_this2.options.isClone) _this2.logger.log('initialized', _this2.options);\n\n _this2.emit('initialized', _this2.options);\n\n deferred.resolve(t);\n callback(err, t);\n };\n\n if (_this2.languages && _this2.options.compatibilityAPI !== 'v1' && !_this2.isInitialized) return finish(null, _this2.t.bind(_this2));\n\n _this2.changeLanguage(_this2.options.lng, finish);\n };\n\n if (this.options.resources || !this.options.initImmediate) {\n load();\n } else {\n setTimeout(load, 0);\n }\n\n return deferred;\n }\n }, {\n key: \"loadResources\",\n value: function loadResources(language) {\n var _this3 = this;\n\n var callback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : noop;\n var usedCallback = callback;\n var usedLng = typeof language === 'string' ? language : this.language;\n if (typeof language === 'function') usedCallback = language;\n\n if (!this.options.resources || this.options.partialBundledLanguages) {\n if (usedLng && usedLng.toLowerCase() === 'cimode') return usedCallback();\n var toLoad = [];\n\n var append = function append(lng) {\n if (!lng) return;\n\n var lngs = _this3.services.languageUtils.toResolveHierarchy(lng);\n\n lngs.forEach(function (l) {\n if (toLoad.indexOf(l) < 0) toLoad.push(l);\n });\n };\n\n if (!usedLng) {\n var fallbacks = this.services.languageUtils.getFallbackCodes(this.options.fallbackLng);\n fallbacks.forEach(function (l) {\n return append(l);\n });\n } else {\n append(usedLng);\n }\n\n if (this.options.preload) {\n this.options.preload.forEach(function (l) {\n return append(l);\n });\n }\n\n this.services.backendConnector.load(toLoad, this.options.ns, function (e) {\n if (!e && !_this3.resolvedLanguage && _this3.language) _this3.setResolvedLanguage(_this3.language);\n usedCallback(e);\n });\n } else {\n usedCallback(null);\n }\n }\n }, {\n key: \"reloadResources\",\n value: function reloadResources(lngs, ns, callback) {\n var deferred = defer();\n if (!lngs) lngs = this.languages;\n if (!ns) ns = this.options.ns;\n if (!callback) callback = noop;\n this.services.backendConnector.reload(lngs, ns, function (err) {\n deferred.resolve();\n callback(err);\n });\n return deferred;\n }\n }, {\n key: \"use\",\n value: function use(module) {\n if (!module) throw new Error('You are passing an undefined module! Please check the object you are passing to i18next.use()');\n if (!module.type) throw new Error('You are passing a wrong module! Please check the object you are passing to i18next.use()');\n\n if (module.type === 'backend') {\n this.modules.backend = module;\n }\n\n if (module.type === 'logger' || module.log && module.warn && module.error) {\n this.modules.logger = module;\n }\n\n if (module.type === 'languageDetector') {\n this.modules.languageDetector = module;\n }\n\n if (module.type === 'i18nFormat') {\n this.modules.i18nFormat = module;\n }\n\n if (module.type === 'postProcessor') {\n postProcessor.addPostProcessor(module);\n }\n\n if (module.type === 'formatter') {\n this.modules.formatter = module;\n }\n\n if (module.type === '3rdParty') {\n this.modules.external.push(module);\n }\n\n return this;\n }\n }, {\n key: \"setResolvedLanguage\",\n value: function setResolvedLanguage(l) {\n if (!l || !this.languages) return;\n if (['cimode', 'dev'].indexOf(l) > -1) return;\n\n for (var li = 0; li < this.languages.length; li++) {\n var lngInLngs = this.languages[li];\n if (['cimode', 'dev'].indexOf(lngInLngs) > -1) continue;\n\n if (this.store.hasLanguageSomeTranslations(lngInLngs)) {\n this.resolvedLanguage = lngInLngs;\n break;\n }\n }\n }\n }, {\n key: \"changeLanguage\",\n value: function changeLanguage(lng, callback) {\n var _this4 = this;\n\n this.isLanguageChangingTo = lng;\n var deferred = defer();\n this.emit('languageChanging', lng);\n\n var setLngProps = function setLngProps(l) {\n _this4.language = l;\n _this4.languages = _this4.services.languageUtils.toResolveHierarchy(l);\n _this4.resolvedLanguage = undefined;\n\n _this4.setResolvedLanguage(l);\n };\n\n var done = function done(err, l) {\n if (l) {\n setLngProps(l);\n\n _this4.translator.changeLanguage(l);\n\n _this4.isLanguageChangingTo = undefined;\n\n _this4.emit('languageChanged', l);\n\n _this4.logger.log('languageChanged', l);\n } else {\n _this4.isLanguageChangingTo = undefined;\n }\n\n deferred.resolve(function () {\n return _this4.t.apply(_this4, arguments);\n });\n if (callback) callback(err, function () {\n return _this4.t.apply(_this4, arguments);\n });\n };\n\n var setLng = function setLng(lngs) {\n if (!lng && !lngs && _this4.services.languageDetector) lngs = [];\n var l = typeof lngs === 'string' ? lngs : _this4.services.languageUtils.getBestMatchFromCodes(lngs);\n\n if (l) {\n if (!_this4.language) {\n setLngProps(l);\n }\n\n if (!_this4.translator.language) _this4.translator.changeLanguage(l);\n if (_this4.services.languageDetector) _this4.services.languageDetector.cacheUserLanguage(l);\n }\n\n _this4.loadResources(l, function (err) {\n done(err, l);\n });\n };\n\n if (!lng && this.services.languageDetector && !this.services.languageDetector.async) {\n setLng(this.services.languageDetector.detect());\n } else if (!lng && this.services.languageDetector && this.services.languageDetector.async) {\n this.services.languageDetector.detect(setLng);\n } else {\n setLng(lng);\n }\n\n return deferred;\n }\n }, {\n key: \"getFixedT\",\n value: function getFixedT(lng, ns, keyPrefix) {\n var _this5 = this;\n\n var fixedT = function fixedT(key, opts) {\n var options;\n\n if (_typeof(opts) !== 'object') {\n for (var _len3 = arguments.length, rest = new Array(_len3 > 2 ? _len3 - 2 : 0), _key3 = 2; _key3 < _len3; _key3++) {\n rest[_key3 - 2] = arguments[_key3];\n }\n\n options = _this5.options.overloadTranslationOptionHandler([key, opts].concat(rest));\n } else {\n options = _objectSpread$6({}, opts);\n }\n\n options.lng = options.lng || fixedT.lng;\n options.lngs = options.lngs || fixedT.lngs;\n options.ns = options.ns || fixedT.ns;\n options.keyPrefix = options.keyPrefix || keyPrefix || fixedT.keyPrefix;\n var keySeparator = _this5.options.keySeparator || '.';\n var resultKey = options.keyPrefix ? \"\".concat(options.keyPrefix).concat(keySeparator).concat(key) : key;\n return _this5.t(resultKey, options);\n };\n\n if (typeof lng === 'string') {\n fixedT.lng = lng;\n } else {\n fixedT.lngs = lng;\n }\n\n fixedT.ns = ns;\n fixedT.keyPrefix = keyPrefix;\n return fixedT;\n }\n }, {\n key: \"t\",\n value: function t() {\n var _this$translator;\n\n return this.translator && (_this$translator = this.translator).translate.apply(_this$translator, arguments);\n }\n }, {\n key: \"exists\",\n value: function exists() {\n var _this$translator2;\n\n return this.translator && (_this$translator2 = this.translator).exists.apply(_this$translator2, arguments);\n }\n }, {\n key: \"setDefaultNamespace\",\n value: function setDefaultNamespace(ns) {\n this.options.defaultNS = ns;\n }\n }, {\n key: \"hasLoadedNamespace\",\n value: function hasLoadedNamespace(ns) {\n var _this6 = this;\n\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n\n if (!this.isInitialized) {\n this.logger.warn('hasLoadedNamespace: i18next was not initialized', this.languages);\n return false;\n }\n\n if (!this.languages || !this.languages.length) {\n this.logger.warn('hasLoadedNamespace: i18n.languages were undefined or empty', this.languages);\n return false;\n }\n\n var lng = this.resolvedLanguage || this.languages[0];\n var fallbackLng = this.options ? this.options.fallbackLng : false;\n var lastLng = this.languages[this.languages.length - 1];\n if (lng.toLowerCase() === 'cimode') return true;\n\n var loadNotPending = function loadNotPending(l, n) {\n var loadState = _this6.services.backendConnector.state[\"\".concat(l, \"|\").concat(n)];\n\n return loadState === -1 || loadState === 2;\n };\n\n if (options.precheck) {\n var preResult = options.precheck(this, loadNotPending);\n if (preResult !== undefined) return preResult;\n }\n\n if (this.hasResourceBundle(lng, ns)) return true;\n if (!this.services.backendConnector.backend || this.options.resources && !this.options.partialBundledLanguages) return true;\n if (loadNotPending(lng, ns) && (!fallbackLng || loadNotPending(lastLng, ns))) return true;\n return false;\n }\n }, {\n key: \"loadNamespaces\",\n value: function loadNamespaces(ns, callback) {\n var _this7 = this;\n\n var deferred = defer();\n\n if (!this.options.ns) {\n callback && callback();\n return Promise.resolve();\n }\n\n if (typeof ns === 'string') ns = [ns];\n ns.forEach(function (n) {\n if (_this7.options.ns.indexOf(n) < 0) _this7.options.ns.push(n);\n });\n this.loadResources(function (err) {\n deferred.resolve();\n if (callback) callback(err);\n });\n return deferred;\n }\n }, {\n key: \"loadLanguages\",\n value: function loadLanguages(lngs, callback) {\n var deferred = defer();\n if (typeof lngs === 'string') lngs = [lngs];\n var preloaded = this.options.preload || [];\n var newLngs = lngs.filter(function (lng) {\n return preloaded.indexOf(lng) < 0;\n });\n\n if (!newLngs.length) {\n if (callback) callback();\n return Promise.resolve();\n }\n\n this.options.preload = preloaded.concat(newLngs);\n this.loadResources(function (err) {\n deferred.resolve();\n if (callback) callback(err);\n });\n return deferred;\n }\n }, {\n key: \"dir\",\n value: function dir(lng) {\n if (!lng) lng = this.resolvedLanguage || (this.languages && this.languages.length > 0 ? this.languages[0] : this.language);\n if (!lng) return 'rtl';\n var rtlLngs = ['ar', 'shu', 'sqr', 'ssh', 'xaa', 'yhd', 'yud', 'aao', 'abh', 'abv', 'acm', 'acq', 'acw', 'acx', 'acy', 'adf', 'ads', 'aeb', 'aec', 'afb', 'ajp', 'apc', 'apd', 'arb', 'arq', 'ars', 'ary', 'arz', 'auz', 'avl', 'ayh', 'ayl', 'ayn', 'ayp', 'bbz', 'pga', 'he', 'iw', 'ps', 'pbt', 'pbu', 'pst', 'prp', 'prd', 'ug', 'ur', 'ydd', 'yds', 'yih', 'ji', 'yi', 'hbo', 'men', 'xmn', 'fa', 'jpr', 'peo', 'pes', 'prs', 'dv', 'sam', 'ckb'];\n return rtlLngs.indexOf(this.services.languageUtils.getLanguagePartFromCode(lng)) > -1 || lng.toLowerCase().indexOf('-arab') > 1 ? 'rtl' : 'ltr';\n }\n }, {\n key: \"cloneInstance\",\n value: function cloneInstance() {\n var _this8 = this;\n\n var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n var callback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : noop;\n\n var mergedOptions = _objectSpread$6(_objectSpread$6(_objectSpread$6({}, this.options), options), {\n isClone: true\n });\n\n var clone = new I18n(mergedOptions);\n\n if (options.debug !== undefined || options.prefix !== undefined) {\n clone.logger = clone.logger.clone(options);\n }\n\n var membersToCopy = ['store', 'services', 'language'];\n membersToCopy.forEach(function (m) {\n clone[m] = _this8[m];\n });\n clone.services = _objectSpread$6({}, this.services);\n clone.services.utils = {\n hasLoadedNamespace: clone.hasLoadedNamespace.bind(clone)\n };\n clone.translator = new Translator(clone.services, clone.options);\n clone.translator.on('*', function (event) {\n for (var _len4 = arguments.length, args = new Array(_len4 > 1 ? _len4 - 1 : 0), _key4 = 1; _key4 < _len4; _key4++) {\n args[_key4 - 1] = arguments[_key4];\n }\n\n clone.emit.apply(clone, [event].concat(args));\n });\n clone.init(mergedOptions, callback);\n clone.translator.options = clone.options;\n clone.translator.backendConnector.services.utils = {\n hasLoadedNamespace: clone.hasLoadedNamespace.bind(clone)\n };\n return clone;\n }\n }, {\n key: \"toJSON\",\n value: function toJSON() {\n return {\n options: this.options,\n store: this.store,\n language: this.language,\n languages: this.languages,\n resolvedLanguage: this.resolvedLanguage\n };\n }\n }]);\n\n return I18n;\n}(EventEmitter);\n\n_defineProperty(I18n, \"createInstance\", function () {\n var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n var callback = arguments.length > 1 ? arguments[1] : undefined;\n return new I18n(options, callback);\n});\n\nvar instance = I18n.createInstance();\ninstance.createInstance = I18n.createInstance;\n\nvar createInstance = instance.createInstance;\nvar init = instance.init;\nvar loadResources = instance.loadResources;\nvar reloadResources = instance.reloadResources;\nvar use = instance.use;\nvar changeLanguage = instance.changeLanguage;\nvar getFixedT = instance.getFixedT;\nvar t = instance.t;\nvar exists = instance.exists;\nvar setDefaultNamespace = instance.setDefaultNamespace;\nvar hasLoadedNamespace = instance.hasLoadedNamespace;\nvar loadNamespaces = instance.loadNamespaces;\nvar loadLanguages = instance.loadLanguages;\n\nexport default instance;\nexport { changeLanguage, createInstance, exists, getFixedT, hasLoadedNamespace, init, loadLanguages, loadNamespaces, loadResources, reloadResources, setDefaultNamespace, t, use };\n","const {\n slice,\n forEach\n} = [];\nfunction defaults(obj) {\n forEach.call(slice.call(arguments, 1), source => {\n if (source) {\n for (const prop in source) {\n if (obj[prop] === undefined) obj[prop] = source[prop];\n }\n }\n });\n return obj;\n}\n\n// eslint-disable-next-line no-control-regex\nconst fieldContentRegExp = /^[\\u0009\\u0020-\\u007e\\u0080-\\u00ff]+$/;\nconst serializeCookie = (name, val, options) => {\n const opt = options || {};\n opt.path = opt.path || '/';\n const value = encodeURIComponent(val);\n let str = `${name}=${value}`;\n if (opt.maxAge > 0) {\n const maxAge = opt.maxAge - 0;\n if (Number.isNaN(maxAge)) throw new Error('maxAge should be a Number');\n str += `; Max-Age=${Math.floor(maxAge)}`;\n }\n if (opt.domain) {\n if (!fieldContentRegExp.test(opt.domain)) {\n throw new TypeError('option domain is invalid');\n }\n str += `; Domain=${opt.domain}`;\n }\n if (opt.path) {\n if (!fieldContentRegExp.test(opt.path)) {\n throw new TypeError('option path is invalid');\n }\n str += `; Path=${opt.path}`;\n }\n if (opt.expires) {\n if (typeof opt.expires.toUTCString !== 'function') {\n throw new TypeError('option expires is invalid');\n }\n str += `; Expires=${opt.expires.toUTCString()}`;\n }\n if (opt.httpOnly) str += '; HttpOnly';\n if (opt.secure) str += '; Secure';\n if (opt.sameSite) {\n const sameSite = typeof opt.sameSite === 'string' ? opt.sameSite.toLowerCase() : opt.sameSite;\n switch (sameSite) {\n case true:\n str += '; SameSite=Strict';\n break;\n case 'lax':\n str += '; SameSite=Lax';\n break;\n case 'strict':\n str += '; SameSite=Strict';\n break;\n case 'none':\n str += '; SameSite=None';\n break;\n default:\n throw new TypeError('option sameSite is invalid');\n }\n }\n return str;\n};\nconst cookie = {\n create(name, value, minutes, domain) {\n let cookieOptions = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {\n path: '/',\n sameSite: 'strict'\n };\n if (minutes) {\n cookieOptions.expires = new Date();\n cookieOptions.expires.setTime(cookieOptions.expires.getTime() + minutes * 60 * 1000);\n }\n if (domain) cookieOptions.domain = domain;\n document.cookie = serializeCookie(name, encodeURIComponent(value), cookieOptions);\n },\n read(name) {\n const nameEQ = `${name}=`;\n const ca = document.cookie.split(';');\n for (let i = 0; i < ca.length; i++) {\n let c = ca[i];\n while (c.charAt(0) === ' ') c = c.substring(1, c.length);\n if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);\n }\n return null;\n },\n remove(name) {\n this.create(name, '', -1);\n }\n};\nvar cookie$1 = {\n name: 'cookie',\n // Deconstruct the options object and extract the lookupCookie property\n lookup(_ref) {\n let {\n lookupCookie\n } = _ref;\n if (lookupCookie && typeof document !== 'undefined') {\n return cookie.read(lookupCookie) || undefined;\n }\n return undefined;\n },\n // Deconstruct the options object and extract the lookupCookie, cookieMinutes, cookieDomain, and cookieOptions properties\n cacheUserLanguage(lng, _ref2) {\n let {\n lookupCookie,\n cookieMinutes,\n cookieDomain,\n cookieOptions\n } = _ref2;\n if (lookupCookie && typeof document !== 'undefined') {\n cookie.create(lookupCookie, lng, cookieMinutes, cookieDomain, cookieOptions);\n }\n }\n};\n\nvar querystring = {\n name: 'querystring',\n // Deconstruct the options object and extract the lookupQuerystring property\n lookup(_ref) {\n let {\n lookupQuerystring\n } = _ref;\n let found;\n if (typeof window !== 'undefined') {\n let {\n search\n } = window.location;\n if (!window.location.search && window.location.hash?.indexOf('?') > -1) {\n search = window.location.hash.substring(window.location.hash.indexOf('?'));\n }\n const query = search.substring(1);\n const params = query.split('&');\n for (let i = 0; i < params.length; i++) {\n const pos = params[i].indexOf('=');\n if (pos > 0) {\n const key = params[i].substring(0, pos);\n if (key === lookupQuerystring) {\n found = params[i].substring(pos + 1);\n }\n }\n }\n }\n return found;\n }\n};\n\nlet hasLocalStorageSupport = null;\nconst localStorageAvailable = () => {\n if (hasLocalStorageSupport !== null) return hasLocalStorageSupport;\n try {\n hasLocalStorageSupport = window !== 'undefined' && window.localStorage !== null;\n const testKey = 'i18next.translate.boo';\n window.localStorage.setItem(testKey, 'foo');\n window.localStorage.removeItem(testKey);\n } catch (e) {\n hasLocalStorageSupport = false;\n }\n return hasLocalStorageSupport;\n};\nvar localStorage = {\n name: 'localStorage',\n // Deconstruct the options object and extract the lookupLocalStorage property\n lookup(_ref) {\n let {\n lookupLocalStorage\n } = _ref;\n if (lookupLocalStorage && localStorageAvailable()) {\n return window.localStorage.getItem(lookupLocalStorage) || undefined; // Undefined ensures type consistency with the previous version of this function\n }\n\n return undefined;\n },\n // Deconstruct the options object and extract the lookupLocalStorage property\n cacheUserLanguage(lng, _ref2) {\n let {\n lookupLocalStorage\n } = _ref2;\n if (lookupLocalStorage && localStorageAvailable()) {\n window.localStorage.setItem(lookupLocalStorage, lng);\n }\n }\n};\n\nlet hasSessionStorageSupport = null;\nconst sessionStorageAvailable = () => {\n if (hasSessionStorageSupport !== null) return hasSessionStorageSupport;\n try {\n hasSessionStorageSupport = window !== 'undefined' && window.sessionStorage !== null;\n const testKey = 'i18next.translate.boo';\n window.sessionStorage.setItem(testKey, 'foo');\n window.sessionStorage.removeItem(testKey);\n } catch (e) {\n hasSessionStorageSupport = false;\n }\n return hasSessionStorageSupport;\n};\nvar sessionStorage = {\n name: 'sessionStorage',\n lookup(_ref) {\n let {\n lookupSessionStorage\n } = _ref;\n if (lookupSessionStorage && sessionStorageAvailable()) {\n return window.sessionStorage.getItem(lookupSessionStorage) || undefined;\n }\n return undefined;\n },\n cacheUserLanguage(lng, _ref2) {\n let {\n lookupSessionStorage\n } = _ref2;\n if (lookupSessionStorage && sessionStorageAvailable()) {\n window.sessionStorage.setItem(lookupSessionStorage, lng);\n }\n }\n};\n\nvar navigator$1 = {\n name: 'navigator',\n lookup(options) {\n const found = [];\n if (typeof navigator !== 'undefined') {\n const {\n languages,\n userLanguage,\n language\n } = navigator;\n if (languages) {\n // chrome only; not an array, so can't use .push.apply instead of iterating\n for (let i = 0; i < languages.length; i++) {\n found.push(languages[i]);\n }\n }\n if (userLanguage) {\n found.push(userLanguage);\n }\n if (language) {\n found.push(language);\n }\n }\n return found.length > 0 ? found : undefined;\n }\n};\n\nvar htmlTag = {\n name: 'htmlTag',\n // Deconstruct the options object and extract the htmlTag property\n lookup(_ref) {\n let {\n htmlTag\n } = _ref;\n let found;\n const internalHtmlTag = htmlTag || (typeof document !== 'undefined' ? document.documentElement : null);\n if (internalHtmlTag && typeof internalHtmlTag.getAttribute === 'function') {\n found = internalHtmlTag.getAttribute('lang');\n }\n return found;\n }\n};\n\nvar path = {\n name: 'path',\n // Deconstruct the options object and extract the lookupFromPathIndex property\n lookup(_ref) {\n let {\n lookupFromPathIndex\n } = _ref;\n if (typeof window === 'undefined') return undefined;\n const language = window.location.pathname.match(/\\/([a-zA-Z-]*)/g);\n if (!Array.isArray(language)) return undefined;\n const index = typeof lookupFromPathIndex === 'number' ? lookupFromPathIndex : 0;\n return language[index]?.replace('/', '');\n }\n};\n\nvar subdomain = {\n name: 'subdomain',\n lookup(_ref) {\n let {\n lookupFromSubdomainIndex\n } = _ref;\n // If given get the subdomain index else 1\n const internalLookupFromSubdomainIndex = typeof lookupFromSubdomainIndex === 'number' ? lookupFromSubdomainIndex + 1 : 1;\n // get all matches if window.location. is existing\n // first item of match is the match itself and the second is the first group match which should be the first subdomain match\n // is the hostname no public domain get the or option of localhost\n const language = typeof window !== 'undefined' && window.location?.hostname?.match(/^(\\w{2,5})\\.(([a-z0-9-]{1,63}\\.[a-z]{2,6})|localhost)/i);\n\n // if there is no match (null) return undefined\n if (!language) return undefined;\n // return the given group match\n return language[internalLookupFromSubdomainIndex];\n }\n};\n\nfunction getDefaults() {\n return {\n order: ['querystring', 'cookie', 'localStorage', 'sessionStorage', 'navigator', 'htmlTag'],\n lookupQuerystring: 'lng',\n lookupCookie: 'i18next',\n lookupLocalStorage: 'i18nextLng',\n lookupSessionStorage: 'i18nextLng',\n // cache user language\n caches: ['localStorage'],\n excludeCacheFor: ['cimode'],\n // cookieMinutes: 10,\n // cookieDomain: 'myDomain'\n\n convertDetectedLanguage: l => l\n };\n}\nclass Browser {\n constructor(services) {\n let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n this.type = 'languageDetector';\n this.detectors = {};\n this.init(services, options);\n }\n init(services) {\n let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n let i18nOptions = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};\n this.services = services || {\n languageUtils: {}\n }; // this way the language detector can be used without i18next\n this.options = defaults(options, this.options || {}, getDefaults());\n if (typeof this.options.convertDetectedLanguage === 'string' && this.options.convertDetectedLanguage.indexOf('15897') > -1) {\n this.options.convertDetectedLanguage = l => l.replace('-', '_');\n }\n\n // backwards compatibility\n if (this.options.lookupFromUrlIndex) this.options.lookupFromPathIndex = this.options.lookupFromUrlIndex;\n this.i18nOptions = i18nOptions;\n this.addDetector(cookie$1);\n this.addDetector(querystring);\n this.addDetector(localStorage);\n this.addDetector(sessionStorage);\n this.addDetector(navigator$1);\n this.addDetector(htmlTag);\n this.addDetector(path);\n this.addDetector(subdomain);\n }\n addDetector(detector) {\n this.detectors[detector.name] = detector;\n return this;\n }\n detect(detectionOrder) {\n if (!detectionOrder) detectionOrder = this.options.order;\n let detected = [];\n detectionOrder.forEach(detectorName => {\n if (this.detectors[detectorName]) {\n let lookup = this.detectors[detectorName].lookup(this.options);\n if (lookup && typeof lookup === 'string') lookup = [lookup];\n if (lookup) detected = detected.concat(lookup);\n }\n });\n detected = detected.map(d => this.options.convertDetectedLanguage(d));\n if (this.services.languageUtils.getBestMatchFromCodes) return detected; // new i18next v19.5.0\n return detected.length > 0 ? detected[0] : null; // a little backward compatibility\n }\n\n cacheUserLanguage(lng, caches) {\n if (!caches) caches = this.options.caches;\n if (!caches) return;\n if (this.options.excludeCacheFor && this.options.excludeCacheFor.indexOf(lng) > -1) return;\n caches.forEach(cacheName => {\n if (this.detectors[cacheName]) this.detectors[cacheName].cacheUserLanguage(lng, this.options);\n });\n }\n}\nBrowser.type = 'languageDetector';\n\nexport { Browser as default };\n","import i18next from 'i18next';\nimport requireContext from 'require-context.macro';\nimport { initReactI18next } from 'react-i18next';\nimport I18nextBrowserLanguageDetector from 'i18next-browser-languagedetector';\n\nconst i18n = i18next.createInstance();\n\nfunction merge(translations, firstFallback) {\n if (Object.keys(translations).length) {\n return { ...firstFallback, ...translations };\n } else {\n // no need to merge if translations is empty\n return firstFallback;\n }\n}\n\nconst importTranlations = process.env.NODE_ENV === 'test' ? requireContext('../locales/', true, /\\.json$/) : require.context('../locales/', true, /\\.json$/); // a bit of webpack magic to import all files in a directory https://webpack.js.org/guides/dependency-management/#requirecontext\n\nlet translations = {};\n\n// first, fill in the default locales\n// ex the file named default-fr-fr.json will be used for fr, fr-fr, and as a fallback for other fr-* locales, like fr-ca\nfor (let filename of importTranlations.keys()) {\n const locale = filename.slice(2, -5).toLowerCase(); // get './fr-FR.json', return 'fr-fr'\n if (locale.indexOf('default-') === 0) {\n const realLocale = locale.slice(8);\n const content = importTranlations(filename);\n translations[realLocale] = { translation: content };\n const localeParts = realLocale.split('-');\n if (localeParts.length > 1) {\n translations[localeParts[0]] = { translation: content }; // if realLocale is fr-fr, store translations for fr\n }\n }\n}\n\n// then the non default locales, and use the default of their language as a fallback\nfor (let filename of importTranlations.keys()) {\n const locale = filename.slice(2, -5).toLowerCase(); // get './fr-FR.json', return 'fr-fr'\n if (locale.indexOf('default-') !== 0) {\n const localeParts = locale.split('-');\n const content = importTranlations(filename);\n if (localeParts.length > 1) {\n translations[locale] = { translation: merge(content, translations[localeParts[0]]?.translation) };\n } else {\n translations[locale] = { translation: content };\n }\n }\n}\n\ni18n\n .use(initReactI18next)\n .use(I18nextBrowserLanguageDetector)\n .init({\n supportedLngs: Object.keys(translations),\n lowerCaseLng: true,\n resources: translations,\n fallbackLng: 'en',\n interpolation: {\n escapeValue: false,\n },\n debug: true,\n detection: {\n caches: [],\n },\n })\n .then()\n .catch(() => {\n console.error('Fail to load translations (i18next)');\n });\n\nexport default i18n;\n","/**\n * This file gather all the utils function related to currencies or prices.\n */\n\n/**\n * Compute the price to display taking in account the currency code and the language\n * @param {number} amount The amount of the price (with a 100 factor). We will divide by 100 to get the real price.\n * @param {number} decimalPlaces The decimal places to display\n * @param {string} currencyCode The trigram of the currency, e.g \"EUR\"\n * @param {string} language The language\n * @return {string} The price formatted according to the locale and the currency\n */\nexport const intlPriceFormat = (amount, decimalPlaces, currencyCode, language) => {\n if ((!amount && amount !== 0) || Number.isNaN(parseFloat(amount)) || !currencyCode) {\n return null;\n }\n\n const amountWithCentsAsDecimals = (amount / 100).toFixed(2);\n\n return new Intl\n .NumberFormat(\n language || 'en-GB',\n {\n style: 'currency',\n currency: currencyCode,\n minimumFractionDigits: decimalPlaces || (decimalPlaces !== 0 && 2),\n maximumFractionDigits: decimalPlaces || (decimalPlaces !== 0 && 2),\n },\n )\n .format(amountWithCentsAsDecimals);\n};\n","// extracted by mini-css-extract-plugin\nexport default {\"name_description\":\"HongKongForm_name_description__REOXF\"};","export const bankCodeMap = {\n '003': 'STANDARD CHARTERED BANK (HONG KONG) LIMITED',\n '004': 'THE HONGKONG AND SHANGHAI BANKING CORPORATION LIMITED (HSBC)',\n '005': 'CREDIT AGRICOLE CORPORATE AND INVESTMENT BANK',\n '006': 'CITIBANK, N.A.',\n '007': 'JPMORGAN CHASE BANK, N.A.',\n '008': 'NATWEST MARTETS PLC',\n '009': 'CHINA CONSTRUCTION BANK (ASIA) CORPORATION LIMITED',\n '012': 'BANK OF CHINA (HONG KONG) LIMITED',\n '015': 'THE BANK OF EAST ASIA, LIMITED',\n '016': 'DBS BANK (HONG KONG) LIMITED',\n '018': 'CHINA CITIC BANK INTERNATIONAL LIMITED',\n '020': 'CMB WING LUNG BANK LIMITED.',\n '022': 'OVERSEA-CHINESE BANKING CORPORATION LTD.',\n '024': 'HANG SENG BANK LTD.',\n '025': 'SHANGHAI COMMERCIAL BANK LTD.',\n '027': 'BANK OF COMMUNICATIONS CO., LTD',\n '028': 'PUBLIC BANK (HONG KONG) LIMITED',\n '035': 'OCBC WING HANG BANK LIMITED',\n '038': 'TAI YAU BANK LTD.',\n '039': 'CHIYU BANKING CORPORATION LTD.',\n '040': 'DAH SING BANK, LTD.',\n '041': 'CHONG HING BANK LIMITED',\n '043': 'NANYANG COMMERCIAL BANK, LTD.',\n '045': 'UCO BANK',\n '046': 'KEB HANA BANK',\n '047': 'MUFG BANK, LTD.',\n '049': 'BANGKOK BANK PUBLIC COMPANY LIMITED',\n '050': 'INDIAN OVERSEAS BANK',\n '052': 'DBS BANK LTD.',\n '054': 'DEUTSCHE BANK AG',\n '055': 'BANK OF AMERICA, N.A.',\n '056': 'BNP PARIBAS',\n '058': 'BANK OF INDIA',\n '060': 'NATIONAL BANK OF PAKISTAN',\n '061': 'TAI SANG BANK LIMITED',\n '063': 'MALAYAN BANKING BERHAD (MAYBANK)',\n '065': 'SUMITOMO MITSUI BANKING CORPORATION',\n '066': 'PT. BANK NEGARA INDONESIA (PERSERO) TBK.',\n '067': 'BDO UNIBANK, INC.',\n '071': 'UNITED OVERSEAS BANK LTD.',\n '072': 'INDUSTRIAL AND COMMERCIAL BANK OF CHINA (ASIA) LIMITED',\n '074': 'BARCLAYS BANK PLC.',\n '076': 'THE BANK OF NOVA SCOTIA',\n '080': 'ROYAL BANK OF CANADA',\n '081': 'SOCIETE GENERALE',\n '082': 'STATE BANK OF INDIA',\n '085': 'THE TORONTO-DOMINION BANK',\n '086': '086 BANK OF MONTREAL',\n '092': 'CANADIAN IMPERIAL BANK OF COMMERCE',\n '097': 'COMMERZBANK AG',\n '103': 'UBS AG, HONG KONG',\n '106': 'HSBC BANK USA, N.A.',\n '109': 'MIZUHO BANK, LTD., HONG KONG BRANCH',\n '113': 'DZ BANK AG DEUTSCHE ZENTRAL-GENOSSENSCHAFTSBANK',\n '118': 'WOORI BANK',\n '119': 'PHILIPPINE NATIONAL BANK',\n '128': 'FUBON BANK (HONG KONG) LIMITED',\n '138': 'MITSUBISHI UFJ TRUST AND BANKING CORPORATION',\n '139': 'THE BANK OF NEW YORK MELLON',\n '145': 'ING BANK N.V.',\n '147': 'BANCO BILBAO VIZCAYA ARGENTARIA S.A.',\n '150': 'NATIONAL AUSTRALIA BANK, LIMITED',\n '151': 'WESTPAC BANKING CORPORATION',\n '152': 'AUSTRALIA AND NEW ZEALAND BANKING GROUP LIMITED',\n '153': 'COMMONWEALTH BANK OF AUSTRALIA',\n '161': 'INTESA SANPAOLO S.P.A.',\n '164': 'UNICREDIT BANK AG',\n '165': 'SVENSKA HANDELSBANKEN AB (PUBL)',\n '170': 'THE CHIBA BANK LTD.',\n '178': 'KBC BANK N.V., HONG KONG BRANCH',\n '180': 'WELLS FARGO BANK, N.A., HONG KONG BRANCH',\n '183': 'COÖPERATIEVE RABOBANK U.A.',\n '185': 'DBS BANK LTD., HONG KONG BRANCH',\n '186': 'THE SHIZUOKA BANK LTD.',\n '188': 'THE HACHIJUNI BANK, LTD.',\n '198': 'HUA NAN COMMERCIAL BANK, LTD.',\n '199': 'THE SHIGA BANK, LTD.',\n '201': 'BANK OF TAIWAN',\n '202': 'THE CHUGOKU BANK LIMITED',\n '203': 'FIRST COMMERCIAL BANK',\n '205': 'COUTTS & CO. LTD.',\n '206': 'CHANG HWA COMMERCIAL BANK, LTD.',\n '210': 'NATIXIS',\n '214': 'INDUSTRIAL AND COMMERCIAL BANK OF CHINA LIMITED',\n '220': 'STATE STREET BANK AND TRUST COMPANY',\n '221': 'CHINA CONSTRUCTION BANK CORPORATION',\n '222': 'AGRICULTURAL BANK OF CHINA LIMITED',\n '227': 'ERSTE GROUP BANK AG',\n '229': 'CTBC BANK CO., LTD.',\n '230': 'TAIWAN BUSINESS BANK, LTD.',\n '233': 'TAIWAN BUSINESS BANK, LTD.',\n '235': 'HSBC PRIVATE BANK (SUISSE) SA',\n '236': 'CATHAY UNITED BANK COMPANY, LIMITED',\n '237': 'EFG BANK AG',\n '238': 'CHINA MERCHANTS BANK CO., LTD.',\n '239': 'TAIPEI FUBON COMMERCIAL BANK CO., LTD.',\n '241': 'BANK SINOPAC',\n '242': 'MEGA INTERNATIONAL COMMERCIAL BANK CO., LTD.',\n '243': 'E.SUN COMMERCIAL BANK, LTD.',\n '245': 'TAISHIN INTERNATIONAL BANK CO., LTD.',\n '248': 'HONG LEONG BANK BERHAD',\n '249': 'STANDARD CHARTERED BANK HONG KONG BRANCH',\n '250': 'CITIBANK (HONG KONG) LIMITED',\n '251': 'ICICI BANK LIMITED',\n '254': 'MELLI BANK PLC',\n '258': 'EAST WEST BANK',\n '259': 'BANK OF BARODA',\n '260': 'FAR EASTERN INTERNATIONAL BANK',\n '261': 'AXIS BANK LIMITED',\n '262': 'CANARA BANK',\n '263': 'CATHAY BANK',\n '264': 'LAND BANK OF TAIWAN CO., LTD.',\n '265': 'TAIWAN COOPERATIVE BANK, LTD.',\n '266': 'PUNJAB NATIONAL BANK',\n '267': 'BANCO SANTANDER S.A.',\n '268': 'UNION BANK OF INDIA',\n '269': 'UNION BANK OF INDIA',\n '271': 'INDUSTRIAL BANK OF KOREA',\n '272': 'BANK OF SINGAPORE LIMITED',\n '273': 'SHINHAN BANK',\n '274': 'O-BANK CO., LTD',\n '275': 'BNP PARIBAS SECURITIES SERVICES',\n '276': 'CHINA DEVELOPMENT BANK',\n '277': 'FIRST ABU DHABI BANK PJSC',\n '278': 'BANK J. SAFRA SARASIN AG',\n '307': 'ABN AMRO BANK N.V.',\n '308': 'HDFC BANK LIMITED',\n '309': 'UNION BANCAIRE PRIVEE, UBP SA',\n '316': 'SKANDINAVISKA ENSKILDA BANKEN AB',\n '320': 'BANK JULIUS BAER & CO. LTD.',\n '324': 'CREDIT INDUSTRIEL ET COMMERCIAL',\n '337': 'TAIWAN SHIN KONG COMMERCIAL BANK CO., LTD.',\n '338': 'BANK OF CHINA LIMITED, HONG KONG BRANCH',\n '339': 'CA INDOSUEZ (SWITZERLAND) SA',\n '341': 'ICBC STANDARD BANK PLC',\n '342': 'LGT BANK AG',\n '344': 'MACQUARIE BANK LIMITED',\n '345': 'SHANGHAI PUDONG DEVELOPMENT BANK CO., LTD.',\n '353': 'CHINA MINSHENG BANKING CORP., LTD.',\n '357': 'PICTET & CIE (EUROPE) S.A.',\n '360': 'NATWEST MARKETS N.V.',\n '368': 'CHINA EVERBRIGHT BANK CO., LTD.',\n '371': 'SUMITOMO MITSUI TRUST BANK, LIMITED',\n '372': 'BANK OF SHANGHAI (HONG KONG) LIMITED',\n '374': 'CIMB BANK BERHAD',\n '377': 'INDUSTRIAL BANK CO., LTD',\n '378': 'YUANTA COMMERCIAL BANK CO., LTD.',\n '379': 'MASHREQ BANK - PUBLIC SHAREHOLDING COMPANY',\n '381': 'KOOKMIN BANK',\n '382': 'BANK OF COMMUNICATIONS (HONG KONG) LIMITED',\n '383': 'CHINA ZHESHANG BANK CO., LTD.',\n '384': 'MORGAN STANLEY BANK ASIA LIMITED',\n '385': 'PING AN BANK CO., LTD.',\n '386': 'HUA XIA BANK CO., LIMITED',\n '387': 'ZA BANK LIMITED',\n '388': 'LIVI VB LIMITED',\n '389': 'MOX BANK LIMITED',\n '390': 'WELAB BANK LIMITED',\n '391': 'FUSION BANK LIMITED',\n '392': 'PING AN ONECONNECT BANK (HONG KONG) LIMITED',\n '393': 'ANT BANK (HONG KONG) LIMITED',\n '395': 'AIRSTAR BANK LIMITED',\n '802': 'HONG KONG SECURITIES CLEARING COMPANY LIMITED',\n '868': 'CLS BANK INTERNATIONAL',\n};\n","import React from 'react';\n\nimport PropTypes from 'prop-types';\nimport { useTranslation } from 'react-i18next';\n\nimport Button from 'lib/components/Button';\nimport FormField from 'lib/components/FormField';\nimport { cleanObjectOnValues } from 'lib/utils/objectUtils';\nimport { useFormSave } from 'lib/hooks/useFormSave';\nimport styles from './HongKongForm.module.scss';\nimport { bankCodeMap } from './constants';\n\nimport styles_psp from 'lib/components/PspComposer/PspComposer.module.scss';\n\n/**\n * This component is one of the multiple available payment method in this project.\n * It represents a form used for Hong Kong banks,\n * and some information related to Hong Kong. It is only used to collect refund request data.\n */\nconst HongKongForm = React.forwardRef(\n (\n {\n pspId,\n token,\n paymentRequestId,\n lyriaUrl,\n hidePayButton,\n labelPayButton,\n onPaymentResult,\n },\n ref,\n ) => {\n const { t } = useTranslation();\n\n const formRef = React.useRef(null);\n const [formData, setFormData] = React.useState({\n 'firstName': '',\n 'lastName': '',\n 'bankAccountNumber': '',\n 'bankCode': '',\n });\n const [errors, setErrors] = React.useState({});\n const [bankCodeIsValid, setBankCodeIsValid] = React.useState(false);\n const [bankAccountIsValid, setBankAccountIsValid] = React.useState(false);\n const [bankName, setBankName] = React.useState('');\n const [formFieldBlurState, setFormFieldBlurState] = React.useState({\n bankAccountNumber: false,\n bankCode: false,\n });\n\n const handleSuccess = React.useCallback(\n (response) => {\n onPaymentResult({ success: true, data: response });\n },\n [onPaymentResult],\n );\n\n const handleError = React.useCallback(\n (response) => {\n if (response?.data) {\n const fieldErrors = {};\n Object\n .keys(response.data)\n .forEach((key) => {\n fieldErrors[key] = response.data[key] && response.data[key].map((error) => t([\n `hong_kong_form_${key}_error_${error.code}`,\n `error_${error.code}`,\n 'error_form',\n ]));\n });\n setErrors(fieldErrors);\n }\n onPaymentResult({\n success: false,\n data: response,\n });\n },\n [onPaymentResult, t],\n );\n\n const url = lyriaUrl + '/hong-kong-form/save';\n const saveForm = useFormSave(url, token, paymentRequestId, pspId, handleSuccess, handleError);\n\n const submitForm = React.useCallback(\n (event) => {\n event.preventDefault();\n event.stopPropagation();\n const rawData = {\n first_name: formData.firstName,\n last_name: formData.lastName,\n bank_account_number: formData.bankAccountNumber,\n bank_code: formData.bankCode,\n };\n\n const data = cleanObjectOnValues(rawData, ['', null]);\n saveForm(data);\n },\n [formData, saveForm],\n );\n\n const formatAndValidateBankCode = React.useCallback(\n (value) => {\n let bankCodeError = null;\n if (!bankCodeMap[value]) {\n bankCodeError = [t('hong_kong_form_bank_code_error')];\n }\n setErrors((prevState) => ({\n ...prevState,\n bankCode: bankCodeError,\n }));\n let isValid = bankCodeError === null && value.length === 3;\n if (isValid) {\n setBankName(bankCodeMap[value]);\n }\n setBankCodeIsValid(isValid);\n return value;\n },\n [t, setErrors, setBankCodeIsValid],\n );\n\n const formatAndValidateBankAccount = React.useCallback(\n (value) => {\n let bankAccountError = null;\n if (isNaN(value) || value.length !== 9) {\n bankAccountError = [t('hong_kong_form_bank_account_number_error')];\n }\n setErrors((prevState) => ({\n ...prevState,\n bankAccountNumber: bankAccountError,\n }));\n let isValid = bankAccountError === null;\n setBankAccountIsValid(isValid);\n return value;\n },\n [t, setErrors, setBankAccountIsValid],\n );\n\n\n const onBlurFormField = React.useCallback(\n (fieldName) => (_event) => {\n setFormFieldBlurState((prevState) => ({\n ...prevState,\n [fieldName]: true,\n }));\n },\n [],\n );\n\n const onChangeFormField = React.useCallback(\n (fieldName) => (event, newValue) => {\n setFormData((prevState) => ({\n ...prevState,\n [fieldName]: newValue,\n }));\n\n },\n [],\n );\n\n React.useImperativeHandle(\n ref,\n () => ({\n pay() {\n return formRef.current.click();\n },\n canClickOnPay: Object.values(formData).every((value) => !!value),\n }),\n [formData],\n );\n\n const requiredFields = [\n 'firstName',\n 'lastName',\n 'bankAccountNumber',\n 'bankCode',\n ];\n const hasRequiredFieldNotFilled = Object\n .values(\n Object.fromEntries(\n Object\n .entries(formData)\n .filter(([k, _v]) => requiredFields.includes(k)),\n ),\n )\n .some((value) => !value);\n\n return (\n \n \n
\n );\n },\n);\n\nHongKongForm.propTypes = {\n /**\n * The is of the PSP returned by the backend in order to be able to pass it when we submit the form data.\n */\n pspId: PropTypes.number.isRequired,\n /**\n * The token to use in order to be able to call the backend when we submit the form data.\n */\n token: PropTypes.string,\n /**\n * The paymentRequestID to use in order to be able to call the backend when we submit the data in the paymentPage.\n */\n paymentRequestId: PropTypes.string,\n /**\n * The backend url to use to pass the form data.\n */\n lyriaUrl: PropTypes.string.isRequired,\n /**\n * Whether the submit button must be displayed or not.\n */\n hidePayButton: PropTypes.bool,\n /**\n * The label of the 'pay' button to display. hidePayButton props must be false of course.\n */\n labelPayButton: PropTypes.string,\n /**\n * The callback function to trigger when the backend return the result of the form data submit.\n */\n onPaymentResult: PropTypes.func.isRequired,\n};\n\nHongKongForm.defaultProps = {\n hidePayButton: false,\n labelPayButton: null, // Fallback on 'pay' or 'ask refund' label.\n};\n\nHongKongForm.displayName = 'HongKongForm';\n\nexport default HongKongForm;\n","import React from 'react';\n\nimport axios from 'axios';\nimport PropTypes from 'prop-types';\nimport 'react-app-polyfill/ie9';\nimport 'react-app-polyfill/stable';\nimport { Trans, useTranslation } from 'react-i18next';\n\nimport ChileanForm from 'lib/components/ChileanForm';\nimport Clabe from 'lib/components/Clabe';\nimport ColombianForm from 'lib/components/ColombianForm';\nimport ErrorBlock from 'lib/components/ErrorBlock/ErrorBlock';\nimport Iban from 'lib/components/Iban';\nimport Ingenico from 'lib/components/Ingenico';\nimport IngenicoLegacy from 'lib/components/IngenicoLegacy';\nimport InternationalBank from 'lib/components/InternationalBank';\nimport Loader from 'lib/components/Loader';\nimport Payline from 'lib/components/Payline';\nimport PaypalForm from 'lib/components/PaypalForm';\nimport PaymentsOS from 'lib/components/PaymentsOS';\nimport PeruvianForm from '../PeruvianForm/PeruvianForm';\nimport PaymentMethodOption from 'lib/components/PaymentMethodOption';\nimport PaymentMethodOptionExpress from 'lib/components/PaymentMethodOptionExpress';\nimport SouthAfricanForm from 'lib/components/SouthAfricanForm';\nimport i18n from 'lib/config/i18n';\nimport { getClientCapabilities, lighenOrDarkenColor, getContrastText } from 'lib/utils/browserUtils';\nimport { intlPriceFormat } from 'lib/utils/currencyUtils';\nimport styles from './PspComposer.module.scss';\nimport HongKongForm from '../HongKongForm/HongKongForm';\n\nconst importAdyen = () => import('lib/components/Adyen');\nconst Adyen = React.lazy(importAdyen);\n\n/**\n * This is the main component that is exposed to be used by front-end projects that want to include payment providers.\n */\nconst PspComposer = React.forwardRef(\n (\n {\n token,\n paymentRequestId,\n lyriaUrl,\n sandbox,\n hidePayButton,\n labelPayButton,\n labelPayButtonApplePayAndGooglePay,\n forceDisplayPaymentMethodsInExpandableButton,\n shouldDisplayExpressCheckoutTitle,\n shouldDisplayPaymentMethodsTitle,\n onPaymentResult,\n onConfigReady,\n lang,\n loader,\n expandOptionIfOnlyOne,\n paymentCardInputWarningMessage,\n primaryColor,\n themeMode,\n },\n ref,\n ) => {\n\n if (typeof (lyria_debug) === 'undefined') {\n console.log = console.debug = console.info = function () { };\n }\n const [loading, setLoading] = React.useState(true);\n const [success, setSuccess] = React.useState(false);\n const [paymentMethods, setPaymentMethods] = React.useState([]);\n const [expandedPaymentMethodId, setExpandedPaymentMethodId] = React.useState(null);\n const [expandedPaymentMethodByDefaultDone, setExpandedPaymentMethodByDefaultDone] = React.useState(false);\n const [inProgressPaymentMethodId, setInProgressPaymentMethodId] = React.useState(null);\n const [errorCode, setErrorCode] = React.useState(null);\n const expandedPaymentMethodRef = React.useRef();\n const expressCheckoutAppleRef = React.useRef();\n const expressCheckoutGoogleRef = React.useRef();\n const [googleLoaded, setGoogleLoaded] = React.useState(false);\n const [googlePayAllowed, setGooglePayAllowed] = React.useState(false);\n\n const displaySpinner = loading || success;\n const paymentMethodsToDisplay = paymentMethods;\n\n const { t } = useTranslation();\n\n React.useEffect(() => {\n const googleLib = document.createElement('script');\n googleLib.src = 'https://pay.google.com/gp/p/js/pay.js';\n googleLib.async = true;\n googleLib.onload = () => {\n setGoogleLoaded(true);\n };\n document.head.appendChild(googleLib);\n return () => {\n document.head.removeChild(googleLib);\n };\n }, []);\n // preload adyen\n // it's a big chunk of code so we don't want to include it in the main js file\n // but we don't want to wait until we need to show the component either\n React.useEffect(() => {\n importAdyen();\n }, []);\n\n // handle both fr_FR and fr-FR\n React.useEffect(() => {\n i18n.changeLanguage(lang.replace('_', '-').toLowerCase());\n }, [lang]);\n\n /* Expose functions and props to external components */\n React.useImperativeHandle(\n ref,\n () => ({\n pay() {\n return (\n expandedPaymentMethodRef.current &&\n expandedPaymentMethodRef.current.pay()\n );\n },\n isAPaymentMethodExpanded: !!expandedPaymentMethodId,\n canClickOnPay: !!expandedPaymentMethodRef?.current?.canClickOnPay,\n }),\n [expandedPaymentMethodId],\n );\n\n\n /* Get the list of available payment methods from lyria backend according to the input token */\n React.useEffect(() => {\n setLoading(true);\n if ((!token && !paymentRequestId) || !lyriaUrl) {\n console.error('\"token\" and \"lyriaUrl\" are required');\n return;\n }\n\n setErrorCode(null);\n axios({\n method: 'post',\n url: `${lyriaUrl}/paymentConfig`,\n data: {\n request_token: token,\n payment_request_id: paymentRequestId,\n client_capabilities: getClientCapabilities(),\n },\n })\n .then((paymentConfigData) => {\n setPaymentMethods(paymentConfigData.data);\n onConfigReady(paymentConfigData.data);\n setLoading(false);\n })\n .catch((error) => {\n console.error(error);\n setLoading(false);\n setErrorCode('internal');\n });\n }, [token, lyriaUrl, onConfigReady, paymentRequestId]);\n\n React.useEffect(() => {\n if (!googleLoaded) {\n setGooglePayAllowed(false);\n return;\n }\n let googlepayPaymentMethod = paymentMethods.filter((paymentMethod) => ['google_pay'].includes(paymentMethod.config?.type));\n if (googlepayPaymentMethod.length === 0) {\n setGooglePayAllowed(false);\n console.log('no gpaymethod');\n return;\n }\n if (googlepayPaymentMethod.length > 1) {\n console.log('too many google pay providers');\n }\n let gpayPaymentMethod = googlepayPaymentMethod[0];\n\n if (!gpayPaymentMethod.config?.config) {\n setGooglePayAllowed(false);\n console.log('no config for this payment method');\n return;\n }\n\n const { environment, ...request } = gpayPaymentMethod.config.config.request;\n if (!request.allowedPaymentMethods || request.allowedPaymentMethods.length === 0) {\n console.log('no allowed gpay methods');\n return null;\n }\n let allowedGooglePayMethods = request.allowedPaymentMethods.map((element) => {\n return element.type;\n });\n // eslint-disable-next-line\n const paymentsClient = new google.payments.api.PaymentsClient({ environment: environment });\n paymentsClient.isReadyToPay({ allowedPaymentMethods: allowedGooglePayMethods }).then(\n (response) => {\n if (response.result) {\n setGooglePayAllowed(true);\n } else {\n setGooglePayAllowed(false);\n }\n })\n .catch(function (_err) {\n setGooglePayAllowed(false);\n },\n );\n }, [googleLoaded, paymentMethods]);\n\n\n const onErrorsReloadPaymentConfig = React.useCallback(\n (response) => {\n if (!['RetryWithTheSameCard', 'RetryWithAnotherCard', 'CheckYourCardDetails', 'AmountLimit', 'PSPError', 'PSPAPIError'].includes(response?.code)) {\n return;\n }\n axios({\n method: 'post',\n url: `${lyriaUrl}/paymentConfig`,\n data: {\n request_token: token,\n client_capabilities: getClientCapabilities(),\n },\n })\n .then((paymentConfigData) => {\n setPaymentMethods(paymentConfigData.data);\n setLoading(false);\n })\n .catch(() => {\n setLoading(false);\n setErrorCode('internal');\n });\n },\n [token, lyriaUrl],\n );\n\n\n const onClickPaymentMethodOption = React.useCallback(\n (paymentMethod) => (expanded) => {\n // We lock the expanded button to not be expandable or collapsable until payment process finished.\n if (inProgressPaymentMethodId) {\n return null;\n }\n if (expanded) {\n setExpandedPaymentMethodId(paymentMethod.id);\n } else {\n setExpandedPaymentMethodId(null);\n }\n },\n [inProgressPaymentMethodId],\n );\n\n const paymentResultCallback = React.useCallback(\n (res) => {\n if (res.success) {\n /* If the payment successes we display a loader because we don't want the user\n to see the payment form again until the host redirects to its own success page */\n setErrorCode(null);\n setSuccess(true);\n } else {\n setErrorCode(res.data?.code);\n setSuccess(false);\n /* If the payment failed we want to show the other psps expand buttons again if any\n to allow the user to select another payment method if needed */\n setInProgressPaymentMethodId(null);\n }\n onPaymentResult(res);\n },\n [onPaymentResult],\n );\n\n const paymentStartedCallback = React.useCallback(\n (paymentMethod) => () => {\n setErrorCode(null);\n setInProgressPaymentMethodId(paymentMethod.id);\n },\n [],\n );\n\n const getAdyenComponent = React.useCallback(\n (paymentMethod, isExpressApple = false, isExpressGoogle = false) => {\n // todo : filter to display only one adyen payment method, not a dozen since this must be either\n // Gp or apple pay\n let adyenRef;\n switch (true) {\n case isExpressApple:\n adyenRef = expressCheckoutAppleRef;\n break;\n case isExpressGoogle:\n adyenRef = expressCheckoutGoogleRef;\n break;\n default:\n adyenRef = expandedPaymentMethodRef;\n }\n let expressCheckout = isExpressApple || isExpressGoogle;\n return (\n Sandbox mode
}\n\n {errorCode && (\n
\n )}\n {!displaySpinner && !errorCode && !paymentMethodsToDisplay.length && (\n \n {loader}\n
\n )}\n {!displaySpinner && isExpressCheckoutAvailable && (\n \n
\n )}\n {!displaySpinner && paymentMethodsToDisplayInOption?.length > 0 && (\n \n {shouldDisplayPaymentMethodsTitle && (\n {loader}}>\n \n );\n break;\n case 'iban':\n paymentMethodComponent = (\n \n
\n );\n })}\n \n {t('selectPaymentMethod')}\n
\n )}\n {paymentMethodsToDisplayInOption.map((paymentMethod, index, array) => {\n let paymentMethodComponent;\n let paymentMethodOoptionIsCreditCard = paymentMethod.payment_methods.every(p => !!p.is_card);\n let paymentMethodOptionName = (paymentMethodOoptionIsCreditCard && paymentMethod.payment_methods?.length > 1)\n ? t('paymentMethodOptionCreditCard')\n : paymentMethod.payment_methods.map(p => p.label).join(' / ');\n // the payment method labels will be displayed if any payment_method has not «is_card» set to true,\n // or if there is just one payment method\n let paymentMethodOptionIcons = paymentMethod.payment_methods.map(p => p.payment_method);\n let paymentMethodIsComponentOnly = false;\n const isPaymentMethodOptionApplePay = paymentMethod.config?.type === 'apple_pay';\n const isPaymentMethodOptionGooglePay = paymentMethod.config?.type === 'google_pay';\n switch (paymentMethod.psp) {\n case 'payline':\n if (isPaymentMethodOptionGooglePay) {\n paymentMethodOptionName = 'Google Pay';\n paymentMethodOptionIcons = ['GooglePay'];\n let isSecureContextValue = true;\n try {\n isSecureContextValue = window.isSecureContext || isSecureContext;\n } catch (e) {\n // That means the browser does not support it\n }\n if (!isSecureContextValue) {\n return null;\n }\n } else if (isPaymentMethodOptionApplePay) {\n const ApplePaySession = 'ApplePaySession' in window ? window['ApplePaySession'] : null;\n const isInIframe = window.location !== window.top.location;\n if (!ApplePaySession || isInIframe) {\n return null;\n }\n paymentMethodOptionName = 'Apple Pay';\n paymentMethodOptionIcons = ['ApplePay'];\n }\n paymentMethodComponent = (\n \n
\n )}\n \n \n );\n },\n);\n\nPspComposer.propTypes = {\n /**\n * The token to use in order to be able to call the backend when we submit the form data.\n */\n token: PropTypes.string,\n /**\n * The id of the payment request\n */\n paymentRequestId : PropTypes.string,\n /**\n * The backend url to use to pass the form data.\n */\n lyriaUrl: PropTypes.string.isRequired,\n /**\n * Whether the payment process should be processed in a sandbox (for testing purpose).\n */\n sandbox: PropTypes.bool,\n /**\n * Whether the submit button must be displayed or not.\n * If true, it should be handle outside the LyriaPay component thanks to the 'ref' props.\n */\n hidePayButton: PropTypes.bool,\n /**\n * The label of the 'pay' button to display. hidePayButton props must be false of course.\n */\n labelPayButton: PropTypes.string,\n /**\n * The label of the 'pay' button to display for GogglePay and ApplePay.\n */\n labelPayButtonApplePayAndGooglePay: PropTypes.oneOf([\n 'buy',\n 'book',\n 'donate',\n 'order',\n 'pay',\n 'logoOnly',\n ]),\n /**\n * Whether we want to force all payment methods to be displayed in an expandable button.\n * This is especially for GooglePay and ApplePay.\n */\n forceDisplayPaymentMethodsInExpandableButton: PropTypes.bool,\n /**\n * Whether we want to display the title about express payment method ('express checkout') above the related section.\n */\n shouldDisplayExpressCheckoutTitle: PropTypes.bool,\n /**\n * Whether we want to display the title about regular payment method ('payment methods') above the related section.\n */\n shouldDisplayPaymentMethodsTitle: PropTypes.bool,\n /**\n * The callback function to trigger when the backend return the result of the form data submit.\n */\n onPaymentResult: PropTypes.func.isRequired,\n /**\n * The callback function on paymentConfig, only usefull for the dev env to setup the dev integration\n */\n onConfigReady: PropTypes.func,\n /**\n * The language code to use to translate all the labels of all the components.\n */\n lang: PropTypes.string,\n /**\n * The loader component to use when the payment or drop-in is loading.\n */\n loader: PropTypes.node,\n /**\n * Whether we want to expand the option by default if there is only one available.\n */\n expandOptionIfOnlyOne: PropTypes.bool,\n /**\n * A warning message to display for payment at the card input step (mainly to advise the user to save its payment method).\n */\n paymentCardInputWarningMessage: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n /**\n * The primary color to use in the whole component (especially for buttons).\n */\n primaryColor: PropTypes.string,\n /**\n * The theme to use (dark or light).\n */\n themeMode: PropTypes.oneOf(['light', 'dark']),\n};\n\nPspComposer.defaultProps = {\n sandbox: false,\n hidePayButton: false,\n labelPayButton: null, // Fallback on 'pay' or 'ask refund' label in the different components\n labelPayButtonApplePayAndGooglePay: 'buy',\n forceDisplayPaymentMethodsInExpandableButton: false,\n shouldDisplayExpressCheckoutTitle: true,\n shouldDisplayPaymentMethodsTitle: true,\n lang: '',\n loader: \n {\n setOpen((prevState) => !prevState);\n }}\n >\n
\n {children && open && (\n \n {header}\n
\n \n {open\n ? <>↓\n : <>→\n }\n
\n \n {children}\n
\n )}\n \n );\n};\n\nDevExpandableBlock.propTypes = {\n /**\n * Whether the block should be expanded.\n */\n expanded: PropTypes.bool,\n /**\n * The title or the header of the block.\n */\n header: PropTypes.any,\n /**\n * The content of the block when it is expanded.\n */\n children: PropTypes.any,\n};\n\nDevExpandableBlock.defaultProps = {\n expanded: false,\n header: null,\n children: null,\n};\n\nexport default DevExpandableBlock;\n","var _rect, _g, _defs;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nfunction SvgCheck(_ref, svgRef) {\n let {\n title,\n titleId,\n ...props\n } = _ref;\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: 80,\n height: 79,\n viewBox: \"0 0 80 79\",\n fill: \"none\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _rect || (_rect = /*#__PURE__*/React.createElement(\"rect\", {\n x: 0.5,\n width: 79,\n height: 79,\n rx: 36,\n fill: \"#F1F6FF\"\n })), _g || (_g = /*#__PURE__*/React.createElement(\"g\", {\n clipPath: \"url(#clip0_546_660)\"\n }, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M40 10C23.7337 10 10.5 23.2337 10.5 39.5C10.5 55.7663 23.7337 69 40 69C56.2663 69 69.5 55.7663 69.5 39.5C69.5 23.2337 56.2663 10 40 10ZM34.103 52.5183L23.1496 41.5886L27.315 37.4114L34.097 44.1817L49.7144 28.5644L53.8857 32.7356L34.103 52.5183Z\",\n fill: \"#0032FA\"\n }))), _defs || (_defs = /*#__PURE__*/React.createElement(\"defs\", null, /*#__PURE__*/React.createElement(\"clipPath\", {\n id: \"clip0_546_660\"\n }, /*#__PURE__*/React.createElement(\"rect\", {\n width: 59,\n height: 59,\n fill: \"white\",\n transform: \"translate(10.5 10)\"\n })))));\n}\nconst ForwardRef = /*#__PURE__*/React.forwardRef(SvgCheck);\nexport default __webpack_public_path__ + \"static/media/check.5fe598f69d6023813c49c220f6de3cd0.svg\";\nexport { ForwardRef as ReactComponent };","// extracted by mini-css-extract-plugin\nexport default {\"container\":\"CallbackPaymentBlock_container__yHDmR\",\"title\":\"CallbackPaymentBlock_title__FMAJa\",\"button\":\"CallbackPaymentBlock_button__JkAaF\",\"footer\":\"CallbackPaymentBlock_footer__0fmEm\"};","import React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport PropTypes from 'prop-types';\nimport checkIcon from '../../assets/check.svg';\nimport styles from './CallbackPaymentBlock.module.scss';\n\nconst CallbackPaymentBlock = ({\n isPaymentSuccess,\n redirectURL,\n redirectOnPaymentResult,\n}) => {\n\n const { t } = useTranslation();\n const displayRedirection = React.useMemo(() => typeof (redirectURL) === 'string', [redirectURL]);\n\n return (\n \n {isPaymentSuccess\n ?\n (\n <>\n 
\n
\n );\n};\n\nCallbackPaymentBlock.propTypes = {\n isPaymentSuccess: PropTypes.bool,\n redirectURL: PropTypes.string,\n redirectOnPaymentResult: PropTypes.func,\n};\n\nexport default CallbackPaymentBlock;\n","var _path;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nfunction SvgLock(_ref, svgRef) {\n let {\n title,\n titleId,\n ...props\n } = _ref;\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: 15,\n height: 15,\n viewBox: \"0 0 15 15\",\n fill: \"none\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n d: \"M13.5 7.5C13.5 6.67275 12.8273 6 12 6H11.25V3.75C11.25 1.68225 9.56775 0 7.5 0C5.43225 0 3.75 1.68225 3.75 3.75V6H3C2.17275 6 1.5 6.67275 1.5 7.5V13.5C1.5 14.3273 2.17275 15 3 15H12C12.8273 15 13.5 14.3273 13.5 13.5V7.5ZM5.25 3.75C5.25 2.5095 6.2595 1.5 7.5 1.5C8.7405 1.5 9.75 2.5095 9.75 3.75V6H5.25V3.75Z\",\n fill: \"black\"\n })));\n}\nconst ForwardRef = /*#__PURE__*/React.forwardRef(SvgLock);\nexport default __webpack_public_path__ + \"static/media/lock.344a31e79126e4ee90f59d998a6b67d5.svg\";\nexport { ForwardRef as ReactComponent };","var _path;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nfunction SvgWeez(_ref, svgRef) {\n let {\n title,\n titleId,\n ...props\n } = _ref;\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: 22,\n height: 22,\n viewBox: \"0 0 22 22\",\n fill: \"none\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n fillRule: \"evenodd\",\n clipRule: \"evenodd\",\n d: \"M17.7262 0H4.27335C1.91332 0 0 1.91334 0 4.27361V17.7266C0 20.0867 1.91332 22 4.27357 22H17.7264C20.0867 22 22 20.0867 22 17.7264V4.27339C21.9998 1.91334 20.0865 0 17.7262 0ZM10.3023 14.134C10.3023 14.3263 10.1464 14.4823 9.95402 14.4823H6.12331V15.875H9.95413C10.1465 15.875 10.3024 16.0309 10.3024 16.2232V17.2682H4.72995V12.0443C4.72995 11.852 4.88587 11.6961 5.07821 11.6961H6.1232V13.0892H9.95413C10.1465 13.0892 10.3024 13.2452 10.3024 13.4375L10.3023 14.134ZM11.6953 10.304H10.3023V11.3477C10.3023 11.4401 10.2656 11.5287 10.2003 11.594C10.135 11.6593 10.0464 11.696 9.95402 11.696H6.12331V10.3041H5.07832C4.98594 10.3042 4.89733 10.2675 4.83199 10.2022C4.76666 10.1369 4.72995 10.0483 4.72995 9.95588V4.73209H5.77494C5.86731 4.73209 5.95589 4.76878 6.0212 4.83409C6.08651 4.8994 6.1232 4.98799 6.1232 5.08035V10.3029H7.51634V5.08035C7.51634 4.98793 7.55307 4.8993 7.61845 4.83398C7.68384 4.76866 7.7725 4.732 7.86492 4.73209H8.56143C8.75377 4.73209 8.90969 4.88801 8.90969 5.08035V10.3029H10.3023V6.47317C10.3023 6.28083 10.4582 6.12491 10.6505 6.12491H11.6955V7.51806H16.9194C17.1117 7.51806 17.2676 7.67398 17.2676 7.86632V8.56284C17.2677 8.65521 17.231 8.74381 17.1657 8.80913C17.1003 8.87445 17.0117 8.91113 16.9194 8.9111H11.6955L11.6953 10.304ZM17.2698 17.268H12.046C11.9536 17.268 11.865 17.2314 11.7997 17.166C11.7344 17.1007 11.6977 17.0121 11.6977 16.9198V14.8304C11.6977 14.738 11.7344 14.6494 11.7997 14.5841C11.865 14.5188 11.9536 14.4821 12.046 14.4822H13.091V13.4372C13.091 13.2448 13.2469 13.0889 13.4392 13.0889H15.877V14.1339C15.877 14.3262 15.7211 14.4822 15.5288 14.4822H13.0905V15.875H16.9214C17.1137 15.875 17.2696 16.0309 17.2696 16.2232L17.2698 17.268ZM17.2698 11.6959V12.7409C17.2698 12.8332 17.2331 12.9218 17.1678 12.9871C17.1025 13.0524 17.0139 13.0891 16.9216 13.0891H15.8766V11.6964H12.0458C11.8534 11.6964 11.6975 11.5405 11.6975 11.3482V10.3032H16.9212C17.0137 10.3031 17.1024 10.3397 17.1678 10.4051C17.2332 10.4705 17.2699 10.5592 17.2698 10.6516V11.6959ZM17.2698 5.77786C17.2698 5.9702 17.1139 6.12612 16.9216 6.12612H11.6975V5.08112C11.6975 4.98875 11.7342 4.90015 11.7995 4.83483C11.8648 4.76951 11.9534 4.73283 12.0458 4.73286H17.2698V5.77786Z\",\n fill: \"#878C9B\"\n })));\n}\nconst ForwardRef = /*#__PURE__*/React.forwardRef(SvgWeez);\nexport default __webpack_public_path__ + \"static/media/weez.12e5cab85e6096aced139a34449cdc3c.svg\";\nexport { ForwardRef as ReactComponent };","// extracted by mini-css-extract-plugin\nexport default {\"body\":\"PaymentPage_body__HTeSc\",\"bluetext\":\"PaymentPage_bluetext__BPfPq\",\"header\":\"PaymentPage_header__7bEsY\",\"header_content\":\"PaymentPage_header_content__4arJk\",\"lock_icon\":\"PaymentPage_lock_icon__ihn8z\",\"content\":\"PaymentPage_content__FS6nm\",\"content_left\":\"PaymentPage_content_left__6WsM5\",\"payment\":\"PaymentPage_payment__qhjg5\",\"payment_method\":\"PaymentPage_payment_method__d5QVU\",\"footer\":\"PaymentPage_footer__lsDnK\",\"footer_lock_icon\":\"PaymentPage_footer_lock_icon__qj9rd\",\"poweredby\":\"PaymentPage_poweredby__4TGCa\"};","import React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport PspComposer from 'lib/components/PspComposer';\nimport CallbackPaymentBlock from 'lib/components/CallbackPaymentBlock';\n\nimport lockIcon from 'lib/assets/lock.svg';\nimport weezIcon from 'lib/assets/weez.svg';\n\nimport Loader from 'lib/components/Loader';\nimport styles from './PaymentPage.module.scss';\n\nconst PaymentPage = () => {\n const { t } = useTranslation();\n const integrationRef = React.useRef();\n const lyriaUrl = window.weezConfig?.lyriaUrl ?? 'http://localhost:8003';\n\n const [displayPaymentDone, setDisplayPaymentDone] = React.useState(false);\n const [isPaymentSuccess, setIsPaymentSuccess] = React.useState();\n const [redirectURL, setRedirectURL] = React.useState();\n const paymentRequestUUID = React.useMemo(() => {\n const path = window.location.pathname;\n const parts = path.split('/');\n return parts[parts.length - 1];\n }, []);\n\n\n const [loader, setLoader] = React.useState(\n {t('callbackValidatedPayment')}\n
\n \n )\n :\n (\n {t('callbackFailedPayment')}
\n )}\n {displayRedirection && (\n <>\n \n {t('callbackFooter')}
\n \n )}\n\n
\n );\n};\n\nexport default PaymentPage;\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport { I18nextProvider } from 'react-i18next';\nimport DevIntegration from 'dev/components/DevIntegration';\nimport PaymentPage from 'payment/PaymentPage';\nimport i18n from 'lib/config/i18n';\n\nimport './main.scss';\n\n/**\n * This is the entry point.\n * yarn start:payment-widget runs Dev Integration and a standalone Payment Page.\n * yarn start:lib runs a Dev Integration with the lib integrated in it.\n * Otherwise, LyriaPay is used as a library and so not as a running application.\n */\nReactDOM.render(\n \n
\n\n \n
\n {t('paymentCheckout')}
\n\n \n {t('securePayment')}\n
\n
\n\n \n
\n \n
\n \n
\n {t('paymentSecurityStandard')}
\n\n
\n \n \n {t('securePayment')}\n
{t('secureProtocolInfo')}
\n\n 
\n
\n {t('poweredBy')}
\n