@adyen/adyen-web 6.21.0 → 6.22.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (75) hide show
  1. package/README.md +1 -1
  2. package/dist/cjs/adyen.css +4 -4
  3. package/dist/cjs/adyen.css.map +1 -1
  4. package/dist/cjs/index.cjs +1 -1
  5. package/dist/cjs/index.cjs.map +1 -1
  6. package/dist/cjs/index.d.cts +19 -6
  7. package/dist/es/adyen.css +4 -4
  8. package/dist/es/adyen.css.map +1 -1
  9. package/dist/es/components/PayTo/components/BSBInput.js +1 -1
  10. package/dist/es/components/PayTo/components/BSBInput.js.map +1 -1
  11. package/dist/es/components/PayTo/components/PayIDInput.js +1 -1
  12. package/dist/es/components/PayTo/components/PayIDInput.js.map +1 -1
  13. package/dist/es/components/PayTo/components/PayToComponent.js +1 -1
  14. package/dist/es/components/PayTo/components/PayToComponent.js.map +1 -1
  15. package/dist/es/components/UPI/UPI.js +1 -1
  16. package/dist/es/components/UPI/UPI.js.map +1 -1
  17. package/dist/es/components/UPI/components/UPIComponent/UPIComponent.js +1 -1
  18. package/dist/es/components/UPI/components/UPIComponent/UPIComponent.js.map +1 -1
  19. package/dist/es/components/UPI/components/UPIMandate/UPIMandate.js +2 -0
  20. package/dist/es/components/UPI/components/UPIMandate/UPIMandate.js.map +1 -0
  21. package/dist/es/components/internal/Address/components/AddressSearch.js.map +1 -1
  22. package/dist/es/components/internal/Await/Await.js +1 -1
  23. package/dist/es/components/internal/Await/Await.js.map +1 -1
  24. package/dist/es/components/internal/FormFields/Fieldset/Fieldset.js +1 -1
  25. package/dist/es/components/internal/FormFields/Fieldset/Fieldset.js.map +1 -1
  26. package/dist/es/components/internal/IssuerList/IssuerList.js +1 -1
  27. package/dist/es/components/internal/IssuerList/IssuerList.js.map +1 -1
  28. package/dist/es/components/internal/QRLoader/QRLoader.js +1 -1
  29. package/dist/es/components/internal/QRLoader/QRLoader.js.map +1 -1
  30. package/dist/es/core/Analytics/Analytics.js +1 -1
  31. package/dist/es/core/Analytics/Analytics.js.map +1 -1
  32. package/dist/es/core/Analytics/utils.js +1 -1
  33. package/dist/es/core/Analytics/utils.js.map +1 -1
  34. package/dist/es/core/Services/analytics/collect-id.js +1 -1
  35. package/dist/es/core/Services/analytics/collect-id.js.map +1 -1
  36. package/dist/es/core/core.js +1 -1
  37. package/dist/es/core/core.js.map +1 -1
  38. package/dist/es/index.d.ts +19 -6
  39. package/dist/es/utils/setFocus.js +1 -1
  40. package/dist/es/utils/setFocus.js.map +1 -1
  41. package/dist/es-legacy/adyen.css +4 -4
  42. package/dist/es-legacy/adyen.css.map +1 -1
  43. package/dist/es-legacy/components/PayTo/components/BSBInput.js +1 -1
  44. package/dist/es-legacy/components/PayTo/components/BSBInput.js.map +1 -1
  45. package/dist/es-legacy/components/PayTo/components/PayIDInput.js +1 -1
  46. package/dist/es-legacy/components/PayTo/components/PayIDInput.js.map +1 -1
  47. package/dist/es-legacy/components/PayTo/components/PayToComponent.js +1 -1
  48. package/dist/es-legacy/components/PayTo/components/PayToComponent.js.map +1 -1
  49. package/dist/es-legacy/components/UPI/UPI.js +1 -1
  50. package/dist/es-legacy/components/UPI/UPI.js.map +1 -1
  51. package/dist/es-legacy/components/UPI/components/UPIComponent/UPIComponent.js +1 -1
  52. package/dist/es-legacy/components/UPI/components/UPIComponent/UPIComponent.js.map +1 -1
  53. package/dist/es-legacy/components/UPI/components/UPIMandate/UPIMandate.js +2 -0
  54. package/dist/es-legacy/components/UPI/components/UPIMandate/UPIMandate.js.map +1 -0
  55. package/dist/es-legacy/components/internal/Address/components/AddressSearch.js.map +1 -1
  56. package/dist/es-legacy/components/internal/Await/Await.js +1 -1
  57. package/dist/es-legacy/components/internal/Await/Await.js.map +1 -1
  58. package/dist/es-legacy/components/internal/FormFields/Fieldset/Fieldset.js +1 -1
  59. package/dist/es-legacy/components/internal/FormFields/Fieldset/Fieldset.js.map +1 -1
  60. package/dist/es-legacy/components/internal/IssuerList/IssuerList.js +1 -1
  61. package/dist/es-legacy/components/internal/IssuerList/IssuerList.js.map +1 -1
  62. package/dist/es-legacy/components/internal/QRLoader/QRLoader.js +1 -1
  63. package/dist/es-legacy/components/internal/QRLoader/QRLoader.js.map +1 -1
  64. package/dist/es-legacy/core/Analytics/Analytics.js +1 -1
  65. package/dist/es-legacy/core/Analytics/Analytics.js.map +1 -1
  66. package/dist/es-legacy/core/Analytics/utils.js +1 -1
  67. package/dist/es-legacy/core/Analytics/utils.js.map +1 -1
  68. package/dist/es-legacy/core/Services/analytics/collect-id.js +1 -1
  69. package/dist/es-legacy/core/Services/analytics/collect-id.js.map +1 -1
  70. package/dist/es-legacy/core/core.js +1 -1
  71. package/dist/es-legacy/core/core.js.map +1 -1
  72. package/dist/es-legacy/utils/setFocus.js +1 -1
  73. package/dist/es-legacy/utils/setFocus.js.map +1 -1
  74. package/package.json +157 -159
  75. package/styles/adyen.css +4 -4
@@ -1,2 +1,2 @@
1
- import{createElement as e}from"../../../external/preact/dist/preact.js";import r from"../../internal/FormFields/Fieldset/Fieldset.js";import{useEffect as a,useRef as t}from"../../../external/preact/hooks/dist/hooks.js";import o from"../../../utils/useForm/useForm.js";import{getErrorMessage as s}from"../../../utils/getErrorMessage.js";import n from"../../internal/FormFields/Field/Field.js";import{useCoreContext as l}from"../../../core/Context/CoreProvider.js";import i from"../../internal/FormFields/InputText.js";import{bsbValidationRules as b}from"./validate.js";import{phoneFormatters as u}from"../../internal/PhoneInput/validate.js";import m from"./PayToNameFields.js";const c=["bankAccountNumber","bsb","firstName","lastName"];function d({setComponentRef:d,defaultData:p,placeholders:f,onChange:N,setStatus:h}){const{i18n:k}=l(),F=o({schema:c,defaultData:p,rules:b,formatters:u}),{handleChangeFor:g,triggerValidation:j,data:A,errors:v,valid:B,isValid:C}=F;a(()=>{N({data:A,valid:B,errors:v,isValid:C})},[A,B,v,C]);const M=t({setStatus:h,showValidation:j});return a(()=>{d(M.current)},[d]),e(r,{classNameModifiers:["payto__bsb_input"],label:"BSB",description:"payto.bsb.description"},e(n,{label:k.get("payto.bsb.label.bankAccountNumber"),classNameModifiers:["col-60","bankAccountNumber"],errorMessage:s(k,v.bankAccountNumber,k.get("payto.bsb.label.bankAccountNumber")),name:"bankAccountNumber",i18n:k},e(i,{name:"bankAccountNumber",value:A.bankAccountNumber,onInput:g("bankAccountNumber","input"),onBlur:g("bankAccountNumber","blur"),placeholder:null==f?void 0:f.bankAccountNumber,required:!0})),e(n,{label:k.get("Bank State Branch"),classNameModifiers:["col-40","bsb"],errorMessage:s(k,v.bsb,k.get("Bank State Branch")),name:"bsb",i18n:k},e(i,{name:"bsb",value:A.bsb,onInput:g("bsb","input"),onBlur:g("bsb","blur"),placeholder:null==f?void 0:f.bsb,required:!0})),e(m,{i18n:k,data:A,handleChangeFor:g,errors:v,placeholders:f}))}export{d as default};
1
+ import{createElement as e}from"../../../external/preact/dist/preact.js";import r from"../../internal/FormFields/Fieldset/Fieldset.js";import{useEffect as a,useRef as t}from"../../../external/preact/hooks/dist/hooks.js";import o from"../../../utils/useForm/useForm.js";import{getErrorMessage as s}from"../../../utils/getErrorMessage.js";import n from"../../internal/FormFields/Field/Field.js";import{useCoreContext as i}from"../../../core/Context/CoreProvider.js";import l from"../../internal/FormFields/InputText.js";import{bsbValidationRules as b}from"./validate.js";import{phoneFormatters as u}from"../../internal/PhoneInput/validate.js";import m from"./PayToNameFields.js";const c=["bankAccountNumber","bsb","firstName","lastName"];function d({setComponentRef:d,defaultData:p,placeholders:f,onChange:N,setStatus:h,id:k}){const{i18n:F}=i(),g=o({schema:c,defaultData:p,rules:b,formatters:u}),{handleChangeFor:j,triggerValidation:A,data:v,errors:B,valid:C,isValid:M}=g;a(()=>{N({data:v,valid:C,errors:B,isValid:M})},[v,C,B,M]);const x=t({setStatus:h,showValidation:A});return a(()=>{d(x.current)},[d]),e(r,{id:k,classNameModifiers:["payto__bsb_input"],label:"BSB",description:"payto.bsb.description"},e(n,{label:F.get("payto.bsb.label.bankAccountNumber"),classNameModifiers:["col-60","bankAccountNumber"],errorMessage:s(F,B.bankAccountNumber,F.get("payto.bsb.label.bankAccountNumber")),name:"bankAccountNumber",i18n:F},e(l,{name:"bankAccountNumber",value:v.bankAccountNumber,onInput:j("bankAccountNumber","input"),onBlur:j("bankAccountNumber","blur"),placeholder:null==f?void 0:f.bankAccountNumber,required:!0})),e(n,{label:F.get("Bank State Branch"),classNameModifiers:["col-40","bsb"],errorMessage:s(F,B.bsb,F.get("Bank State Branch")),name:"bsb",i18n:F},e(l,{name:"bsb",value:v.bsb,onInput:j("bsb","input"),onBlur:j("bsb","blur"),placeholder:null==f?void 0:f.bsb,required:!0})),e(m,{i18n:F,data:v,handleChangeFor:j,errors:B,placeholders:f}))}export{d as default};
2
2
  //# sourceMappingURL=BSBInput.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"BSBInput.js","sources":["../../../../../src/components/PayTo/components/BSBInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport Fieldset from '../../internal/FormFields/Fieldset';\nimport { useEffect, useRef } from 'preact/hooks';\nimport useForm from '../../../utils/useForm';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport Field from '../../internal/FormFields/Field';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport InputText from '../../internal/FormFields/InputText';\nimport { bsbValidationRules } from './validate';\nimport './PayIDInput.scss';\nimport { phoneFormatters } from '../../internal/PhoneInput/validate';\nimport { ComponentMethodsRef, UIElementStatus } from '../../internal/UIElement/types';\nimport PayToNameFields from './PayToNameFields';\nimport { PayToPlaceholdersType } from '../types';\n\nexport interface BSBFormData {\n bsb: string;\n bankAccountNumber: string;\n firstName: string;\n lastName: string;\n}\n\nexport interface BSBInputProps {\n status: UIElementStatus;\n setStatus: (status: UIElementStatus) => void;\n defaultData: BSBFormData;\n placeholders: PayToPlaceholdersType;\n onChange: (e) => void;\n setComponentRef: (ref: ComponentMethodsRef) => void;\n}\n\nconst BASE_SCHEMA = ['bankAccountNumber', 'bsb', 'firstName', 'lastName'];\n\nexport default function BSBInput({ setComponentRef, defaultData, placeholders, onChange, setStatus }: BSBInputProps) {\n const { i18n } = useCoreContext();\n\n const form = useForm<BSBFormData>({\n schema: BASE_SCHEMA,\n defaultData: defaultData,\n rules: bsbValidationRules,\n formatters: phoneFormatters\n });\n const { handleChangeFor, triggerValidation, data, errors, valid, isValid } = form;\n\n // standard onChange propagate to parent state\n useEffect(() => {\n onChange({ data, valid, errors, isValid });\n }, [data, valid, errors, isValid]);\n\n const payToRef = useRef<ComponentMethodsRef>({\n setStatus: setStatus,\n showValidation: triggerValidation\n });\n\n useEffect(() => {\n setComponentRef(payToRef.current);\n }, [setComponentRef]);\n\n return (\n <Fieldset classNameModifiers={['payto__bsb_input']} label={'BSB'} description={'payto.bsb.description'}>\n <Field\n label={i18n.get('payto.bsb.label.bankAccountNumber')}\n classNameModifiers={['col-60', 'bankAccountNumber']}\n errorMessage={getErrorMessage(i18n, errors.bankAccountNumber, i18n.get('payto.bsb.label.bankAccountNumber'))}\n name={'bankAccountNumber'}\n i18n={i18n}\n >\n <InputText\n name={'bankAccountNumber'}\n value={data.bankAccountNumber}\n onInput={handleChangeFor('bankAccountNumber', 'input')}\n onBlur={handleChangeFor('bankAccountNumber', 'blur')}\n placeholder={placeholders?.bankAccountNumber}\n required={true}\n />\n </Field>\n\n <Field\n label={i18n.get('Bank State Branch')}\n classNameModifiers={['col-40', 'bsb']}\n errorMessage={getErrorMessage(i18n, errors.bsb, i18n.get('Bank State Branch'))}\n name={'bsb'}\n i18n={i18n}\n >\n <InputText\n name={'bsb'}\n value={data.bsb}\n onInput={handleChangeFor('bsb', 'input')}\n onBlur={handleChangeFor('bsb', 'blur')}\n placeholder={placeholders?.bsb}\n required={true}\n />\n </Field>\n\n <PayToNameFields i18n={i18n} data={data} handleChangeFor={handleChangeFor} errors={errors} placeholders={placeholders} />\n </Fieldset>\n );\n}\n"],"names":["BASE_SCHEMA","BSBInput","setComponentRef","defaultData","placeholders","onChange","setStatus","i18n","useCoreContext","form","useForm","schema","rules","bsbValidationRules","formatters","phoneFormatters","handleChangeFor","triggerValidation","data","errors","valid","isValid","useEffect","payToRef","useRef","showValidation","current","h","Fieldset","classNameModifiers","label","description","Field","get","errorMessage","getErrorMessage","bankAccountNumber","name","InputText","value","onInput","onBlur","placeholder","required","bsb","PayToNameFields"],"mappings":"oqBA+BA,MAAMA,EAAc,CAAC,oBAAqB,MAAO,YAAa,YAE/C,SAASC,GAASC,gBAAEA,EAAeC,YAAEA,EAAWC,aAAEA,EAAYC,SAAEA,EAAQC,UAAEA,IACrF,MAAMC,KAAEA,GAASC,IAEXC,EAAOC,EAAqB,CAC9BC,OAAQX,EACRG,YAAaA,EACbS,MAAOC,EACPC,WAAYC,KAEVC,gBAAEA,EAAeC,kBAAEA,EAAiBC,KAAEA,EAAIC,OAAEA,EAAMC,MAAEA,EAAKC,QAAEA,GAAYZ,EAG7Ea,EAAU,KACNjB,EAAS,CAAEa,OAAME,QAAOD,SAAQE,aACjC,CAACH,EAAME,EAAOD,EAAQE,IAEzB,MAAME,EAAWC,EAA4B,CACzClB,UAAWA,EACXmB,eAAgBR,IAOpB,OAJAK,EAAU,KACNpB,EAAgBqB,EAASG,UAC1B,CAACxB,IAGAyB,EAACC,EAAAA,CAASC,mBAAoB,CAAC,oBAAqBC,MAAO,MAAOC,YAAa,yBAC3EJ,EAACK,EAAAA,CACGF,MAAOvB,EAAK0B,IAAI,qCAChBJ,mBAAoB,CAAC,SAAU,qBAC/BK,aAAcC,EAAgB5B,EAAMY,EAAOiB,kBAAmB7B,EAAK0B,IAAI,sCACvEI,KAAM,oBACN9B,KAAMA,GAENoB,EAACW,EAAAA,CACGD,KAAM,oBACNE,MAAOrB,EAAKkB,kBACZI,QAASxB,EAAgB,oBAAqB,SAC9CyB,OAAQzB,EAAgB,oBAAqB,QAC7C0B,YAAatC,aAAAA,EAAAA,EAAcgC,kBAC3BO,UAAU,KAIlBhB,EAACK,EAAAA,CACGF,MAAOvB,EAAK0B,IAAI,qBAChBJ,mBAAoB,CAAC,SAAU,OAC/BK,aAAcC,EAAgB5B,EAAMY,EAAOyB,IAAKrC,EAAK0B,IAAI,sBACzDI,KAAM,MACN9B,KAAMA,GAENoB,EAACW,EAAAA,CACGD,KAAM,MACNE,MAAOrB,EAAK0B,IACZJ,QAASxB,EAAgB,MAAO,SAChCyB,OAAQzB,EAAgB,MAAO,QAC/B0B,YAAatC,aAAAA,EAAAA,EAAcwC,IAC3BD,UAAU,KAIlBhB,EAACkB,EAAAA,CAAgBtC,KAAMA,EAAMW,KAAMA,EAAMF,gBAAiBA,EAAiBG,OAAQA,EAAQf,aAAcA,IAGrH"}
1
+ {"version":3,"file":"BSBInput.js","sources":["../../../../../src/components/PayTo/components/BSBInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport Fieldset from '../../internal/FormFields/Fieldset';\nimport { useEffect, useRef } from 'preact/hooks';\nimport useForm from '../../../utils/useForm';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport Field from '../../internal/FormFields/Field';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport InputText from '../../internal/FormFields/InputText';\nimport { bsbValidationRules } from './validate';\nimport './PayIDInput.scss';\nimport { phoneFormatters } from '../../internal/PhoneInput/validate';\nimport { ComponentMethodsRef, UIElementStatus } from '../../internal/UIElement/types';\nimport PayToNameFields from './PayToNameFields';\nimport { PayToPlaceholdersType } from '../types';\n\nexport interface BSBFormData {\n bsb: string;\n bankAccountNumber: string;\n firstName: string;\n lastName: string;\n}\n\nexport interface BSBInputProps {\n status: UIElementStatus;\n setStatus: (status: UIElementStatus) => void;\n defaultData: BSBFormData;\n placeholders: PayToPlaceholdersType;\n onChange: (e) => void;\n setComponentRef: (ref: ComponentMethodsRef) => void;\n id?: string;\n}\n\nconst BASE_SCHEMA = ['bankAccountNumber', 'bsb', 'firstName', 'lastName'];\n\nexport default function BSBInput({ setComponentRef, defaultData, placeholders, onChange, setStatus, id }: BSBInputProps) {\n const { i18n } = useCoreContext();\n\n const form = useForm<BSBFormData>({\n schema: BASE_SCHEMA,\n defaultData: defaultData,\n rules: bsbValidationRules,\n formatters: phoneFormatters\n });\n const { handleChangeFor, triggerValidation, data, errors, valid, isValid } = form;\n\n // standard onChange propagate to parent state\n useEffect(() => {\n onChange({ data, valid, errors, isValid });\n }, [data, valid, errors, isValid]);\n\n const payToRef = useRef<ComponentMethodsRef>({\n setStatus: setStatus,\n showValidation: triggerValidation\n });\n\n useEffect(() => {\n setComponentRef(payToRef.current);\n }, [setComponentRef]);\n\n return (\n <Fieldset id={id} classNameModifiers={['payto__bsb_input']} label={'BSB'} description={'payto.bsb.description'}>\n <Field\n label={i18n.get('payto.bsb.label.bankAccountNumber')}\n classNameModifiers={['col-60', 'bankAccountNumber']}\n errorMessage={getErrorMessage(i18n, errors.bankAccountNumber, i18n.get('payto.bsb.label.bankAccountNumber'))}\n name={'bankAccountNumber'}\n i18n={i18n}\n >\n <InputText\n name={'bankAccountNumber'}\n value={data.bankAccountNumber}\n onInput={handleChangeFor('bankAccountNumber', 'input')}\n onBlur={handleChangeFor('bankAccountNumber', 'blur')}\n placeholder={placeholders?.bankAccountNumber}\n required={true}\n />\n </Field>\n\n <Field\n label={i18n.get('Bank State Branch')}\n classNameModifiers={['col-40', 'bsb']}\n errorMessage={getErrorMessage(i18n, errors.bsb, i18n.get('Bank State Branch'))}\n name={'bsb'}\n i18n={i18n}\n >\n <InputText\n name={'bsb'}\n value={data.bsb}\n onInput={handleChangeFor('bsb', 'input')}\n onBlur={handleChangeFor('bsb', 'blur')}\n placeholder={placeholders?.bsb}\n required={true}\n />\n </Field>\n\n <PayToNameFields i18n={i18n} data={data} handleChangeFor={handleChangeFor} errors={errors} placeholders={placeholders} />\n </Fieldset>\n );\n}\n"],"names":["BASE_SCHEMA","BSBInput","setComponentRef","defaultData","placeholders","onChange","setStatus","id","i18n","useCoreContext","form","useForm","schema","rules","bsbValidationRules","formatters","phoneFormatters","handleChangeFor","triggerValidation","data","errors","valid","isValid","useEffect","payToRef","useRef","showValidation","current","h","Fieldset","classNameModifiers","label","description","Field","get","errorMessage","getErrorMessage","bankAccountNumber","name","InputText","value","onInput","onBlur","placeholder","required","bsb","PayToNameFields"],"mappings":"oqBAgCA,MAAMA,EAAc,CAAC,oBAAqB,MAAO,YAAa,YAE/C,SAASC,GAASC,gBAAEA,EAAeC,YAAEA,EAAWC,aAAEA,EAAYC,SAAEA,EAAQC,UAAEA,EAASC,GAAEA,IAChG,MAAMC,KAAEA,GAASC,IAEXC,EAAOC,EAAqB,CAC9BC,OAAQZ,EACRG,YAAaA,EACbU,MAAOC,EACPC,WAAYC,KAEVC,gBAAEA,EAAeC,kBAAEA,EAAiBC,KAAEA,EAAIC,OAAEA,EAAMC,MAAEA,EAAKC,QAAEA,GAAYZ,EAG7Ea,EAAU,KACNlB,EAAS,CAAEc,OAAME,QAAOD,SAAQE,aACjC,CAACH,EAAME,EAAOD,EAAQE,IAEzB,MAAME,EAAWC,EAA4B,CACzCnB,UAAWA,EACXoB,eAAgBR,IAOpB,OAJAK,EAAU,KACNrB,EAAgBsB,EAASG,UAC1B,CAACzB,IAGA0B,EAACC,EAAAA,CAAStB,GAAIA,EAAIuB,mBAAoB,CAAC,oBAAqBC,MAAO,MAAOC,YAAa,yBACnFJ,EAACK,EAAAA,CACGF,MAAOvB,EAAK0B,IAAI,qCAChBJ,mBAAoB,CAAC,SAAU,qBAC/BK,aAAcC,EAAgB5B,EAAMY,EAAOiB,kBAAmB7B,EAAK0B,IAAI,sCACvEI,KAAM,oBACN9B,KAAMA,GAENoB,EAACW,EAAAA,CACGD,KAAM,oBACNE,MAAOrB,EAAKkB,kBACZI,QAASxB,EAAgB,oBAAqB,SAC9CyB,OAAQzB,EAAgB,oBAAqB,QAC7C0B,YAAavC,aAAAA,EAAAA,EAAciC,kBAC3BO,UAAU,KAIlBhB,EAACK,EAAAA,CACGF,MAAOvB,EAAK0B,IAAI,qBAChBJ,mBAAoB,CAAC,SAAU,OAC/BK,aAAcC,EAAgB5B,EAAMY,EAAOyB,IAAKrC,EAAK0B,IAAI,sBACzDI,KAAM,MACN9B,KAAMA,GAENoB,EAACW,EAAAA,CACGD,KAAM,MACNE,MAAOrB,EAAK0B,IACZJ,QAASxB,EAAgB,MAAO,SAChCyB,OAAQzB,EAAgB,MAAO,QAC/B0B,YAAavC,aAAAA,EAAAA,EAAcyC,IAC3BD,UAAU,KAIlBhB,EAACkB,EAAAA,CAAgBtC,KAAMA,EAAMW,KAAMA,EAAMF,gBAAiBA,EAAiBG,OAAQA,EAAQhB,aAAcA,IAGrH"}
@@ -1,2 +1,2 @@
1
- import{createElement as e}from"../../../external/preact/dist/preact.js";import r from"../../internal/FormFields/Fieldset/Fieldset.js";import i,{PayToIdentifierEnum as t}from"./IdentifierSelector.js";import{useEffect as o,useRef as a}from"../../../external/preact/hooks/dist/hooks.js";import n from"../../../utils/useForm/useForm.js";import l from"./PayToPhone.js";import s from"../../internal/FormFields/InputEmail.js";import{getErrorMessage as d}from"../../../utils/getErrorMessage.js";import m from"../../internal/FormFields/Field/Field.js";import{useCoreContext as p}from"../../../core/Context/CoreProvider.js";import c from"../../internal/FormFields/InputText.js";import{payIdValidationRules as f}from"./validate.js";import{phoneFormatters as u}from"../../internal/PhoneInput/validate.js";import g from"./PayToNameFields.js";function b(e,r,i){return r in e?Object.defineProperty(e,r,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[r]=i,e}function h(e){for(var r=1;r<arguments.length;r++){var i=null!=arguments[r]?arguments[r]:{},t=Object.keys(i);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(i).filter(function(e){return Object.getOwnPropertyDescriptor(i,e).enumerable}))),t.forEach(function(r){b(e,r,i[r])})}return e}const I=["selectedIdentifier","firstName","lastName"],j={[t.email]:["email"],[t.phone]:["phoneNumber","phonePrefix"],[t.abn]:["abn"],[t.orgid]:["orgid"]};function y({setComponentRef:b,defaultData:y,placeholders:F,onChange:v,setStatus:N}){const{i18n:P}=p(),M=n({schema:I,defaultData:h({selectedIdentifier:t.phone},y),rules:f,formatters:u}),{handleChangeFor:O,triggerValidation:C,data:E,errors:S,valid:x,isValid:B,setSchema:w}=M;o(()=>{w([...j[E.selectedIdentifier],...I])},[E.selectedIdentifier]),o(()=>{v({data:E,valid:x,errors:S,isValid:B})},[E,x,S,B]);const D=a({setStatus:N,showValidation:C});return o(()=>{b(D.current)},[b]),e(r,{classNameModifiers:["payto__payid_input"],label:"PayID",description:"payto.payid.description"},e(i,{classNameModifiers:["col-40"],onSelectedIdentifier:O("selectedIdentifier"),selectedIdentifier:E.selectedIdentifier}),E.selectedIdentifier===t.phone&&e(l,{onChange:O("phone","blur"),data:E,form:M}),E.selectedIdentifier===t.email&&e(m,{label:P.get("shopperEmail"),classNameModifiers:["col-60","email"],errorMessage:d(P,S.email,P.get("shopperEmail")),dir:"ltr",name:"email",i18n:P},e(s,{name:"email",value:E.email,onInput:O("email","input"),onBlur:O("email","blur"),placeholder:null==F?void 0:F.email,required:!0})),E.selectedIdentifier===t.abn&&e(m,{label:P.get("ABN"),classNameModifiers:["col-60","abn"],errorMessage:d(P,S.abn,P.get("ABN")),name:"ABN",i18n:P},e(c,{name:"abn",value:E.abn,onInput:O("abn","input"),onBlur:O("abn","blur"),placeholder:null==F?void 0:F.abn,required:!0})),E.selectedIdentifier===t.orgid&&e(m,{label:P.get("payto.payid.label.orgid"),classNameModifiers:["col-60","orgid"],errorMessage:d(P,S.orgid,P.get("payto.payid.label.orgid")),name:"orgid",i18n:P},e(c,{name:"orgid",value:E.orgid,onInput:O("orgid","input"),onBlur:O("orgid","blur"),placeholder:null==F?void 0:F.orgid,required:!0})),e(g,{i18n:P,data:E,handleChangeFor:O,errors:S,placeholders:F}))}export{y as default};
1
+ import{createElement as e}from"../../../external/preact/dist/preact.js";import r from"../../internal/FormFields/Fieldset/Fieldset.js";import i,{PayToIdentifierEnum as t}from"./IdentifierSelector.js";import{useEffect as o,useRef as a}from"../../../external/preact/hooks/dist/hooks.js";import n from"../../../utils/useForm/useForm.js";import l from"./PayToPhone.js";import s from"../../internal/FormFields/InputEmail.js";import{getErrorMessage as d}from"../../../utils/getErrorMessage.js";import m from"../../internal/FormFields/Field/Field.js";import{useCoreContext as p}from"../../../core/Context/CoreProvider.js";import c from"../../internal/FormFields/InputText.js";import{payIdValidationRules as f}from"./validate.js";import{phoneFormatters as u}from"../../internal/PhoneInput/validate.js";import g from"./PayToNameFields.js";function b(e,r,i){return r in e?Object.defineProperty(e,r,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[r]=i,e}function h(e){for(var r=1;r<arguments.length;r++){var i=null!=arguments[r]?arguments[r]:{},t=Object.keys(i);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(i).filter(function(e){return Object.getOwnPropertyDescriptor(i,e).enumerable}))),t.forEach(function(r){b(e,r,i[r])})}return e}const I=["selectedIdentifier","firstName","lastName"],j={[t.email]:["email"],[t.phone]:["phoneNumber","phonePrefix"],[t.abn]:["abn"],[t.orgid]:["orgid"]};function y({setComponentRef:b,defaultData:y,placeholders:F,onChange:v,setStatus:N,id:P}){const{i18n:M}=p(),O=n({schema:I,defaultData:h({selectedIdentifier:t.phone},y),rules:f,formatters:u}),{handleChangeFor:C,triggerValidation:E,data:S,errors:x,valid:B,isValid:w,setSchema:D}=O;o(()=>{D([...j[S.selectedIdentifier],...I])},[S.selectedIdentifier]),o(()=>{v({data:S,valid:B,errors:x,isValid:w})},[S,B,x,w]);const V=a({setStatus:N,showValidation:E});return o(()=>{b(V.current)},[b]),e(r,{id:P,classNameModifiers:["payto__payid_input"],label:"PayID",description:"payto.payid.description"},e(i,{classNameModifiers:["col-40"],onSelectedIdentifier:C("selectedIdentifier"),selectedIdentifier:S.selectedIdentifier}),S.selectedIdentifier===t.phone&&e(l,{onChange:C("phone","blur"),data:S,form:O}),S.selectedIdentifier===t.email&&e(m,{label:M.get("shopperEmail"),classNameModifiers:["col-60","email"],errorMessage:d(M,x.email,M.get("shopperEmail")),dir:"ltr",name:"email",i18n:M},e(s,{name:"email",value:S.email,onInput:C("email","input"),onBlur:C("email","blur"),placeholder:null==F?void 0:F.email,required:!0})),S.selectedIdentifier===t.abn&&e(m,{label:M.get("ABN"),classNameModifiers:["col-60","abn"],errorMessage:d(M,x.abn,M.get("ABN")),name:"ABN",i18n:M},e(c,{name:"abn",value:S.abn,onInput:C("abn","input"),onBlur:C("abn","blur"),placeholder:null==F?void 0:F.abn,required:!0})),S.selectedIdentifier===t.orgid&&e(m,{label:M.get("payto.payid.label.orgid"),classNameModifiers:["col-60","orgid"],errorMessage:d(M,x.orgid,M.get("payto.payid.label.orgid")),name:"orgid",i18n:M},e(c,{name:"orgid",value:S.orgid,onInput:C("orgid","input"),onBlur:C("orgid","blur"),placeholder:null==F?void 0:F.orgid,required:!0})),e(g,{i18n:M,data:S,handleChangeFor:C,errors:x,placeholders:F}))}export{y as default};
2
2
  //# sourceMappingURL=PayIDInput.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"PayIDInput.js","sources":["../../../../../src/components/PayTo/components/PayIDInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport Fieldset from '../../internal/FormFields/Fieldset';\nimport IdentifierSelector, { PayToIdentifierEnum } from './IdentifierSelector';\nimport { useEffect, useRef } from 'preact/hooks';\nimport useForm from '../../../utils/useForm';\nimport PayToPhone from './PayToPhone';\nimport InputEmail from '../../internal/FormFields/InputEmail';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport Field from '../../internal/FormFields/Field';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport InputText from '../../internal/FormFields/InputText';\nimport { payIdValidationRules } from './validate';\nimport './PayIDInput.scss';\nimport { phoneFormatters } from '../../internal/PhoneInput/validate';\nimport { ComponentMethodsRef, UIElementStatus } from '../../internal/UIElement/types';\nimport PayToNameFields from './PayToNameFields';\nimport { PayToPlaceholdersType } from '../types';\n\nexport interface PayIdFormData {\n email: string;\n phone: string;\n abn: string;\n orgid: string;\n firstName: string;\n lastName: string;\n phoneNumber?: string;\n phonePrefix?: string;\n selectedIdentifier: PayToIdentifierEnum;\n}\n\nexport interface PayIDInputProps {\n status: UIElementStatus;\n setStatus: (status: UIElementStatus) => void;\n defaultData: PayIdFormData;\n placeholders: PayToPlaceholdersType;\n onChange: (e) => void;\n setComponentRef: (ref: ComponentMethodsRef) => void;\n}\n\nconst BASE_SCHEMA = ['selectedIdentifier', 'firstName', 'lastName'];\n\nconst IDENTIFIER_SCHEMA = {\n [PayToIdentifierEnum.email]: ['email'],\n [PayToIdentifierEnum.phone]: ['phoneNumber', 'phonePrefix'],\n [PayToIdentifierEnum.abn]: ['abn'],\n [PayToIdentifierEnum.orgid]: ['orgid']\n};\n\nexport default function PayIDInput({ setComponentRef, defaultData, placeholders, onChange, setStatus }: PayIDInputProps) {\n const { i18n } = useCoreContext();\n\n const form = useForm<PayIdFormData>({\n schema: BASE_SCHEMA,\n defaultData: { selectedIdentifier: PayToIdentifierEnum.phone, ...defaultData },\n rules: payIdValidationRules,\n formatters: phoneFormatters\n });\n const { handleChangeFor, triggerValidation, data, errors, valid, isValid, setSchema } = form;\n\n // handle the changes of identifier, each identifier gets its own schema\n useEffect(() => {\n // get the correct schema for each identifier and merge it with the base\n setSchema([...IDENTIFIER_SCHEMA[data.selectedIdentifier], ...BASE_SCHEMA]);\n }, [data.selectedIdentifier]);\n\n // standard onChange propagate to parent state\n useEffect(() => {\n onChange({ data, valid, errors, isValid });\n }, [data, valid, errors, isValid]);\n\n const payToRef = useRef<ComponentMethodsRef>({\n setStatus: setStatus,\n showValidation: triggerValidation\n });\n\n useEffect(() => {\n setComponentRef(payToRef.current);\n }, [setComponentRef]);\n\n return (\n <Fieldset classNameModifiers={['payto__payid_input']} label={'PayID'} description={'payto.payid.description'}>\n <IdentifierSelector\n classNameModifiers={['col-40']}\n onSelectedIdentifier={handleChangeFor('selectedIdentifier')}\n selectedIdentifier={data.selectedIdentifier}\n />\n {data.selectedIdentifier === PayToIdentifierEnum.phone && (\n <PayToPhone onChange={handleChangeFor('phone', 'blur')} data={data} form={form} />\n )}\n\n {/* TODO probably worth refactoring this into either re-usable components or builder */}\n {data.selectedIdentifier === PayToIdentifierEnum.email && (\n <Field\n label={i18n.get('shopperEmail')}\n classNameModifiers={['col-60', 'email']}\n errorMessage={getErrorMessage(i18n, errors.email, i18n.get('shopperEmail'))}\n dir={'ltr'}\n name={'email'}\n i18n={i18n}\n >\n <InputEmail\n name={'email'}\n value={data.email}\n onInput={handleChangeFor('email', 'input')}\n onBlur={handleChangeFor('email', 'blur')}\n placeholder={placeholders?.email}\n required={true}\n />\n </Field>\n )}\n\n {data.selectedIdentifier === PayToIdentifierEnum.abn && (\n <Field\n label={i18n.get('ABN')}\n classNameModifiers={['col-60', 'abn']}\n errorMessage={getErrorMessage(i18n, errors.abn, i18n.get('ABN'))}\n name={'ABN'}\n i18n={i18n}\n >\n <InputText\n name={'abn'}\n value={data.abn}\n onInput={handleChangeFor('abn', 'input')}\n onBlur={handleChangeFor('abn', 'blur')}\n placeholder={placeholders?.abn}\n required={true}\n />\n </Field>\n )}\n\n {data.selectedIdentifier === PayToIdentifierEnum.orgid && (\n <Field\n label={i18n.get('payto.payid.label.orgid')}\n classNameModifiers={['col-60', 'orgid']}\n errorMessage={getErrorMessage(i18n, errors.orgid, i18n.get('payto.payid.label.orgid'))}\n name={'orgid'}\n i18n={i18n}\n >\n <InputText\n name={'orgid'}\n value={data.orgid}\n onInput={handleChangeFor('orgid', 'input')}\n onBlur={handleChangeFor('orgid', 'blur')}\n placeholder={placeholders?.orgid}\n required={true}\n />\n </Field>\n )}\n\n <PayToNameFields i18n={i18n} data={data} handleChangeFor={handleChangeFor} errors={errors} placeholders={placeholders} />\n </Fieldset>\n );\n}\n"],"names":["BASE_SCHEMA","IDENTIFIER_SCHEMA","PayToIdentifierEnum","email","phone","abn","orgid","PayIDInput","setComponentRef","defaultData","placeholders","onChange","setStatus","i18n","useCoreContext","form","useForm","schema","_object_spread","selectedIdentifier","rules","payIdValidationRules","formatters","phoneFormatters","handleChangeFor","triggerValidation","data","errors","valid","isValid","setSchema","useEffect","payToRef","useRef","showValidation","current","h","Fieldset","classNameModifiers","label","description","IdentifierSelector","onSelectedIdentifier","PayToPhone","Field","get","errorMessage","getErrorMessage","dir","name","InputEmail","value","onInput","onBlur","placeholder","required","InputText","PayToNameFields"],"mappings":"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"}
1
+ {"version":3,"file":"PayIDInput.js","sources":["../../../../../src/components/PayTo/components/PayIDInput.tsx"],"sourcesContent":["import { h } from 'preact';\nimport Fieldset from '../../internal/FormFields/Fieldset';\nimport IdentifierSelector, { PayToIdentifierEnum } from './IdentifierSelector';\nimport { useEffect, useRef } from 'preact/hooks';\nimport useForm from '../../../utils/useForm';\nimport PayToPhone from './PayToPhone';\nimport InputEmail from '../../internal/FormFields/InputEmail';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport Field from '../../internal/FormFields/Field';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport InputText from '../../internal/FormFields/InputText';\nimport { payIdValidationRules } from './validate';\nimport './PayIDInput.scss';\nimport { phoneFormatters } from '../../internal/PhoneInput/validate';\nimport { ComponentMethodsRef, UIElementStatus } from '../../internal/UIElement/types';\nimport PayToNameFields from './PayToNameFields';\nimport { PayToPlaceholdersType } from '../types';\n\nexport interface PayIdFormData {\n email: string;\n phone: string;\n abn: string;\n orgid: string;\n firstName: string;\n lastName: string;\n phoneNumber?: string;\n phonePrefix?: string;\n selectedIdentifier: PayToIdentifierEnum;\n}\n\nexport interface PayIDInputProps {\n status: UIElementStatus;\n setStatus: (status: UIElementStatus) => void;\n defaultData: PayIdFormData;\n placeholders: PayToPlaceholdersType;\n onChange: (e) => void;\n setComponentRef: (ref: ComponentMethodsRef) => void;\n id?: string;\n}\n\nconst BASE_SCHEMA = ['selectedIdentifier', 'firstName', 'lastName'];\n\nconst IDENTIFIER_SCHEMA = {\n [PayToIdentifierEnum.email]: ['email'],\n [PayToIdentifierEnum.phone]: ['phoneNumber', 'phonePrefix'],\n [PayToIdentifierEnum.abn]: ['abn'],\n [PayToIdentifierEnum.orgid]: ['orgid']\n};\n\nexport default function PayIDInput({ setComponentRef, defaultData, placeholders, onChange, setStatus, id }: PayIDInputProps) {\n const { i18n } = useCoreContext();\n\n const form = useForm<PayIdFormData>({\n schema: BASE_SCHEMA,\n defaultData: { selectedIdentifier: PayToIdentifierEnum.phone, ...defaultData },\n rules: payIdValidationRules,\n formatters: phoneFormatters\n });\n const { handleChangeFor, triggerValidation, data, errors, valid, isValid, setSchema } = form;\n\n // handle the changes of identifier, each identifier gets its own schema\n useEffect(() => {\n // get the correct schema for each identifier and merge it with the base\n setSchema([...IDENTIFIER_SCHEMA[data.selectedIdentifier], ...BASE_SCHEMA]);\n }, [data.selectedIdentifier]);\n\n // standard onChange propagate to parent state\n useEffect(() => {\n onChange({ data, valid, errors, isValid });\n }, [data, valid, errors, isValid]);\n\n const payToRef = useRef<ComponentMethodsRef>({\n setStatus: setStatus,\n showValidation: triggerValidation\n });\n\n useEffect(() => {\n setComponentRef(payToRef.current);\n }, [setComponentRef]);\n\n return (\n <Fieldset id={id} classNameModifiers={['payto__payid_input']} label={'PayID'} description={'payto.payid.description'}>\n <IdentifierSelector\n classNameModifiers={['col-40']}\n onSelectedIdentifier={handleChangeFor('selectedIdentifier')}\n selectedIdentifier={data.selectedIdentifier}\n />\n {data.selectedIdentifier === PayToIdentifierEnum.phone && (\n <PayToPhone onChange={handleChangeFor('phone', 'blur')} data={data} form={form} />\n )}\n\n {/* TODO probably worth refactoring this into either re-usable components or builder */}\n {data.selectedIdentifier === PayToIdentifierEnum.email && (\n <Field\n label={i18n.get('shopperEmail')}\n classNameModifiers={['col-60', 'email']}\n errorMessage={getErrorMessage(i18n, errors.email, i18n.get('shopperEmail'))}\n dir={'ltr'}\n name={'email'}\n i18n={i18n}\n >\n <InputEmail\n name={'email'}\n value={data.email}\n onInput={handleChangeFor('email', 'input')}\n onBlur={handleChangeFor('email', 'blur')}\n placeholder={placeholders?.email}\n required={true}\n />\n </Field>\n )}\n\n {data.selectedIdentifier === PayToIdentifierEnum.abn && (\n <Field\n label={i18n.get('ABN')}\n classNameModifiers={['col-60', 'abn']}\n errorMessage={getErrorMessage(i18n, errors.abn, i18n.get('ABN'))}\n name={'ABN'}\n i18n={i18n}\n >\n <InputText\n name={'abn'}\n value={data.abn}\n onInput={handleChangeFor('abn', 'input')}\n onBlur={handleChangeFor('abn', 'blur')}\n placeholder={placeholders?.abn}\n required={true}\n />\n </Field>\n )}\n\n {data.selectedIdentifier === PayToIdentifierEnum.orgid && (\n <Field\n label={i18n.get('payto.payid.label.orgid')}\n classNameModifiers={['col-60', 'orgid']}\n errorMessage={getErrorMessage(i18n, errors.orgid, i18n.get('payto.payid.label.orgid'))}\n name={'orgid'}\n i18n={i18n}\n >\n <InputText\n name={'orgid'}\n value={data.orgid}\n onInput={handleChangeFor('orgid', 'input')}\n onBlur={handleChangeFor('orgid', 'blur')}\n placeholder={placeholders?.orgid}\n required={true}\n />\n </Field>\n )}\n\n <PayToNameFields i18n={i18n} data={data} handleChangeFor={handleChangeFor} errors={errors} placeholders={placeholders} />\n </Fieldset>\n );\n}\n"],"names":["BASE_SCHEMA","IDENTIFIER_SCHEMA","PayToIdentifierEnum","email","phone","abn","orgid","PayIDInput","setComponentRef","defaultData","placeholders","onChange","setStatus","id","i18n","useCoreContext","form","useForm","schema","_object_spread","selectedIdentifier","rules","payIdValidationRules","formatters","phoneFormatters","handleChangeFor","triggerValidation","data","errors","valid","isValid","setSchema","useEffect","payToRef","useRef","showValidation","current","h","Fieldset","classNameModifiers","label","description","IdentifierSelector","onSelectedIdentifier","PayToPhone","Field","get","errorMessage","getErrorMessage","dir","name","InputEmail","value","onInput","onBlur","placeholder","required","InputText","PayToNameFields"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{createElement as e}from"../../../external/preact/dist/preact.js";import t from"../../internal/SegmentedControl/SegmentedControl.js";import{useState as o,useMemo as n}from"../../../external/preact/hooks/dist/hooks.js";import a from"./PayIDInput.js";import r from"./BSBInput.js";import{useCoreContext as s}from"../../../core/Context/CoreProvider.js";import i from"../../../_virtual/index.js";function l(e,t,o){return t in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e}function p(e){for(var t=1;t<arguments.length;t++){var o=null!=arguments[t]?arguments[t]:{},n=Object.keys(o);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(o).filter(function(e){return Object.getOwnPropertyDescriptor(o,e).enumerable}))),n.forEach(function(t){l(e,t,o[t])})}return e}function u(l){const{i18n:u}=s(),[c,d]=o("ready"),m=n(()=>[{value:"payid-option",label:"PayID",id:"payid-option",controls:"payid-input"},{value:"bsb-option",label:u.get("payto.bsb.option.label"),id:"bsb-option",controls:"bsb-input"}],[u]),f=m[0].value,[b,y]=o(f),g=({data:e,valid:t,errors:o,isValid:n})=>{l.onChange({data:p({selectedInput:b},e),valid:t,errors:o,isValid:n})};return e("div",{className:i({"adyen-checkout__payto-component":!0,"adyen-checkout__payto-component--loading":"loading"===c})},e(t,{selectedValue:b,options:m,onChange:y}),"payid-option"===b&&e(a,{status:c,setStatus:d,setComponentRef:l.setComponentRef,onChange:g,defaultData:l.data,placeholders:l.placeholders}),"bsb-option"===b&&e(r,{status:c,setStatus:d,setComponentRef:l.setComponentRef,onChange:g,defaultData:l.data,placeholders:l.placeholders}),l.showPayButton&&l.payButton({status:c,label:u.get("continue")}))}export{u as default};
1
+ import{createElement as t}from"../../../external/preact/dist/preact.js";import e from"../../internal/SegmentedControl/SegmentedControl.js";import{useState as o,useMemo as n}from"../../../external/preact/hooks/dist/hooks.js";import a from"./PayIDInput.js";import r from"./BSBInput.js";import{useCoreContext as s}from"../../../core/Context/CoreProvider.js";import i from"../../../_virtual/index.js";import{getUniqueId as l}from"../../../utils/idGenerator.js";function p(t,e,o){return e in t?Object.defineProperty(t,e,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[e]=o,t}function u(t){for(var e=1;e<arguments.length;e++){var o=null!=arguments[e]?arguments[e]:{},n=Object.keys(o);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(o).filter(function(t){return Object.getOwnPropertyDescriptor(o,t).enumerable}))),n.forEach(function(e){p(t,e,o[e])})}return t}function d(p){const{i18n:d}=s(),[c,m]=o("ready"),f=n(()=>l("payid-input"),[]),b=n(()=>l("bsb-input"),[]),y=n(()=>[{value:"payid-option",label:"PayID",id:"payid-option",controls:f},{value:"bsb-option",label:d.get("payto.bsb.option.label"),id:"bsb-option",controls:b}],[d,f,b]),g=y[0].value,[h,j]=o(g),C=({data:t,valid:e,errors:o,isValid:n})=>{p.onChange({data:u({selectedInput:h},t),valid:e,errors:o,isValid:n})};return t("div",{className:i({"adyen-checkout__payto-component":!0,"adyen-checkout__payto-component--loading":"loading"===c})},t(e,{selectedValue:h,options:y,onChange:j}),"payid-option"===h&&t(a,{id:f,status:c,setStatus:m,setComponentRef:p.setComponentRef,onChange:C,defaultData:p.data,placeholders:p.placeholders}),"bsb-option"===h&&t(r,{id:b,status:c,setStatus:m,setComponentRef:p.setComponentRef,onChange:C,defaultData:p.data,placeholders:p.placeholders}),p.showPayButton&&p.payButton({status:c,label:d.get("continue")}))}export{d as default};
2
2
  //# sourceMappingURL=PayToComponent.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"PayToComponent.js","sources":["../../../../../src/components/PayTo/components/PayToComponent.tsx"],"sourcesContent":["import { h } from 'preact';\nimport SegmentedControl from '../../internal/SegmentedControl';\nimport { useMemo, useState } from 'preact/hooks';\nimport { SegmentedControlOptions } from '../../internal/SegmentedControl/SegmentedControl';\nimport PayIDInput from './PayIDInput';\nimport BSBInput from './BSBInput';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { ComponentMethodsRef, UIElementStatus } from '../../internal/UIElement/types';\nimport { PayToData, PayToPlaceholdersType } from '../types';\nimport { PayButtonProps } from '../../internal/PayButton/PayButton';\nimport classNames from 'classnames';\nimport './PayToComponent.scss';\n\nexport type PayToInputOption = 'payid-option' | 'bsb-option';\n\nexport type PayToComponentData = { selectedInput: PayToInputOption };\n\nexport interface PayToComponentProps {\n showPayButton: boolean;\n onChange: (e) => void;\n setComponentRef: (ref: ComponentMethodsRef) => void;\n data: PayToData;\n placeholders: PayToPlaceholdersType;\n payButton: (props: Partial<PayButtonProps>) => h.JSX.Element;\n}\n\nexport default function PayToComponent(props: PayToComponentProps) {\n const { i18n } = useCoreContext();\n\n const [status, setStatus] = useState<UIElementStatus>('ready');\n\n const inputOptions: SegmentedControlOptions<PayToInputOption> = useMemo(\n () => [\n {\n value: 'payid-option',\n label: 'PayID',\n id: 'payid-option',\n controls: 'payid-input'\n },\n {\n value: 'bsb-option',\n label: i18n.get('payto.bsb.option.label'),\n id: 'bsb-option',\n controls: 'bsb-input'\n }\n ],\n [i18n]\n );\n\n const defaultOption = inputOptions[0].value;\n const [selectedInput, setSelectedInput] = useState<PayToInputOption>(defaultOption);\n\n const onChange = ({ data, valid, errors, isValid }) => {\n // merge selected input to as data, this keep the input layers untouched\n props.onChange({ data: { selectedInput: selectedInput, ...data }, valid, errors, isValid });\n };\n\n return (\n <div\n className={classNames({\n 'adyen-checkout__payto-component': true,\n 'adyen-checkout__payto-component--loading': status === 'loading'\n })}\n >\n <SegmentedControl selectedValue={selectedInput} options={inputOptions} onChange={setSelectedInput} />\n {selectedInput === 'payid-option' && (\n <PayIDInput\n status={status}\n setStatus={setStatus}\n setComponentRef={props.setComponentRef}\n onChange={onChange}\n defaultData={props.data}\n placeholders={props.placeholders}\n />\n )}\n {selectedInput === 'bsb-option' && (\n <BSBInput\n status={status}\n setStatus={setStatus}\n setComponentRef={props.setComponentRef}\n onChange={onChange}\n defaultData={props.data}\n placeholders={props.placeholders}\n />\n )}\n\n {props.showPayButton && props.payButton({ status, label: i18n.get('continue') })}\n </div>\n );\n}\n"],"names":["PayToComponent","props","i18n","useCoreContext","status","setStatus","useState","inputOptions","useMemo","value","label","id","controls","get","defaultOption","selectedInput","setSelectedInput","onChange","data","valid","errors","isValid","_object_spread","h","div","className","classNames","SegmentedControl","selectedValue","options","PayIDInput","setComponentRef","defaultData","placeholders","BSBInput","showPayButton","payButton"],"mappings":"y0BA0Be,SAASA,EAAeC,GACnC,MAAMC,KAAEA,GAASC,KAEVC,EAAQC,GAAaC,EAA0B,SAEhDC,EAA0DC,EAC5D,IAAM,CACF,CACIC,MAAO,eACPC,MAAO,QACPC,GAAI,eACJC,SAAU,eAEd,CACIH,MAAO,aACPC,MAAOR,EAAKW,IAAI,0BAChBF,GAAI,aACJC,SAAU,cAGlB,CAACV,IAGCY,EAAgBP,EAAa,GAAGE,OAC/BM,EAAeC,GAAoBV,EAA2BQ,GAE/DG,EAAW,EAAGC,OAAMC,QAAOC,SAAQC,cAErCpB,EAAMgB,SAAS,CAAEC,KAAMI,EAAA,CAAEP,cAAeA,GAAkBG,GAAQC,QAAOC,SAAQC,aAGrF,OACIE,EAACC,MAAAA,CACGC,UAAWC,EAAW,CAClB,mCAAmC,EACnC,2CAAuD,YAAXtB,KAGhDmB,EAACI,EAAAA,CAAiBC,cAAeb,EAAec,QAAStB,EAAcU,SAAUD,IAC9D,iBAAlBD,GACGQ,EAACO,EAAAA,CACG1B,OAAQA,EACRC,UAAWA,EACX0B,gBAAiB9B,EAAM8B,gBACvBd,SAAUA,EACVe,YAAa/B,EAAMiB,KACnBe,aAAchC,EAAMgC,eAGT,eAAlBlB,GACGQ,EAACW,EAAAA,CACG9B,OAAQA,EACRC,UAAWA,EACX0B,gBAAiB9B,EAAM8B,gBACvBd,SAAUA,EACVe,YAAa/B,EAAMiB,KACnBe,aAAchC,EAAMgC,eAI3BhC,EAAMkC,eAAiBlC,EAAMmC,UAAU,CAAEhC,SAAQM,MAAOR,EAAKW,IAAI,cAG9E"}
1
+ {"version":3,"file":"PayToComponent.js","sources":["../../../../../src/components/PayTo/components/PayToComponent.tsx"],"sourcesContent":["import { h } from 'preact';\nimport SegmentedControl from '../../internal/SegmentedControl';\nimport { useMemo, useState } from 'preact/hooks';\nimport { SegmentedControlOptions } from '../../internal/SegmentedControl/SegmentedControl';\nimport PayIDInput from './PayIDInput';\nimport BSBInput from './BSBInput';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { ComponentMethodsRef, UIElementStatus } from '../../internal/UIElement/types';\nimport { PayToData, PayToPlaceholdersType } from '../types';\nimport { PayButtonProps } from '../../internal/PayButton/PayButton';\nimport classNames from 'classnames';\nimport { getUniqueId } from '../../../utils/idGenerator';\nimport './PayToComponent.scss';\n\nexport type PayToInputOption = 'payid-option' | 'bsb-option';\n\nexport type PayToComponentData = { selectedInput: PayToInputOption };\n\nexport interface PayToComponentProps {\n showPayButton: boolean;\n onChange: (e) => void;\n setComponentRef: (ref: ComponentMethodsRef) => void;\n data: PayToData;\n placeholders: PayToPlaceholdersType;\n payButton: (props: Partial<PayButtonProps>) => h.JSX.Element;\n}\n\nexport default function PayToComponent(props: PayToComponentProps) {\n const { i18n } = useCoreContext();\n\n const [status, setStatus] = useState<UIElementStatus>('ready');\n\n // Generate unique IDs for the input sections\n const payidInputId = useMemo(() => getUniqueId('payid-input'), []);\n const bsbInputId = useMemo(() => getUniqueId('bsb-input'), []);\n\n const inputOptions: SegmentedControlOptions<PayToInputOption> = useMemo(\n () => [\n {\n value: 'payid-option',\n label: 'PayID',\n id: 'payid-option',\n controls: payidInputId\n },\n {\n value: 'bsb-option',\n label: i18n.get('payto.bsb.option.label'),\n id: 'bsb-option',\n controls: bsbInputId\n }\n ],\n [i18n, payidInputId, bsbInputId]\n );\n\n const defaultOption = inputOptions[0].value;\n const [selectedInput, setSelectedInput] = useState<PayToInputOption>(defaultOption);\n\n const onChange = ({ data, valid, errors, isValid }) => {\n // merge selected input to as data, this keep the input layers untouched\n props.onChange({ data: { selectedInput: selectedInput, ...data }, valid, errors, isValid });\n };\n\n return (\n <div\n className={classNames({\n 'adyen-checkout__payto-component': true,\n 'adyen-checkout__payto-component--loading': status === 'loading'\n })}\n >\n <SegmentedControl selectedValue={selectedInput} options={inputOptions} onChange={setSelectedInput} />\n {selectedInput === 'payid-option' && (\n <PayIDInput\n id={payidInputId}\n status={status}\n setStatus={setStatus}\n setComponentRef={props.setComponentRef}\n onChange={onChange}\n defaultData={props.data}\n placeholders={props.placeholders}\n />\n )}\n {selectedInput === 'bsb-option' && (\n <BSBInput\n id={bsbInputId}\n status={status}\n setStatus={setStatus}\n setComponentRef={props.setComponentRef}\n onChange={onChange}\n defaultData={props.data}\n placeholders={props.placeholders}\n />\n )}\n\n {props.showPayButton && props.payButton({ status, label: i18n.get('continue') })}\n </div>\n );\n}\n"],"names":["PayToComponent","props","i18n","useCoreContext","status","setStatus","useState","payidInputId","useMemo","getUniqueId","bsbInputId","inputOptions","value","label","id","controls","get","defaultOption","selectedInput","setSelectedInput","onChange","data","valid","errors","isValid","_object_spread","h","div","className","classNames","SegmentedControl","selectedValue","options","PayIDInput","setComponentRef","defaultData","placeholders","BSBInput","showPayButton","payButton"],"mappings":"q4BA2Be,SAASA,EAAeC,GACnC,MAAMC,KAAEA,GAASC,KAEVC,EAAQC,GAAaC,EAA0B,SAGhDC,EAAeC,EAAQ,IAAMC,EAAY,eAAgB,IACzDC,EAAaF,EAAQ,IAAMC,EAAY,aAAc,IAErDE,EAA0DH,EAC5D,IAAM,CACF,CACII,MAAO,eACPC,MAAO,QACPC,GAAI,eACJC,SAAUR,GAEd,CACIK,MAAO,aACPC,MAAOX,EAAKc,IAAI,0BAChBF,GAAI,aACJC,SAAUL,IAGlB,CAACR,EAAMK,EAAcG,IAGnBO,EAAgBN,EAAa,GAAGC,OAC/BM,EAAeC,GAAoBb,EAA2BW,GAE/DG,EAAW,EAAGC,OAAMC,QAAOC,SAAQC,cAErCvB,EAAMmB,SAAS,CAAEC,KAAMI,EAAA,CAAEP,cAAeA,GAAkBG,GAAQC,QAAOC,SAAQC,aAGrF,OACIE,EAACC,MAAAA,CACGC,UAAWC,EAAW,CAClB,mCAAmC,EACnC,2CAAuD,YAAXzB,KAGhDsB,EAACI,EAAAA,CAAiBC,cAAeb,EAAec,QAASrB,EAAcS,SAAUD,IAC9D,iBAAlBD,GACGQ,EAACO,EAAAA,CACGnB,GAAIP,EACJH,OAAQA,EACRC,UAAWA,EACX6B,gBAAiBjC,EAAMiC,gBACvBd,SAAUA,EACVe,YAAalC,EAAMoB,KACnBe,aAAcnC,EAAMmC,eAGT,eAAlBlB,GACGQ,EAACW,EAAAA,CACGvB,GAAIJ,EACJN,OAAQA,EACRC,UAAWA,EACX6B,gBAAiBjC,EAAMiC,gBACvBd,SAAUA,EACVe,YAAalC,EAAMoB,KACnBe,aAAcnC,EAAMmC,eAI3BnC,EAAMqC,eAAiBrC,EAAMsC,UAAU,CAAEnC,SAAQS,MAAOX,EAAKc,IAAI,cAG9E"}
@@ -1,2 +1,2 @@
1
- import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as e}from"../internal/UIElement/UIElement.js";import o from"./components/UPIComponent/UPIComponent.js";import{CoreProvider as r}from"../../core/Context/CoreProvider.js";import n from"../internal/Await/Await.js";import s from"../internal/QRLoader/QRLoader.js";import i from"../../core/Errors/SRPanelProvider.js";import{TxVariants as p}from"../tx-variants.js";import a from"../../utils/isMobile.js";import{getQrOption as d,getVpaOption as l,getIntentOption as u}from"./constants.js";function c(t,e,o){return e in t?Object.defineProperty(t,e,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[e]=o,t}function m(t){for(var e=1;e<arguments.length;e++){var o=null!=arguments[e]?arguments[e]:{},r=Object.keys(o);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(o).filter(function(t){return Object.getOwnPropertyDescriptor(o,t).enumerable}))),r.forEach(function(e){c(t,e,o[e])})}return t}function h(t,e){return e=null!=e?e:{},Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(e)):function(t){var e=Object.keys(t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(t);e.push.apply(e,o)}return e}(Object(e)).forEach(function(o){Object.defineProperty(t,o,Object.getOwnPropertyDescriptor(e,o))}),t}class f extends e{formatProps(t){if(!a())return h(m({},super.formatProps(t)),{defaultMode:["qrCode","vpa"].includes(null==t?void 0:t.defaultMode)?t.defaultMode:"qrCode",apps:[],segmentedControlOptions:[d(t.i18n),l(t.i18n)]});const{i18n:e,apps:o=[]}=t;if(o.length>0){const r=["intent","vpa"].includes(t.defaultMode)?t.defaultMode:"intent";return h(m({},super.formatProps(t)),{defaultMode:r,apps:o,segmentedControlOptions:[u(e),l(e)]})}return h(m({},super.formatProps(t)),{defaultMode:"vpa",apps:[],segmentedControlOptions:[]})}get isValid(){return this.state.isValid}formatData(){const{virtualPaymentAddress:t,app:e}=this.state.data||{};return{paymentMethod:m({type:this.paymentType},this.paymentType===p.upi_collect&&t&&{virtualPaymentAddress:t},this.paymentType===p.upi_intent&&(null==e?void 0:e.id)&&{appId:e.id})}}get paymentType(){return"qrCode"===this.selectedMode?p.upi_qr:"vpa"===this.selectedMode?p.upi_collect:p.upi_intent}renderContent(e,r,i){switch(e){case"qrCode":return t(s,h(m({ref:t=>{this.componentRef=t}},this.props),{qrCodeData:this.props.qrCodeData?encodeURIComponent(this.props.qrCodeData):null,type:p.upi_qr,brandLogo:this.props.brandLogo||this.icon,onComplete:this.onComplete,introduction:this.props.i18n.get("upi.qrCodeWaitingMessage"),countdownTime:5,onActionHandled:this.onActionHandled}));case"await":return t(n,{ref:t=>{this.componentRef=t},url:r,type:i,showCountdownTimer:!0,shouldRedirectAutomatically:!0,showAmount:!0,countdownTime:5,clientKey:this.props.clientKey,paymentData:this.props.paymentData,onActionHandled:this.onActionHandled,onError:this.props.onError,messageText:this.props.i18n.get("upi.vpaWaitingMessage"),awaitText:this.props.i18n.get("await.waitForConfirmation"),onComplete:this.onComplete,brandLogo:this.icon,amount:this.props.amount});default:return t(o,{ref:t=>{this.componentRef=t},payButton:this.payButton,onChange:this.setState,onUpdateMode:this.onUpdateMode,apps:this.props.apps,segmentedControlOptions:this.props.segmentedControlOptions,defaultMode:this.props.defaultMode,showPayButton:this.props.showPayButton})}}render(){const{type:e,url:o,paymentMethodType:n}=this.props;return t(r,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},t(i,{srPanel:this.props.modules.srPanel},this.renderContent(e,o,n)))}constructor(t,e){super(t,e),c(this,"selectedMode",void 0),c(this,"onUpdateMode",t=>{this.selectedMode=t}),this.selectedMode=this.props.defaultMode}}c(f,"type",p.upi),c(f,"txVariants",[p.upi,p.upi_qr,p.upi_collect,p.upi_intent]);export{f as default};
1
+ import{createElement as t}from"../../external/preact/dist/preact.js";import{UIElement as e}from"../internal/UIElement/UIElement.js";import o from"./components/UPIComponent/UPIComponent.js";import{CoreProvider as n}from"../../core/Context/CoreProvider.js";import r from"../internal/Await/Await.js";import s from"../internal/QRLoader/QRLoader.js";import i from"../../core/Errors/SRPanelProvider.js";import{TxVariants as p}from"../tx-variants.js";import a from"../../utils/isMobile.js";import{getQrOption as d,getVpaOption as u,getIntentOption as l}from"./constants.js";function c(t,e,o){return e in t?Object.defineProperty(t,e,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[e]=o,t}function m(t){for(var e=1;e<arguments.length;e++){var o=null!=arguments[e]?arguments[e]:{},n=Object.keys(o);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(o).filter(function(t){return Object.getOwnPropertyDescriptor(o,t).enumerable}))),n.forEach(function(e){c(t,e,o[e])})}return t}function h(t,e){return e=null!=e?e:{},Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(e)):function(t){var e=Object.keys(t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(t);e.push.apply(e,o)}return e}(Object(e)).forEach(function(o){Object.defineProperty(t,o,Object.getOwnPropertyDescriptor(e,o))}),t}class f extends e{formatProps(t){if(!a())return h(m({},super.formatProps(t)),{defaultMode:["qrCode","vpa"].includes(null==t?void 0:t.defaultMode)?t.defaultMode:"qrCode",apps:[],segmentedControlOptions:[d(t.i18n),u(t.i18n)]});const{i18n:e,apps:o=[]}=t;if(o.length>0){const n=["intent","vpa"].includes(t.defaultMode)?t.defaultMode:"intent";return h(m({},super.formatProps(t)),{defaultMode:n,apps:o,segmentedControlOptions:[l(e),u(e)]})}return h(m({},super.formatProps(t)),{defaultMode:"vpa",apps:[],segmentedControlOptions:[]})}get isValid(){return this.state.isValid}formatData(){const{virtualPaymentAddress:t,app:e}=this.state.data||{};return{paymentMethod:m({type:this.paymentType},this.paymentType===p.upi_collect&&t&&{virtualPaymentAddress:t},this.paymentType===p.upi_intent&&(null==e?void 0:e.id)&&{appId:e.id})}}get paymentType(){return"qrCode"===this.selectedMode?p.upi_qr:"vpa"===this.selectedMode?p.upi_collect:p.upi_intent}renderContent(e,n,i){const a=!!this.props.mandate;switch(e){case"qrCode":var d;return t(s,h(m({ref:t=>{this.componentRef=t}},this.props),{qrCodeData:this.props.qrCodeData?encodeURIComponent(this.props.qrCodeData):null,type:p.upi_qr,brandLogo:this.props.brandLogo||this.icon,onComplete:this.onComplete,introduction:this.props.i18n.get("upi.qrCodeWaitingMessage"),countdownTime:null!==(d=this.props.countdownTime)&&void 0!==d?d:5,onActionHandled:this.onActionHandled,showAmount:!a}));case"await":var u;return t(r,{ref:t=>{this.componentRef=t},url:n,type:i,showCountdownTimer:!0,shouldRedirectAutomatically:!0,showAmount:!a,countdownTime:null!==(u=this.props.countdownTime)&&void 0!==u?u:5,clientKey:this.props.clientKey,paymentData:this.props.paymentData,onActionHandled:this.onActionHandled,onError:this.props.onError,messageText:this.props.i18n.get("upi.vpaWaitingMessage"),awaitText:this.props.i18n.get("await.waitForConfirmation"),onComplete:this.onComplete,brandLogo:this.icon,amount:this.props.amount});default:return t(o,{ref:t=>{this.componentRef=t},payButton:this.payButton,onChange:this.setState,onUpdateMode:this.onUpdateMode,apps:this.props.apps,segmentedControlOptions:this.props.segmentedControlOptions,defaultMode:this.props.defaultMode,showPayButton:this.props.showPayButton,amount:this.props.amount,mandate:this.props.mandate})}}render(){const{type:e,url:o,paymentMethodType:r}=this.props;return t(n,{i18n:this.props.i18n,loadingContext:this.props.loadingContext,resources:this.resources},t(i,{srPanel:this.props.modules.srPanel},this.renderContent(e,o,r)))}constructor(t,e){super(t,e),c(this,"selectedMode",void 0),c(this,"onUpdateMode",t=>{this.selectedMode=t}),this.selectedMode=this.props.defaultMode}}c(f,"type",p.upi),c(f,"txVariants",[p.upi,p.upi_qr,p.upi_collect,p.upi_intent]);export{f as default};
2
2
  //# sourceMappingURL=UPI.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"UPI.js","sources":["../../../../src/components/UPI/UPI.tsx"],"sourcesContent":["import { h, RefObject } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport UPIComponent from './components/UPIComponent';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport Await from '../internal/Await';\nimport QRLoader from '../internal/QRLoader';\nimport { UPIConfiguration, UpiMode, UpiPaymentData, UpiType } from './types';\nimport SRPanelProvider from '../../core/Errors/SRPanelProvider';\nimport { TxVariants } from '../tx-variants';\nimport isMobile from '../../utils/isMobile';\nimport type { ICore } from '../../core/types';\nimport { getIntentOption, getQrOption, getVpaOption } from './constants';\n\n/**\n * For mobile:\n * We should show upi_collect and upi_intent depending on if `apps` are returned in /paymentMethods response.\n * If there is no apps, hide segmented controls.\n * The upi_collect should always be on the second tab.\n * Never show QR code.\n *\n * For non-mobile:\n * We should never show the upi_intent (ignore `apps` in /paymentMethods response)\n * The upi_qr should be on the first tab and the upi_collect should be on second tab\n */\n\nclass UPI extends UIElement<UPIConfiguration> {\n public static type = TxVariants.upi;\n public static txVariants = [TxVariants.upi, TxVariants.upi_qr, TxVariants.upi_collect, TxVariants.upi_intent];\n\n private selectedMode: UpiMode;\n\n constructor(checkout: ICore, props: UPIConfiguration) {\n super(checkout, props);\n this.selectedMode = this.props.defaultMode;\n }\n\n formatProps(props: UPIConfiguration): UPIConfiguration {\n if (!isMobile()) {\n return {\n ...super.formatProps(props),\n defaultMode: ['qrCode', 'vpa'].includes(props?.defaultMode) ? props.defaultMode : 'qrCode',\n apps: [], // For desktop, ignore the apps\n segmentedControlOptions: [getQrOption(props.i18n), getVpaOption(props.i18n)]\n };\n }\n\n const { i18n, apps = [] } = props;\n const hasIntentApps = apps.length > 0;\n if (hasIntentApps) {\n // Mobile with UPI apps\n const allowedModes: UpiMode[] = ['intent', 'vpa'];\n const defaultMode = allowedModes.includes(props.defaultMode) ? props.defaultMode : 'intent';\n return {\n ...super.formatProps(props),\n defaultMode,\n apps,\n segmentedControlOptions: [getIntentOption(i18n), getVpaOption(i18n)]\n };\n }\n\n // Mobile, but no UPI apps\n return {\n ...super.formatProps(props),\n defaultMode: 'vpa', // Only VPA is possible\n apps: [],\n segmentedControlOptions: []\n };\n }\n\n public get isValid(): boolean {\n return this.state.isValid;\n }\n\n public formatData(): UpiPaymentData {\n const { virtualPaymentAddress, app } = this.state.data || {};\n\n return {\n paymentMethod: {\n type: this.paymentType,\n ...(this.paymentType === TxVariants.upi_collect && virtualPaymentAddress && { virtualPaymentAddress }),\n ...(this.paymentType === TxVariants.upi_intent && app?.id && { appId: app.id })\n }\n };\n }\n\n get paymentType(): UpiType {\n if (this.selectedMode === 'qrCode') {\n return TxVariants.upi_qr;\n }\n if (this.selectedMode === 'vpa') {\n return TxVariants.upi_collect;\n }\n return TxVariants.upi_intent;\n }\n\n private onUpdateMode = (mode: UpiMode): void => {\n this.selectedMode = mode;\n };\n\n private renderContent(type: string, url: string, paymentMethodType: string): h.JSX.Element {\n switch (type) {\n case 'qrCode':\n return (\n <QRLoader\n ref={ref => {\n this.componentRef = ref;\n }}\n {...this.props}\n qrCodeData={this.props.qrCodeData ? encodeURIComponent(this.props.qrCodeData) : null}\n type={TxVariants.upi_qr}\n brandLogo={this.props.brandLogo || this.icon}\n onComplete={this.onComplete}\n introduction={this.props.i18n.get('upi.qrCodeWaitingMessage')}\n countdownTime={5}\n onActionHandled={this.onActionHandled}\n />\n );\n case 'await':\n return (\n <Await\n ref={ref => {\n this.componentRef = ref;\n }}\n url={url}\n type={paymentMethodType}\n showCountdownTimer\n shouldRedirectAutomatically\n showAmount\n countdownTime={5}\n clientKey={this.props.clientKey}\n paymentData={this.props.paymentData}\n onActionHandled={this.onActionHandled}\n onError={this.props.onError}\n messageText={this.props.i18n.get('upi.vpaWaitingMessage')}\n awaitText={this.props.i18n.get('await.waitForConfirmation')}\n onComplete={this.onComplete}\n brandLogo={this.icon}\n amount={this.props.amount}\n />\n );\n default:\n return (\n <UPIComponent\n ref={(ref: RefObject<typeof UPIComponent>) => {\n this.componentRef = ref;\n }}\n payButton={this.payButton}\n onChange={this.setState}\n onUpdateMode={this.onUpdateMode}\n apps={this.props.apps}\n segmentedControlOptions={this.props.segmentedControlOptions}\n defaultMode={this.props.defaultMode}\n showPayButton={this.props.showPayButton}\n />\n );\n }\n }\n\n public render(): h.JSX.Element {\n const { type, url, paymentMethodType } = this.props;\n return (\n <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n <SRPanelProvider srPanel={this.props.modules.srPanel}>{this.renderContent(type, url, paymentMethodType)}</SRPanelProvider>\n </CoreProvider>\n );\n }\n}\n\nexport default UPI;\n"],"names":["UPI","UIElement","formatProps","props","isMobile","_object_spread_props","_object_spread","super","defaultMode","includes","apps","segmentedControlOptions","getQrOption","i18n","getVpaOption","length","getIntentOption","isValid","this","state","formatData","virtualPaymentAddress","app","data","paymentMethod","type","paymentType","TxVariants","upi_collect","upi_intent","id","appId","selectedMode","upi_qr","renderContent","url","paymentMethodType","h","QRLoader","ref","componentRef","qrCodeData","encodeURIComponent","brandLogo","icon","onComplete","introduction","get","countdownTime","onActionHandled","Await","showCountdownTimer","shouldRedirectAutomatically","showAmount","clientKey","paymentData","onError","messageText","awaitText","amount","UPIComponent","payButton","onChange","setState","onUpdateMode","showPayButton","render","CoreProvider","loadingContext","resources","SRPanelProvider","srPanel","modules","constructor","checkout","_define_property","mode","upi","txVariants"],"mappings":"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"}
1
+ {"version":3,"file":"UPI.js","sources":["../../../../src/components/UPI/UPI.tsx"],"sourcesContent":["import { h, RefObject } from 'preact';\nimport UIElement from '../internal/UIElement/UIElement';\nimport UPIComponent from './components/UPIComponent';\nimport { CoreProvider } from '../../core/Context/CoreProvider';\nimport Await from '../internal/Await';\nimport QRLoader from '../internal/QRLoader';\nimport { UPIConfiguration, UpiMode, UpiPaymentData, UpiType } from './types';\nimport SRPanelProvider from '../../core/Errors/SRPanelProvider';\nimport { TxVariants } from '../tx-variants';\nimport isMobile from '../../utils/isMobile';\nimport type { ICore } from '../../core/types';\nimport { getIntentOption, getQrOption, getVpaOption } from './constants';\n\n/**\n * For mobile:\n * We should show upi_collect and upi_intent depending on if `apps` are returned in /paymentMethods response.\n * If there is no apps, hide segmented controls.\n * The upi_collect should always be on the second tab.\n * Never show QR code.\n *\n * For non-mobile:\n * We should never show the upi_intent (ignore `apps` in /paymentMethods response)\n * The upi_qr should be on the first tab and the upi_collect should be on second tab\n */\n\nclass UPI extends UIElement<UPIConfiguration> {\n public static type = TxVariants.upi;\n public static txVariants = [TxVariants.upi, TxVariants.upi_qr, TxVariants.upi_collect, TxVariants.upi_intent];\n\n private selectedMode: UpiMode;\n\n constructor(checkout: ICore, props: UPIConfiguration) {\n super(checkout, props);\n this.selectedMode = this.props.defaultMode;\n }\n\n formatProps(props: UPIConfiguration): UPIConfiguration {\n if (!isMobile()) {\n return {\n ...super.formatProps(props),\n defaultMode: ['qrCode', 'vpa'].includes(props?.defaultMode) ? props.defaultMode : 'qrCode',\n apps: [], // For desktop, ignore the apps\n segmentedControlOptions: [getQrOption(props.i18n), getVpaOption(props.i18n)]\n };\n }\n\n const { i18n, apps = [] } = props;\n const hasIntentApps = apps.length > 0;\n if (hasIntentApps) {\n // Mobile with UPI apps\n const allowedModes: UpiMode[] = ['intent', 'vpa'];\n const defaultMode = allowedModes.includes(props.defaultMode) ? props.defaultMode : 'intent';\n return {\n ...super.formatProps(props),\n defaultMode,\n apps,\n segmentedControlOptions: [getIntentOption(i18n), getVpaOption(i18n)]\n };\n }\n\n // Mobile, but no UPI apps\n return {\n ...super.formatProps(props),\n defaultMode: 'vpa', // Only VPA is possible\n apps: [],\n segmentedControlOptions: []\n };\n }\n\n public get isValid(): boolean {\n return this.state.isValid;\n }\n\n public formatData(): UpiPaymentData {\n const { virtualPaymentAddress, app } = this.state.data || {};\n\n return {\n paymentMethod: {\n type: this.paymentType,\n ...(this.paymentType === TxVariants.upi_collect && virtualPaymentAddress && { virtualPaymentAddress }),\n ...(this.paymentType === TxVariants.upi_intent && app?.id && { appId: app.id })\n }\n };\n }\n\n get paymentType(): UpiType {\n if (this.selectedMode === 'qrCode') {\n return TxVariants.upi_qr;\n }\n if (this.selectedMode === 'vpa') {\n return TxVariants.upi_collect;\n }\n return TxVariants.upi_intent;\n }\n\n private onUpdateMode = (mode: UpiMode): void => {\n this.selectedMode = mode;\n };\n\n private renderContent(type: string, url: string, paymentMethodType: string): h.JSX.Element {\n const isAutoPay = !!this.props.mandate;\n\n switch (type) {\n case 'qrCode':\n return (\n <QRLoader\n ref={ref => {\n this.componentRef = ref;\n }}\n {...this.props}\n qrCodeData={this.props.qrCodeData ? encodeURIComponent(this.props.qrCodeData) : null}\n type={TxVariants.upi_qr}\n brandLogo={this.props.brandLogo || this.icon}\n onComplete={this.onComplete}\n introduction={this.props.i18n.get('upi.qrCodeWaitingMessage')}\n countdownTime={this.props.countdownTime ?? 5}\n onActionHandled={this.onActionHandled}\n showAmount={!isAutoPay}\n />\n );\n case 'await':\n return (\n <Await\n ref={ref => {\n this.componentRef = ref;\n }}\n url={url}\n type={paymentMethodType}\n showCountdownTimer\n shouldRedirectAutomatically\n showAmount={!isAutoPay}\n countdownTime={this.props.countdownTime ?? 5}\n clientKey={this.props.clientKey}\n paymentData={this.props.paymentData}\n onActionHandled={this.onActionHandled}\n onError={this.props.onError}\n messageText={this.props.i18n.get('upi.vpaWaitingMessage')}\n awaitText={this.props.i18n.get('await.waitForConfirmation')}\n onComplete={this.onComplete}\n brandLogo={this.icon}\n amount={this.props.amount}\n />\n );\n default:\n return (\n <UPIComponent\n ref={(ref: RefObject<typeof UPIComponent>) => {\n this.componentRef = ref;\n }}\n payButton={this.payButton}\n onChange={this.setState}\n onUpdateMode={this.onUpdateMode}\n apps={this.props.apps}\n segmentedControlOptions={this.props.segmentedControlOptions}\n defaultMode={this.props.defaultMode}\n showPayButton={this.props.showPayButton}\n amount={this.props.amount}\n mandate={this.props.mandate}\n />\n );\n }\n }\n\n public render(): h.JSX.Element {\n const { type, url, paymentMethodType } = this.props;\n return (\n <CoreProvider i18n={this.props.i18n} loadingContext={this.props.loadingContext} resources={this.resources}>\n <SRPanelProvider srPanel={this.props.modules.srPanel}>{this.renderContent(type, url, paymentMethodType)}</SRPanelProvider>\n </CoreProvider>\n );\n }\n}\n\nexport default UPI;\n"],"names":["UPI","UIElement","formatProps","props","isMobile","_object_spread_props","_object_spread","super","defaultMode","includes","apps","segmentedControlOptions","getQrOption","i18n","getVpaOption","length","getIntentOption","isValid","this","state","formatData","virtualPaymentAddress","app","data","paymentMethod","type","paymentType","TxVariants","upi_collect","upi_intent","id","appId","selectedMode","upi_qr","renderContent","url","paymentMethodType","isAutoPay","mandate","_this_props_countdownTime","h","QRLoader","ref","componentRef","qrCodeData","encodeURIComponent","brandLogo","icon","onComplete","introduction","get","countdownTime","onActionHandled","showAmount","_this_props_countdownTime1","Await","showCountdownTimer","shouldRedirectAutomatically","clientKey","paymentData","onError","messageText","awaitText","amount","UPIComponent","payButton","onChange","setState","onUpdateMode","showPayButton","render","CoreProvider","loadingContext","resources","SRPanelProvider","srPanel","modules","constructor","checkout","_define_property","mode","upi","txVariants"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{createElement as e,Fragment as t}from"../../../../external/preact/dist/preact.js";import{useState as n,useCallback as o,useEffect as a}from"../../../../external/preact/hooks/dist/hooks.js";import r from"../VpaInput/VpaInput.js";import i from"../../../../core/Context/useImage.js";import{A11Y as l}from"../../constants.js";import s from"../../../internal/SegmentedControl/SegmentedControl.js";import d from"../UPIIntentAppList/UPIIntentAppList.js";import{useCoreContext as c}from"../../../../core/Context/CoreProvider.js";import u from"../../../internal/Alert/Alert.js";function p(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function m(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},o=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),o.forEach(function(t){p(e,t,n[t])})}return e}function g({defaultMode:p,onChange:g,onUpdateMode:b=()=>{},payButton:f,showPayButton:y,apps:h=[],segmentedControlOptions:I=[]}){const{i18n:C}=c(),j=i(),[v,A]=n("ready"),[N,k]=n(p),[P,S]=n(null),[O,V]=n(null),[q,w]=n("qrCode"===p);this.setStatus=e=>{A(e)},this.showValidation=()=>{null==P||P.validateInput(),"intent"===N&&T()};const x=o(e=>{S(e)},[]),B=o(e=>{k(e),b(e)},[b]),E=o(e=>{(null==e?void 0:e.id)!==(null==O?void 0:O.id)&&(V(e),w(!0),A("ready"))},[O]),T=o(()=>{O?(A("ready"),w(!0)):(A("error"),w(!1))},[O]);return a(()=>{g("qrCode"!==N?{data:m({},O&&{app:O}),isValid:q}:{data:{},valid:{},errors:{},isValid:!0})},[O,q,N,g]),e(t,null,I.length>0&&e("p",{className:"adyen-checkout_upi-mode-selection-text"},C.get("upi.modeSelection")),e(s,{onChange:B,selectedValue:N,disabled:"loading"===v,classNameModifiers:["upi-margin-bottom"],options:I}),"intent"===N&&e("div",{id:l.AreaId.INTENT,"aria-labelledby":l.ButtonId.INTENT,className:"adyen-checkout-upi-area-intent",role:"region"},e("span",{className:"adyen-checkout-upi-instruction-label"},C.get("upi.intent.instruction")),"error"===v&&e(u,{icon:"cross"},C.get("upi.error.noAppSelected")),e(d,{disabled:"loading"===v,apps:h,selectedAppId:null==O?void 0:O.id,onAppSelect:E}),y&&f({label:C.get("continue"),status:v})),"vpa"===N&&e("div",{id:l.AreaId.VPA,"aria-labelledby":l.ButtonId.VPA,className:"adyen-checkout-upi-area-vpa",role:"region"},e("span",{className:"adyen-checkout-upi-instruction-label"},C.get("upi.collect.instruction")),e(r,{disabled:"loading"===v,onChange:g,onSetInputHandlers:x}),y&&f({label:C.get("continue"),status:v})),"qrCode"===N&&e("div",{id:l.AreaId.QR,"aria-labelledby":l.ButtonId.QR,className:"adyen-checkout-upi-area-qr-code",role:"region"},e("span",{className:"adyen-checkout-upi-instruction-label"},C.get("upi.qrCode.instruction")),y&&f({label:C.get("generateQRCode"),icon:j({imageFolder:"components/"})("qr"),status:v})))}export{g as default};
1
+ import{createElement as e,Fragment as t}from"../../../../external/preact/dist/preact.js";import{useState as n,useCallback as a,useEffect as o}from"../../../../external/preact/hooks/dist/hooks.js";import r from"../VpaInput/VpaInput.js";import i from"../../../../core/Context/useImage.js";import{A11Y as l}from"../../constants.js";import s from"../../../internal/SegmentedControl/SegmentedControl.js";import d from"../UPIIntentAppList/UPIIntentAppList.js";import{useCoreContext as u}from"../../../../core/Context/CoreProvider.js";import c from"../../../internal/Alert/Alert.js";import p from"../UPIMandate/UPIMandate.js";function m(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function g(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},a=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(a=a.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),a.forEach(function(t){m(e,t,n[t])})}return e}function b({defaultMode:m,onChange:b,payButton:f,showPayButton:y,mandate:I,amount:h,onUpdateMode:j=()=>{},apps:C=[],segmentedControlOptions:v=[]}){const{i18n:A}=u(),N=i(),[P,k]=n("ready"),[S,O]=n(m),[V,q]=n(null),[w,x]=n(null),[B,E]=n("qrCode"===m),M=I&&e(p,{mandate:I,amount:h});this.setStatus=e=>{k(e)},this.showValidation=()=>{null==V||V.validateInput(),"intent"===S&&R()};const U=a(e=>{q(e)},[]),T=a(e=>{O(e),j(e)},[j]),Q=a(e=>{(null==e?void 0:e.id)!==(null==w?void 0:w.id)&&(x(e),E(!0),k("ready"))},[w]),R=a(()=>{w?(k("ready"),E(!0)):(k("error"),E(!1))},[w]);return o(()=>{b("qrCode"!==S?{data:g({},w&&{app:w}),isValid:B}:{data:{},valid:{},errors:{},isValid:!0})},[w,B,S,b]),e(t,null,v.length>0&&e("p",{className:"adyen-checkout_upi-mode-selection-text"},A.get("upi.modeSelection")),e(s,{onChange:T,selectedValue:S,disabled:"loading"===P,classNameModifiers:["upi-margin-bottom"],options:v}),"intent"===S&&e("div",{id:l.AreaId.INTENT,"aria-labelledby":l.ButtonId.INTENT,className:"adyen-checkout-upi-area-intent",role:"region"},e("span",{className:"adyen-checkout-upi-instruction-label"},A.get("upi.intent.instruction")),"error"===P&&e(c,{icon:"cross"},A.get("upi.error.noAppSelected")),e(d,{disabled:"loading"===P,apps:C,selectedAppId:null==w?void 0:w.id,onAppSelect:Q}),M,y&&f({label:A.get("continue"),status:P})),"vpa"===S&&e("div",{id:l.AreaId.VPA,"aria-labelledby":l.ButtonId.VPA,className:"adyen-checkout-upi-area-vpa",role:"region"},e("span",{className:"adyen-checkout-upi-instruction-label"},A.get("upi.collect.instruction")),e(r,{disabled:"loading"===P,onChange:b,onSetInputHandlers:U}),M,y&&f({label:A.get("continue"),status:P})),"qrCode"===S&&e("div",{id:l.AreaId.QR,"aria-labelledby":l.ButtonId.QR,className:"adyen-checkout-upi-area-qr-code",role:"region"},e("span",{className:"adyen-checkout-upi-instruction-label"},A.get("upi.qrCode.instruction")),M,y&&f({label:A.get("generateQRCode"),icon:N({imageFolder:"components/"})("qr"),status:P})))}export{b as default};
2
2
  //# sourceMappingURL=UPIComponent.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"UPIComponent.js","sources":["../../../../../../src/components/UPI/components/UPIComponent/UPIComponent.tsx"],"sourcesContent":["import { Fragment, h, RefObject } from 'preact';\nimport { useCallback, useEffect, useState } from 'preact/hooks';\nimport { PayButtonFunctionProps, UIElementStatus } from '../../../types';\nimport VpaInput, { VpaInputHandlers } from '../VpaInput/VpaInput';\nimport { App, UpiMode } from '../../types';\nimport useImage from '../../../../core/Context/useImage';\nimport { A11Y } from '../../constants';\nimport './UPIComponent.scss';\nimport SegmentedControl from '../../../internal/SegmentedControl';\nimport UPIIntentAppList from '../UPIIntentAppList';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport Alert from '../../../internal/Alert';\nimport { SegmentedControlOption } from '../../../internal/SegmentedControl/SegmentedControl';\n\ntype UpiData = { app?: App; virtualPaymentAddress?: string };\n\ntype OnChangeProps = { data: UpiData; valid?: { [key: string]: boolean }; errors?: { [key: string]: any }; isValid: boolean };\n\ninterface UPIComponentProps {\n defaultMode: UpiMode;\n showPayButton: boolean;\n apps?: Array<App>;\n segmentedControlOptions?: Array<SegmentedControlOption<UpiMode>>;\n\n ref?(ref: RefObject<typeof UPIComponent>): void;\n\n payButton?(props: PayButtonFunctionProps): h.JSX.Element;\n\n onChange({ data, valid, errors, isValid }: OnChangeProps): void;\n\n onUpdateMode?(mode: UpiMode): void;\n}\n\nexport default function UPIComponent({\n defaultMode,\n onChange,\n onUpdateMode = () => {},\n payButton,\n showPayButton,\n apps = [],\n segmentedControlOptions = []\n}: Readonly<UPIComponentProps>): h.JSX.Element {\n const { i18n } = useCoreContext();\n const getImage = useImage();\n const [status, setStatus] = useState<UIElementStatus>('ready');\n const [mode, setMode] = useState<UpiMode>(defaultMode);\n const [vpaInputHandlers, setVpaInputHandlers] = useState<VpaInputHandlers>(null);\n const [selectedApp, setSelectedApp] = useState<App>(null);\n const [isValid, setIsValid] = useState<boolean>(defaultMode === 'qrCode');\n\n this.setStatus = (status: UIElementStatus) => {\n setStatus(status);\n };\n\n this.showValidation = () => {\n vpaInputHandlers?.validateInput();\n if (mode === 'intent') {\n validateIntentApp();\n }\n };\n\n const onSetVpaInputHandlers = useCallback((handlers: VpaInputHandlers) => {\n setVpaInputHandlers(handlers);\n }, []);\n\n const onChangeUpiMode = useCallback(\n (newMode: UpiMode) => {\n setMode(newMode);\n onUpdateMode(newMode);\n },\n [onUpdateMode]\n );\n\n const handleAppSelect = useCallback(\n (app: App) => {\n if (app?.id === selectedApp?.id) return;\n\n setSelectedApp(app);\n setIsValid(true);\n setStatus('ready');\n },\n [selectedApp]\n );\n\n const validateIntentApp = useCallback(() => {\n if (!selectedApp) {\n setStatus('error');\n setIsValid(false);\n } else {\n setStatus('ready');\n setIsValid(true);\n }\n }, [selectedApp]);\n\n useEffect(() => {\n if (mode !== 'qrCode') {\n onChange({\n data: { ...(selectedApp && { app: selectedApp }) },\n isValid\n });\n } else {\n /**\n * When selecting QR code mode, we need to clear the state data and trigger the 'onChange'.\n */\n onChange({ data: {}, valid: {}, errors: {}, isValid: true });\n }\n }, [selectedApp, isValid, mode, onChange]);\n\n return (\n <Fragment>\n {segmentedControlOptions.length > 0 && <p className=\"adyen-checkout_upi-mode-selection-text\">{i18n.get('upi.modeSelection')}</p>}\n <SegmentedControl\n onChange={onChangeUpiMode}\n selectedValue={mode}\n disabled={status === 'loading'}\n classNameModifiers={['upi-margin-bottom']}\n options={segmentedControlOptions}\n />\n\n {mode === 'intent' && (\n <div id={A11Y.AreaId.INTENT} aria-labelledby={A11Y.ButtonId.INTENT} className=\"adyen-checkout-upi-area-intent\" role=\"region\">\n <span className=\"adyen-checkout-upi-instruction-label\">{i18n.get('upi.intent.instruction')}</span>\n {status === 'error' && <Alert icon={'cross'}>{i18n.get('upi.error.noAppSelected')}</Alert>}\n <UPIIntentAppList disabled={status === 'loading'} apps={apps} selectedAppId={selectedApp?.id} onAppSelect={handleAppSelect} />\n\n {showPayButton &&\n payButton({\n label: i18n.get('continue'),\n status\n })}\n </div>\n )}\n {mode === 'vpa' && (\n <div id={A11Y.AreaId.VPA} aria-labelledby={A11Y.ButtonId.VPA} className=\"adyen-checkout-upi-area-vpa\" role=\"region\">\n <span className=\"adyen-checkout-upi-instruction-label\">{i18n.get('upi.collect.instruction')}</span>\n <VpaInput disabled={status === 'loading'} onChange={onChange} onSetInputHandlers={onSetVpaInputHandlers} />\n\n {showPayButton &&\n payButton({\n label: i18n.get('continue'),\n status\n })}\n </div>\n )}\n {mode === 'qrCode' && (\n <div id={A11Y.AreaId.QR} aria-labelledby={A11Y.ButtonId.QR} className=\"adyen-checkout-upi-area-qr-code\" role=\"region\">\n <span className=\"adyen-checkout-upi-instruction-label\">{i18n.get('upi.qrCode.instruction')}</span>\n {showPayButton &&\n payButton({\n label: i18n.get('generateQRCode'),\n icon: getImage({ imageFolder: 'components/' })('qr'),\n status\n })}\n </div>\n )}\n </Fragment>\n );\n}\n"],"names":["UPIComponent","defaultMode","onChange","onUpdateMode","payButton","showPayButton","apps","segmentedControlOptions","i18n","useCoreContext","getImage","useImage","status","setStatus","useState","mode","setMode","vpaInputHandlers","setVpaInputHandlers","selectedApp","setSelectedApp","isValid","setIsValid","this","showValidation","validateInput","validateIntentApp","onSetVpaInputHandlers","useCallback","handlers","onChangeUpiMode","newMode","handleAppSelect","app","id","useEffect","data","_object_spread","valid","errors","h","Fragment","length","p","className","get","SegmentedControl","selectedValue","disabled","classNameModifiers","options","div","A11Y","AreaId","INTENT","aria-labelledby","ButtonId","role","span","Alert","icon","UPIIntentAppList","selectedAppId","onAppSelect","label","VPA","VpaInput","onSetInputHandlers","QR","imageFolder"],"mappings":"4/BAiCe,SAASA,GAAaC,YACjCA,EAAWC,SACXA,EAAQC,aACRA,EAAe,OAAQC,UACvBA,EAASC,cACTA,EAAaC,KACbA,EAAO,GAAEC,wBACTA,EAA0B,KAE1B,MAAMC,KAAEA,GAASC,IACXC,EAAWC,KACVC,EAAQC,GAAaC,EAA0B,UAC/CC,EAAMC,GAAWF,EAAkBb,IACnCgB,EAAkBC,GAAuBJ,EAA2B,OACpEK,EAAaC,GAAkBN,EAAc,OAC7CO,EAASC,GAAcR,EAAkC,WAAhBb,GAEhDsB,KAAKV,UAAaD,IACdC,EAAUD,IAGdW,KAAKC,eAAiB,KAClBP,SAAAA,EAAkBQ,gBACL,WAATV,GACAW,KAIR,MAAMC,EAAwBC,EAAaC,IACvCX,EAAoBW,IACrB,IAEGC,EAAkBF,EACnBG,IACGf,EAAQe,GACR5B,EAAa4B,IAEjB,CAAC5B,IAGC6B,EAAkBJ,EACnBK,KACOA,aAAAA,EAAAA,EAAKC,OAAOf,aAAAA,EAAAA,EAAae,MAE7Bd,EAAea,GACfX,GAAW,GACXT,EAAU,WAEd,CAACM,IAGCO,EAAoBE,EAAY,KAC7BT,GAIDN,EAAU,SACVS,GAAW,KAJXT,EAAU,SACVS,GAAW,KAKhB,CAACH,IAgBJ,OAdAgB,EAAU,KAEFjC,EADS,WAATa,EACS,CACLqB,KAAMC,KAAMlB,GAAe,CAAEc,IAAKd,IAClCE,WAMK,CAAEe,KAAM,CAAA,EAAIE,MAAO,CAAA,EAAIC,OAAQ,CAAA,EAAIlB,SAAS,KAE1D,CAACF,EAAaE,EAASN,EAAMb,IAG5BsC,EAACC,EAAAA,KACIlC,EAAwBmC,OAAS,GAAKF,EAACG,IAAAA,CAAEC,UAAU,0CAA0CpC,EAAKqC,IAAI,sBACvGL,EAACM,EAAAA,CACG5C,SAAU4B,EACViB,cAAehC,EACfiC,SAAqB,YAAXpC,EACVqC,mBAAoB,CAAC,qBACrBC,QAAS3C,IAGH,WAATQ,GACGyB,EAACW,MAAAA,CAAIjB,GAAIkB,EAAKC,OAAOC,OAAQC,kBAAiBH,EAAKI,SAASF,OAAQV,UAAU,iCAAiCa,KAAK,UAChHjB,EAACkB,OAAAA,CAAKd,UAAU,wCAAwCpC,EAAKqC,IAAI,2BACrD,UAAXjC,GAAsB4B,EAACmB,EAAAA,CAAMC,KAAM,SAAUpD,EAAKqC,IAAI,4BACvDL,EAACqB,EAAAA,CAAiBb,SAAqB,YAAXpC,EAAsBN,KAAMA,EAAMwD,cAAe3C,aAAAA,EAAAA,EAAae,GAAI6B,YAAa/B,IAE1G3B,GACGD,EAAU,CACN4D,MAAOxD,EAAKqC,IAAI,YAChBjC,YAIN,QAATG,GACGyB,EAACW,MAAAA,CAAIjB,GAAIkB,EAAKC,OAAOY,IAAKV,kBAAiBH,EAAKI,SAASS,IAAKrB,UAAU,8BAA8Ba,KAAK,UACvGjB,EAACkB,OAAAA,CAAKd,UAAU,wCAAwCpC,EAAKqC,IAAI,4BACjEL,EAAC0B,EAAAA,CAASlB,SAAqB,YAAXpC,EAAsBV,SAAUA,EAAUiE,mBAAoBxC,IAEjFtB,GACGD,EAAU,CACN4D,MAAOxD,EAAKqC,IAAI,YAChBjC,YAIN,WAATG,GACGyB,EAACW,MAAAA,CAAIjB,GAAIkB,EAAKC,OAAOe,GAAIb,kBAAiBH,EAAKI,SAASY,GAAIxB,UAAU,kCAAkCa,KAAK,UACzGjB,EAACkB,OAAAA,CAAKd,UAAU,wCAAwCpC,EAAKqC,IAAI,2BAChExC,GACGD,EAAU,CACN4D,MAAOxD,EAAKqC,IAAI,kBAChBe,KAAMlD,EAAS,CAAE2D,YAAa,eAAxB3D,CAAyC,MAC/CE,YAM5B"}
1
+ {"version":3,"file":"UPIComponent.js","sources":["../../../../../../src/components/UPI/components/UPIComponent/UPIComponent.tsx"],"sourcesContent":["import { Fragment, h, RefObject } from 'preact';\nimport { useCallback, useEffect, useState } from 'preact/hooks';\nimport { PayButtonFunctionProps, UIElementStatus } from '../../../types';\nimport VpaInput, { VpaInputHandlers } from '../VpaInput/VpaInput';\nimport { App, UpiMode } from '../../types';\nimport useImage from '../../../../core/Context/useImage';\nimport { A11Y } from '../../constants';\nimport './UPIComponent.scss';\nimport SegmentedControl from '../../../internal/SegmentedControl';\nimport UPIIntentAppList from '../UPIIntentAppList';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport Alert from '../../../internal/Alert';\nimport { SegmentedControlOption } from '../../../internal/SegmentedControl/SegmentedControl';\nimport UPIMandate, { Mandate } from '../UPIMandate/UPIMandate';\nimport type { PaymentAmount } from '../../../../types/global-types';\n\ntype UpiData = { app?: App; virtualPaymentAddress?: string };\n\ntype OnChangeProps = { data: UpiData; valid?: { [key: string]: boolean }; errors?: { [key: string]: any }; isValid: boolean };\n\ninterface UPIComponentProps {\n defaultMode: UpiMode;\n showPayButton: boolean;\n apps?: Array<App>;\n segmentedControlOptions?: Array<SegmentedControlOption<UpiMode>>;\n mandate?: Mandate;\n amount?: PaymentAmount;\n\n ref?(ref: RefObject<typeof UPIComponent>): void;\n\n payButton?(props: PayButtonFunctionProps): h.JSX.Element;\n\n onChange({ data, valid, errors, isValid }: OnChangeProps): void;\n\n onUpdateMode?(mode: UpiMode): void;\n}\n\nexport default function UPIComponent({\n defaultMode,\n onChange,\n payButton,\n showPayButton,\n mandate,\n amount,\n onUpdateMode = () => {},\n apps = [],\n segmentedControlOptions = []\n}: Readonly<UPIComponentProps>): h.JSX.Element {\n const { i18n } = useCoreContext();\n const getImage = useImage();\n const [status, setStatus] = useState<UIElementStatus>('ready');\n const [mode, setMode] = useState<UpiMode>(defaultMode);\n const [vpaInputHandlers, setVpaInputHandlers] = useState<VpaInputHandlers>(null);\n const [selectedApp, setSelectedApp] = useState<App>(null);\n const [isValid, setIsValid] = useState<boolean>(defaultMode === 'qrCode');\n const mandateComponent = mandate && <UPIMandate mandate={mandate} amount={amount} />;\n\n this.setStatus = (status: UIElementStatus) => {\n setStatus(status);\n };\n\n this.showValidation = () => {\n vpaInputHandlers?.validateInput();\n if (mode === 'intent') {\n validateIntentApp();\n }\n };\n\n const onSetVpaInputHandlers = useCallback((handlers: VpaInputHandlers) => {\n setVpaInputHandlers(handlers);\n }, []);\n\n const onChangeUpiMode = useCallback(\n (newMode: UpiMode) => {\n setMode(newMode);\n onUpdateMode(newMode);\n },\n [onUpdateMode]\n );\n\n const handleAppSelect = useCallback(\n (app: App) => {\n if (app?.id === selectedApp?.id) return;\n\n setSelectedApp(app);\n setIsValid(true);\n setStatus('ready');\n },\n [selectedApp]\n );\n\n const validateIntentApp = useCallback(() => {\n if (!selectedApp) {\n setStatus('error');\n setIsValid(false);\n } else {\n setStatus('ready');\n setIsValid(true);\n }\n }, [selectedApp]);\n\n useEffect(() => {\n if (mode !== 'qrCode') {\n onChange({\n data: { ...(selectedApp && { app: selectedApp }) },\n isValid\n });\n } else {\n /**\n * When selecting QR code mode, we need to clear the state data and trigger the 'onChange'.\n */\n onChange({ data: {}, valid: {}, errors: {}, isValid: true });\n }\n }, [selectedApp, isValid, mode, onChange]);\n\n return (\n <Fragment>\n {segmentedControlOptions.length > 0 && <p className=\"adyen-checkout_upi-mode-selection-text\">{i18n.get('upi.modeSelection')}</p>}\n <SegmentedControl\n onChange={onChangeUpiMode}\n selectedValue={mode}\n disabled={status === 'loading'}\n classNameModifiers={['upi-margin-bottom']}\n options={segmentedControlOptions}\n />\n\n {mode === 'intent' && (\n <div id={A11Y.AreaId.INTENT} aria-labelledby={A11Y.ButtonId.INTENT} className=\"adyen-checkout-upi-area-intent\" role=\"region\">\n <span className=\"adyen-checkout-upi-instruction-label\">{i18n.get('upi.intent.instruction')}</span>\n {status === 'error' && <Alert icon={'cross'}>{i18n.get('upi.error.noAppSelected')}</Alert>}\n <UPIIntentAppList disabled={status === 'loading'} apps={apps} selectedAppId={selectedApp?.id} onAppSelect={handleAppSelect} />\n {mandateComponent}\n {showPayButton &&\n payButton({\n label: i18n.get('continue'),\n status\n })}\n </div>\n )}\n {mode === 'vpa' && (\n <div id={A11Y.AreaId.VPA} aria-labelledby={A11Y.ButtonId.VPA} className=\"adyen-checkout-upi-area-vpa\" role=\"region\">\n <span className=\"adyen-checkout-upi-instruction-label\">{i18n.get('upi.collect.instruction')}</span>\n <VpaInput disabled={status === 'loading'} onChange={onChange} onSetInputHandlers={onSetVpaInputHandlers} />\n {mandateComponent}\n {showPayButton &&\n payButton({\n label: i18n.get('continue'),\n status\n })}\n </div>\n )}\n {mode === 'qrCode' && (\n <div id={A11Y.AreaId.QR} aria-labelledby={A11Y.ButtonId.QR} className=\"adyen-checkout-upi-area-qr-code\" role=\"region\">\n <span className=\"adyen-checkout-upi-instruction-label\">{i18n.get('upi.qrCode.instruction')}</span>\n {mandateComponent}\n {showPayButton &&\n payButton({\n label: i18n.get('generateQRCode'),\n icon: getImage({ imageFolder: 'components/' })('qr'),\n status\n })}\n </div>\n )}\n </Fragment>\n );\n}\n"],"names":["UPIComponent","defaultMode","onChange","payButton","showPayButton","mandate","amount","onUpdateMode","apps","segmentedControlOptions","i18n","useCoreContext","getImage","useImage","status","setStatus","useState","mode","setMode","vpaInputHandlers","setVpaInputHandlers","selectedApp","setSelectedApp","isValid","setIsValid","mandateComponent","h","UPIMandate","this","showValidation","validateInput","validateIntentApp","onSetVpaInputHandlers","useCallback","handlers","onChangeUpiMode","newMode","handleAppSelect","app","id","useEffect","data","_object_spread","valid","errors","Fragment","length","p","className","get","SegmentedControl","selectedValue","disabled","classNameModifiers","options","div","A11Y","AreaId","INTENT","aria-labelledby","ButtonId","role","span","Alert","icon","UPIIntentAppList","selectedAppId","onAppSelect","label","VPA","VpaInput","onSetInputHandlers","QR","imageFolder"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ import{createElement as n}from"../../../../external/preact/dist/preact.js";import{useMemo as t}from"../../../../external/preact/hooks/dist/hooks.js";import{useCoreContext as e}from"../../../../core/Context/CoreProvider.js";import o from"../../../internal/Alert/Alert.js";const r=({mandate:r,amount:a})=>{const{i18n:u}=e(),l=t(()=>{const{amount:t,frequency:e,amountRule:o}=r,{value:l,currency:s}=a||{};if(!(e&&o&&t&&s))return console.warn("No mandate information because of missing one of the following: frequency, amountRule, amount or currency"),null;const m=u.amount(Number(t),s),i=l?u.amount(l,s):null,c=u.get(`upi.mandate.frequency.${e}`),f=u.get("upi.mandate.intro"),p=`${m}${c}`;if("exact"===o)return n("span",null,f," (",n("strong",null,p),").");const d=u.get("upi.mandate.upTo",{values:{amount:p}});if(i){const t=u.get("upi.mandate.max.extraText");return n("span",null,f," (",n("strong",null,i),"). ",t," (",n("strong",null,d),").")}return n("span",null,f," (",n("strong",null,d),").")},[r,a,u]);return l?n(o,{icon:"info_black",type:"info"},l):null};export{r as default};
2
+ //# sourceMappingURL=UPIMandate.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"UPIMandate.js","sources":["../../../../../../src/components/UPI/components/UPIMandate/UPIMandate.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useMemo } from 'preact/hooks';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport Alert from '../../../internal/Alert';\nimport type { PaymentAmount } from '../../../../types/global-types';\n\nexport type Mandate = { amount: string; frequency: 'monthly' | 'weekly' | 'adhoc'; amountRule: 'max' | 'exact' };\n\nexport interface UPIMandateProps {\n mandate: Mandate;\n amount?: PaymentAmount;\n}\n\nconst UPIMandate = ({ mandate, amount }: UPIMandateProps): h.JSX.Element => {\n const { i18n } = useCoreContext();\n\n const mandateContent = useMemo((): h.JSX.Element => {\n const { amount: mandateAmount, frequency, amountRule } = mandate;\n const { value: paymentAmount, currency } = amount || {};\n\n if (!frequency || !amountRule || !mandateAmount || !currency) {\n console.warn('No mandate information because of missing one of the following: frequency, amountRule, amount or currency');\n return null;\n }\n\n const formattedMandateAmount = i18n.amount(Number(mandateAmount), currency);\n const formattedTransactionAmount = paymentAmount ? i18n.amount(paymentAmount, currency) : null;\n\n const frequencyText = i18n.get(`upi.mandate.frequency.${frequency}`);\n const introText = i18n.get('upi.mandate.intro');\n const recurringAmount = `${formattedMandateAmount}${frequencyText}`;\n\n if (amountRule === 'exact') {\n return (\n <span>\n {introText} (<strong>{recurringAmount}</strong>).\n </span>\n );\n }\n\n // amountRule === 'max'\n const maxAmountText = i18n.get('upi.mandate.upTo', { values: { amount: recurringAmount } });\n\n if (formattedTransactionAmount) {\n const extraText = i18n.get('upi.mandate.max.extraText');\n return (\n <span>\n {introText} (<strong>{formattedTransactionAmount}</strong>). {extraText} (<strong>{maxAmountText}</strong>).\n </span>\n );\n }\n\n return (\n <span>\n {introText} (<strong>{maxAmountText}</strong>).\n </span>\n );\n }, [mandate, amount, i18n]);\n\n if (!mandateContent) return null;\n\n return (\n <Alert icon=\"info_black\" type=\"info\">\n {mandateContent}\n </Alert>\n );\n};\n\nexport default UPIMandate;\n"],"names":["UPIMandate","mandate","amount","i18n","useCoreContext","mandateContent","useMemo","mandateAmount","frequency","amountRule","value","paymentAmount","currency","console","warn","formattedMandateAmount","Number","formattedTransactionAmount","frequencyText","get","introText","recurringAmount","h","span","strong","maxAmountText","values","extraText","Alert","icon","type"],"mappings":"+QAaA,MAAMA,EAAa,EAAGC,UAASC,aAC3B,MAAMC,KAAEA,GAASC,IAEXC,EAAiBC,EAAQ,KAC3B,MAAQJ,OAAQK,EAAaC,UAAEA,EAASC,WAAEA,GAAeR,GACjDS,MAAOC,EAAaC,SAAEA,GAAaV,GAAU,CAAA,EAErD,KAAKM,GAAcC,GAAeF,GAAkBK,GAEhD,OADAC,QAAQC,KAAK,6GACN,KAGX,MAAMC,EAAyBZ,EAAKD,OAAOc,OAAOT,GAAgBK,GAC5DK,EAA6BN,EAAgBR,EAAKD,OAAOS,EAAeC,GAAY,KAEpFM,EAAgBf,EAAKgB,IAAI,yBAAyBX,KAClDY,EAAYjB,EAAKgB,IAAI,qBACrBE,EAAkB,GAAGN,IAAyBG,IAEpD,GAAmB,UAAfT,EACA,OACIa,EAACC,OAAAA,KACIH,EAAU,KAAEE,EAACE,cAAQH,GAAyB,MAM3D,MAAMI,EAAgBtB,EAAKgB,IAAI,mBAAoB,CAAEO,OAAQ,CAAExB,OAAQmB,KAEvE,GAAIJ,EAA4B,CAC5B,MAAMU,EAAYxB,EAAKgB,IAAI,6BAC3B,OACIG,EAACC,OAAAA,KACIH,EAAU,KAAEE,EAACE,SAAAA,KAAQP,GAAoC,MAAIU,EAAU,KAAEL,EAACE,SAAAA,KAAQC,GAAuB,KAGtH,CAEA,OACIH,EAACC,OAAAA,KACIH,EAAU,KAAEE,EAACE,cAAQC,GAAuB,OAGtD,CAACxB,EAASC,EAAQC,IAErB,OAAKE,EAGDiB,EAACM,EAAAA,CAAMC,KAAK,aAAaC,KAAK,QACzBzB,GAJmB"}
@@ -1 +1 @@
1
- {"version":3,"file":"AddressSearch.js","sources":["../../../../../../src/components/internal/Address/components/AddressSearch.tsx"],"sourcesContent":["import Field from '../../FormFields/Field';\nimport { h } from 'preact';\nimport { AddressLookupItem } from '../types';\nimport { useCallback, useEffect, useState, useMemo } from 'preact/hooks';\nimport './AddressSearch.scss';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport { debounce } from '../../../../utils/debounce';\nimport Select from '../../FormFields/Select';\nimport { AddressData } from '../../../../types';\n\nexport type OnAddressLookupType = (\n value: string,\n actions: {\n resolve: (value: Array<AddressLookupItem>) => void;\n reject: (reason?: any) => void;\n }\n) => Promise<void>;\n\nexport type OnAddressSelectedType = (\n value: string,\n actions: {\n resolve: (value: AddressLookupItem) => void;\n reject: (reason?: any) => void;\n }\n) => Promise<void>;\n\ninterface AddressSearchProps {\n onAddressLookup?: OnAddressLookupType;\n onAddressSelected?: OnAddressSelectedType;\n onSelect: (addressItem: AddressData) => void;\n onManualAddress: any;\n externalErrorMessage: string;\n hideManualButton: boolean;\n showContextualElement?: boolean;\n contextualText?: string;\n placeholder?: string;\n addressSearchDebounceMs?: number;\n}\n\ninterface RejectionReason {\n errorMessage: string;\n}\n\nexport default function AddressSearch({\n onAddressLookup,\n onAddressSelected,\n onSelect,\n onManualAddress,\n externalErrorMessage,\n hideManualButton,\n showContextualElement,\n contextualText,\n placeholder,\n addressSearchDebounceMs\n}: Readonly<AddressSearchProps>) {\n const [formattedData, setFormattedData] = useState([]);\n const [originalData, setOriginalData] = useState([]);\n\n const [errorMessage, setErrorMessage] = useState('');\n\n const { i18n } = useCoreContext();\n const mapDataToSelect = data => data.map(({ id, name }) => ({ id, name }));\n\n const handlePromiseReject = useCallback((reason: RejectionReason) => {\n if (reason?.errorMessage) {\n setErrorMessage(reason.errorMessage);\n }\n }, []);\n\n const onTextInput = useCallback(\n (inputValue: string) => {\n new Promise<Array<AddressLookupItem>>((resolve, reject) => {\n void onAddressLookup(inputValue, { resolve, reject });\n })\n .then(searchArray => {\n setOriginalData(searchArray);\n setFormattedData(mapDataToSelect(searchArray));\n setErrorMessage('');\n })\n .catch(reason => handlePromiseReject(reason));\n },\n [onAddressLookup]\n );\n\n // update error message when there's a new one\n useEffect(() => {\n setErrorMessage(externalErrorMessage);\n }, [externalErrorMessage]);\n\n const onSelectItem = event => {\n if (!event.target.value) {\n setErrorMessage(i18n.get('address.errors.incomplete'));\n return;\n }\n const value = originalData.find(item => item.id === event.target.value);\n\n // 1. in case we don't get a function just select item\n if (typeof onAddressSelected !== 'function') {\n onSelect(value);\n setFormattedData([]);\n return;\n }\n\n // 2. in case callback is provided, create and call onAddressSelected\n new Promise<AddressLookupItem>((resolve, reject) => {\n void onAddressSelected(value, { resolve, reject });\n })\n .then(fullData => {\n onSelect(fullData);\n setFormattedData([]);\n })\n .catch(reason => handlePromiseReject(reason));\n };\n\n const debounceInputHandler = useMemo(() => debounce(onTextInput, addressSearchDebounceMs), []);\n\n return (\n <div className={'adyen-checkout__address-search adyen-checkout__field-group'}>\n <Field\n label={i18n.get('address')}\n classNameModifiers={['address-search']}\n errorMessage={errorMessage}\n name={'address-search'}\n showContextualElement={showContextualElement}\n contextualText={contextualText}\n >\n <Select\n name={'address-search'}\n className={'adyen-checkout__address-search__dropdown'}\n placeholder={placeholder}\n onInput={debounceInputHandler}\n items={formattedData}\n onChange={onSelectItem}\n disableTextFilter={true}\n blurOnClose={true}\n />\n </Field>\n {!hideManualButton && (\n <span className=\"adyen-checkout__address-search__manual-add\">\n <button\n type=\"button\"\n className=\"adyen-checkout__button adyen-checkout__button--inline adyen-checkout__button--link adyen-checkout__address-search__manual-add__button\"\n onClick={onManualAddress}\n >\n {'+ ' + i18n.get('address.enterManually')}\n </button>\n </span>\n )}\n </div>\n );\n}\n"],"names":["AddressSearch","onAddressLookup","onAddressSelected","onSelect","onManualAddress","externalErrorMessage","hideManualButton","showContextualElement","contextualText","placeholder","addressSearchDebounceMs","formattedData","setFormattedData","useState","originalData","setOriginalData","errorMessage","setErrorMessage","i18n","useCoreContext","handlePromiseReject","useCallback","reason","onTextInput","inputValue","Promise","resolve","reject","then","searchArray","map","id","name","catch","useEffect","debounceInputHandler","useMemo","debounce","h","div","className","Field","label","get","classNameModifiers","Select","onInput","items","onChange","event","target","value","find","item","fullData","disableTextFilter","blurOnClose","span","button","type","onClick"],"mappings":"saA2Ce,SAASA,GAAcC,gBAClCA,EAAeC,kBACfA,EAAiBC,SACjBA,EAAQC,gBACRA,EAAeC,qBACfA,EAAoBC,iBACpBA,EAAgBC,sBAChBA,EAAqBC,eACrBA,EAAcC,YACdA,EAAWC,wBACXA,IAEA,MAAOC,EAAeC,GAAoBC,EAAS,KAC5CC,EAAcC,GAAmBF,EAAS,KAE1CG,EAAcC,GAAmBJ,EAAS,KAE3CK,KAAEA,GAASC,IAGXC,EAAsBC,EAAaC,KACjCA,aAAAA,EAAAA,EAAQN,eACRC,EAAgBK,EAAON,eAE5B,IAEGO,EAAcF,EACfG,IACG,IAAIC,QAAkC,CAACC,EAASC,KACvC1B,EAAgBuB,EAAY,CAAEE,UAASC,aAE3CC,KAAKC,IACFd,EAAgBc,GAChBjB,EAAiCiB,EAfZC,IAAI,EAAGC,KAAIC,WAAM,CAAQD,KAAIC,WAgBlDf,EAAgB,MAEnBgB,MAAMX,GAAUF,EAAoBE,KAE7C,CAACrB,IAILiC,EAAU,KACNjB,EAAgBZ,IACjB,CAACA,IAEJ,MAyBM8B,EAAuBC,EAAQ,IAAMC,EAASd,EAAab,GAA0B,IAE3F,OACI4B,EAACC,MAAAA,CAAIC,UAAW,8DACZF,EAACG,EAAAA,CACGC,MAAOxB,EAAKyB,IAAI,WAChBC,mBAAoB,CAAC,kBACrB5B,aAAcA,EACdgB,KAAM,iBACNzB,sBAAuBA,EACvBC,eAAgBA,GAEhB8B,EAACO,EAAAA,CACGb,KAAM,iBACNQ,UAAW,2CACX/B,YAAaA,EACbqC,QAASX,EACTY,MAAOpC,EACPqC,SA3CKC,IACjB,IAAKA,EAAMC,OAAOC,MAEd,YADAlC,EAAgBC,EAAKyB,IAAI,8BAG7B,MAAMQ,EAAQrC,EAAasC,KAAKC,GAAQA,EAAKtB,KAAOkB,EAAMC,OAAOC,OAGjE,GAAiC,mBAAtBjD,EAGP,OAFAC,EAASgD,QACTvC,EAAiB,IAKrB,IAAIa,QAA2B,CAACC,EAASC,KAChCzB,EAAkBiD,EAAO,CAAEzB,UAASC,aAExCC,KAAK0B,IACFnD,EAASmD,GACT1C,EAAiB,MAEpBqB,MAAMX,GAAUF,EAAoBE,KAsB7BiC,mBAAmB,EACnBC,aAAa,MAGnBlD,GACEgC,EAACmB,OAAAA,CAAKjB,UAAU,8CACZF,EAACoB,SAAAA,CACGC,KAAK,SACLnB,UAAU,wIACVoB,QAASxD,GAER,KAAOc,EAAKyB,IAAI,2BAMzC"}
1
+ {"version":3,"file":"AddressSearch.js","sources":["../../../../../../src/components/internal/Address/components/AddressSearch.tsx"],"sourcesContent":["import Field from '../../FormFields/Field';\nimport { h } from 'preact';\nimport { AddressLookupItem } from '../types';\nimport { useCallback, useEffect, useState, useMemo } from 'preact/hooks';\nimport './AddressSearch.scss';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport { debounce } from '../../../../utils/debounce';\nimport Select from '../../FormFields/Select';\nimport { AddressData } from '../../../../types';\n\nexport type OnAddressLookupType = (\n value: string,\n actions: {\n resolve: (value: Array<AddressLookupItem>) => void;\n reject: (reason?: any) => void;\n }\n) => Promise<void>;\n\nexport type OnAddressSelectedType = (\n value: AddressLookupItem,\n actions: {\n resolve: (value: AddressLookupItem) => void;\n reject: (reason?: any) => void;\n }\n) => Promise<void>;\n\ninterface AddressSearchProps {\n onAddressLookup?: OnAddressLookupType;\n onAddressSelected?: OnAddressSelectedType;\n onSelect: (addressItem: AddressData) => void;\n onManualAddress: any;\n externalErrorMessage: string;\n hideManualButton: boolean;\n showContextualElement?: boolean;\n contextualText?: string;\n placeholder?: string;\n addressSearchDebounceMs?: number;\n}\n\ninterface RejectionReason {\n errorMessage: string;\n}\n\nexport default function AddressSearch({\n onAddressLookup,\n onAddressSelected,\n onSelect,\n onManualAddress,\n externalErrorMessage,\n hideManualButton,\n showContextualElement,\n contextualText,\n placeholder,\n addressSearchDebounceMs\n}: Readonly<AddressSearchProps>) {\n const [formattedData, setFormattedData] = useState<AddressLookupItem[]>([]);\n const [originalData, setOriginalData] = useState<AddressLookupItem[]>([]);\n\n const [errorMessage, setErrorMessage] = useState('');\n\n const { i18n } = useCoreContext();\n const mapDataToSelect = data => data.map(({ id, name }) => ({ id, name }));\n\n const handlePromiseReject = useCallback((reason: RejectionReason) => {\n if (reason?.errorMessage) {\n setErrorMessage(reason.errorMessage);\n }\n }, []);\n\n const onTextInput = useCallback(\n (inputValue: string) => {\n new Promise<Array<AddressLookupItem>>((resolve, reject) => {\n void onAddressLookup(inputValue, { resolve, reject });\n })\n .then(searchArray => {\n setOriginalData(searchArray);\n setFormattedData(mapDataToSelect(searchArray));\n setErrorMessage('');\n })\n .catch(reason => handlePromiseReject(reason));\n },\n [onAddressLookup]\n );\n\n // update error message when there's a new one\n useEffect(() => {\n setErrorMessage(externalErrorMessage);\n }, [externalErrorMessage]);\n\n const onSelectItem = event => {\n if (!event.target.value) {\n setErrorMessage(i18n.get('address.errors.incomplete'));\n return;\n }\n const value = originalData.find(item => item.id === event.target.value);\n\n // 1. in case we don't get a function just select item\n if (typeof onAddressSelected !== 'function') {\n onSelect(value);\n setFormattedData([]);\n return;\n }\n\n // 2. in case callback is provided, create and call onAddressSelected\n new Promise<AddressLookupItem>((resolve, reject) => {\n void onAddressSelected(value, { resolve, reject });\n })\n .then(fullData => {\n onSelect(fullData);\n setFormattedData([]);\n })\n .catch(reason => handlePromiseReject(reason));\n };\n\n const debounceInputHandler = useMemo(() => debounce(onTextInput, addressSearchDebounceMs), []);\n\n return (\n <div className={'adyen-checkout__address-search adyen-checkout__field-group'}>\n <Field\n label={i18n.get('address')}\n classNameModifiers={['address-search']}\n errorMessage={errorMessage}\n name={'address-search'}\n showContextualElement={showContextualElement}\n contextualText={contextualText}\n >\n <Select\n name={'address-search'}\n className={'adyen-checkout__address-search__dropdown'}\n placeholder={placeholder}\n onInput={debounceInputHandler}\n items={formattedData}\n onChange={onSelectItem}\n disableTextFilter={true}\n blurOnClose={true}\n />\n </Field>\n {!hideManualButton && (\n <span className=\"adyen-checkout__address-search__manual-add\">\n <button\n type=\"button\"\n className=\"adyen-checkout__button adyen-checkout__button--inline adyen-checkout__button--link adyen-checkout__address-search__manual-add__button\"\n onClick={onManualAddress}\n >\n {'+ ' + i18n.get('address.enterManually')}\n </button>\n </span>\n )}\n </div>\n );\n}\n"],"names":["AddressSearch","onAddressLookup","onAddressSelected","onSelect","onManualAddress","externalErrorMessage","hideManualButton","showContextualElement","contextualText","placeholder","addressSearchDebounceMs","formattedData","setFormattedData","useState","originalData","setOriginalData","errorMessage","setErrorMessage","i18n","useCoreContext","handlePromiseReject","useCallback","reason","onTextInput","inputValue","Promise","resolve","reject","then","searchArray","map","id","name","catch","useEffect","debounceInputHandler","useMemo","debounce","h","div","className","Field","label","get","classNameModifiers","Select","onInput","items","onChange","event","target","value","find","item","fullData","disableTextFilter","blurOnClose","span","button","type","onClick"],"mappings":"saA2Ce,SAASA,GAAcC,gBAClCA,EAAeC,kBACfA,EAAiBC,SACjBA,EAAQC,gBACRA,EAAeC,qBACfA,EAAoBC,iBACpBA,EAAgBC,sBAChBA,EAAqBC,eACrBA,EAAcC,YACdA,EAAWC,wBACXA,IAEA,MAAOC,EAAeC,GAAoBC,EAA8B,KACjEC,EAAcC,GAAmBF,EAA8B,KAE/DG,EAAcC,GAAmBJ,EAAS,KAE3CK,KAAEA,GAASC,IAGXC,EAAsBC,EAAaC,KACjCA,aAAAA,EAAAA,EAAQN,eACRC,EAAgBK,EAAON,eAE5B,IAEGO,EAAcF,EACfG,IACG,IAAIC,QAAkC,CAACC,EAASC,KACvC1B,EAAgBuB,EAAY,CAAEE,UAASC,aAE3CC,KAAKC,IACFd,EAAgBc,GAChBjB,EAAiCiB,EAfZC,IAAI,EAAGC,KAAIC,WAAM,CAAQD,KAAIC,WAgBlDf,EAAgB,MAEnBgB,MAAMX,GAAUF,EAAoBE,KAE7C,CAACrB,IAILiC,EAAU,KACNjB,EAAgBZ,IACjB,CAACA,IAEJ,MAyBM8B,EAAuBC,EAAQ,IAAMC,EAASd,EAAab,GAA0B,IAE3F,OACI4B,EAACC,MAAAA,CAAIC,UAAW,8DACZF,EAACG,EAAAA,CACGC,MAAOxB,EAAKyB,IAAI,WAChBC,mBAAoB,CAAC,kBACrB5B,aAAcA,EACdgB,KAAM,iBACNzB,sBAAuBA,EACvBC,eAAgBA,GAEhB8B,EAACO,EAAAA,CACGb,KAAM,iBACNQ,UAAW,2CACX/B,YAAaA,EACbqC,QAASX,EACTY,MAAOpC,EACPqC,SA3CKC,IACjB,IAAKA,EAAMC,OAAOC,MAEd,YADAlC,EAAgBC,EAAKyB,IAAI,8BAG7B,MAAMQ,EAAQrC,EAAasC,KAAKC,GAAQA,EAAKtB,KAAOkB,EAAMC,OAAOC,OAGjE,GAAiC,mBAAtBjD,EAGP,OAFAC,EAASgD,QACTvC,EAAiB,IAKrB,IAAIa,QAA2B,CAACC,EAASC,KAChCzB,EAAkBiD,EAAO,CAAEzB,UAASC,aAExCC,KAAK0B,IACFnD,EAASmD,GACT1C,EAAiB,MAEpBqB,MAAMX,GAAUF,EAAoBE,KAsB7BiC,mBAAmB,EACnBC,aAAa,MAGnBlD,GACEgC,EAACmB,OAAAA,CAAKjB,UAAU,8CACZF,EAACoB,SAAAA,CACGC,KAAK,SACLnB,UAAU,wIACVoB,QAASxD,GAER,KAAOc,EAAKyB,IAAI,2BAMzC"}
@@ -1,2 +1,2 @@
1
- import{createElement as e}from"../../../external/preact/dist/preact.js";import{useState as t,useEffect as a}from"../../../external/preact/hooks/dist/hooks.js";import o from"../../../_virtual/index.js";import r from"../../../core/Services/payment-status.js";import{processResponse as n}from"../../../core/ProcessResponse/process-response.js";import s from"../Spinner/Spinner.js";import i from"../Countdown/index.js";import c from"../Button/Button.js";import{useCoreContext as l}from"../../../core/Context/CoreProvider.js";import u from"../../../core/Errors/AdyenCheckoutError.js";import d from"../ContentSeparator/ContentSeparator.js";import m from"../../../core/Context/useImage.js";function p(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}function _(e){for(var t=1;t<arguments.length;t++){var a=null!=arguments[t]?arguments[t]:{},o=Object.keys(a);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(a).filter(function(e){return Object.getOwnPropertyDescriptor(a,e).enumerable}))),o.forEach(function(t){p(e,t,a[t])})}return e}function y(e,t){if(null==e)return{};var a,o,r=function(e,t){if(null==e)return{};var a,o,r={},n=Object.keys(e);for(o=0;o<n.length;o++)a=n[o],t.indexOf(a)>=0||(r[a]=e[a]);return r}(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(o=0;o<n.length;o++)a=n[o],t.indexOf(a)>=0||Object.prototype.propertyIsEnumerable.call(e,a)&&(r[a]=e[a])}return r}function w(p){var w;const{i18n:h,loadingContext:f}=l(),g=m(),[v,k]=t(!1),[b,N]=t(!1),[j,O]=t(!0),[C,T]=t(!1),[x,E]=t(p.delay),[R,S]=t(100),[P,A]=t(0),[D,I]=t(!1),[L,M]=t(null),{amount:$}=p,z=e=>{if(e.props.payload){k(!0);const t={data:{details:{payload:e.props.payload},paymentData:p.paymentData}};return p.onComplete(t,this)}N(!0),p.onError(new u("ERROR","successful result, but no payload in response"))},B=e=>{if(N(!0),e.props.payload){const t={data:{details:{payload:e.props.payload},paymentData:p.paymentData}};return p.onComplete(t,this)}p.onError(new u("ERROR","error result with no payload in response"))},F=async()=>{const{paymentData:e,clientKey:t,throttleInterval:a,pollStatus:o}=p,s=null!=o?o:()=>r(e,t,f,a);var i;C||(null===(i=p.onActionHandled)||void 0===i||i.call(p,{componentType:p.type,actionDescription:"polling-started"}),T(!0));return s().then(n).catch(e=>{var{message:t}=e,a=y(e,["message"]);return{type:"network-error",props:_({},t&&{message:h.get(t)},a)}}).then(e=>{switch(e.type){case"success":z(e);break;case"error":B(e);break;default:O(!1)}})},H=e=>{window.location.assign(e)};a(()=>{p.shouldRedirectAutomatically&&p.url&&H(p.url)},[p.shouldRedirectAutomatically,p.url]),a(()=>(F(),()=>{clearTimeout(L)}),[]),a(()=>{if(b)return clearTimeout(L);if(v)return clearTimeout(L);if(!j){const e=async()=>{await F();const e=P+x;A(e),e>=p.throttleTime&&!D&&(E(p.throttleInterval),I(!0))};M(setTimeout(()=>{e()},x))}},[j,b,v,P]);const K=(t,a)=>e("div",{className:"adyen-checkout__await adyen-checkout__await--result"},e("img",{className:"adyen-checkout__await__icon adyen-checkout__await__icon--result",src:g({imageFolder:"components/"})(t),alt:h.get(a)}),e("div",{className:"adyen-checkout__await__subtitle adyen-checkout__await__subtitle--result"},h.get(a)));if(b)return K("error","error.subtitle.payment");if(v)return K("success","creditCard.success");if(j)return e("div",{className:"adyen-checkout__await"},p.brandLogo&&e("img",{src:p.brandLogo,alt:p.type,className:"adyen-checkout__await__brand-logo"}),e(s,{inline:!1,size:"large"}));const q=h.get("wechatpay.timetopay").split("%@");return e("div",{className:o("adyen-checkout__await",`adyen-checkout__await--${p.type}`,p.classNameModifiers.map(e=>`adyen-checkout__await--${e}`))},p.brandLogo&&e("img",{src:p.brandLogo,alt:p.type,className:"adyen-checkout__await__brand-logo"}),!!(p.showAmount&&(null==$?void 0:$.value)&&(null==$?void 0:$.currency))&&e("div",{className:"adyen-checkout__await__amount"},h.amount($.value,$.currency)),null!=p.messageText&&e("div",{className:"adyen-checkout__await__subtitle"},p.messageText),e("div",{className:"adyen-checkout__await__indicator-holder"},e("div",{className:"adyen-checkout__await__indicator-spinner"},e(s,{inline:!1,size:"medium"})),e("div",{className:"adyen-checkout__await__indicator-text"},p.awaitText)),p.showCountdownTimer&&e("div",{className:"adyen-checkout__await__countdown-holder"},e("div",{className:"adyen-checkout__await__progress"},e("span",{className:"adyen-checkout__await__percentage",style:{width:`${R}%`}})),e("div",{className:"adyen-checkout__await__countdown"},q[0]," ",e(i,{minutesFromNow:p.countdownTime,onTick:e=>{S(e.percentage)},onCompleted:()=>{N(!0),clearTimeout(L),p.onError(new u("ERROR","Payment Expired"))}})," ",q[1])),p.url&&!p.shouldRedirectAutomatically&&e("div",{className:"adyen-checkout__await__app-link"},e(d,null),e(c,{classNameModifiers:["await"],onClick:()=>H(p.url),label:h.get("openApp")})),p.instructions&&e("div",{className:"adyen-checkout__await__instructions"},"string"==typeof p.instructions?h.get(p.instructions):null===(w=p.instructions)||void 0===w?void 0:w.call(p)),p.endSlot&&e("div",{className:"adyen-checkout__await__end-slot"},p.endSlot()))}w.defaultProps={countdownTime:15,onError:()=>{},onComplete:()=>{},delay:2e3,throttleTime:6e4,throttleInterval:1e4,showCountdownTimer:!0,classNameModifiers:[],url:null};export{w as default};
1
+ import{createElement as e}from"../../../external/preact/dist/preact.js";import{useState as t,useEffect as a}from"../../../external/preact/hooks/dist/hooks.js";import o from"../../../_virtual/index.js";import r from"../../../core/Services/payment-status.js";import{processResponse as n}from"../../../core/ProcessResponse/process-response.js";import s from"../Spinner/Spinner.js";import i from"../Countdown/index.js";import c from"../Button/Button.js";import{useCoreContext as l}from"../../../core/Context/CoreProvider.js";import u from"../../../core/Errors/AdyenCheckoutError.js";import d from"../ContentSeparator/ContentSeparator.js";import m from"../../../core/Context/useImage.js";function p(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}function _(e){for(var t=1;t<arguments.length;t++){var a=null!=arguments[t]?arguments[t]:{},o=Object.keys(a);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(a).filter(function(e){return Object.getOwnPropertyDescriptor(a,e).enumerable}))),o.forEach(function(t){p(e,t,a[t])})}return e}function y(e,t){if(null==e)return{};var a,o,r=function(e,t){if(null==e)return{};var a,o,r={},n=Object.keys(e);for(o=0;o<n.length;o++)a=n[o],t.indexOf(a)>=0||(r[a]=e[a]);return r}(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(o=0;o<n.length;o++)a=n[o],t.indexOf(a)>=0||Object.prototype.propertyIsEnumerable.call(e,a)&&(r[a]=e[a])}return r}function w(p){var w;const{i18n:h,loadingContext:f}=l(),g=m(),[v,k]=t(!1),[b,N]=t(!1),[j,O]=t(!0),[C,T]=t(!1),[x,E]=t(p.delay),[R,S]=t(100),[P,A]=t(0),[D,I]=t(!1),[L,M]=t(null),{amount:$}=p,z=e=>{if(e.props.payload){k(!0);const t={data:{details:{payload:e.props.payload},paymentData:p.paymentData}};return p.onComplete(t,this)}N(!0),p.onError(new u("ERROR","successful result, but no payload in response"))},B=e=>{if(N(!0),e.props.payload){const t={data:{details:{payload:e.props.payload},paymentData:p.paymentData}};return p.onComplete(t,this)}p.onError(new u("ERROR","error result with no payload in response"))},F=async()=>{const{paymentData:e,clientKey:t,throttleInterval:a,pollStatus:o}=p,s=null!=o?o:()=>r(e,t,f,a);var i;C||(null===(i=p.onActionHandled)||void 0===i||i.call(p,{componentType:p.type,actionDescription:"polling-started"}),T(!0));return s().then(n).catch(e=>{var{message:t}=e,a=y(e,["message"]);return{type:"network-error",props:_({},t&&{message:h.get(t)},a)}}).then(e=>{switch(e.type){case"success":z(e);break;case"error":B(e);break;default:O(!1)}})},H=e=>{window.location.assign(e)};a(()=>{p.shouldRedirectAutomatically&&p.url&&H(p.url)},[p.shouldRedirectAutomatically,p.url]),a(()=>(F(),()=>{clearTimeout(L)}),[]),a(()=>{if(b)return clearTimeout(L);if(v)return clearTimeout(L);if(!j){const e=async()=>{await F();const e=P+x;A(e),e>=p.throttleTime&&!D&&(E(p.throttleInterval),I(!0))};M(setTimeout(()=>{e()},x))}},[j,b,v,P]);const K=(t,a)=>e("div",{className:"adyen-checkout__await adyen-checkout__await--result"},e("img",{className:"adyen-checkout__await__icon adyen-checkout__await__icon--result",src:g({imageFolder:"components/"})(t),alt:h.get(a)}),e("div",{className:"adyen-checkout__await__subtitle adyen-checkout__await__subtitle--result"},h.get(a)));if(b)return K("error","error.subtitle.payment");if(v)return K("success","creditCard.success");if(j)return e("div",{className:"adyen-checkout__await"},p.brandLogo&&e("img",{src:p.brandLogo,alt:p.type,className:"adyen-checkout__await__brand-logo"}),e(s,{inline:!1,size:"large"}));const q=h.get("wechatpay.timetopay").split("%@");return e("div",{className:o("adyen-checkout__await",`adyen-checkout__await--${p.type}`,p.classNameModifiers.map(e=>`adyen-checkout__await--${e}`))},p.brandLogo&&e("img",{src:p.brandLogo,alt:p.type,className:"adyen-checkout__await__brand-logo"}),!(!p.showAmount||null===(null==$?void 0:$.value)||!(null==$?void 0:$.currency))&&e("div",{className:"adyen-checkout__await__amount"},h.amount($.value,$.currency)),null!=p.messageText&&e("div",{className:"adyen-checkout__await__subtitle"},p.messageText),e("div",{className:"adyen-checkout__await__indicator-holder"},e("div",{className:"adyen-checkout__await__indicator-spinner"},e(s,{inline:!1,size:"medium"})),e("div",{className:"adyen-checkout__await__indicator-text"},p.awaitText)),p.showCountdownTimer&&e("div",{className:"adyen-checkout__await__countdown-holder"},e("div",{className:"adyen-checkout__await__progress"},e("span",{className:"adyen-checkout__await__percentage",style:{width:`${R}%`}})),e("div",{className:"adyen-checkout__await__countdown"},q[0]," ",e(i,{minutesFromNow:p.countdownTime,onTick:e=>{S(e.percentage)},onCompleted:()=>{N(!0),clearTimeout(L),p.onError(new u("ERROR","Payment Expired"))}})," ",q[1])),p.url&&!p.shouldRedirectAutomatically&&e("div",{className:"adyen-checkout__await__app-link"},e(d,null),e(c,{classNameModifiers:["await"],onClick:()=>H(p.url),label:h.get("openApp")})),p.instructions&&e("div",{className:"adyen-checkout__await__instructions"},"string"==typeof p.instructions?h.get(p.instructions):null===(w=p.instructions)||void 0===w?void 0:w.call(p)),p.endSlot&&e("div",{className:"adyen-checkout__await__end-slot"},p.endSlot()))}w.defaultProps={countdownTime:15,onError:()=>{},onComplete:()=>{},delay:2e3,throttleTime:6e4,throttleInterval:1e4,showCountdownTimer:!0,classNameModifiers:[],url:null};export{w as default};
2
2
  //# sourceMappingURL=Await.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Await.js","sources":["../../../../../src/components/internal/Await/Await.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useState, useEffect } from 'preact/hooks';\nimport classnames from 'classnames';\nimport checkPaymentStatus from '../../../core/Services/payment-status';\nimport processResponse from '../../../core/ProcessResponse';\n\nimport Spinner from '../../internal/Spinner';\nimport Countdown from '../Countdown';\nimport Button from '../Button';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { AwaitComponentProps, StatusObject } from './types';\nimport './Await.scss';\nimport AdyenCheckoutError from '../../../core/Errors/AdyenCheckoutError';\nimport ContentSeparator from '../ContentSeparator';\nimport useImage from '../../../core/Context/useImage';\n\nfunction Await(props: AwaitComponentProps) {\n const { i18n, loadingContext } = useCoreContext();\n const getImage = useImage();\n const [completed, setCompleted] = useState(false);\n const [expired, setExpired] = useState(false);\n const [loading, setLoading] = useState(true);\n const [hasCalledActionHandled, setHasCalledActionHandled] = useState(false);\n const [delay, setDelay] = useState(props.delay);\n const [percentage, setPercentage] = useState(100);\n const [timePassed, setTimePassed] = useState(0);\n const [hasAdjustedTime, setHasAdjustedTime] = useState(false);\n const [storedTimeout, setStoredTimeout] = useState(null);\n const { amount } = props;\n\n const onTimeUp = (): void => {\n setExpired(true);\n clearTimeout(storedTimeout);\n props.onError(new AdyenCheckoutError('ERROR', 'Payment Expired'));\n };\n\n const onTick = (time): void => {\n setPercentage(time.percentage);\n };\n\n const onComplete = (status: StatusObject): void => {\n // Only make details call if we have a payload\n if (status.props.payload) {\n setCompleted(true);\n const state = {\n data: {\n details: { payload: status.props.payload },\n paymentData: props.paymentData\n }\n };\n // Send success response to onAdditionalDetails\n return props.onComplete(state, this);\n }\n\n // Show error state & call merchant defined error callback if we do not have a payload\n setExpired(true);\n props.onError(new AdyenCheckoutError('ERROR', 'successful result, but no payload in response'));\n };\n\n const onError = (status: StatusObject): void => {\n setExpired(true);\n\n // Only make details call if we have a payload\n if (status.props.payload) {\n const state = {\n data: {\n details: { payload: status.props.payload },\n paymentData: props.paymentData\n }\n };\n // Send error response to onAdditionalDetails\n return props.onComplete(state, this);\n }\n\n // Call merchant defined error callback if we do not have a payload\n props.onError(new AdyenCheckoutError('ERROR', 'error result with no payload in response'));\n };\n\n const checkStatus = async (): Promise<void> => {\n const { paymentData, clientKey, throttleInterval, pollStatus } = props;\n\n // If there's a custom pollStatus function, call it.\n // Otherwise, call the default one.\n const pollStatusFunction = pollStatus ?? (() => checkPaymentStatus(paymentData, clientKey, loadingContext, throttleInterval));\n\n if (!hasCalledActionHandled) {\n props.onActionHandled?.({ componentType: props.type, actionDescription: 'polling-started' });\n setHasCalledActionHandled(true);\n }\n\n return pollStatusFunction()\n .then(processResponse)\n .catch(({ message, ...response }) => ({\n type: 'network-error',\n props: {\n ...(message && { message: i18n.get(message) }),\n ...response\n }\n }))\n .then((status: StatusObject) => {\n switch (status.type) {\n case 'success':\n onComplete(status);\n break;\n\n case 'error':\n onError(status);\n break;\n\n default:\n setLoading(false);\n }\n });\n };\n\n const redirectToApp = (url): void => {\n window.location.assign(url);\n };\n\n useEffect(() => {\n if (props.shouldRedirectAutomatically && props.url) {\n redirectToApp(props.url);\n }\n }, [props.shouldRedirectAutomatically, props.url]);\n\n useEffect(() => {\n void checkStatus();\n return (): void => {\n clearTimeout(storedTimeout);\n };\n }, []);\n\n useEffect(() => {\n if (expired) return clearTimeout(storedTimeout);\n\n if (completed) return clearTimeout(storedTimeout);\n\n if (!loading) {\n // Retry until getting a complete response from the server OR it times out\n // Changes setTimeout time to new value (throttleInterval) after a certain amount of time (throttleTime) has passed\n const statusInterval = async (): Promise<void> => {\n await checkStatus();\n\n const actualTimePassed = timePassed + delay;\n // timePassed is the value that is the main \"engine\" that drives this useEffect/polling\n setTimePassed(actualTimePassed);\n\n if (actualTimePassed >= props.throttleTime && !hasAdjustedTime) {\n setDelay(props.throttleInterval);\n setHasAdjustedTime(true);\n }\n };\n\n // Create (another) interval to poll for a result\n setStoredTimeout(setTimeout(() => void statusInterval(), delay));\n }\n }, [loading, expired, completed, timePassed]);\n\n const finalState = (image, message) => (\n <div className=\"adyen-checkout__await adyen-checkout__await--result\">\n <img\n className=\"adyen-checkout__await__icon adyen-checkout__await__icon--result\"\n src={getImage({ imageFolder: 'components/' })(image)}\n alt={i18n.get(message)}\n />\n <div className=\"adyen-checkout__await__subtitle adyen-checkout__await__subtitle--result\">{i18n.get(message)}</div>\n </div>\n );\n\n if (expired) {\n return finalState('error', 'error.subtitle.payment');\n }\n\n if (completed) {\n return finalState('success', 'creditCard.success');\n }\n\n if (loading) {\n return (\n <div className=\"adyen-checkout__await\">\n {props.brandLogo && <img src={props.brandLogo} alt={props.type} className=\"adyen-checkout__await__brand-logo\" />}\n <Spinner inline={false} size=\"large\" />\n </div>\n );\n }\n\n const timeToPayString = i18n.get('wechatpay.timetopay').split('%@');\n\n return (\n <div\n className={classnames(\n 'adyen-checkout__await',\n `adyen-checkout__await--${props.type}`,\n props.classNameModifiers.map(m => `adyen-checkout__await--${m}`)\n )}\n >\n {props.brandLogo && <img src={props.brandLogo} alt={props.type} className=\"adyen-checkout__await__brand-logo\" />}\n\n {/* Everything is wrapped in !! so we evaluate the result as boolean,\n otherwise we might just print the value or object as mistake */}\n {!!(props.showAmount && amount?.value && amount?.currency) && (\n <div className=\"adyen-checkout__await__amount\">{i18n.amount(amount.value, amount.currency)}</div>\n )}\n\n {props.messageText != null && <div className=\"adyen-checkout__await__subtitle\">{props.messageText}</div>}\n\n <div className=\"adyen-checkout__await__indicator-holder\">\n <div className=\"adyen-checkout__await__indicator-spinner\">\n <Spinner inline={false} size=\"medium\" />\n </div>\n <div className=\"adyen-checkout__await__indicator-text\">{props.awaitText}</div>\n </div>\n\n {props.showCountdownTimer && (\n <div className=\"adyen-checkout__await__countdown-holder\">\n <div className=\"adyen-checkout__await__progress\">\n <span className=\"adyen-checkout__await__percentage\" style={{ width: `${percentage}%` }} />\n </div>\n\n <div className=\"adyen-checkout__await__countdown\">\n {timeToPayString[0]}&nbsp;\n <Countdown minutesFromNow={props.countdownTime} onTick={onTick} onCompleted={onTimeUp} />\n &nbsp;{timeToPayString[1]}\n </div>\n </div>\n )}\n\n {props.url && !props.shouldRedirectAutomatically && (\n <div className=\"adyen-checkout__await__app-link\">\n <ContentSeparator />\n <Button classNameModifiers={['await']} onClick={() => redirectToApp(props.url)} label={i18n.get('openApp')} />\n </div>\n )}\n\n {props.instructions && (\n <div className=\"adyen-checkout__await__instructions\">\n {typeof props.instructions === 'string' ? i18n.get(props.instructions) : props.instructions?.()}\n </div>\n )}\n\n {props.endSlot && <div className=\"adyen-checkout__await__end-slot\">{props.endSlot()}</div>}\n </div>\n );\n}\n\nAwait.defaultProps = {\n countdownTime: 15,\n onError: () => {},\n onComplete: () => {},\n delay: 2000,\n throttleTime: 60000,\n throttleInterval: 10000,\n showCountdownTimer: true,\n classNameModifiers: [],\n url: null\n};\n\nexport default Await;\n"],"names":["Await","props","i18n","loadingContext","useCoreContext","getImage","useImage","completed","setCompleted","useState","expired","setExpired","loading","setLoading","hasCalledActionHandled","setHasCalledActionHandled","delay","setDelay","percentage","setPercentage","timePassed","setTimePassed","hasAdjustedTime","setHasAdjustedTime","storedTimeout","setStoredTimeout","amount","onComplete","status","payload","state","data","details","paymentData","this","onError","AdyenCheckoutError","checkStatus","async","clientKey","throttleInterval","pollStatus","pollStatusFunction","checkPaymentStatus","onActionHandled","componentType","type","actionDescription","then","processResponse","catch","_param","message","response","_object_spread","get","redirectToApp","url","window","location","assign","useEffect","shouldRedirectAutomatically","clearTimeout","statusInterval","actualTimePassed","throttleTime","setTimeout","finalState","image","h","div","className","img","src","imageFolder","alt","brandLogo","Spinner","inline","size","timeToPayString","split","classnames","classNameModifiers","map","m","showAmount","value","currency","messageText","awaitText","showCountdownTimer","span","style","width","Countdown","minutesFromNow","countdownTime","onTick","time","onCompleted","ContentSeparator","Button","onClick","label","instructions","endSlot","defaultProps"],"mappings":"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"}
1
+ {"version":3,"file":"Await.js","sources":["../../../../../src/components/internal/Await/Await.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useState, useEffect } from 'preact/hooks';\nimport classnames from 'classnames';\nimport checkPaymentStatus from '../../../core/Services/payment-status';\nimport processResponse from '../../../core/ProcessResponse';\n\nimport Spinner from '../../internal/Spinner';\nimport Countdown from '../Countdown';\nimport Button from '../Button';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { AwaitComponentProps, StatusObject } from './types';\nimport './Await.scss';\nimport AdyenCheckoutError from '../../../core/Errors/AdyenCheckoutError';\nimport ContentSeparator from '../ContentSeparator';\nimport useImage from '../../../core/Context/useImage';\n\nfunction Await(props: AwaitComponentProps) {\n const { i18n, loadingContext } = useCoreContext();\n const getImage = useImage();\n const [completed, setCompleted] = useState(false);\n const [expired, setExpired] = useState(false);\n const [loading, setLoading] = useState(true);\n const [hasCalledActionHandled, setHasCalledActionHandled] = useState(false);\n const [delay, setDelay] = useState(props.delay);\n const [percentage, setPercentage] = useState(100);\n const [timePassed, setTimePassed] = useState(0);\n const [hasAdjustedTime, setHasAdjustedTime] = useState(false);\n const [storedTimeout, setStoredTimeout] = useState(null);\n const { amount } = props;\n\n const onTimeUp = (): void => {\n setExpired(true);\n clearTimeout(storedTimeout);\n props.onError(new AdyenCheckoutError('ERROR', 'Payment Expired'));\n };\n\n const onTick = (time): void => {\n setPercentage(time.percentage);\n };\n\n const onComplete = (status: StatusObject): void => {\n // Only make details call if we have a payload\n if (status.props.payload) {\n setCompleted(true);\n const state = {\n data: {\n details: { payload: status.props.payload },\n paymentData: props.paymentData\n }\n };\n // Send success response to onAdditionalDetails\n return props.onComplete(state, this);\n }\n\n // Show error state & call merchant defined error callback if we do not have a payload\n setExpired(true);\n props.onError(new AdyenCheckoutError('ERROR', 'successful result, but no payload in response'));\n };\n\n const onError = (status: StatusObject): void => {\n setExpired(true);\n\n // Only make details call if we have a payload\n if (status.props.payload) {\n const state = {\n data: {\n details: { payload: status.props.payload },\n paymentData: props.paymentData\n }\n };\n // Send error response to onAdditionalDetails\n return props.onComplete(state, this);\n }\n\n // Call merchant defined error callback if we do not have a payload\n props.onError(new AdyenCheckoutError('ERROR', 'error result with no payload in response'));\n };\n\n const checkStatus = async (): Promise<void> => {\n const { paymentData, clientKey, throttleInterval, pollStatus } = props;\n\n // If there's a custom pollStatus function, call it.\n // Otherwise, call the default one.\n const pollStatusFunction = pollStatus ?? (() => checkPaymentStatus(paymentData, clientKey, loadingContext, throttleInterval));\n\n if (!hasCalledActionHandled) {\n props.onActionHandled?.({ componentType: props.type, actionDescription: 'polling-started' });\n setHasCalledActionHandled(true);\n }\n\n return pollStatusFunction()\n .then(processResponse)\n .catch(({ message, ...response }) => ({\n type: 'network-error',\n props: {\n ...(message && { message: i18n.get(message) }),\n ...response\n }\n }))\n .then((status: StatusObject) => {\n switch (status.type) {\n case 'success':\n onComplete(status);\n break;\n\n case 'error':\n onError(status);\n break;\n\n default:\n setLoading(false);\n }\n });\n };\n\n const redirectToApp = (url): void => {\n window.location.assign(url);\n };\n\n useEffect(() => {\n if (props.shouldRedirectAutomatically && props.url) {\n redirectToApp(props.url);\n }\n }, [props.shouldRedirectAutomatically, props.url]);\n\n useEffect(() => {\n void checkStatus();\n return (): void => {\n clearTimeout(storedTimeout);\n };\n }, []);\n\n useEffect(() => {\n if (expired) return clearTimeout(storedTimeout);\n\n if (completed) return clearTimeout(storedTimeout);\n\n if (!loading) {\n // Retry until getting a complete response from the server OR it times out\n // Changes setTimeout time to new value (throttleInterval) after a certain amount of time (throttleTime) has passed\n const statusInterval = async (): Promise<void> => {\n await checkStatus();\n\n const actualTimePassed = timePassed + delay;\n // timePassed is the value that is the main \"engine\" that drives this useEffect/polling\n setTimePassed(actualTimePassed);\n\n if (actualTimePassed >= props.throttleTime && !hasAdjustedTime) {\n setDelay(props.throttleInterval);\n setHasAdjustedTime(true);\n }\n };\n\n // Create (another) interval to poll for a result\n setStoredTimeout(setTimeout(() => void statusInterval(), delay));\n }\n }, [loading, expired, completed, timePassed]);\n\n const finalState = (image, message) => (\n <div className=\"adyen-checkout__await adyen-checkout__await--result\">\n <img\n className=\"adyen-checkout__await__icon adyen-checkout__await__icon--result\"\n src={getImage({ imageFolder: 'components/' })(image)}\n alt={i18n.get(message)}\n />\n <div className=\"adyen-checkout__await__subtitle adyen-checkout__await__subtitle--result\">{i18n.get(message)}</div>\n </div>\n );\n\n if (expired) {\n return finalState('error', 'error.subtitle.payment');\n }\n\n if (completed) {\n return finalState('success', 'creditCard.success');\n }\n\n if (loading) {\n return (\n <div className=\"adyen-checkout__await\">\n {props.brandLogo && <img src={props.brandLogo} alt={props.type} className=\"adyen-checkout__await__brand-logo\" />}\n <Spinner inline={false} size=\"large\" />\n </div>\n );\n }\n\n const timeToPayString = i18n.get('wechatpay.timetopay').split('%@');\n\n return (\n <div\n className={classnames(\n 'adyen-checkout__await',\n `adyen-checkout__await--${props.type}`,\n props.classNameModifiers.map(m => `adyen-checkout__await--${m}`)\n )}\n >\n {props.brandLogo && <img src={props.brandLogo} alt={props.type} className=\"adyen-checkout__await__brand-logo\" />}\n\n {/* Everything is wrapped in !! so we evaluate the result as boolean,\n otherwise we might just print the value or object as mistake */}\n {!!(props.showAmount && amount?.value !== null && amount?.currency) && (\n <div className=\"adyen-checkout__await__amount\">{i18n.amount(amount.value, amount.currency)}</div>\n )}\n\n {props.messageText != null && <div className=\"adyen-checkout__await__subtitle\">{props.messageText}</div>}\n\n <div className=\"adyen-checkout__await__indicator-holder\">\n <div className=\"adyen-checkout__await__indicator-spinner\">\n <Spinner inline={false} size=\"medium\" />\n </div>\n <div className=\"adyen-checkout__await__indicator-text\">{props.awaitText}</div>\n </div>\n\n {props.showCountdownTimer && (\n <div className=\"adyen-checkout__await__countdown-holder\">\n <div className=\"adyen-checkout__await__progress\">\n <span className=\"adyen-checkout__await__percentage\" style={{ width: `${percentage}%` }} />\n </div>\n\n <div className=\"adyen-checkout__await__countdown\">\n {timeToPayString[0]}&nbsp;\n <Countdown minutesFromNow={props.countdownTime} onTick={onTick} onCompleted={onTimeUp} />\n &nbsp;{timeToPayString[1]}\n </div>\n </div>\n )}\n\n {props.url && !props.shouldRedirectAutomatically && (\n <div className=\"adyen-checkout__await__app-link\">\n <ContentSeparator />\n <Button classNameModifiers={['await']} onClick={() => redirectToApp(props.url)} label={i18n.get('openApp')} />\n </div>\n )}\n\n {props.instructions && (\n <div className=\"adyen-checkout__await__instructions\">\n {typeof props.instructions === 'string' ? i18n.get(props.instructions) : props.instructions?.()}\n </div>\n )}\n\n {props.endSlot && <div className=\"adyen-checkout__await__end-slot\">{props.endSlot()}</div>}\n </div>\n );\n}\n\nAwait.defaultProps = {\n countdownTime: 15,\n onError: () => {},\n onComplete: () => {},\n delay: 2000,\n throttleTime: 60000,\n throttleInterval: 10000,\n showCountdownTimer: true,\n classNameModifiers: [],\n url: null\n};\n\nexport default Await;\n"],"names":["Await","props","i18n","loadingContext","useCoreContext","getImage","useImage","completed","setCompleted","useState","expired","setExpired","loading","setLoading","hasCalledActionHandled","setHasCalledActionHandled","delay","setDelay","percentage","setPercentage","timePassed","setTimePassed","hasAdjustedTime","setHasAdjustedTime","storedTimeout","setStoredTimeout","amount","onComplete","status","payload","state","data","details","paymentData","this","onError","AdyenCheckoutError","checkStatus","async","clientKey","throttleInterval","pollStatus","pollStatusFunction","checkPaymentStatus","onActionHandled","componentType","type","actionDescription","then","processResponse","catch","_param","message","response","_object_spread","get","redirectToApp","url","window","location","assign","useEffect","shouldRedirectAutomatically","clearTimeout","statusInterval","actualTimePassed","throttleTime","setTimeout","finalState","image","h","div","className","img","src","imageFolder","alt","brandLogo","Spinner","inline","size","timeToPayString","split","classnames","classNameModifiers","map","m","showAmount","value","currency","messageText","awaitText","showCountdownTimer","span","style","width","Countdown","minutesFromNow","countdownTime","onTick","time","onCompleted","ContentSeparator","Button","onClick","label","instructions","endSlot","defaultProps"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{createElement as e}from"../../../../external/preact/dist/preact.js";import t from"../../../../_virtual/index.js";import{useCoreContext as i}from"../../../../core/Context/CoreProvider.js";import{getUniqueId as a}from"../../../../utils/idGenerator.js";function d({children:d,classNameModifiers:s=[],label:r,readonly:c=!1,description:o}){const{i18n:l}=i(),n=a("payid-input-description");return e("fieldset",{className:t(["adyen-checkout__fieldset",...s.map(e=>`adyen-checkout__fieldset--${e}`),{"adyen-checkout__fieldset--readonly":c}]),"aria-describedby":o?n:null},r&&e("legend",{className:"adyen-checkout__fieldset__title"},l.get(r)),o&&e("p",{id:n,className:"adyen-checkout__fieldset__description"},l.get(o)),e("div",{className:"adyen-checkout__fieldset__fields"},d))}export{d as default};
1
+ import{createElement as e}from"../../../../external/preact/dist/preact.js";import t from"../../../../_virtual/index.js";import{useCoreContext as i}from"../../../../core/Context/CoreProvider.js";import{getUniqueId as s}from"../../../../utils/idGenerator.js";import{useMemo as d}from"../../../../external/preact/hooks/dist/hooks.js";function o({children:o,classNameModifiers:r=[],label:a,readonly:c=!1,description:l,id:n}){const{i18n:_}=i(),m=d(()=>s("fieldset-description"),[]);return e("fieldset",{id:n,className:t(["adyen-checkout__fieldset",...r.map(e=>`adyen-checkout__fieldset--${e}`),{"adyen-checkout__fieldset--readonly":c}]),"aria-describedby":l?m:null},a&&e("legend",{className:"adyen-checkout__fieldset__title"},_.get(a)),l&&e("p",{id:m,className:"adyen-checkout__fieldset__description"},_.get(l)),e("div",{className:"adyen-checkout__fieldset__fields"},o))}export{o as default};
2
2
  //# sourceMappingURL=Fieldset.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Fieldset.js","sources":["../../../../../../src/components/internal/FormFields/Fieldset/Fieldset.tsx"],"sourcesContent":["import { h, ComponentChildren } from 'preact';\nimport cx from 'classnames';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport './Fieldset.scss';\nimport { getUniqueId } from '../../../../utils/idGenerator';\n\ninterface FieldsetProps {\n children: ComponentChildren;\n classNameModifiers?: string[];\n label?: string;\n description?: string;\n readonly?: boolean;\n}\n\nexport default function Fieldset({ children, classNameModifiers = [], label, readonly = false, description }: FieldsetProps) {\n const { i18n } = useCoreContext();\n\n const describedById = getUniqueId('payid-input-description');\n\n return (\n <fieldset\n className={cx([\n 'adyen-checkout__fieldset',\n ...classNameModifiers.map(m => `adyen-checkout__fieldset--${m}`),\n { 'adyen-checkout__fieldset--readonly': readonly }\n ])}\n aria-describedby={description ? describedById : null}\n >\n {label && <legend className=\"adyen-checkout__fieldset__title\">{i18n.get(label)}</legend>}\n {description && (\n <p id={describedById} className=\"adyen-checkout__fieldset__description\">\n {i18n.get(description)}\n </p>\n )}\n <div className=\"adyen-checkout__fieldset__fields\">{children}</div>\n </fieldset>\n );\n}\n"],"names":["Fieldset","children","classNameModifiers","label","readonly","description","i18n","useCoreContext","describedById","getUniqueId","h","fieldset","className","cx","map","m","aria-describedby","legend","get","p","id","div"],"mappings":"iQAce,SAASA,GAASC,SAAEA,EAAQC,mBAAEA,EAAqB,GAAEC,MAAEA,EAAKC,SAAEA,GAAW,EAAKC,YAAEA,IAC3F,MAAMC,KAAEA,GAASC,IAEXC,EAAgBC,EAAY,2BAElC,OACIC,EAACC,WAAAA,CACGC,UAAWC,EAAG,CACV,8BACGX,EAAmBY,IAAIC,GAAK,6BAA6BA,KAC5D,CAAE,qCAAsCX,KAE5CY,mBAAkBX,EAAcG,EAAgB,MAE/CL,GAASO,EAACO,SAAAA,CAAOL,UAAU,mCAAmCN,EAAKY,IAAIf,IACvEE,GACGK,EAACS,IAAAA,CAAEC,GAAIZ,EAAeI,UAAU,yCAC3BN,EAAKY,IAAIb,IAGlBK,EAACW,MAAAA,CAAIT,UAAU,oCAAoCX,GAG/D"}
1
+ {"version":3,"file":"Fieldset.js","sources":["../../../../../../src/components/internal/FormFields/Fieldset/Fieldset.tsx"],"sourcesContent":["import { h, ComponentChildren } from 'preact';\nimport cx from 'classnames';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\nimport './Fieldset.scss';\nimport { getUniqueId } from '../../../../utils/idGenerator';\nimport { useMemo } from 'preact/hooks';\n\ninterface FieldsetProps {\n children: ComponentChildren;\n classNameModifiers?: string[];\n label?: string;\n description?: string;\n readonly?: boolean;\n id?: string;\n}\n\nexport default function Fieldset({ children, classNameModifiers = [], label, readonly = false, description, id }: FieldsetProps) {\n const { i18n } = useCoreContext();\n\n const describedById = useMemo(() => getUniqueId('fieldset-description'), []);\n\n return (\n <fieldset\n id={id}\n className={cx([\n 'adyen-checkout__fieldset',\n ...classNameModifiers.map(m => `adyen-checkout__fieldset--${m}`),\n { 'adyen-checkout__fieldset--readonly': readonly }\n ])}\n aria-describedby={description ? describedById : null}\n >\n {label && <legend className=\"adyen-checkout__fieldset__title\">{i18n.get(label)}</legend>}\n {description && (\n <p id={describedById} className=\"adyen-checkout__fieldset__description\">\n {i18n.get(description)}\n </p>\n )}\n <div className=\"adyen-checkout__fieldset__fields\">{children}</div>\n </fieldset>\n );\n}\n"],"names":["Fieldset","children","classNameModifiers","label","readonly","description","id","i18n","useCoreContext","describedById","useMemo","getUniqueId","h","fieldset","className","cx","map","m","aria-describedby","legend","get","p","div"],"mappings":"2UAgBe,SAASA,GAASC,SAAEA,EAAQC,mBAAEA,EAAqB,GAAEC,MAAEA,EAAKC,SAAEA,GAAW,EAAKC,YAAEA,EAAWC,GAAEA,IACxG,MAAMC,KAAEA,GAASC,IAEXC,EAAgBC,EAAQ,IAAMC,EAAY,wBAAyB,IAEzE,OACIC,EAACC,WAAAA,CACGP,GAAIA,EACJQ,UAAWC,EAAG,CACV,8BACGb,EAAmBc,IAAIC,GAAK,6BAA6BA,KAC5D,CAAE,qCAAsCb,KAE5Cc,mBAAkBb,EAAcI,EAAgB,MAE/CN,GAASS,EAACO,SAAAA,CAAOL,UAAU,mCAAmCP,EAAKa,IAAIjB,IACvEE,GACGO,EAACS,IAAAA,CAAEf,GAAIG,EAAeK,UAAU,yCAC3BP,EAAKa,IAAIf,IAGlBO,EAACU,MAAAA,CAAIR,UAAU,oCAAoCb,GAG/D"}