@adyen/kyc-components 4.25.0 → 4.26.0-beta.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.
- package/dist/{4-people-DKuivE0m.js → 4-people-CAxQpi_3.js} +2 -2
- package/dist/{AcceptTermsOfServiceWorkflow-BKWCrZdZ.js → AcceptTermsOfServiceWorkflow-eOcHITwQ.js} +4 -4
- package/dist/{Accordion-D_DOaWj2.js → Accordion-BAdwrgCR.js} +4 -24
- package/dist/{AccountSetupRejected-BtcxtVKO.js → AccountSetupRejected-Jii0yaLC.js} +3 -4
- package/dist/{NodeRenderer-Z10yF5MV.js → AdaptiveWorkflow-B6SIOcbU.js} +87 -34
- package/dist/{AdaptiveWorkflowComponent-C4Q6NVtv.js → AdaptiveWorkflowComponent-we5_UgiI.js} +32 -33
- package/dist/{AddressFields-CFG2_P0x.js → AddressFields-Qq_8lUYz.js} +21 -27
- package/dist/{Avatar-k5lNd5KG.js → Avatar-C2zeqSSB.js} +10 -8
- package/dist/{BusinessFinancingDropin-BjTnxk__.js → BusinessFinancingDropin-gMa--znJ.js} +61 -71
- package/dist/{BusinessFinancingPage-C4dAslMp.js → BusinessFinancingPage-BIdRvI7h.js} +7 -7
- package/dist/{BusinessRegistrationNumberField-Dz1uGvRQ.js → BusinessRegistrationNumberField-Vr3KBWJD.js} +7 -8
- package/dist/{BusinessRegistrationNumberFieldGroup-BFPrFa1_.js → BusinessRegistrationNumberFieldGroup-DLGAFcRN.js} +7 -8
- package/dist/{BusinessTypeSelectionPage-DeWD37jR.js → BusinessTypeSelectionPage-9B2SxGcV.js} +16 -17
- package/dist/{Button-BxdC8cVB.js → Button-Dwr6jvJZ.js} +2 -2
- package/dist/Checkbox-zAGhz7rC.js +114 -0
- package/dist/{ComponentGroup-S6c3rVoX.js → ComponentGroup-DH_CH6bM.js} +4 -4
- package/dist/{ConstitutionalDocument-CNNhKkzD.js → ConstitutionalDocument-DMNlJJzp.js} +25 -28
- package/dist/{ContactDetails-_HCOKj3-.js → ContactDetails-kwe-LwUD.js} +8 -13
- package/dist/{ContextGuidance-v-d9RQuo.js → ContextGuidance-1tQjHxTm.js} +3 -3
- package/dist/CountryField-BkNURmjP.js +56 -0
- package/dist/{Currency-3Z9i_AhY.js → Currency-BjBbhCzV.js} +10 -12
- package/dist/{CustomerSupport-B0UJHtAq.js → CustomerSupport-CT4s3fyC.js} +17 -17
- package/dist/DateField-CJeu0KoS.js +73 -0
- package/dist/{DebugModal-DgbagO5Z.js → DebugModal-YjFFNeOM.js} +12 -17
- package/dist/{DecisionMakerDetails-RF9BoMYF.js → DecisionMakerDetails-B4aCl2kl.js} +21 -24
- package/dist/{DecisionMakerDetailsPage-CGOs2Ubt.js → DecisionMakerDetailsPage-Dg_RbdxY.js} +43 -40
- package/dist/{DecisionMakers-qRoXooYA.js → DecisionMakers-Cq3yVb54.js} +55 -61
- package/dist/{DetailViewLayout-DNCGEd7b.js → DetailViewLayout-DJgAzdlZ.js} +8 -6
- package/dist/{Dropzone-cewfCgXt.js → Dropzone-Cgqct7ux.js} +8 -8
- package/dist/EmailField-CVwmsS5d.js +61 -0
- package/dist/{EmbeddedStatus-Keg7UojY.js → EmbeddedStatus-4YjyzkcD.js} +4 -4
- package/dist/{EndStateLayout-GHEYl82p.js → EndStateLayout-C5Pqler-.js} +3 -3
- package/dist/{EntityAssociation-BPtrqdQR.js → EntityAssociation-DzNk5XbC.js} +7 -7
- package/dist/{ErrorPanel-PefRq1M4.js → ErrorPanel-DtbpEeJk.js} +24 -19
- package/dist/{GlobalEntryModal-CTGSdkW7.js → GlobalEntryModal-D9rqts-z.js} +203 -78
- package/dist/{GlobalEntryPage-CdGXV-QZ.js → GlobalEntryPage-OTglAvMX.js} +10 -10
- package/dist/Icon-_YUEZg1p.js +175 -0
- package/dist/{IdentityNumber-Cz6-4YcM.js → IdentityNumber-9SwAYweE.js} +10 -12
- package/dist/{IdentityNumberFieldGroup-D2PV_4A5.js → IdentityNumberFieldGroup-B9SxTHei.js} +16 -14
- package/dist/{IdentityScreeningWorkflow-mbcaIctn.js → IdentityScreeningWorkflow-C-nLWlJS.js} +16 -16
- package/dist/{Image-Bn_Yyuof.js → Image-CxnjHtP1.js} +1 -1
- package/dist/{IndividualDropin-D1UOavsw.js → IndividualDropin-BpFRq3S4.js} +266 -281
- package/dist/{IndustryCodeFieldGroup-DmOqxPIg.js → IndustryCodeFieldGroup-CEWUFYmK.js} +9 -10
- package/dist/{InputDate-B0RNGCq2.js → InputDate-DjUm9FiK.js} +6 -29
- package/dist/InputDate.utils-D4Ov0KIl.js +25 -0
- package/dist/{InputGroup-B4U3QVEp.js → InputGroup-Bv005B22.js} +7 -6
- package/dist/{InputText-CwPK55J0.js → InputText-DtoBABE5.js} +42 -4
- package/dist/{Introduction-DFW6EaLG.js → Introduction-GW5FJSTJ.js} +9 -9
- package/dist/{InvitedDecisionMakerComponent-hdQc0T7D.js → InvitedDecisionMakerComponent-tahktJVa.js} +45 -45
- package/dist/{JpAddressFields-CzGnXBMk.js → JpAddressFields-CpRh_gFz.js} +13 -13
- package/dist/{LegalCompanyNameField-CV2EgRCw.js → LegalCompanyNameField-Coff77lN.js} +5 -5
- package/dist/{LegalRepresentativeDetailsPage-BiAfoErR.js → LegalRepresentativeDetailsPage-CXMGtJvO.js} +35 -34
- package/dist/{Link-C3dYYTm_.js → Link-D0Yqc2r0.js} +7 -6
- package/dist/{List-ywoRPg-q.js → List-qvNxW9lm.js} +3 -2
- package/dist/{ListItem-CHGVbHhB.js → ListItem-DY-qq1lS.js} +29 -4
- package/dist/{Loader-BVtlpTeo.js → Loader-BDaKGf77.js} +1 -1
- package/dist/{Modal-Dq44ZUNN.js → Modal-Dx_NESnV.js} +25 -5
- package/dist/{Name-BfQr3et_.js → Name-CrLaukRh.js} +5 -5
- package/dist/NumberField-CS93IGoS.js +60 -0
- package/dist/{PatriotActDisclosure-BNAsJXEL.js → PatriotActDisclosure-C3jKKi6y.js} +11 -12
- package/dist/{PayoutDetailsDropin-NyizAaYy.js → PayoutDetailsDropin-BxOJ9P17.js} +163 -158
- package/dist/{PayoutDetailsPage-NM0Eqf4K.js → PayoutDetailsPage-BxaCk685.js} +10 -9
- package/dist/{Review-CzgmjDcZ.js → Review-C81Qsrkg.js} +25 -24
- package/dist/{RootBusinessDetailsPage-B1a0hu8F.js → RootBusinessDetailsPage-CwRyRbEv.js} +9 -7
- package/dist/{RootBusinessLinesPage-Dv1uT7OS.js → RootBusinessLinesPage-C3GZQ-KO.js} +48 -53
- package/dist/{RootIndividualDetailsPage-vkjzmyF7.js → RootIndividualDetailsPage-CvVVlkJI.js} +42 -39
- package/dist/{Select-prMx73V9.js → Select-AiAom5JL.js} +330 -19
- package/dist/{SignPCIComponent-CIkdVNH2.js → SignPCIComponent-Dmr9dDYB.js} +19 -23
- package/dist/{SingpassSelection-B6NONcr4.js → SingpassSelection-BXHvwmgp.js} +7 -7
- package/dist/Skeleton-7xDqhYr-.js +30 -0
- package/dist/{SoleProprietorshipPage-BmNs557C.js → SoleProprietorshipPage-DKL4anrn.js} +7 -7
- package/dist/{SourceOfFundsPage-B5nZ3MjN.js → SourceOfFundsPage-2dxP6dlL.js} +46 -58
- package/dist/{SourceOfFundsWorkflow-IkLZG9JI.js → SourceOfFundsWorkflow-Didn1fld.js} +4 -4
- package/dist/{StackLayout-IUdNMDgW.js → StackLayout-J1ynSX-P.js} +6 -5
- package/dist/{utils-lIizXlcC.js → StateField-BoIVEnaZ.js} +89 -3
- package/dist/{Step-BJh4XZae.js → Step-CiwqdcuY.js} +19 -13
- package/dist/SummarySection-B6A_AT1m.js +60 -0
- package/dist/{Task-yQcY16x1.js → Task-CJDcviJ6.js} +8 -8
- package/dist/{TaskGroup-C9iFHpux.js → TaskGroup-BXkrbyTG.js} +5 -5
- package/dist/{TaskListItem-ChlmCIfF.js → TaskListItem-CQXvVRWG.js} +11 -11
- package/dist/{TaskStepperContextProvider-I7talGDO.js → TaskStepperContextProvider-9wlnwii7.js} +1 -1
- package/dist/{TaskVerificationStatus-Bd5Eftf2.js → TaskVerificationStatus-zoxTZ2mt.js} +3 -3
- package/dist/{TaxInformationFieldGroup-Dq0J9rBU.js → TaxInformationFieldGroup-CnaGMge9.js} +19 -18
- package/dist/{TaxReportingDropin-Cq3gBWtp.js → TaxReportingDropin-F4e4CxiC.js} +22 -26
- package/dist/{TaxReportingWorkflow-flQPRAPy.js → TaxReportingWorkflow-Caa_klQR.js} +4 -4
- package/dist/{TermsOfServiceManagement-BM5K4cpw.js → TermsOfServiceManagement-5x2f0QgC.js} +21 -30
- package/dist/{TextArea-C12oXMzX.js → TextArea-eJQFkYyd.js} +5 -5
- package/dist/TextField-Ca7rT4tr.js +73 -0
- package/dist/{TrustDetailsPage-z7s9FxVC.js → TrustDetailsPage-D3RkKlpJ.js} +59 -67
- package/dist/{TrustMemberCompanyPage-tU2HTiDG.js → TrustMemberCompanyPage-BvBxQg7D.js} +8 -8
- package/dist/{TrustMemberIndividualPage-BLBtnoSq.js → TrustMemberIndividualPage-D4idWK8j.js} +35 -34
- package/dist/{TrustMemberRoleAndTypePage-DIwrtOWr.js → TrustMemberRoleAndTypePage-CyKm_knd.js} +23 -30
- package/dist/{TrustMembersOverview-CowTgfIb.js → TrustMembersOverview-BnP0wZSf.js} +18 -22
- package/dist/{UboTaskItem-CZLDzQil.js → UboTaskItem-Degn5OyC.js} +8 -8
- package/dist/{UnincorporatedPartnershipIndividualPage-BT0j54-O.js → UnincorporatedPartnershipIndividualPage-Bgb4oCRJ.js} +35 -34
- package/dist/{UnincorporatedPartnershipMemberCompanyPage-DFOoV0wQ.js → UnincorporatedPartnershipMemberCompanyPage-T6SOH3Mv.js} +8 -8
- package/dist/{UnincorporatedPartnershipMemberRoleAndTypePage-D973uyHj.js → UnincorporatedPartnershipMemberRoleAndTypePage-BVfav_Z_.js} +14 -16
- package/dist/{UnincorporatedPartnershipMembersOverview-5w1BrDMI.js → UnincorporatedPartnershipMembersOverview-DPW48_Lv.js} +11 -14
- package/dist/VerificationErrorAlert-q1SEqBXx.js +68 -0
- package/dist/WebsiteField-CnOU49Hn.js +62 -0
- package/dist/{Workflow-CF-HUIjR.js → Workflow-D298oRt0.js} +9 -9
- package/dist/{accountHolderUtils-CAu4V0ed.js → accountHolderUtils-CLuKAgaj.js} +3 -3
- package/dist/adyen-business-financing.js +8 -9
- package/dist/adyen-individual-configuration.js +36 -36
- package/dist/adyen-individual-status.js +8 -9
- package/dist/adyen-invited-decision-maker.js +3 -3
- package/dist/adyen-onboarding.js +61 -59
- package/dist/adyen-terms-of-service-management.js +3 -3
- package/dist/adyen-terms-of-service-status.js +6 -7
- package/dist/adyen-transfer-instrument-configuration.js +7 -8
- package/dist/adyen-transfer-instrument-management.js +16 -22
- package/dist/adyen-verification-status.js +7 -9
- package/dist/{arrow-right-D2hul7WG.js → arrow-right-BwP9nNDE.js} +2 -2
- package/dist/bafinUtils-CsDthERR.js +3548 -0
- package/dist/{bag-CRRS1aow.js → bag-Cnk9dcZg.js} +2 -2
- package/dist/{bank-BoirCLLW.js → bank-UssyP-aG.js} +2 -2
- package/dist/bg-BG-C7z9VtPy.js +7 -0
- package/dist/{bin-BOmfqfrr.js → bin--Ft4cPCj.js} +2 -2
- package/dist/{capital-DTjbiurV.js → capital-BbOFhTHY.js} +2 -2
- package/dist/{cash-stack-7KpYpBek.js → cash-stack-LTzc8hQZ.js} +2 -2
- package/dist/{certificate-BPuoJ6Ip.js → certificate-CswNcwlI.js} +2 -2
- package/dist/{checkmark-BiSLf8M1.js → checkmark-DH1abKZn.js} +2 -2
- package/dist/{checkmark-circle-Ams7bSve.js → checkmark-circle-VWM-JsI6.js} +2 -2
- package/dist/{checkmark-circle-fill-_p4ss4ac.js → checkmark-circle-fill-AuW2DQDT.js} +2 -2
- package/dist/{checkmark-small-3bw4ftPV.js → checkmark-small-B6vsnsSO.js} +2 -2
- package/dist/{chevron-down-GgZawvoy.js → chevron-down-BGAMP7CF.js} +2 -2
- package/dist/{chevron-left-TeZTTvo5.js → chevron-left-EjFIt8Cd.js} +2 -2
- package/dist/{chevron-right-Cg8XlTxx.js → chevron-right-B5zb9mkt.js} +2 -2
- package/dist/{chevron-up-COQUTli0.js → chevron-up-DZiittpJ.js} +2 -2
- package/dist/{circle-CypWzg83.js → circle-CygvxRY_.js} +2 -2
- package/dist/{circle-small-filled-DfdK2A35.js → circle-small-filled-PeElhgJU.js} +2 -2
- package/dist/{clock-DmfGJ2r9.js → clock-CQXEE5jK.js} +2 -2
- package/dist/{coins-CBvbB8_X.js → coins-C7syygUR.js} +2 -2
- package/dist/{constants-DAb_IqC6.js → constants-Dvga6KjU.js} +7 -8
- package/dist/{contract-D1_RJ_xh.js → contract-BWEAd7e-.js} +2 -2
- package/dist/{countries-BGMTpyJv.js → countries-ZMuvRtQR.js} +1 -1
- package/dist/{country-BEZkohEO.js → country-WYlusjTL.js} +2 -2
- package/dist/{cross-circle-fill-CUXdo1x-.js → cross-circle-fill-Bxj_fgQE.js} +2 -2
- package/dist/cross-circle-fill-small-DwUKcL9P.js +20 -0
- package/dist/{cross-BORHADVQ.js → cross-vK6qh9R0.js} +2 -2
- package/dist/cs-CZ-B_u3kWRS.js +7 -0
- package/dist/da-DK-s_nCUhFO.js +7 -0
- package/dist/de-DE-5lHcZmT6.js +7 -0
- package/dist/{decisionMakerRoles-JEb0ON4e.js → decisionMakerRoles-DA8MK9Dh.js} +2 -2
- package/dist/{document-1-qvV57JdS.js → document-1-BPWF8zKf.js} +2 -2
- package/dist/{document-person-DiJ7M8-D.js → document-person-DVRFNq7g.js} +2 -2
- package/dist/{documentUtils-CxjFpoJB.js → documentUtils-6K3LdjjN.js} +6 -4
- package/dist/{download-Ca4w0Yfr.js → download-DfdpoHdN.js} +2 -2
- package/dist/dropinUtils-CSlRmPSn.js +2572 -0
- package/dist/{edit-1-D8VhDchs.js → edit-1-BgVB06zI.js} +2 -2
- package/dist/el-GR-DTaQeK-A.js +7 -0
- package/dist/{entityAssociationUtil-CY0grcyH.js → entityAssociationUtil-BlfcBl3i.js} +1 -1
- package/dist/{error-DrzrPjvf.js → error-DjErFfKK.js} +3 -3
- package/dist/es-ES-tZMJvO6B.js +7 -0
- package/dist/es-LA-C0x1nQUQ.js +7 -0
- package/dist/et-EE-BqB-3lW_.js +7 -0
- package/dist/{external-link-Dy4le-8Q.js → external-link-BbXGAtFE.js} +2 -2
- package/dist/fi-FI-BpwWFhLW.js +7 -0
- package/dist/{form-rules-DhuNdiqF.js → form-rules-HzaYJh36.js} +90 -5
- package/dist/{formatValidationError-z2D5oU1e.js → formatValidationError-D3vBdIym.js} +2 -2
- package/dist/fr-FR-DMPXwPYV.js +7 -0
- package/dist/{getDefaultRegistrationNumberType-BNO2BcfK.js → getDefaultRegistrationNumberType-CiEvyeR9.js} +5 -7
- package/dist/{useAssociatedLegalEntity-BdcoiUby.js → getFormSlice-CxtXJ0-P.js} +23 -5
- package/dist/{getName-DgxRqagk.js → getName-Cii7OyRd.js} +2 -2
- package/dist/{getProblemsForEntity-BY_voJ99.js → getProblemsForEntity-mdb3Bfpj.js} +3 -3
- package/dist/{getTrustedDecisionMakers-Ta-pURcL.js → getTrustedDecisionMakers-D89oYOLp.js} +2 -2
- package/dist/getValidationError-DvQgc-X3.js +19 -0
- package/dist/{gift-Bs_mAgul.js → gift-BjS6ErNG.js} +2 -2
- package/dist/{graph-Co0JhGiY.js → graph-B8rX9eXr.js} +2 -2
- package/dist/{graph-up-DIvH9haf.js → graph-up-Dwaq7upe.js} +2 -2
- package/dist/{headquarter-BESfDGKh.js → headquarter-CXwws_UP.js} +2 -2
- package/dist/{hotel-Vne7G5M6.js → hotel-CD5Lv9P7.js} +2 -2
- package/dist/hr-HR-D5kV_w60.js +7 -0
- package/dist/{http-DsJtugN1.js → http-C8rt2BZk.js} +5 -4
- package/dist/hu-HU-Bl1dnZfO.js +7 -0
- package/dist/{image-BQM21XCk.js → image-BTE2a8ZV.js} +2 -2
- package/dist/{info-DExoPRH5.js → info-BTc0bCCM.js} +2 -2
- package/dist/{info-filled-11KMeUso.js → info-filled-DhYinieW.js} +2 -2
- package/dist/it-IT-DiuPLWbr.js +7 -0
- package/dist/ja-JP-COBWjdXk.js +7 -0
- package/dist/{legalArrangementUtils-C68JdH6I.js → legalArrangementUtils-Crgt_L7h.js} +1 -1
- package/dist/{location-zRH5zJ8c.js → location-CwE3Q0gg.js} +2 -2
- package/dist/lt-LT-D9Pum2_8.js +7 -0
- package/dist/lv-LV-DDcLP43G.js +7 -0
- package/dist/{mail-i1-zg-cv.js → mail-CIeugZTd.js} +2 -2
- package/dist/{mapAddressLocalizationToJpAddressSchema-DpOIaxj6.js → mapAddressLocalizationToJpAddressSchema-BLOAhwWM.js} +2 -2
- package/dist/{mapExistingFile-RrS8dCpX.js → mapExistingFile-BXfeQxev.js} +2 -2
- package/dist/{mapJpAddressSchemaToAddressLocalizations-wwD6Rp3Q.js → mapJpAddressSchemaToAddressLocalizations-cseKFm-l.js} +16 -15
- package/dist/{mapLegalEntityToIndividualSchema-DtT3pcZJ.js → mapLegalEntityToIndividualSchema-DvGFy20Z.js} +12 -13
- package/dist/{mapTransferInstrumentToPayoutAccount-BpXU-nP1.js → mapTransferInstrumentToPayoutAccount-Cq7PMPOa.js} +4 -4
- package/dist/{minus-circle-filled-CxUdRO8J.js → minus-circle-filled-96DZCdcJ.js} +2 -2
- package/dist/nl-NL-CBRRvqAY.js +7 -0
- package/dist/no-NO-C9lYR_fQ.js +7 -0
- package/dist/{options-horizontal-D86T_xAF.js → options-horizontal-BU9r-Xx3.js} +2 -2
- package/dist/{partner-Dje0ykF6.js → partner-C1SWc0pB.js} +2 -2
- package/dist/{pay-by-link-plane-DAiddPu6.js → pay-by-link-plane-xK4Zkol0.js} +2 -2
- package/dist/{payout-DKiGv3F9.js → payout-zGf0LNbo.js} +2 -2
- package/dist/{pdf-CC8vqpTo.js → pdf-Bbs3Ji9v.js} +157 -174
- package/dist/{pdf.worker.min-CdKJICZZ.js → pdf.worker.min-DTQpK-0h.js} +67 -58
- package/dist/{person-DgALGIIz.js → person-xTKhpEGR.js} +2 -2
- package/dist/pl-PL-CZST_1gV.js +7 -0
- package/dist/{plus-DlQKP2C9.js → plus-Cm_dWRpB.js} +2 -2
- package/dist/{plus-circle-filled-BntUOVIJ.js → plus-circle-filled-Df77eidx.js} +2 -2
- package/dist/{processCapabilities-CWE5UFt8.js → processCapabilities-FL4-KAbd.js} +7 -9
- package/dist/{processValidationErrors-CFU1x_1n.js → processValidationErrors-Cn-RYAun.js} +4 -4
- package/dist/pt-BR-C32QroLH.js +7 -0
- package/dist/pt-PT-ByfmK1XA.js +7 -0
- package/dist/{recurring-DZgT_ekJ.js → recurring-BfwVHJ2Z.js} +2 -2
- package/dist/resolveEnvironment-D8-1H8bU.js +2516 -0
- package/dist/{revenue-accelerate-aMLYFVW6.js → revenue-accelerate-ClN0cx7Z.js} +2 -2
- package/dist/ro-RO-YkglLwfY.js +7 -0
- package/dist/{save-uDNye08N.js → save-QK2A-teG.js} +2 -2
- package/dist/{search-0OS6oe8N.js → search-DVSyT7Q7.js} +2 -2
- package/dist/{uppercase-DvjwUM0n.js → sharedValidators-DODW7kuK.js} +5 -3
- package/dist/{show-BWoS9-Y1.js → show-BRWLIRSA.js} +2 -2
- package/dist/sk-SK-BYRIVzdY.js +7 -0
- package/dist/sl-SI-Cjub_bfF.js +7 -0
- package/dist/{solution-payments-BMal7uJZ.js → solution-payments-BZZceFVV.js} +2 -2
- package/dist/{store-N7ZA4FKy.js → store-DLKKLXhn.js} +2 -2
- package/dist/style.css +1418 -1157
- package/dist/styles-DYaAeu4q.js +1418 -1157
- package/dist/sv-SE-1re-9Lp8.js +7 -0
- package/dist/{terminal-1-0RlQpbUC.js → terminal-1-CpAyEdjO.js} +2 -2
- package/dist/{translation-DbATp_35.js → translation-CpH8D2NK.js} +34 -30
- package/dist/types/adaptiveWorkflow/component-registry.d.ts +19 -2
- package/dist/types/adaptiveWorkflow/components/NodeRenderer/NodeRenderer.d.ts +7 -0
- package/dist/types/adaptiveWorkflow/components/NodeRenderer/SimpleFieldRenderer.d.ts +2 -2
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/CountryField/CountryField.d.ts +4 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/CountryField/contextMap.d.ts +10 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/DateField/DateField.d.ts +4 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/DateField/contextMap.d.ts +9 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/DateField/validators.d.ts +2 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/EmailField/EmailField.d.ts +4 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/EmailField/contextMap.d.ts +10 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/EmailField/validators.d.ts +2 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/NumberField/NumberField.d.ts +4 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/NumberField/contextMap.d.ts +9 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/NumberField/validators.d.ts +2 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/TextField/TextField.d.ts +4 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/TextField/contextMap.d.ts +10 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/TextField/validators.d.ts +4 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/WebsiteField/WebsiteField.d.ts +4 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/WebsiteField/contextMap.d.ts +10 -0
- package/dist/types/adaptiveWorkflow/components/Shared/Fields/WebsiteField/validators.d.ts +3 -0
- package/dist/types/adaptiveWorkflow/utils/validators/getValidationError.d.ts +7 -0
- package/dist/types/adaptiveWorkflow/utils/validators/sharedValidators.d.ts +3 -0
- package/dist/types/adaptiveWorkflow/utils/validators/types.d.ts +6 -0
- package/dist/types/api/adaptive/useAdaptiveWorkflow.d.ts +1 -1
- package/dist/types/api/address/useAddressCleanse.d.ts +2 -2
- package/dist/types/api/address/useRetrieveAddress.d.ts +2 -2
- package/dist/types/api/address/useRetrieveFromPostcodeJp.d.ts +2 -2
- package/dist/types/api/address/useSearchAddress.d.ts +2 -2
- package/dist/types/api/businessLines/useBusinessLines.d.ts +1 -1
- package/dist/types/api/companySearch/useCompanySearch.d.ts +6 -293
- package/dist/types/api/configurations/useSupportedCountries.d.ts +1 -1
- package/dist/types/api/configurations/useTaskTypes.d.ts +1 -1
- package/dist/types/api/configurations/useVersionConfiguration.d.ts +2 -2
- package/dist/types/api/datasets/useLegalForms.d.ts +1 -1
- package/dist/types/api/datasets/useNaceCodes.d.ts +1 -1
- package/dist/types/api/datasets/useSourceOfFundsTypes.d.ts +1 -1
- package/dist/types/api/documents/useDocument.d.ts +1 -1
- package/dist/types/api/documents/useDocuments.d.ts +2 -2
- package/dist/types/api/idNowProvider/useIdNowProvider.d.ts +3 -3
- package/dist/types/api/idVerificationProviders/useIdVerificationToken.d.ts +2 -2
- package/dist/types/api/industryCodes/useIndustryCodes.d.ts +1 -1
- package/dist/types/api/invitations/useInvitationStatus.d.ts +1 -1
- package/dist/types/api/invitedEntity/useInvitedEntityAssociationData.d.ts +2 -2
- package/dist/types/api/invitedEntity/useInvitedEntityRootCapabilities.d.ts +2 -2
- package/dist/types/api/invitedEntity/useInvitedEntityVerificationErrors.d.ts +2 -2
- package/dist/types/api/legalEntity/useLegalEntity.d.ts +9 -9
- package/dist/types/api/onboardingStatus/useOnboardingStatus.d.ts +1 -1
- package/dist/types/api/openId/useOpenIdAuthorizationLink.d.ts +1 -1
- package/dist/types/api/pci/usePciQuestionnaireList.d.ts +2 -2
- package/dist/types/api/pci/usePciStatus.d.ts +2 -2
- package/dist/types/api/pci/usePciTemplate.d.ts +2 -2
- package/dist/types/api/providersConfiguration/useProviderStatus.d.ts +1 -1
- package/dist/types/api/taskStatus/useTaskStatus.d.ts +2 -2
- package/dist/types/api/taskStatus/useTaskStatuses.d.ts +2 -2
- package/dist/types/api/taxClassification/useTaxClassification.d.ts +2 -2
- package/dist/types/api/termsOfService/useAcceptedTermsOfService.d.ts +2 -2
- package/dist/types/api/termsOfService/useTermsOfService.d.ts +2 -2
- package/dist/types/api/termsOfService/useTermsOfServiceAcceptanceInfos.d.ts +1 -1
- package/dist/types/api/termsOfService/useTermsOfServiceStatus.d.ts +2 -2
- package/dist/types/api/tinVerification/useVerifyTin.d.ts +5 -245
- package/dist/types/api/toggles/useToggles.d.ts +1 -1
- package/dist/types/api/transferInstruments/useBankVerificationProviders.d.ts +1 -1
- package/dist/types/api/transferInstruments/useTransferInstrument.d.ts +1 -1
- package/dist/types/api/transferInstruments/useTransferInstruments.d.ts +1 -1
- package/dist/types/api/uiAnalytics/useAnalyticsSession.d.ts +2 -2
- package/dist/types/api/validation/useValidatePhoneNumber.d.ts +2 -2
- package/dist/types/components/BankAccount/mapping/mapPayoutAccountSchemaToApiBankAccount.d.ts +3 -2
- package/dist/types/components/BankAccount/mapping/mapPayoutDetailsToTransferInstrument.d.ts +3 -2
- package/dist/types/components/Business/forms/rules.d.ts +3 -1
- package/dist/types/components/EFP/tasks/BusinessFinancingDropin/BusinessFinancingSummary.d.ts +3 -2
- package/dist/types/components/GlobalEntry/hooks/usePrefetchCompanySearch.d.ts +11 -0
- package/dist/types/components/GlobalEntry/rules.d.ts +1 -1
- package/dist/types/components/GlobalEntry/utils/submitGlobalEntry.d.ts +3 -1
- package/dist/types/components/Individual/forms/BasicDetails/validate.d.ts +3 -1
- package/dist/types/components/Individual/forms/Individual.rules.d.ts +4 -2
- package/dist/types/components/Shared/NewSummary/NewSummary.d.ts +7 -6
- package/dist/types/components/Shared/SummarySection/SummarySection.d.ts +12 -4
- package/dist/types/components/Shared/fields/LocalizedNameFields/validate.d.ts +2 -2
- package/dist/types/components/Shared/fields/RegistrationAndOperationalAddressFields/utils.d.ts +1 -1
- package/dist/types/components/Shared/fields/TaxInformationField/taxIdNumberTypes.d.ts +1 -1
- package/dist/types/components/Shared/forms/Address/localized/jp/jpAddressSchema.d.ts +11 -1
- package/dist/types/components/ui/atoms/Typography/Typography.types.d.ts +1 -1
- package/dist/types/context/SettingsContext/types.d.ts +8 -0
- package/dist/types/context/ToggleContext/types.d.ts +3 -13
- package/dist/types/utils/japanSupportUtils.d.ts +2 -2
- package/dist/types/utils/validatorUtils.d.ts +2 -0
- package/dist/{types-D6p5FQF-.js → types-BymnGWO9.js} +1 -1
- package/dist/{types-B9zXzag-.js → types-qahGXhtr.js} +1 -1
- package/dist/{upload-C5NC1E4N.js → upload-BI7LKlDm.js} +2 -2
- package/dist/{useAdaptiveWorkflow-DsQESk9f.js → useAdaptiveWorkflow-B35cXauP.js} +1 -1
- package/dist/{useBusinessDetailsData-dsYTeDom.js → useBusinessDetailsData-BEM6OCqH.js} +132 -150
- package/dist/{useBusinessLines-BhSN6qCH.js → useBusinessLines-0FcuDMzo.js} +1 -1
- package/dist/{useCanSeeIntroduction-BLGY7sE-.js → useCanSeeIntroduction-B6BDOCm_.js} +5 -5
- package/dist/{useDataMissingRemediations-ttUrk09_.js → useDataMissingRemediations-DKjYzfe2.js} +3 -3
- package/dist/{useForm-BFeaSvlP.js → useForm-fYu8sJ-i.js} +6 -6
- package/dist/{useHideTaskStepper-C_w6iUY-.js → useHideTaskStepper-BgCN--mG.js} +1 -1
- package/dist/{invalidateRootLegalEntity-B97dCa-s.js → useId-CEUET5IS.js} +32 -4
- package/dist/{useIndustryCodes-uAj90IyS.js → useIndustryCodes-La1cU8oH.js} +1 -1
- package/dist/{useLegalEntity-QQXN6YOm.js → useLegalEntity-CxeMoCm4.js} +4 -3
- package/dist/{useNavigate-J0sRAAoI.js → useNavigate-B1z7McBl.js} +33 -33
- package/dist/{useOnboardingStatus-CsGUjkm-.js → useOnboardingStatus-CX8IrDe_.js} +1 -1
- package/dist/{usePciQuestionnaireList-CFNJD8pS.js → usePciQuestionnaireList-CB_tjNsz.js} +1 -1
- package/dist/{useSalesChannels-huIL6Dhk.js → useSalesChannels-DJAmDo-r.js} +5 -5
- package/dist/{useScenarios-DV2TeNvN.js → useScenarios-DfE71fl7.js} +7 -6
- package/dist/{useSettingsContext-9O3Aqpfq.js → useSettingsContext-Bpf4UqRT.js} +6 -3
- package/dist/{useTaskLandedEvent-DwZHcMEQ.js → useTaskLandedEvent-BtuFBe20.js} +2 -2
- package/dist/{useTaskStatus-CgrhdaE_.js → useTaskStatus-4nAPf_uD.js} +1 -1
- package/dist/{useTermsOfServiceStatus-DbJDklA2.js → useTermsOfServiceStatus-FDpSDjco.js} +1 -1
- package/dist/{useTrustMembers-uhgi2qfN.js → useTrustMembers-D3sCwcaT.js} +9 -8
- package/dist/{useUnincorporatedPartnershipMembers-DVEWj1is.js → useUnincorporatedPartnershipMembers-DcfQJdVZ.js} +5 -5
- package/dist/{useUpdateBusinessLines-DCKYTzxd.js → useUpdateBusinessLines-B-pF2YT-.js} +1 -1
- package/dist/{utils-SKYT7xU4.js → utils-BFxg3gPM.js} +2 -2
- package/dist/{utils-D8pwjFm5.js → utils-CcBgYW2P.js} +5 -6
- package/dist/utils-Oc-YLiM0.js +214 -0
- package/dist/{validate-BBVJuFm5.js → validate-1rlz-OH4.js} +15 -17
- package/dist/{validate-Bkpa-y5Q.js → validate-B2P8hpA5.js} +7 -7
- package/dist/{validate-t6pT7AaZ.js → validate-S1Bm0XnT.js} +3 -3
- package/dist/{validate-Dmdw3pYn.js → validate-x5CYfY5E.js} +2 -2
- package/dist/{validateExtractionResult-qkFkcrwl.js → validateExtractionResult-IRRMwcNi.js} +5 -7
- package/dist/{warning-circle-fill-C2lMYPJW.js → warning-circle-fill-ClFvGo5m.js} +2 -2
- package/dist/{warning-diamond-filled-CQ2DdW5g.js → warning-diamond-filled-CWyKR65i.js} +2 -2
- package/dist/{webinar-BpZWqd-g.js → webinar-DWX7Z5Wz.js} +2 -2
- package/package.json +36 -36
- package/dist/AdaptiveWorkflow-2EE8iiMD.js +0 -33
- package/dist/Alert-BqbbDRYR.js +0 -172
- package/dist/AnalyticsContext-CpimDlw4.js +0 -21
- package/dist/Checkbox-qfdF12cF.js +0 -60
- package/dist/Confirm-DjFpxSzC.js +0 -77
- package/dist/CountryField-CMOB4yz4.js +0 -38
- package/dist/DataConflictsModal-8Nnj7_UD.js +0 -238
- package/dist/Field-Df7ajJE2.js +0 -154
- package/dist/FormFlow.module-DqMxjYHl.js +0 -20
- package/dist/Header-DvifUz7-.js +0 -93
- package/dist/Icon-DFQgr7dy.js +0 -175
- package/dist/LandingLayout-BsIoIFzs.js +0 -76
- package/dist/LegalName-BYQ12uWc.js +0 -33
- package/dist/LoaderWrapper-Dc88hY-P.js +0 -34
- package/dist/MaskedInput-CkDwzLxe.js +0 -719
- package/dist/MaybeModal-Dfm1rIUG.js +0 -24
- package/dist/NewSummary-DYLlnpwx.js +0 -73
- package/dist/ProgressBar-DWFxLMUA.js +0 -38
- package/dist/RadioGroup-CY33MT83.js +0 -47
- package/dist/RadioWithLabel-BmUFWDxq.js +0 -45
- package/dist/SettingsContext-Dl-9WWCI.js +0 -9
- package/dist/StateContext-B2_Pqd_y.js +0 -9
- package/dist/StateField-BiNI3dm9.js +0 -55
- package/dist/StructuredList-BHUmeWeh.js +0 -56
- package/dist/Summary-BTDbRMfh.js +0 -235
- package/dist/TaxInformationField--Uhp0zLv.js +0 -242
- package/dist/TileGroup-BFcSgQ1l.js +0 -172
- package/dist/ToastContext-B_wd2IY2.js +0 -13
- package/dist/ToastContextProvider-BSQ1Upl_.js +0 -103
- package/dist/VerificationErrorAlert-B6HmAZ0g.js +0 -38
- package/dist/_rolldown_dynamic_import_helper-sGNwd-kR.js +0 -14
- package/dist/bafinUtils-RXELXyTR.js +0 -96
- package/dist/bg-BG-DfbtcqF4.js +0 -7
- package/dist/birthDateUtils-D6uk7zwm.js +0 -84
- package/dist/businessRegistrationNumberPatterns-pbrCVTTp.js +0 -982
- package/dist/cross-circle-fill-small-DdoPZZeo.js +0 -20
- package/dist/cs-CZ-CajuRLo4.js +0 -7
- package/dist/da-DK-BEwmSejn.js +0 -7
- package/dist/datasetUtil-BdHPWsxZ.js +0 -45
- package/dist/de-DE-PyK3jl-6.js +0 -7
- package/dist/debouncedInputEvent-Fwwp_K_-.js +0 -54
- package/dist/debugStore-Dwn1FXrh.js +0 -9
- package/dist/dropinUtils-OsMsnnYG.js +0 -496
- package/dist/el-GR-KPFghikv.js +0 -7
- package/dist/es-ES-z4jLCvkJ.js +0 -7
- package/dist/es-LA-Dx4QymCh.js +0 -7
- package/dist/et-EE-1EhDxtTe.js +0 -7
- package/dist/fi-FI-Dc2RMc_u.js +0 -7
- package/dist/fieldConfigurations-CZCFghnK.js +0 -11
- package/dist/formFieldsUtils-CnDkgahc.js +0 -7
- package/dist/formUtils-BHgG8yQZ.js +0 -52
- package/dist/formUtils-DAKrWwgL.js +0 -84
- package/dist/fr-FR-DswL4wQ1.js +0 -7
- package/dist/getFormSlice-C1ma6Xd4.js +0 -21
- package/dist/getTrustedFields-BJ88GlM-.js +0 -28
- package/dist/globalStore--_np-9ON.js +0 -418
- package/dist/hr-HR-DI2D_V50.js +0 -7
- package/dist/hu-HU-lyRcZjGI.js +0 -7
- package/dist/isEmpty-Uewyl-r6.js +0 -14
- package/dist/isEmptyEntity-3OHnhXqG.js +0 -43
- package/dist/it-IT-Bn4CEcmI.js +0 -7
- package/dist/ja-JP-CAX_xwUx.js +0 -7
- package/dist/keys-Ce8YnRP2.js +0 -20
- package/dist/listToRecord-DumSkYDz.js +0 -10
- package/dist/lt-LT-BdgYuJW7.js +0 -7
- package/dist/lv-LV-Bz5c0Psg.js +0 -7
- package/dist/mapScriptLocalization-BCfkZo1y.js +0 -46
- package/dist/nl-NL-BE2cQh0x.js +0 -7
- package/dist/no-NO-vgzpp44v.js +0 -7
- package/dist/patternValidators-DsrZkuOO.js +0 -73
- package/dist/pl-PL-DgDSRVmp.js +0 -7
- package/dist/pt-BR-BaKp-J8F.js +0 -7
- package/dist/pt-PT-Df48oeP5.js +0 -7
- package/dist/resolveEnvironment-CLI-fiSo.js +0 -999
- package/dist/ro-RO-CTMsv_EY.js +0 -7
- package/dist/roleMetadata-CbgaYaH8.js +0 -56
- package/dist/sk-SK-oqO5I3Aw.js +0 -7
- package/dist/sl-SI-CQhJFnpj.js +0 -7
- package/dist/summaryItem-uDWmtYtt.js +0 -16
- package/dist/sv-SE-CmevESLi.js +0 -7
- package/dist/toFullWidth-Dgy4X4i8.js +0 -52
- package/dist/trustUtil-BG17fZ56.js +0 -98
- package/dist/types/adaptiveWorkflow/components/Fields/LegalName.d.ts +0 -14
- package/dist/types-B28r2lAW.js +0 -30
- package/dist/types-CZAHRt31.js +0 -147
- package/dist/useAccountHolder-BpIX1iBG.js +0 -102
- package/dist/useAllowedCountries-qyvo-c6A.js +0 -80
- package/dist/useAnalyticsContext-gSnRnYgV.js +0 -12
- package/dist/useCreateLegalEntity-CYZd_62a.js +0 -24
- package/dist/useDataset-K19TDoyR.js +0 -98
- package/dist/useDeleteTransferInstrument-C10xzHiO.js +0 -31
- package/dist/useId-BkDhUta2.js +0 -28
- package/dist/useMultiForm-CM3lpilP.js +0 -790
- package/dist/useToastContext-B6Mqc2HY.js +0 -12
- package/dist/useToggleContext-B_YexrbT.js +0 -21
- package/dist/useUpdateLegalEntity-B7LRg8m0.js +0 -29
- package/dist/utils-BLBh0VEd.js +0 -1755
- package/dist/utils-CYUYe54m.js +0 -24
- package/dist/utils-DdHbAadK.js +0 -80
- package/dist/validationError-DUn2rT0n.js +0 -55
- package/dist/validationResult-bjYBDjbU.js +0 -29
- package/dist/validatorUtils-D2O6AAZn.js +0 -106
- /package/dist/{pt-BR-CPbFPNwq2.js → pt-BR-CPbFPNwq.js} +0 -0
|
@@ -0,0 +1,2572 @@
|
|
|
1
|
+
try {
|
|
2
|
+
let e = "undefined" != typeof window ? window : "undefined" != typeof global ? global : "undefined" != typeof globalThis ? globalThis : "undefined" != typeof self ? self : {}, n = new e.Error().stack;
|
|
3
|
+
n && (e._sentryDebugIds = e._sentryDebugIds || {}, e._sentryDebugIds[n] = "b0f855d1-ef33-41b8-9065-ca4cd72733f9", e._sentryDebugIdIdentifier = "sentry-dbid-b0f855d1-ef33-41b8-9065-ca4cd72733f9");
|
|
4
|
+
} catch (e) {}
|
|
5
|
+
import { r as useTranslation } from "./translation-CpH8D2NK.js";
|
|
6
|
+
import { C as useDataset, G as OTHER_ENTITIES_VALID_CHAR_REGEX, H as LATIN_SPACE_MARK_PUNCTUATION_NUMBERS_REGEX, U as NO_ALPHABET_REGEX, ct as isValidMinLength, dt as standardKatakanaValidator, it as isEmpty, k as Header, lt as matchesRegex, nt as hasText, ot as isInvalidName, tt as hasRepeatedCharacters, ut as standardKanjiValidator, w as datasetIdentifier, z as EMOJI_REGEX } from "./resolveEnvironment-D8-1H8bU.js";
|
|
7
|
+
import { t as createLogger } from "./logger-Z8AeTE4x.js";
|
|
8
|
+
import { t as Icon } from "./Icon-_YUEZg1p.js";
|
|
9
|
+
import { n as IconButton, t as Button } from "./Button-Dwr6jvJZ.js";
|
|
10
|
+
import { a as objectsDeepEqual, o as entriesOf, t as cloneObject } from "./genUtils-nphCwt1A.js";
|
|
11
|
+
import { t as DecisionMakerTypes } from "./decisionMaker-CR0qaGWQ.js";
|
|
12
|
+
import { n as TrustMemberGuidanceLabels, r as TrustMemberTypes } from "./trustMemberGuidance-BpeDHAJP.js";
|
|
13
|
+
import { i as useAnalyticsContext, r as KEYBOARD_KEYS } from "./Modal-Dx_NESnV.js";
|
|
14
|
+
import { i as formDebugInfo, n as useForwardedRef, r as InputBase, t as InputText } from "./InputText-DtoBABE5.js";
|
|
15
|
+
import { t as useId } from "./useId-CEUET5IS.js";
|
|
16
|
+
import { a as MaybeModal, c as getDataByFields, d as isTranslationObject, f as translateTranslatable, i as ProgressBar, l as omitKeys, o as ValidationResult, p as LoaderWrapper, r as Field, s as addKeys, t as Select } from "./Select-AiAom5JL.js";
|
|
17
|
+
import { o as StructuredList, s as Confirm } from "./utils-Oc-YLiM0.js";
|
|
18
|
+
import { t as Image } from "./Image-CxnjHtP1.js";
|
|
19
|
+
import { t as List } from "./List-qvNxW9lm.js";
|
|
20
|
+
import { i as getFieldNameFromPath, r as FormRouterContext, t as ErrorPanel } from "./ErrorPanel-DtbpEeJk.js";
|
|
21
|
+
import { t as UnincorporatedPartnershipMemberTypes } from "./unincorporatedPartnership-BbNowjM2.js";
|
|
22
|
+
import { forwardRef, lazy } from "preact/compat";
|
|
23
|
+
import { useCallback as useCallback$1, useContext as useContext$1, useEffect as useEffect$1, useLayoutEffect, useMemo as useMemo$1, useReducer, useRef as useRef$1, useState as useState$1 } from "preact/hooks";
|
|
24
|
+
import cx from "classnames";
|
|
25
|
+
import { Fragment as Fragment$1, jsx, jsxs } from "preact/jsx-runtime";
|
|
26
|
+
import { createContext as createContext$1 } from "preact";
|
|
27
|
+
//#region src/context/FormContext/FormContext.ts
|
|
28
|
+
var FormContext = createContext$1(null);
|
|
29
|
+
//#endregion
|
|
30
|
+
//#region src/context/FormContext/FormContextProvider.tsx
|
|
31
|
+
function FormContextProvider({ children, form }) {
|
|
32
|
+
const contextValue = useMemo$1(() => ({ form }), [form]);
|
|
33
|
+
return /* @__PURE__ */ jsx(FormContext.Provider, {
|
|
34
|
+
value: contextValue,
|
|
35
|
+
children
|
|
36
|
+
});
|
|
37
|
+
}
|
|
38
|
+
//#endregion
|
|
39
|
+
//#region src/hooks/usePageLandedEvent.ts
|
|
40
|
+
/**
|
|
41
|
+
* Hook that automatically sends a "Landed on page" analytics event on when active form changes.
|
|
42
|
+
* Used on form component level (i.e. Basic information, Additional details etc.) to explicitly track page visits.
|
|
43
|
+
* This centralizes the common analytics pattern used across form components.
|
|
44
|
+
*/
|
|
45
|
+
var usePageLandedEvent = (formName) => {
|
|
46
|
+
const userEvents = useAnalyticsContext();
|
|
47
|
+
const oldFormNameRef = useRef$1(void 0);
|
|
48
|
+
if (formName && oldFormNameRef.current !== formName) {
|
|
49
|
+
userEvents.updateSharedEventProperties({ page: formName });
|
|
50
|
+
userEvents.addPageEvent("Landed on page", { actionType: "navigate" });
|
|
51
|
+
oldFormNameRef.current = formName;
|
|
52
|
+
}
|
|
53
|
+
};
|
|
54
|
+
//#endregion
|
|
55
|
+
//#region src/utils/analytics/trackNavigation.ts
|
|
56
|
+
var trackNavigation = ({ userEvents, actionType, toForm, label, returnValue, additionalTrackingParams }) => {
|
|
57
|
+
userEvents.addPageEvent("Clicked button", {
|
|
58
|
+
actionType,
|
|
59
|
+
toPage: toForm,
|
|
60
|
+
label,
|
|
61
|
+
returnValue,
|
|
62
|
+
...additionalTrackingParams
|
|
63
|
+
});
|
|
64
|
+
};
|
|
65
|
+
//#endregion
|
|
66
|
+
//#region src/utils/formUtils.ts
|
|
67
|
+
var createFormUtils = (props, t) => ({
|
|
68
|
+
getLabel: (field, fallbackLabelKey) => {
|
|
69
|
+
let translationKey = props.labels?.[field] ?? fallbackLabelKey ?? field;
|
|
70
|
+
if (props.labels && !props.labels?.[field] && Object.keys(props.labels).length) {
|
|
71
|
+
const parentKey = Object.keys(props.labels).find((fieldKey) => typeof props.labels?.[fieldKey] === "object");
|
|
72
|
+
if (parentKey) translationKey = props.labels[parentKey][field] ?? translationKey;
|
|
73
|
+
}
|
|
74
|
+
return t(($) => $[translationKey]);
|
|
75
|
+
},
|
|
76
|
+
getMask: (field) => props.masks?.[field],
|
|
77
|
+
isRequiredField: (field, showIfNotInRequiredFields = true) => props.requiredFields ? props.requiredFields.includes(field) && (field !== "role" || field === "role" && props.taskType !== "individual") : showIfNotInRequiredFields,
|
|
78
|
+
isOptionalField: (field) => props.optionalFields?.includes(field) ?? false,
|
|
79
|
+
isVisibleField(field, showIfNotInRequiredFields = true) {
|
|
80
|
+
return this.isRequiredField(field, showIfNotInRequiredFields) || this.isOptionalField(field);
|
|
81
|
+
},
|
|
82
|
+
isReadOnly: (field) => props.readOnly || (props.readOnlyFields ? props.readOnlyFields.includes(field) : false),
|
|
83
|
+
isObscured: (field) => props.obscuredFields ? props.obscuredFields.includes(field) : false,
|
|
84
|
+
isTrusted: (field) => props.trustedFields ? props.trustedFields.includes(field) : false,
|
|
85
|
+
getErrorMessage: (field, errors, fieldProblems) => {
|
|
86
|
+
const errorMessage = errors?.[field]?.errorMessage;
|
|
87
|
+
if (!(!!errorMessage || Boolean(fieldProblems?.[field]))) return;
|
|
88
|
+
return {
|
|
89
|
+
key: (isTranslationObject(errorMessage) ? errorMessage.key : errorMessage) || "invalid",
|
|
90
|
+
message: translateTranslatable(t, errorMessage)
|
|
91
|
+
};
|
|
92
|
+
},
|
|
93
|
+
getFieldData: (formData, fieldKeys) => getDataByFields(formData, fieldKeys),
|
|
94
|
+
getFieldValid: (formValid, fieldKeys) => entriesOf(formValid).reduce((acc, [key, val]) => fieldKeys.includes(key) ? {
|
|
95
|
+
...acc,
|
|
96
|
+
[key]: val
|
|
97
|
+
} : acc, {}),
|
|
98
|
+
getFieldErrors: (formErrors, fieldProblems, fieldKeys) => Object.keys(formErrors).reduce((acc, key) => {
|
|
99
|
+
if (!fieldKeys.includes(key)) return acc;
|
|
100
|
+
const error = formErrors?.[key]?.errorMessage;
|
|
101
|
+
if (!(!!error || Boolean(fieldProblems?.[key]))) return acc;
|
|
102
|
+
const errorKey = isTranslationObject(error) ? error.key : error;
|
|
103
|
+
return {
|
|
104
|
+
...acc,
|
|
105
|
+
[key]: {
|
|
106
|
+
key: errorKey || "invalid",
|
|
107
|
+
message: translateTranslatable(t, error)
|
|
108
|
+
}
|
|
109
|
+
};
|
|
110
|
+
}, {}),
|
|
111
|
+
getFieldLabels: (fieldKeys, fallbackLabelKeys) => fieldKeys.reduce((acc, field) => {
|
|
112
|
+
let translationKey = props.labels?.[field] ?? fallbackLabelKeys?.[field] ?? field;
|
|
113
|
+
if (props.labels && !props.labels?.[field] && Object.keys(props.labels).length) {
|
|
114
|
+
const parentKey = Object.keys(props.labels).find((fieldKey) => typeof props.labels?.[fieldKey] === "object");
|
|
115
|
+
if (parentKey) translationKey = props.labels[parentKey][field] ?? translationKey;
|
|
116
|
+
}
|
|
117
|
+
return {
|
|
118
|
+
...acc,
|
|
119
|
+
[field]: t(($) => $[translationKey])
|
|
120
|
+
};
|
|
121
|
+
}, {})
|
|
122
|
+
});
|
|
123
|
+
var mergeFieldMetadataIntoProps = (fieldName, metadata, otherProps) => {
|
|
124
|
+
const existingProps = otherProps ?? {};
|
|
125
|
+
return {
|
|
126
|
+
...existingProps,
|
|
127
|
+
labels: {
|
|
128
|
+
...existingProps.labels,
|
|
129
|
+
[fieldName]: metadata.label
|
|
130
|
+
},
|
|
131
|
+
masks: {
|
|
132
|
+
...existingProps.masks,
|
|
133
|
+
[fieldName]: metadata.mask
|
|
134
|
+
},
|
|
135
|
+
validators: {
|
|
136
|
+
...existingProps.validators,
|
|
137
|
+
[fieldName]: metadata.validators
|
|
138
|
+
}
|
|
139
|
+
};
|
|
140
|
+
};
|
|
141
|
+
//#endregion
|
|
142
|
+
//#region src/utils/roleMetadata.ts
|
|
143
|
+
var roleMetadata = {
|
|
144
|
+
[DecisionMakerTypes.CONTROLLING_PERSON]: {
|
|
145
|
+
name: "controllingPerson",
|
|
146
|
+
description: "controllingPersonDescription"
|
|
147
|
+
},
|
|
148
|
+
[DecisionMakerTypes.OWNER]: {
|
|
149
|
+
name: "owner",
|
|
150
|
+
description: "ownerDescription"
|
|
151
|
+
},
|
|
152
|
+
[DecisionMakerTypes.SIGNATORY]: {
|
|
153
|
+
name: "signatory",
|
|
154
|
+
description: "signatoryDescription"
|
|
155
|
+
},
|
|
156
|
+
[DecisionMakerTypes.DIRECTOR]: {
|
|
157
|
+
name: "director",
|
|
158
|
+
description: "directorDescription"
|
|
159
|
+
},
|
|
160
|
+
[TrustMemberTypes.DEFINED_BENEFICIARY]: {
|
|
161
|
+
name: "definedBeneficiary",
|
|
162
|
+
description: "definedBeneficiaryDescription"
|
|
163
|
+
},
|
|
164
|
+
[TrustMemberTypes.UNDEFINED_BENEFICIARY]: {
|
|
165
|
+
name: "undefinedBeneficiary",
|
|
166
|
+
description: "undefinedBeneficiaryDescription"
|
|
167
|
+
},
|
|
168
|
+
[TrustMemberTypes.PROTECTOR]: {
|
|
169
|
+
name: "protector",
|
|
170
|
+
description: "personAppointmentUnderTrustInstrument"
|
|
171
|
+
},
|
|
172
|
+
[TrustMemberTypes.TRUSTEE]: {
|
|
173
|
+
name: "trustee",
|
|
174
|
+
description: "legalOwnerOfProperty"
|
|
175
|
+
},
|
|
176
|
+
[TrustMemberTypes.SETTLOR]: {
|
|
177
|
+
name: "settlor",
|
|
178
|
+
description: "entityEstablishingTrust"
|
|
179
|
+
},
|
|
180
|
+
[TrustMemberGuidanceLabels.BENEFICIARY]: { name: TrustMemberGuidanceLabels.BENEFICIARY },
|
|
181
|
+
[TrustMemberGuidanceLabels.TRUSTEE]: { name: TrustMemberGuidanceLabels.TRUSTEE },
|
|
182
|
+
[UnincorporatedPartnershipMemberTypes.SECONDARY_PARTNER]: {
|
|
183
|
+
name: UnincorporatedPartnershipMemberTypes.SECONDARY_PARTNER,
|
|
184
|
+
description: "secondaryPartnerGuideDescription"
|
|
185
|
+
}
|
|
186
|
+
};
|
|
187
|
+
var getRoleTagVariant = (role) => roleMetadata[role]?.variant ?? "blue";
|
|
188
|
+
var getRoleName = (role) => roleMetadata[role]?.name ?? role;
|
|
189
|
+
var Summary_module_default = {
|
|
190
|
+
summary: "_summary_1op7a_1",
|
|
191
|
+
"summary-content": "_summary-content_1op7a_7",
|
|
192
|
+
summaryContent: "_summary-content_1op7a_7",
|
|
193
|
+
"summary-list": "_summary-list_1op7a_13",
|
|
194
|
+
summaryList: "_summary-list_1op7a_13",
|
|
195
|
+
"summary-list-header": "_summary-list-header_1op7a_27",
|
|
196
|
+
summaryListHeader: "_summary-list-header_1op7a_27",
|
|
197
|
+
"summary-list-header-title": "_summary-list-header-title_1op7a_32",
|
|
198
|
+
summaryListHeaderTitle: "_summary-list-header-title_1op7a_32",
|
|
199
|
+
"summary-list-item": "_summary-list-item_1op7a_41",
|
|
200
|
+
summaryListItem: "_summary-list-item_1op7a_41",
|
|
201
|
+
"summary-list-item-key": "_summary-list-item-key_1op7a_55",
|
|
202
|
+
summaryListItemKey: "_summary-list-item-key_1op7a_55",
|
|
203
|
+
"summary-list-item-value": "_summary-list-item-value_1op7a_67",
|
|
204
|
+
summaryListItemValue: "_summary-list-item-value_1op7a_67",
|
|
205
|
+
"summary-content-legal-caption": "_summary-content-legal-caption_1op7a_73",
|
|
206
|
+
summaryContentLegalCaption: "_summary-content-legal-caption_1op7a_73",
|
|
207
|
+
"summary-content-list": "_summary-content-list_1op7a_88",
|
|
208
|
+
summaryContentList: "_summary-content-list_1op7a_88",
|
|
209
|
+
"summary-content-logo": "_summary-content-logo_1op7a_92",
|
|
210
|
+
summaryContentLogo: "_summary-content-logo_1op7a_92"
|
|
211
|
+
};
|
|
212
|
+
//#endregion
|
|
213
|
+
//#region src/components/Shared/Summary/summaryItem.ts
|
|
214
|
+
var isSummaryItem = (val) => typeof val === "object" && val !== null && "summaryLabel" in val && "summaryValue" in val;
|
|
215
|
+
var summaryItem = (summaryLabel, summaryValue) => ({
|
|
216
|
+
summaryLabel,
|
|
217
|
+
summaryValue
|
|
218
|
+
});
|
|
219
|
+
var preTranslatedSummaryItem = (summaryLabel, summaryValue) => ({
|
|
220
|
+
summaryLabel,
|
|
221
|
+
summaryValue,
|
|
222
|
+
preTranslated: true
|
|
223
|
+
});
|
|
224
|
+
//#endregion
|
|
225
|
+
//#region src/components/Shared/Summary/Summary.tsx
|
|
226
|
+
var onfidoLogo = lazy(() => import("./onfido-logo-CMRuSr8M.js"));
|
|
227
|
+
var summaryStep = {
|
|
228
|
+
formId: "summary",
|
|
229
|
+
formName: "summary"
|
|
230
|
+
};
|
|
231
|
+
/** @deprecated, use NewSummary */
|
|
232
|
+
function Summary({ data, forms, gotoForm, labels, problems, omitted = {}, showFormHeader = true, showSectionHeader = true, showLegalCaption = false, showTaxExemptedLegalCaption = false, useStructuredList = false }) {
|
|
233
|
+
const { t } = useTranslation("common");
|
|
234
|
+
const userEvents = useAnalyticsContext();
|
|
235
|
+
const editForm = (formId) => {
|
|
236
|
+
const formIndex = forms.findIndex((form) => form.formId === formId);
|
|
237
|
+
if (formIndex >= 0) gotoForm(formIndex);
|
|
238
|
+
};
|
|
239
|
+
const allValidationErrors = problems?.validationErrors && Object.values(problems.validationErrors)?.reduce((acc, validError) => ({
|
|
240
|
+
...acc,
|
|
241
|
+
...validError
|
|
242
|
+
}), {});
|
|
243
|
+
const allVerificationErrors = problems?.verificationErrors && Object.values(problems.verificationErrors)?.reduce((acc, verifError) => ({
|
|
244
|
+
...acc,
|
|
245
|
+
...verifError
|
|
246
|
+
}), {});
|
|
247
|
+
const formUtils = createFormUtils({ labels }, t);
|
|
248
|
+
const summarySectionHeader = (formName, formId) => /* @__PURE__ */ jsxs("header", {
|
|
249
|
+
className: Summary_module_default.summaryListHeader,
|
|
250
|
+
children: [/* @__PURE__ */ jsx("h2", {
|
|
251
|
+
className: Summary_module_default.summaryListHeaderTitle,
|
|
252
|
+
children: formName
|
|
253
|
+
}), !omitted.summaryEditButton?.includes(formId) && /* @__PURE__ */ jsx(IconButton, {
|
|
254
|
+
variant: "tertiary",
|
|
255
|
+
icon: "edit",
|
|
256
|
+
onClick: () => {
|
|
257
|
+
trackNavigation({
|
|
258
|
+
userEvents,
|
|
259
|
+
actionType: "edit",
|
|
260
|
+
toForm: formName,
|
|
261
|
+
label: "Pencil icon"
|
|
262
|
+
});
|
|
263
|
+
editForm(formId);
|
|
264
|
+
},
|
|
265
|
+
ariaLabel: t(($) => $["editForm"], { formName })
|
|
266
|
+
})]
|
|
267
|
+
});
|
|
268
|
+
const renderSummarySection = (fieldData, labelData = {}, formName, formId, useStructuredList) => {
|
|
269
|
+
const structuredListItems = Object.entries(fieldData).map(([key, value]) => {
|
|
270
|
+
return {
|
|
271
|
+
term: t(($) => $[labelData[key] || key]),
|
|
272
|
+
details: value
|
|
273
|
+
};
|
|
274
|
+
});
|
|
275
|
+
return !useStructuredList ? /* @__PURE__ */ jsxs(List, {
|
|
276
|
+
variant: "grouped-secondary",
|
|
277
|
+
children: [showSectionHeader && summarySectionHeader(formName, formId), /* @__PURE__ */ jsx("dl", {
|
|
278
|
+
className: Summary_module_default.summaryList,
|
|
279
|
+
children: Array.isArray(fieldData) ? fieldData.map((item) => renderBulletedListField(item)) : renderSummaryItems(fieldData, labelData)
|
|
280
|
+
})]
|
|
281
|
+
}) : /* @__PURE__ */ jsxs(List, {
|
|
282
|
+
variant: "grouped-secondary",
|
|
283
|
+
children: [showSectionHeader && summarySectionHeader(formName, formId), /* @__PURE__ */ jsx(StructuredList, { items: structuredListItems })]
|
|
284
|
+
});
|
|
285
|
+
};
|
|
286
|
+
const renderSummaryContent = (summaryData, useStructuredList) => {
|
|
287
|
+
const summaryList = [];
|
|
288
|
+
forms.forEach(({ formId, formName }) => {
|
|
289
|
+
const currentFormData = summaryData[formId];
|
|
290
|
+
if (!currentFormData || Object.values(currentFormData).every((value) => isEmpty(value)) || formId === summaryStep.formId || omitted.forms?.includes(formId)) return;
|
|
291
|
+
const summaryItems = currentFormData.hasInnerForms ? renderInnerForms(labels?.[formId], formId, currentFormData) : renderSummarySection(currentFormData, labels?.[formId], t(($) => $[typeof labels?.[formId] === "string" ? labels[formId] : formName]), formId, useStructuredList);
|
|
292
|
+
summaryList.push(summaryItems);
|
|
293
|
+
});
|
|
294
|
+
return summaryList;
|
|
295
|
+
};
|
|
296
|
+
const renderInnerForms = (labelData, parentFormId, innerForms = {}) => {
|
|
297
|
+
if (!innerForms) return [];
|
|
298
|
+
const dataList = [];
|
|
299
|
+
Object.entries(innerForms).forEach(([innerFormName, innerFormFieldData]) => {
|
|
300
|
+
const formName = t(($) => $[labelData?.[innerFormName] || innerFormName]);
|
|
301
|
+
if (typeof innerFormFieldData === "object" && innerFormFieldData !== null) {
|
|
302
|
+
if (Object.values(innerFormFieldData).every((value) => isEmpty(value))) return;
|
|
303
|
+
dataList.push(renderSummarySection(innerFormFieldData, labelData, formName, parentFormId));
|
|
304
|
+
}
|
|
305
|
+
});
|
|
306
|
+
return dataList;
|
|
307
|
+
};
|
|
308
|
+
/**
|
|
309
|
+
* Renders a single label-value pair as a field in the summary section.
|
|
310
|
+
*
|
|
311
|
+
* This helper function creates the markup for a single piece of data,
|
|
312
|
+
* displaying a label and its corresponding value using a definition list
|
|
313
|
+
* for semantic correctness (`<dt>` for label, `<dd>` for data).
|
|
314
|
+
*
|
|
315
|
+
* @param label The translated label to display for the field.
|
|
316
|
+
* @param value The value of the field, which can be a simple string or a JSX element for more complex rendering.
|
|
317
|
+
* @returns A JSX element representing the summary field.
|
|
318
|
+
*/
|
|
319
|
+
const renderField = (label, value) => /* @__PURE__ */ jsxs("div", {
|
|
320
|
+
className: Summary_module_default.summaryListItem,
|
|
321
|
+
children: [/* @__PURE__ */ jsx("dt", {
|
|
322
|
+
className: Summary_module_default.summaryListItemKey,
|
|
323
|
+
children: label
|
|
324
|
+
}), /* @__PURE__ */ jsx("dd", {
|
|
325
|
+
className: Summary_module_default.summaryListItemValue,
|
|
326
|
+
children: value
|
|
327
|
+
})]
|
|
328
|
+
});
|
|
329
|
+
const renderBulletedListField = (item) => /* @__PURE__ */ jsx("ul", {
|
|
330
|
+
className: Summary_module_default.summaryContentList,
|
|
331
|
+
children: /* @__PURE__ */ jsx("li", { children: item })
|
|
332
|
+
});
|
|
333
|
+
/**
|
|
334
|
+
* Recursively renders the data fields for a summary section.
|
|
335
|
+
*
|
|
336
|
+
* This function iterates through the properties of the `formData` object.
|
|
337
|
+
* It handles different data types by:
|
|
338
|
+
* - Displaying simple string or number values with their corresponding labels.
|
|
339
|
+
* - Handling 'role' arrays specifically to show a comma-separated list of roles.
|
|
340
|
+
* - Recognizing and rendering `SummaryItem` objects with their custom labels and values.
|
|
341
|
+
* - Recursively calling itself for nested objects to render their properties.
|
|
342
|
+
*
|
|
343
|
+
* Fields listed in the `omitted.keys` prop are skipped.
|
|
344
|
+
*
|
|
345
|
+
* @param formData The data object for the current section, containing key-value pairs to be rendered.
|
|
346
|
+
* @param labelData A map of field keys to their corresponding translation keys for fetching display labels.
|
|
347
|
+
* @returns An array of JSX elements representing the rendered summary fields for the section.
|
|
348
|
+
*/
|
|
349
|
+
const renderSummaryItems = (formData = {}, labelData = {}) => {
|
|
350
|
+
if (!formData) return [];
|
|
351
|
+
if (formData?.idVerificationMethod === "instantVerification") return [renderField(t(($) => $["verificationMethod"]), /* @__PURE__ */ jsx(Image, {
|
|
352
|
+
lazyLoadedImage: onfidoLogo,
|
|
353
|
+
className: Summary_module_default.summaryContentLogo,
|
|
354
|
+
alt: "onfido-logo"
|
|
355
|
+
}))];
|
|
356
|
+
const dataList = [];
|
|
357
|
+
Object.entries(formData).forEach(([field, fieldData]) => {
|
|
358
|
+
if (omitted.keys?.includes(field) || !fieldData) return;
|
|
359
|
+
const fieldName = t(($) => $[labelData[field] || field]);
|
|
360
|
+
if (field === "role" && Array.isArray(fieldData)) {
|
|
361
|
+
const label = fieldData.length > 1 ? t(($) => $["roles"]) : fieldName;
|
|
362
|
+
const roles = fieldData.map((role) => t(($) => $[getRoleName(role)])).join(", ");
|
|
363
|
+
dataList.push(renderField(label, roles));
|
|
364
|
+
} else if (isSummaryItem(fieldData)) {
|
|
365
|
+
const { summaryLabel, summaryValue, preTranslated } = fieldData;
|
|
366
|
+
if (preTranslated) dataList.push(renderField(summaryLabel, summaryValue));
|
|
367
|
+
else dataList.push(renderField(translateTranslatable(t, summaryLabel) ?? "", summaryValue));
|
|
368
|
+
} else if (typeof fieldData === "object") dataList.push(renderSummaryItems(fieldData, labelData));
|
|
369
|
+
else if (["string", "number"].includes(typeof fieldData)) dataList.push(renderField(fieldName, fieldData));
|
|
370
|
+
});
|
|
371
|
+
return dataList;
|
|
372
|
+
};
|
|
373
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
374
|
+
role: "region",
|
|
375
|
+
className: Summary_module_default.summary,
|
|
376
|
+
children: [showFormHeader && /* @__PURE__ */ jsx(Header, {
|
|
377
|
+
title: t(($) => $["summary"]),
|
|
378
|
+
description: t(($) => $["summaryDescription"])
|
|
379
|
+
}), /* @__PURE__ */ jsxs("div", {
|
|
380
|
+
className: Summary_module_default.summaryContent,
|
|
381
|
+
children: [
|
|
382
|
+
/* @__PURE__ */ jsx(ErrorPanel, {
|
|
383
|
+
validationErrors: allValidationErrors,
|
|
384
|
+
verificationErrors: allVerificationErrors,
|
|
385
|
+
formUtils,
|
|
386
|
+
id: "ariaErrorField"
|
|
387
|
+
}),
|
|
388
|
+
renderSummaryContent(data, useStructuredList),
|
|
389
|
+
showLegalCaption && /* @__PURE__ */ jsx("div", {
|
|
390
|
+
className: Summary_module_default.summaryContentLegalCaption,
|
|
391
|
+
children: t(($) => $["summaryLegalCaption"])
|
|
392
|
+
}),
|
|
393
|
+
showTaxExemptedLegalCaption && /* @__PURE__ */ jsxs("div", {
|
|
394
|
+
className: Summary_module_default.summaryContentLegalCaption,
|
|
395
|
+
children: [/* @__PURE__ */ jsx("p", { children: t(($) => $["summaryTaxExemptionLegalCaptionTitle"]) }), /* @__PURE__ */ jsxs("ul", { children: [
|
|
396
|
+
/* @__PURE__ */ jsx("li", { children: t(($) => $["summaryTaxExemptionLegalCaption_1"]) }),
|
|
397
|
+
/* @__PURE__ */ jsx("li", { children: t(($) => $["summaryTaxExemptionLegalCaption_2"]) }),
|
|
398
|
+
/* @__PURE__ */ jsx("li", { children: t(($) => $["summaryTaxExemptionLegalCaption_3"]) })
|
|
399
|
+
] })]
|
|
400
|
+
})
|
|
401
|
+
]
|
|
402
|
+
})]
|
|
403
|
+
});
|
|
404
|
+
}
|
|
405
|
+
//#endregion
|
|
406
|
+
//#region src/utils/scrollToInvalidField.ts
|
|
407
|
+
var INVALID_FIELD_SELECTOR = ".adyen-kyc-field--error, .adyen-kyc-label__text--error";
|
|
408
|
+
var SCROLLABLE_OVERFLOW_VALUES = /* @__PURE__ */ new Set([
|
|
409
|
+
"auto",
|
|
410
|
+
"scroll",
|
|
411
|
+
"overlay"
|
|
412
|
+
]);
|
|
413
|
+
var isWindow = (container) => container === window;
|
|
414
|
+
var getInvalidFieldTarget = (element) => element.closest(".adyen-kyc-field") ?? element;
|
|
415
|
+
var isCustomElement = (element) => element.tagName.includes("-");
|
|
416
|
+
var queryInvalidField = (root) => {
|
|
417
|
+
const invalidField = root.querySelector(INVALID_FIELD_SELECTOR);
|
|
418
|
+
if (invalidField) return getInvalidFieldTarget(invalidField);
|
|
419
|
+
for (const element of Array.from(root.querySelectorAll("*")).filter(isCustomElement)) {
|
|
420
|
+
if (!element.shadowRoot) continue;
|
|
421
|
+
const shadowInvalidField = queryInvalidField(element.shadowRoot);
|
|
422
|
+
if (shadowInvalidField) return shadowInvalidField;
|
|
423
|
+
}
|
|
424
|
+
return null;
|
|
425
|
+
};
|
|
426
|
+
var isElementVisibleInContainer = (element, container) => {
|
|
427
|
+
const elementRect = element.getBoundingClientRect();
|
|
428
|
+
if (isWindow(container)) return elementRect.top >= 0 && elementRect.bottom <= window.innerHeight;
|
|
429
|
+
const containerRect = container.getBoundingClientRect();
|
|
430
|
+
return elementRect.top >= containerRect.top && elementRect.bottom <= containerRect.bottom;
|
|
431
|
+
};
|
|
432
|
+
var findScrollContainer = (element) => {
|
|
433
|
+
let parent = element.parentElement;
|
|
434
|
+
while (parent) {
|
|
435
|
+
const style = window.getComputedStyle(parent);
|
|
436
|
+
const canScroll = parent.scrollHeight > parent.clientHeight;
|
|
437
|
+
const hasScrollableOverflow = SCROLLABLE_OVERFLOW_VALUES.has(style.overflowY);
|
|
438
|
+
if (canScroll && hasScrollableOverflow) return parent;
|
|
439
|
+
parent = parent.parentElement;
|
|
440
|
+
}
|
|
441
|
+
return window;
|
|
442
|
+
};
|
|
443
|
+
var scrollElementIntoContainer = (element, container) => {
|
|
444
|
+
if (isWindow(container)) {
|
|
445
|
+
element.scrollIntoView({
|
|
446
|
+
behavior: "smooth",
|
|
447
|
+
block: "center"
|
|
448
|
+
});
|
|
449
|
+
return;
|
|
450
|
+
}
|
|
451
|
+
const elementRect = element.getBoundingClientRect();
|
|
452
|
+
const containerRect = container.getBoundingClientRect();
|
|
453
|
+
const offset = elementRect.top - containerRect.top - containerRect.height / 3;
|
|
454
|
+
container.scrollBy({
|
|
455
|
+
top: offset,
|
|
456
|
+
behavior: "smooth"
|
|
457
|
+
});
|
|
458
|
+
};
|
|
459
|
+
var scrollToInvalidField = () => {
|
|
460
|
+
const invalidField = queryInvalidField(document);
|
|
461
|
+
if (!invalidField) return;
|
|
462
|
+
const container = findScrollContainer(invalidField);
|
|
463
|
+
if (isElementVisibleInContainer(invalidField, container)) return;
|
|
464
|
+
scrollElementIntoContainer(invalidField, container);
|
|
465
|
+
};
|
|
466
|
+
//#endregion
|
|
467
|
+
//#region src/hooks/useFormComposer.ts
|
|
468
|
+
var logger$2 = createLogger();
|
|
469
|
+
/**
|
|
470
|
+
* The step we open to for editing an existing entity should be the summary if there are verification errors
|
|
471
|
+
* Otherwise (including for a new entity), just show the first step
|
|
472
|
+
*/
|
|
473
|
+
var getOpeningStep = (forms, remediationActions) => {
|
|
474
|
+
if (remediationActions && Object.keys(remediationActions).length > 0) {
|
|
475
|
+
const allRemediationActions = Object.values(remediationActions).flat().filter((rem) => rem.forms?.length > 0);
|
|
476
|
+
if (allRemediationActions.length === 1 && allRemediationActions[0]?.forms.length === 1) {
|
|
477
|
+
const form = forms.find((form) => form?.formId === allRemediationActions[0]?.forms[0]);
|
|
478
|
+
if (form) return form;
|
|
479
|
+
}
|
|
480
|
+
return forms[forms.length - 1];
|
|
481
|
+
}
|
|
482
|
+
return forms[0];
|
|
483
|
+
};
|
|
484
|
+
var useFormComposer = ({ problems, navigationTrackingParams, forms, externalBackClick, onSubmit, triggerValidation }) => {
|
|
485
|
+
const userEvents = useAnalyticsContext();
|
|
486
|
+
const [shouldValidate, setShouldValidate] = useState$1(false);
|
|
487
|
+
const [activeForm, setActiveForm] = useState$1(forms[0]);
|
|
488
|
+
const isFormSummaryStep = (form) => form.formId === summaryStep.formId;
|
|
489
|
+
/**
|
|
490
|
+
* Defaults to the forms on screen. A caller that rearranges the flow and navigates in the same
|
|
491
|
+
* tick has to pass its own list, as the rearranged one only becomes `forms` on the next render.
|
|
492
|
+
*/
|
|
493
|
+
const getFormIndex = (formId, formList = forms) => formList.findIndex((form) => form.formId === formId);
|
|
494
|
+
const currentStep = getFormIndex(activeForm.formId);
|
|
495
|
+
const totalSteps = forms.length;
|
|
496
|
+
const isFirstStep = currentStep === 0;
|
|
497
|
+
const firstStepId = forms[0]?.formId;
|
|
498
|
+
usePageLandedEvent(activeForm.formName);
|
|
499
|
+
const [oldForms, setOldForms] = useState$1(forms);
|
|
500
|
+
if (oldForms !== forms) {
|
|
501
|
+
setActiveForm((activeForm) => forms.find(({ formId }) => formId === activeForm.formId) ?? activeForm);
|
|
502
|
+
setOldForms(forms);
|
|
503
|
+
}
|
|
504
|
+
/**
|
|
505
|
+
* Opening step can be calculated once since the problems are already known on drop-in load
|
|
506
|
+
*/
|
|
507
|
+
const [oldFirstStepId, setOldFirstStepId] = useState$1(void 0);
|
|
508
|
+
if (oldFirstStepId !== firstStepId) {
|
|
509
|
+
/** TODO: need a better solution
|
|
510
|
+
* If firstStepId changes it means form configurations are being setup,
|
|
511
|
+
* not able to put forms as the dependency here as it also updates whenever validity changes
|
|
512
|
+
* should separate out forms into forms and validity
|
|
513
|
+
***/
|
|
514
|
+
setActiveForm(getOpeningStep(forms, problems?.remediationActions));
|
|
515
|
+
setOldFirstStepId(firstStepId);
|
|
516
|
+
}
|
|
517
|
+
const gotoFormByFormIndex = (nextFormIndex, currentForms) => {
|
|
518
|
+
const nextForm = (currentForms ?? forms)[nextFormIndex];
|
|
519
|
+
if (nextForm) setActiveForm(nextForm);
|
|
520
|
+
};
|
|
521
|
+
/**
|
|
522
|
+
* We often run into a situation where we want to navigate to a specific form immediately after
|
|
523
|
+
* rearranging the forms in the flow.
|
|
524
|
+
*
|
|
525
|
+
* The issue here is that the callback, (e.g. {@link IdVerificationMethod.handleVerifyByInvite})
|
|
526
|
+
* has a reference only to the current forms, not what the forms will be post-rearrangement.
|
|
527
|
+
* Hence, it is impossible to call {@link gotoFormByFormIndex} because we have no idea what the
|
|
528
|
+
* eventual index of the form will be.
|
|
529
|
+
*
|
|
530
|
+
* The solution: set a desired form ID, then resolve the navigation as part of the render
|
|
531
|
+
* once {@link forms} contains it. The subsequent {@link gotoFormByFormIndex} will immediately
|
|
532
|
+
* cancel the current render and trigger a new one.
|
|
533
|
+
*/
|
|
534
|
+
const [desiredFormId, setDesiredFormId] = useState$1();
|
|
535
|
+
if (desiredFormId) {
|
|
536
|
+
const targetFormIndex = forms.findIndex((form) => form.formId === desiredFormId);
|
|
537
|
+
if (targetFormIndex === -1) logger$2.warn(`Desired form ${desiredFormId} not present. \nCurrent forms: ${forms.map((f) => f.formId).join(", ")}`);
|
|
538
|
+
else {
|
|
539
|
+
setDesiredFormId(void 0);
|
|
540
|
+
gotoFormByFormIndex(targetFormIndex);
|
|
541
|
+
}
|
|
542
|
+
}
|
|
543
|
+
const gotoFormByFormId = (formId) => {
|
|
544
|
+
setDesiredFormId(formId);
|
|
545
|
+
};
|
|
546
|
+
const trackSubmitClick = () => {
|
|
547
|
+
trackNavigation({
|
|
548
|
+
userEvents,
|
|
549
|
+
actionType: "submit",
|
|
550
|
+
label: "submit",
|
|
551
|
+
additionalTrackingParams: navigationTrackingParams
|
|
552
|
+
});
|
|
553
|
+
};
|
|
554
|
+
const handleNextClick = async (updatedForms) => {
|
|
555
|
+
const currentForms = updatedForms ?? forms;
|
|
556
|
+
const currentFormIndex = getFormIndex(activeForm.formId, currentForms);
|
|
557
|
+
if (isFormSummaryStep(activeForm)) {
|
|
558
|
+
trackSubmitClick();
|
|
559
|
+
onSubmit();
|
|
560
|
+
return;
|
|
561
|
+
}
|
|
562
|
+
/**
|
|
563
|
+
* Returns validation result of async validators if any
|
|
564
|
+
*/
|
|
565
|
+
const isAsyncValidationValid = await triggerValidation?.(activeForm.formId) ?? true;
|
|
566
|
+
/**
|
|
567
|
+
* Checks if both static validations and asyncValidations pass
|
|
568
|
+
*/
|
|
569
|
+
if (!activeForm.isValid || !isAsyncValidationValid) {
|
|
570
|
+
/**
|
|
571
|
+
* shouldValidate is not required with useMultiForm
|
|
572
|
+
*/
|
|
573
|
+
setShouldValidate(true);
|
|
574
|
+
requestAnimationFrame(scrollToInvalidField);
|
|
575
|
+
trackNavigation({
|
|
576
|
+
userEvents,
|
|
577
|
+
actionType: "next",
|
|
578
|
+
label: "next",
|
|
579
|
+
returnValue: "validation error",
|
|
580
|
+
additionalTrackingParams: navigationTrackingParams
|
|
581
|
+
});
|
|
582
|
+
return;
|
|
583
|
+
}
|
|
584
|
+
if (currentFormIndex === currentForms.length - 1) {
|
|
585
|
+
trackSubmitClick();
|
|
586
|
+
onSubmit();
|
|
587
|
+
return;
|
|
588
|
+
}
|
|
589
|
+
setShouldValidate(false);
|
|
590
|
+
const toFormIndex = currentFormIndex + 1;
|
|
591
|
+
gotoFormByFormIndex(toFormIndex, currentForms);
|
|
592
|
+
trackNavigation({
|
|
593
|
+
userEvents,
|
|
594
|
+
actionType: "next",
|
|
595
|
+
toForm: currentForms[toFormIndex]?.formName,
|
|
596
|
+
label: "next",
|
|
597
|
+
returnValue: "success",
|
|
598
|
+
additionalTrackingParams: navigationTrackingParams
|
|
599
|
+
});
|
|
600
|
+
};
|
|
601
|
+
const handleBackClick = () => {
|
|
602
|
+
if (currentStep > 0) {
|
|
603
|
+
const toForm = forms[currentStep - 1];
|
|
604
|
+
setActiveForm(toForm);
|
|
605
|
+
trackNavigation({
|
|
606
|
+
userEvents,
|
|
607
|
+
actionType: "back",
|
|
608
|
+
toForm: toForm?.formName,
|
|
609
|
+
label: "back",
|
|
610
|
+
additionalTrackingParams: navigationTrackingParams
|
|
611
|
+
});
|
|
612
|
+
}
|
|
613
|
+
};
|
|
614
|
+
return {
|
|
615
|
+
handleBackClick: isFirstStep ? externalBackClick : handleBackClick,
|
|
616
|
+
handleNextClick,
|
|
617
|
+
gotoFormByFormIndex,
|
|
618
|
+
gotoFormByFormId,
|
|
619
|
+
activeForm,
|
|
620
|
+
shouldValidate,
|
|
621
|
+
setShouldValidate,
|
|
622
|
+
steps: {
|
|
623
|
+
current: currentStep,
|
|
624
|
+
total: totalSteps
|
|
625
|
+
}
|
|
626
|
+
};
|
|
627
|
+
};
|
|
628
|
+
//#endregion
|
|
629
|
+
//#region src/hooks/useMultiForm/reducer.ts
|
|
630
|
+
/** Checks if a field key exists on the nested data object (even if its value is undefined) */
|
|
631
|
+
var hasOwnNestedField = (data, formName, fieldKey) => {
|
|
632
|
+
const form = data?.[formName];
|
|
633
|
+
return form != null && typeof form === "object" && Object.hasOwn(form, fieldKey);
|
|
634
|
+
};
|
|
635
|
+
var hasValueChanged = (newData, prevData) => {
|
|
636
|
+
if (typeof newData === "object") return !objectsDeepEqual(newData, prevData);
|
|
637
|
+
return newData !== prevData;
|
|
638
|
+
};
|
|
639
|
+
/** Formats and validates a field */
|
|
640
|
+
var processField = ({ key, value, formName, mode, defaultData, data, fieldContext, formatters, staticValidate }) => {
|
|
641
|
+
const formatterFn = formatters?.[key]?.formatter ? formatters[key]?.formatter : formatters?.[key];
|
|
642
|
+
const formattedValue = formatterFn && typeof formatterFn === "function" ? formatterFn(value, fieldContext) : value;
|
|
643
|
+
const fieldHasDefaultValue = key in (defaultData ?? {});
|
|
644
|
+
const fieldHasChanged = defaultData?.[key] !== value;
|
|
645
|
+
const validationResult = (fieldContext.state.obscuredFields?.includes(key) ? fieldHasChanged : fieldHasChanged || fieldHasDefaultValue) ? staticValidate({
|
|
646
|
+
key,
|
|
647
|
+
value: formattedValue,
|
|
648
|
+
mode,
|
|
649
|
+
formName
|
|
650
|
+
}, data, fieldContext) : new ValidationResult([{
|
|
651
|
+
isValid: true,
|
|
652
|
+
hasError: false
|
|
653
|
+
}]);
|
|
654
|
+
const asyncValidationResult = fieldContext.state?.asyncErrors?.[key];
|
|
655
|
+
/** Add any existing async validation result to validation result */
|
|
656
|
+
if (asyncValidationResult) validationResult.addError(asyncValidationResult);
|
|
657
|
+
return [formattedValue, validationResult];
|
|
658
|
+
};
|
|
659
|
+
/**
|
|
660
|
+
* The function takes in the below params and spits out an initial state, by running the validations
|
|
661
|
+
* across all forms and fields. It makes sure all validations are done and only sets the validity
|
|
662
|
+
* instead of the errors, this is to avoid users seeing error immaturely on initial load.
|
|
663
|
+
*
|
|
664
|
+
* @param requiredFields
|
|
665
|
+
* @param staticValidate
|
|
666
|
+
* @param asyncValidate
|
|
667
|
+
* @param defaultData
|
|
668
|
+
* @param obscuredFields
|
|
669
|
+
* @param optionalFields
|
|
670
|
+
* @param trustedFields
|
|
671
|
+
* @param fieldProblems
|
|
672
|
+
* @param formatters
|
|
673
|
+
* @param data
|
|
674
|
+
*/
|
|
675
|
+
function init({ requiredFields, staticValidate, defaultData, obscuredFields, optionalFields, trustedFields, fieldProblems, formatters, data, asyncErrors }) {
|
|
676
|
+
/**
|
|
677
|
+
* Fetches the validation result of a field in a form
|
|
678
|
+
* @param fieldKey
|
|
679
|
+
* @param formName
|
|
680
|
+
*/
|
|
681
|
+
const getProcessedState = (fieldKey, formName) => {
|
|
682
|
+
const [formattedValue, validationResult] = processField({
|
|
683
|
+
key: fieldKey,
|
|
684
|
+
value: hasOwnNestedField(data, formName, fieldKey) ? data?.[formName]?.[fieldKey] ?? null : defaultData?.[formName]?.[fieldKey] ?? null,
|
|
685
|
+
mode: "blur",
|
|
686
|
+
formName,
|
|
687
|
+
formatters: formatters?.[formName],
|
|
688
|
+
defaultData: defaultData?.[formName],
|
|
689
|
+
data,
|
|
690
|
+
fieldContext: { state: {
|
|
691
|
+
data: data?.[formName],
|
|
692
|
+
obscuredFields: obscuredFields?.[formName],
|
|
693
|
+
optionalFields: optionalFields?.[formName],
|
|
694
|
+
trustedFields: trustedFields?.[formName],
|
|
695
|
+
requiredFields: requiredFields?.[formName],
|
|
696
|
+
asyncErrors: asyncErrors?.[formName]
|
|
697
|
+
} },
|
|
698
|
+
staticValidate
|
|
699
|
+
});
|
|
700
|
+
return {
|
|
701
|
+
valid: validationResult.isValid && !fieldProblems?.[formName]?.[fieldKey] || false,
|
|
702
|
+
errors: null,
|
|
703
|
+
data: formattedValue,
|
|
704
|
+
fieldProblems: fieldProblems?.[formName]?.[fieldKey]
|
|
705
|
+
};
|
|
706
|
+
};
|
|
707
|
+
/**
|
|
708
|
+
* requiredFields can be undefined if the configuration api call is not yet completed
|
|
709
|
+
* returned default state in this case
|
|
710
|
+
*/
|
|
711
|
+
if (!requiredFields) return {
|
|
712
|
+
data: defaultData,
|
|
713
|
+
errors: {},
|
|
714
|
+
fieldProblems: {},
|
|
715
|
+
valid: {},
|
|
716
|
+
requiredFields: {},
|
|
717
|
+
asyncErrors: {},
|
|
718
|
+
defaultData
|
|
719
|
+
};
|
|
720
|
+
/**
|
|
721
|
+
* Make sure forms containing only optional fields are also taken into account
|
|
722
|
+
*/
|
|
723
|
+
const formsForOptionalFields = Object.keys(optionalFields ?? {});
|
|
724
|
+
const formsForRequiredFields = Object.keys(requiredFields);
|
|
725
|
+
/**
|
|
726
|
+
* Visits every field and builds a state with the validity
|
|
727
|
+
*/
|
|
728
|
+
return Array.from(/* @__PURE__ */ new Set([...formsForOptionalFields, ...formsForRequiredFields])).reduce((acc, formName) => {
|
|
729
|
+
const form = formName;
|
|
730
|
+
const optionalsFormFields = optionalFields?.[form] ?? [];
|
|
731
|
+
const requiredFormFields = requiredFields?.[form] ?? [];
|
|
732
|
+
const formState = [...optionalsFormFields, ...requiredFormFields].reduce((acc, field) => {
|
|
733
|
+
const { valid, errors, data, fieldProblems: processedFieldProblems } = getProcessedState(field, form);
|
|
734
|
+
return {
|
|
735
|
+
...acc,
|
|
736
|
+
data: {
|
|
737
|
+
...acc.data,
|
|
738
|
+
[field]: data
|
|
739
|
+
},
|
|
740
|
+
valid: {
|
|
741
|
+
...acc.valid,
|
|
742
|
+
[field]: valid
|
|
743
|
+
},
|
|
744
|
+
errors: {
|
|
745
|
+
...acc.errors,
|
|
746
|
+
[field]: errors
|
|
747
|
+
},
|
|
748
|
+
fieldProblems: {
|
|
749
|
+
...acc.fieldProblems,
|
|
750
|
+
...processedFieldProblems ? { [field]: processedFieldProblems } : {}
|
|
751
|
+
}
|
|
752
|
+
};
|
|
753
|
+
}, {});
|
|
754
|
+
return {
|
|
755
|
+
requiredFields,
|
|
756
|
+
data: {
|
|
757
|
+
...acc.data,
|
|
758
|
+
[formName]: formState.data
|
|
759
|
+
},
|
|
760
|
+
valid: {
|
|
761
|
+
...acc.valid,
|
|
762
|
+
[formName]: formState.valid
|
|
763
|
+
},
|
|
764
|
+
errors: {
|
|
765
|
+
...acc.errors,
|
|
766
|
+
[formName]: formState.errors
|
|
767
|
+
},
|
|
768
|
+
fieldProblems: {
|
|
769
|
+
...acc.fieldProblems,
|
|
770
|
+
[formName]: formState.fieldProblems
|
|
771
|
+
},
|
|
772
|
+
asyncErrors: { ...acc.asyncErrors },
|
|
773
|
+
obscuredFields,
|
|
774
|
+
optionalFields,
|
|
775
|
+
trustedFields,
|
|
776
|
+
defaultData
|
|
777
|
+
};
|
|
778
|
+
}, {
|
|
779
|
+
requiredFields,
|
|
780
|
+
data: {},
|
|
781
|
+
valid: {},
|
|
782
|
+
errors: {},
|
|
783
|
+
fieldProblems: {},
|
|
784
|
+
obscuredFields,
|
|
785
|
+
optionalFields,
|
|
786
|
+
trustedFields,
|
|
787
|
+
asyncErrors: {}
|
|
788
|
+
});
|
|
789
|
+
}
|
|
790
|
+
function reducer({ staticValidate, obscuredFields, optionalFields, trustedFields, formatters, defaultData }) {
|
|
791
|
+
return (state, { type, key, mode, value, formData, formName, selectedSchema, innerFormFields, requiredFields, optionalFields: newOptionalFields, asyncValidationResults }) => {
|
|
792
|
+
const clonedState = structuredClone(state);
|
|
793
|
+
switch (type) {
|
|
794
|
+
case "setData":
|
|
795
|
+
if (!key || !formName) return state;
|
|
796
|
+
clonedState.data[formName] ??= {};
|
|
797
|
+
clonedState.data[formName][key] = value;
|
|
798
|
+
return clonedState;
|
|
799
|
+
case "setFormData": {
|
|
800
|
+
if (!formName || !formData) return state;
|
|
801
|
+
const formRequiredFields = clonedState.requiredFields?.[formName] ?? [];
|
|
802
|
+
const formOptionalFields = clonedState.optionalFields?.[formName] ?? [];
|
|
803
|
+
const allowedFields = [...formRequiredFields, ...formOptionalFields];
|
|
804
|
+
const filteredUpdates = {};
|
|
805
|
+
for (const formDataKey in formData) if (allowedFields.includes(formDataKey)) filteredUpdates[formDataKey] = formData[formDataKey];
|
|
806
|
+
clonedState.data[formName] = filteredUpdates;
|
|
807
|
+
const formValidity = allowedFields.reduce((acc, field) => {
|
|
808
|
+
const [, validation] = processField({
|
|
809
|
+
key: field,
|
|
810
|
+
value: filteredUpdates[field],
|
|
811
|
+
mode: "blur",
|
|
812
|
+
formName,
|
|
813
|
+
defaultData: defaultData?.[formName],
|
|
814
|
+
data: clonedState.data,
|
|
815
|
+
formatters: formatters?.[formName],
|
|
816
|
+
fieldContext: { state: {
|
|
817
|
+
data: clonedState?.data?.[formName],
|
|
818
|
+
obscuredFields: obscuredFields?.[formName],
|
|
819
|
+
optionalFields: optionalFields?.[formName],
|
|
820
|
+
trustedFields: trustedFields?.[formName],
|
|
821
|
+
errors: clonedState.errors?.[formName],
|
|
822
|
+
valid: clonedState.valid?.[formName],
|
|
823
|
+
fieldProblems: clonedState.fieldProblems?.[formName],
|
|
824
|
+
asyncErrors: clonedState.asyncErrors?.[formName]
|
|
825
|
+
} },
|
|
826
|
+
staticValidate
|
|
827
|
+
});
|
|
828
|
+
return {
|
|
829
|
+
...acc,
|
|
830
|
+
[field]: validation.isValid
|
|
831
|
+
};
|
|
832
|
+
}, {});
|
|
833
|
+
clonedState.data[formName] = filteredUpdates;
|
|
834
|
+
clonedState.valid[formName] = formValidity;
|
|
835
|
+
return clonedState;
|
|
836
|
+
}
|
|
837
|
+
case "setValid":
|
|
838
|
+
if (!key || !formName || clonedState.valid[formName]?.[key] === value) return state;
|
|
839
|
+
clonedState.valid[formName] ??= {};
|
|
840
|
+
clonedState.valid[formName][key] = !!value;
|
|
841
|
+
return clonedState;
|
|
842
|
+
case "setErrors":
|
|
843
|
+
if (!key || !formName) return state;
|
|
844
|
+
clonedState.errors[formName] ??= {};
|
|
845
|
+
clonedState.errors[formName][key] = value;
|
|
846
|
+
return clonedState;
|
|
847
|
+
case "setRequiredFields": {
|
|
848
|
+
/**
|
|
849
|
+
* If defaultData changes reset the data in the form to new defaultData
|
|
850
|
+
* Fetching documents are bit delayed, this accomodates that delay
|
|
851
|
+
*/
|
|
852
|
+
const hasDefaultDataChanged = !objectsDeepEqual(defaultData, state.defaultData);
|
|
853
|
+
if (objectsDeepEqual(requiredFields, clonedState.requiredFields) && objectsDeepEqual(newOptionalFields, clonedState.optionalFields) && !hasDefaultDataChanged) return state;
|
|
854
|
+
const updatedData = hasDefaultDataChanged ? defaultData : structuredClone(clonedState.data);
|
|
855
|
+
/**
|
|
856
|
+
* When schema changes without a defaultData refresh, re-add any fields that were
|
|
857
|
+
* previously removed and are now reintroduced from the local stash.
|
|
858
|
+
*
|
|
859
|
+
* This preserves user-entered values across dynamic required/optional transitions,
|
|
860
|
+
* such as when rule-driven fields are temporarily hidden and then shown again.
|
|
861
|
+
*/
|
|
862
|
+
if (!hasDefaultDataChanged && updatedData) for (const formName in requiredFields) {
|
|
863
|
+
const form = formName;
|
|
864
|
+
const prevFields = [...clonedState.requiredFields?.[form] ?? [], ...clonedState.optionalFields?.[form] ?? []];
|
|
865
|
+
[...requiredFields?.[form] ?? [], ...newOptionalFields?.[form] ?? []].filter((field) => !prevFields.includes(field)).forEach((field) => {
|
|
866
|
+
const currentValue = updatedData?.[form]?.[field];
|
|
867
|
+
const localValue = clonedState.local?.[form]?.data?.[field];
|
|
868
|
+
if (typeof currentValue === "undefined" && typeof localValue !== "undefined") {
|
|
869
|
+
if (!updatedData[form]) return;
|
|
870
|
+
updatedData[form][field] = localValue;
|
|
871
|
+
}
|
|
872
|
+
});
|
|
873
|
+
}
|
|
874
|
+
const newState = init({
|
|
875
|
+
requiredFields,
|
|
876
|
+
data: updatedData,
|
|
877
|
+
fieldProblems: clonedState.fieldProblems,
|
|
878
|
+
obscuredFields,
|
|
879
|
+
optionalFields: newOptionalFields,
|
|
880
|
+
trustedFields,
|
|
881
|
+
staticValidate,
|
|
882
|
+
defaultData
|
|
883
|
+
});
|
|
884
|
+
if (hasDefaultDataChanged) return newState;
|
|
885
|
+
/**
|
|
886
|
+
* Persist values of fields that are being removed from the active schema into local.
|
|
887
|
+
*
|
|
888
|
+
* These values are later used to restore data for reintroduced fields in subsequent
|
|
889
|
+
* schema transitions, avoiding silent data loss during dynamic form updates.
|
|
890
|
+
*/
|
|
891
|
+
const local = Object.keys(requiredFields ?? {}).reduce((acc, formName) => {
|
|
892
|
+
const form = formName;
|
|
893
|
+
const prevFields = [...clonedState.requiredFields?.[form] ?? [], ...clonedState.optionalFields?.[form] ?? []];
|
|
894
|
+
const nextFields = [...requiredFields?.[form] ?? [], ...newOptionalFields?.[form] ?? []];
|
|
895
|
+
const removedFields = prevFields.filter((field) => !nextFields.includes(field));
|
|
896
|
+
if (!removedFields.length) {
|
|
897
|
+
if (clonedState.local?.[form]) return {
|
|
898
|
+
...acc,
|
|
899
|
+
[form]: clonedState.local[form]
|
|
900
|
+
};
|
|
901
|
+
return acc;
|
|
902
|
+
}
|
|
903
|
+
const localFormData = {
|
|
904
|
+
...clonedState.local?.[form]?.data ?? {},
|
|
905
|
+
...removedFields.reduce((fieldAcc, field) => {
|
|
906
|
+
const value = clonedState.data?.[form]?.[field];
|
|
907
|
+
if (typeof value !== "undefined") return {
|
|
908
|
+
...fieldAcc,
|
|
909
|
+
[field]: value
|
|
910
|
+
};
|
|
911
|
+
return fieldAcc;
|
|
912
|
+
}, {})
|
|
913
|
+
};
|
|
914
|
+
return {
|
|
915
|
+
...acc,
|
|
916
|
+
[form]: {
|
|
917
|
+
...clonedState.local?.[form] ?? {},
|
|
918
|
+
data: localFormData
|
|
919
|
+
}
|
|
920
|
+
};
|
|
921
|
+
}, {});
|
|
922
|
+
return {
|
|
923
|
+
...newState,
|
|
924
|
+
local
|
|
925
|
+
};
|
|
926
|
+
}
|
|
927
|
+
case "setInnerFormRequiredFields": {
|
|
928
|
+
/**
|
|
929
|
+
* This sets the requiredFields in a single form.
|
|
930
|
+
* Ideally this should not be used anywhere, as this goes against the idea of having all
|
|
931
|
+
* the rules of calculating requiredFields in a single place. keeping this in case we have
|
|
932
|
+
* any exceptional scenarios where this would be required. Can be removed once all forms
|
|
933
|
+
* migrated to useMultiform
|
|
934
|
+
*/
|
|
935
|
+
if (!innerFormFields || !formName) return state;
|
|
936
|
+
const requiredFields = {
|
|
937
|
+
...clonedState.requiredFields,
|
|
938
|
+
[formName]: innerFormFields
|
|
939
|
+
};
|
|
940
|
+
const defaultState = init({
|
|
941
|
+
requiredFields,
|
|
942
|
+
defaultData,
|
|
943
|
+
fieldProblems: clonedState.fieldProblems,
|
|
944
|
+
obscuredFields,
|
|
945
|
+
optionalFields,
|
|
946
|
+
trustedFields,
|
|
947
|
+
staticValidate,
|
|
948
|
+
data: defaultData
|
|
949
|
+
});
|
|
950
|
+
const removedFields = clonedState.optionalFields?.[formName].length ? [...(clonedState.requiredFields?.[formName] ?? []).filter((field) => !innerFormFields.includes(field)), ...clonedState.optionalFields[formName].filter((field) => !optionalFields?.[formName].includes(field))] : clonedState.requiredFields?.[formName].filter((field) => !innerFormFields.includes(field));
|
|
951
|
+
const newFields = optionalFields?.[formName].length ? [...innerFormFields.filter((field) => !clonedState.requiredFields?.[formName].includes(field)), ...(optionalFields[formName] ?? []).filter((field) => !clonedState.optionalFields?.[formName].includes(field))] : innerFormFields.filter((field) => !clonedState.requiredFields?.[formName].includes(field));
|
|
952
|
+
const formLocal = {
|
|
953
|
+
data: omitKeys(clonedState.data?.[formName], newFields),
|
|
954
|
+
errors: omitKeys(clonedState.errors?.[formName], newFields),
|
|
955
|
+
valid: omitKeys(clonedState.valid?.[formName], newFields),
|
|
956
|
+
fieldProblems: omitKeys(clonedState.fieldProblems?.[formName], newFields)
|
|
957
|
+
};
|
|
958
|
+
const local = {
|
|
959
|
+
...clonedState.local,
|
|
960
|
+
[formName]: formLocal
|
|
961
|
+
};
|
|
962
|
+
const updatedFormData = addKeys(omitKeys(clonedState.data?.[formName], removedFields), newFields, null, defaultState.data?.[formName], clonedState.local?.[formName].data);
|
|
963
|
+
const updatedData = {
|
|
964
|
+
...clonedState.data,
|
|
965
|
+
[formName]: updatedFormData
|
|
966
|
+
};
|
|
967
|
+
const updatedFormValidity = addKeys(omitKeys(clonedState.valid?.[formName], removedFields), newFields, false, defaultState.valid?.[formName], clonedState.local?.[formName].valid);
|
|
968
|
+
const updatedValidity = {
|
|
969
|
+
...clonedState.valid,
|
|
970
|
+
[formName]: updatedFormValidity
|
|
971
|
+
};
|
|
972
|
+
const updatedFormErrors = addKeys(omitKeys(clonedState.errors?.[formName], removedFields), newFields, null, defaultState.errors?.[formName], clonedState.local?.[formName].errors);
|
|
973
|
+
const updatedErrors = {
|
|
974
|
+
...clonedState.errors,
|
|
975
|
+
[formName]: updatedFormErrors
|
|
976
|
+
};
|
|
977
|
+
const updatedFormFieldProblems = addKeys(omitKeys(clonedState.fieldProblems?.[formName], removedFields), newFields, false, defaultState.fieldProblems?.[formName], clonedState.local?.[formName].fieldProblems);
|
|
978
|
+
return {
|
|
979
|
+
requiredFields,
|
|
980
|
+
data: updatedData,
|
|
981
|
+
valid: updatedValidity,
|
|
982
|
+
errors: updatedErrors,
|
|
983
|
+
fieldProblems: {
|
|
984
|
+
...clonedState.fieldProblems,
|
|
985
|
+
[formName]: updatedFormFieldProblems
|
|
986
|
+
},
|
|
987
|
+
asyncErrors: clonedState.asyncErrors,
|
|
988
|
+
optionalFields,
|
|
989
|
+
trustedFields,
|
|
990
|
+
local,
|
|
991
|
+
defaultData
|
|
992
|
+
};
|
|
993
|
+
}
|
|
994
|
+
case "updateField": {
|
|
995
|
+
/**
|
|
996
|
+
* Called when a field value changes in form
|
|
997
|
+
* Validates the field and updates data, validity, error in the state for the field
|
|
998
|
+
*/
|
|
999
|
+
if (!key || !mode || !formName) return state;
|
|
1000
|
+
const updatedData = {
|
|
1001
|
+
...clonedState.data,
|
|
1002
|
+
[formName]: {
|
|
1003
|
+
...clonedState.data?.[formName],
|
|
1004
|
+
[key]: value
|
|
1005
|
+
}
|
|
1006
|
+
};
|
|
1007
|
+
/**
|
|
1008
|
+
* Wipe async errors for the field if value has been changed
|
|
1009
|
+
*/
|
|
1010
|
+
const updatedAsyncErrors = hasValueChanged(value, clonedState.data?.[formName]?.[key]) ? {
|
|
1011
|
+
...clonedState.asyncErrors,
|
|
1012
|
+
[formName]: {
|
|
1013
|
+
...clonedState.asyncErrors?.[formName],
|
|
1014
|
+
[key]: null
|
|
1015
|
+
}
|
|
1016
|
+
} : clonedState.asyncErrors;
|
|
1017
|
+
const [formattedValue, validation] = processField({
|
|
1018
|
+
key,
|
|
1019
|
+
value,
|
|
1020
|
+
mode,
|
|
1021
|
+
formName,
|
|
1022
|
+
defaultData: defaultData?.[formName],
|
|
1023
|
+
data: updatedData,
|
|
1024
|
+
formatters: formatters?.[formName],
|
|
1025
|
+
fieldContext: { state: {
|
|
1026
|
+
data: clonedState.data?.[formName],
|
|
1027
|
+
obscuredFields: obscuredFields?.[formName],
|
|
1028
|
+
optionalFields: optionalFields?.[formName],
|
|
1029
|
+
trustedFields: trustedFields?.[formName],
|
|
1030
|
+
errors: clonedState.errors[formName],
|
|
1031
|
+
valid: clonedState.valid[formName],
|
|
1032
|
+
fieldProblems: clonedState.fieldProblems[formName],
|
|
1033
|
+
asyncErrors: updatedAsyncErrors[formName]
|
|
1034
|
+
} },
|
|
1035
|
+
staticValidate
|
|
1036
|
+
});
|
|
1037
|
+
const clearFieldProblems = (clonedState.data?.[formName])?.[key] !== formattedValue;
|
|
1038
|
+
return {
|
|
1039
|
+
...clonedState,
|
|
1040
|
+
data: {
|
|
1041
|
+
...clonedState.data,
|
|
1042
|
+
[formName]: {
|
|
1043
|
+
...clonedState.data?.[formName],
|
|
1044
|
+
[key]: formattedValue
|
|
1045
|
+
}
|
|
1046
|
+
},
|
|
1047
|
+
asyncErrors: updatedAsyncErrors,
|
|
1048
|
+
errors: {
|
|
1049
|
+
...clonedState.errors,
|
|
1050
|
+
[formName]: {
|
|
1051
|
+
...clonedState.errors[formName],
|
|
1052
|
+
[key]: validation.getError() ?? null
|
|
1053
|
+
}
|
|
1054
|
+
},
|
|
1055
|
+
valid: {
|
|
1056
|
+
...clonedState.valid,
|
|
1057
|
+
[formName]: {
|
|
1058
|
+
...clonedState?.valid?.[formName],
|
|
1059
|
+
[key]: (validation.isValid && !clonedState.fieldProblems?.[formName]?.[key]) ?? false
|
|
1060
|
+
}
|
|
1061
|
+
},
|
|
1062
|
+
fieldProblems: {
|
|
1063
|
+
...clonedState.fieldProblems,
|
|
1064
|
+
[formName]: {
|
|
1065
|
+
...clonedState.fieldProblems[formName],
|
|
1066
|
+
...!clearFieldProblems && clonedState.fieldProblems?.[formName]?.[key] ? { [key]: true } : {}
|
|
1067
|
+
}
|
|
1068
|
+
}
|
|
1069
|
+
};
|
|
1070
|
+
}
|
|
1071
|
+
case "validateForm": {
|
|
1072
|
+
/**
|
|
1073
|
+
* Called when triggerValidation('formName') is called, validates all the fields in the form
|
|
1074
|
+
* and populates the errors in the state
|
|
1075
|
+
*/
|
|
1076
|
+
if (!formName) return state;
|
|
1077
|
+
const formFields = clonedState.requiredFields?.[formName];
|
|
1078
|
+
if (!formFields) return state;
|
|
1079
|
+
const formState = (selectedSchema || formFields).reduce((acc, field) => {
|
|
1080
|
+
const formData = clonedState.data?.[formName];
|
|
1081
|
+
const [formattedValue, validation] = processField({
|
|
1082
|
+
key: field,
|
|
1083
|
+
mode: "blur",
|
|
1084
|
+
value: formData?.[field] ?? null,
|
|
1085
|
+
formName,
|
|
1086
|
+
defaultData: defaultData?.[formName],
|
|
1087
|
+
data: clonedState.data,
|
|
1088
|
+
formatters: formatters?.[formName],
|
|
1089
|
+
fieldContext: { state: {
|
|
1090
|
+
data: clonedState.data?.[formName],
|
|
1091
|
+
obscuredFields: obscuredFields?.[formName],
|
|
1092
|
+
optionalFields: optionalFields?.[formName],
|
|
1093
|
+
trustedFields: trustedFields?.[formName],
|
|
1094
|
+
errors: clonedState.errors[formName],
|
|
1095
|
+
valid: clonedState.valid[formName],
|
|
1096
|
+
fieldProblems: clonedState.fieldProblems[formName],
|
|
1097
|
+
asyncErrors: clonedState.asyncErrors[formName]
|
|
1098
|
+
} },
|
|
1099
|
+
staticValidate
|
|
1100
|
+
});
|
|
1101
|
+
const clearFieldProblems = (clonedState?.data?.[formName])?.[field] !== formattedValue;
|
|
1102
|
+
const fieldAsyncValidationResult = asyncValidationResults?.[field];
|
|
1103
|
+
return {
|
|
1104
|
+
data: formData,
|
|
1105
|
+
asyncErrors: {
|
|
1106
|
+
...acc.asyncErrors,
|
|
1107
|
+
[field]: fieldAsyncValidationResult?.getError() ?? null
|
|
1108
|
+
},
|
|
1109
|
+
errors: {
|
|
1110
|
+
...acc.errors,
|
|
1111
|
+
[field]: validation.getError() ?? fieldAsyncValidationResult?.getError() ?? null
|
|
1112
|
+
},
|
|
1113
|
+
valid: {
|
|
1114
|
+
...acc.valid,
|
|
1115
|
+
[field]: validation.isValid && (fieldAsyncValidationResult?.isValid ?? true) && !clonedState.fieldProblems[formName][field]
|
|
1116
|
+
},
|
|
1117
|
+
fieldProblems: {
|
|
1118
|
+
...acc.fieldProblems,
|
|
1119
|
+
...!clearFieldProblems && acc.fieldProblems?.[field] ? { [field]: true } : {}
|
|
1120
|
+
}
|
|
1121
|
+
};
|
|
1122
|
+
}, {});
|
|
1123
|
+
return {
|
|
1124
|
+
...clonedState,
|
|
1125
|
+
errors: {
|
|
1126
|
+
...clonedState.errors,
|
|
1127
|
+
[formName]: formState.errors
|
|
1128
|
+
},
|
|
1129
|
+
asyncErrors: {
|
|
1130
|
+
...clonedState.asyncErrors,
|
|
1131
|
+
[formName]: formState.asyncErrors
|
|
1132
|
+
},
|
|
1133
|
+
valid: {
|
|
1134
|
+
...clonedState.valid,
|
|
1135
|
+
[formName]: formState.valid
|
|
1136
|
+
},
|
|
1137
|
+
fieldProblems: {
|
|
1138
|
+
...clonedState.fieldProblems,
|
|
1139
|
+
[formName]: formState.fieldProblems
|
|
1140
|
+
}
|
|
1141
|
+
};
|
|
1142
|
+
}
|
|
1143
|
+
default: throw new Error("Undefined useForm action");
|
|
1144
|
+
}
|
|
1145
|
+
};
|
|
1146
|
+
}
|
|
1147
|
+
//#endregion
|
|
1148
|
+
//#region src/hooks/useMultiForm/useMultiFormAsyncValidator.ts
|
|
1149
|
+
var logger$1 = createLogger();
|
|
1150
|
+
/**
|
|
1151
|
+
* Returns
|
|
1152
|
+
* - triggerAsyncValidation function which can execute the async validation for a field and populate the sync validation results
|
|
1153
|
+
* - asyncValidationResult state which keeps track of async validations of all fields.
|
|
1154
|
+
* @param asyncRules
|
|
1155
|
+
*/
|
|
1156
|
+
var useMultiFormAsyncValidator = (asyncRules) => {
|
|
1157
|
+
const validResult = {
|
|
1158
|
+
isValid: true,
|
|
1159
|
+
hasError: false
|
|
1160
|
+
};
|
|
1161
|
+
const triggerAsyncValidation = useCallback$1(async (field, formName, data) => {
|
|
1162
|
+
if (!asyncRules) return new ValidationResult([validResult]);
|
|
1163
|
+
const rule = typeof asyncRules === "function" ? asyncRules(data)[formName]?.[field] : asyncRules[formName][field];
|
|
1164
|
+
const value = data?.[formName]?.[field];
|
|
1165
|
+
if (!rule || !value) return new ValidationResult([validResult]);
|
|
1166
|
+
const isValid = await rule.asyncValidate(value).catch(logger$1.error);
|
|
1167
|
+
if (isValid === false) return new ValidationResult([{
|
|
1168
|
+
isValid,
|
|
1169
|
+
errorMessage: typeof rule.errorMessage === "function" ? rule.errorMessage(value) : rule.errorMessage,
|
|
1170
|
+
hasError: !isValid
|
|
1171
|
+
}]);
|
|
1172
|
+
return new ValidationResult([validResult]);
|
|
1173
|
+
}, [asyncRules]);
|
|
1174
|
+
const triggerAsyncFormValidation = async (formName, state, selectedSchema) => {
|
|
1175
|
+
const fields = selectedSchema ?? state.requiredFields?.[formName];
|
|
1176
|
+
if (!fields?.length) return { isValid: true };
|
|
1177
|
+
const asyncValidationResults = await fields.reduce(async (accPromise, fieldName) => {
|
|
1178
|
+
const acc = await accPromise;
|
|
1179
|
+
const asyncValidationResult = await triggerAsyncValidation(fieldName, formName, state.data);
|
|
1180
|
+
return {
|
|
1181
|
+
...acc,
|
|
1182
|
+
[fieldName]: asyncValidationResult
|
|
1183
|
+
};
|
|
1184
|
+
}, Promise.resolve({}));
|
|
1185
|
+
const isValid = Object.values(asyncValidationResults).every((validationResult) => validationResult.isValid);
|
|
1186
|
+
return {
|
|
1187
|
+
...asyncValidationResults,
|
|
1188
|
+
isValid
|
|
1189
|
+
};
|
|
1190
|
+
};
|
|
1191
|
+
return { triggerAsyncFormValidation };
|
|
1192
|
+
};
|
|
1193
|
+
//#endregion
|
|
1194
|
+
//#region src/utils/validation/commonValidators.ts
|
|
1195
|
+
var isTruthyValidator = {
|
|
1196
|
+
validate: (value) => !!value,
|
|
1197
|
+
modes: ["blur"],
|
|
1198
|
+
errorMessage: "fieldIsRequired"
|
|
1199
|
+
};
|
|
1200
|
+
var isNotEmptyValidator = {
|
|
1201
|
+
validate: (value) => !isEmpty(value),
|
|
1202
|
+
modes: ["blur"],
|
|
1203
|
+
errorMessage: "fieldIsRequired"
|
|
1204
|
+
};
|
|
1205
|
+
//#endregion
|
|
1206
|
+
//#region src/hooks/useMultiForm/useMultiFormStaticValidator.ts
|
|
1207
|
+
var useMultiFormStaticValidator = (rules) => {
|
|
1208
|
+
const getRulesForField = useCallback$1((field, form, data) => {
|
|
1209
|
+
const fallbackRule = {
|
|
1210
|
+
validate: () => true,
|
|
1211
|
+
modes: ["blur", "input"]
|
|
1212
|
+
};
|
|
1213
|
+
if (!form) return [fallbackRule];
|
|
1214
|
+
const fieldRules = typeof rules === "function" ? rules(data)?.[form]?.[field] ?? [fallbackRule] : rules?.[form]?.[field] ?? [fallbackRule];
|
|
1215
|
+
return Array.isArray(fieldRules) ? fieldRules : [fieldRules];
|
|
1216
|
+
}, [rules]);
|
|
1217
|
+
return { triggerStaticValidation: useCallback$1(({ key, value, mode = "blur", formName }, data, context) => {
|
|
1218
|
+
const fieldRules = getRulesForField(key, formName, data);
|
|
1219
|
+
const isFieldOptional = !!context?.state.optionalFields?.includes(key);
|
|
1220
|
+
const isFieldObscured = !!context?.state.obscuredFields?.includes(key);
|
|
1221
|
+
if (!isFieldOptional) fieldRules.unshift(isNotEmptyValidator);
|
|
1222
|
+
const validationRulesResult = fieldRules.map((rule) => {
|
|
1223
|
+
const shouldValidate = rule.modes.includes(mode) && !isFieldObscured;
|
|
1224
|
+
const isValid = isFieldOptional && isEmpty(value) ? true : rule.validate(value, context);
|
|
1225
|
+
return {
|
|
1226
|
+
isValid,
|
|
1227
|
+
errorMessage: typeof rule.errorMessage === "function" ? rule.errorMessage(value, context) : rule.errorMessage,
|
|
1228
|
+
hasError: shouldValidate && !isValid
|
|
1229
|
+
};
|
|
1230
|
+
});
|
|
1231
|
+
return new ValidationResult(validationRulesResult);
|
|
1232
|
+
}, [getRulesForField]) };
|
|
1233
|
+
};
|
|
1234
|
+
//#endregion
|
|
1235
|
+
//#region src/hooks/useMultiForm/useMultiForm.ts
|
|
1236
|
+
function useMultiForm({ defaultData, rules, asyncRules, fieldProblems, allFields, requiredFields, obscuredFields, optionalFields, trustedFields, formatters }) {
|
|
1237
|
+
const { triggerStaticValidation } = useMultiFormStaticValidator(rules);
|
|
1238
|
+
const { triggerAsyncFormValidation } = useMultiFormAsyncValidator(asyncRules);
|
|
1239
|
+
const getRequiredFields = useMemo$1(() => typeof requiredFields === "function" ? requiredFields : () => requiredFields, [requiredFields]);
|
|
1240
|
+
const getSchema = useMemo$1(() => getRequiredFields(defaultData), [defaultData, getRequiredFields]);
|
|
1241
|
+
const getReducer = useCallback$1(() => reducer({
|
|
1242
|
+
staticValidate: triggerStaticValidation,
|
|
1243
|
+
defaultData,
|
|
1244
|
+
obscuredFields,
|
|
1245
|
+
optionalFields,
|
|
1246
|
+
trustedFields,
|
|
1247
|
+
formatters
|
|
1248
|
+
}), [
|
|
1249
|
+
triggerStaticValidation,
|
|
1250
|
+
obscuredFields,
|
|
1251
|
+
optionalFields,
|
|
1252
|
+
trustedFields,
|
|
1253
|
+
formatters,
|
|
1254
|
+
defaultData
|
|
1255
|
+
]);
|
|
1256
|
+
const initialData = useMemo$1(() => ({
|
|
1257
|
+
requiredFields: getSchema,
|
|
1258
|
+
defaultData,
|
|
1259
|
+
fieldProblems,
|
|
1260
|
+
obscuredFields,
|
|
1261
|
+
optionalFields,
|
|
1262
|
+
trustedFields,
|
|
1263
|
+
formatters,
|
|
1264
|
+
staticValidate: triggerStaticValidation,
|
|
1265
|
+
data: defaultData
|
|
1266
|
+
}), [
|
|
1267
|
+
getSchema,
|
|
1268
|
+
defaultData,
|
|
1269
|
+
fieldProblems,
|
|
1270
|
+
obscuredFields,
|
|
1271
|
+
optionalFields,
|
|
1272
|
+
trustedFields,
|
|
1273
|
+
formatters,
|
|
1274
|
+
triggerStaticValidation
|
|
1275
|
+
]);
|
|
1276
|
+
const [state, dispatch] = useReducer(getReducer(), initialData, init);
|
|
1277
|
+
const isValid = useMemo$1(() => {
|
|
1278
|
+
const formsForOptionalFields = Object.keys(state.optionalFields ?? {});
|
|
1279
|
+
const formsForRequiredFields = Object.keys(state.requiredFields ?? {});
|
|
1280
|
+
return Array.from(/* @__PURE__ */ new Set([...formsForOptionalFields, ...formsForRequiredFields])).reduce((acc, formName) => {
|
|
1281
|
+
const form = formName;
|
|
1282
|
+
const optionalsFormFields = state.optionalFields?.[form] ?? [];
|
|
1283
|
+
const requiredFormFields = state.requiredFields?.[form] ?? [];
|
|
1284
|
+
const formFields = [...optionalsFormFields, ...requiredFormFields];
|
|
1285
|
+
const formValidity = state.valid[formName] ?? {};
|
|
1286
|
+
return {
|
|
1287
|
+
...acc,
|
|
1288
|
+
[formName]: Object.entries(formValidity)?.every(([field, valid]) => formFields.includes(field) ? valid : true)
|
|
1289
|
+
};
|
|
1290
|
+
}, {});
|
|
1291
|
+
}, [state.requiredFields, state.valid]);
|
|
1292
|
+
const getTargetValue = useCallback$1((formName, key, e) => {
|
|
1293
|
+
if (!e?.target) return e;
|
|
1294
|
+
if (e.target.type === "checkbox") return !state.data?.[formName][key];
|
|
1295
|
+
return e.target.value;
|
|
1296
|
+
}, [state.data]);
|
|
1297
|
+
const setErrors = useCallback$1((formName, key, value) => {
|
|
1298
|
+
dispatch({
|
|
1299
|
+
type: "setErrors",
|
|
1300
|
+
key,
|
|
1301
|
+
value,
|
|
1302
|
+
formName
|
|
1303
|
+
});
|
|
1304
|
+
}, []);
|
|
1305
|
+
const setValid = useCallback$1((formName, key, value) => {
|
|
1306
|
+
dispatch({
|
|
1307
|
+
type: "setValid",
|
|
1308
|
+
key,
|
|
1309
|
+
value,
|
|
1310
|
+
formName
|
|
1311
|
+
});
|
|
1312
|
+
}, []);
|
|
1313
|
+
const setData = useCallback$1((formName, key, value) => {
|
|
1314
|
+
dispatch({
|
|
1315
|
+
type: "setData",
|
|
1316
|
+
key,
|
|
1317
|
+
value,
|
|
1318
|
+
formName
|
|
1319
|
+
});
|
|
1320
|
+
}, []);
|
|
1321
|
+
const setFormData = useCallback$1((formName, formData) => {
|
|
1322
|
+
dispatch({
|
|
1323
|
+
type: "setFormData",
|
|
1324
|
+
formName,
|
|
1325
|
+
formData
|
|
1326
|
+
});
|
|
1327
|
+
}, []);
|
|
1328
|
+
const handleChangeFor = useCallback$1((formName, key, mode = "blur") => (e) => {
|
|
1329
|
+
const value = getTargetValue(formName, key, e);
|
|
1330
|
+
dispatch({
|
|
1331
|
+
type: "updateField",
|
|
1332
|
+
key,
|
|
1333
|
+
value,
|
|
1334
|
+
mode,
|
|
1335
|
+
formName
|
|
1336
|
+
});
|
|
1337
|
+
}, [getTargetValue]);
|
|
1338
|
+
const triggerValidation = useCallback$1(async (formName, selectedSchema) => {
|
|
1339
|
+
const asyncValidationResults = await triggerAsyncFormValidation(formName, state, selectedSchema);
|
|
1340
|
+
dispatch({
|
|
1341
|
+
type: "validateForm",
|
|
1342
|
+
formName,
|
|
1343
|
+
selectedSchema,
|
|
1344
|
+
asyncValidationResults
|
|
1345
|
+
});
|
|
1346
|
+
return asyncValidationResults.isValid;
|
|
1347
|
+
}, [state, triggerAsyncFormValidation]);
|
|
1348
|
+
const resetToDefaultData = useCallback$1(() => {
|
|
1349
|
+
if (!getSchema) return;
|
|
1350
|
+
Object.entries(getSchema).forEach(([formName]) => {
|
|
1351
|
+
const form = formName;
|
|
1352
|
+
const formData = defaultData?.[form];
|
|
1353
|
+
getSchema[form].forEach((field) => {
|
|
1354
|
+
if (!formData || typeof formData[field] !== "undefined") {
|
|
1355
|
+
handleChangeFor(form, field)(formData);
|
|
1356
|
+
return;
|
|
1357
|
+
}
|
|
1358
|
+
setValid(form, field, false);
|
|
1359
|
+
setErrors(form, field, null);
|
|
1360
|
+
setData(form, field, formData[field]);
|
|
1361
|
+
});
|
|
1362
|
+
});
|
|
1363
|
+
}, [
|
|
1364
|
+
defaultData,
|
|
1365
|
+
getSchema,
|
|
1366
|
+
handleChangeFor,
|
|
1367
|
+
setData,
|
|
1368
|
+
setErrors,
|
|
1369
|
+
setValid
|
|
1370
|
+
]);
|
|
1371
|
+
useEffect$1(() => {
|
|
1372
|
+
const requiredFields = getRequiredFields(state.data);
|
|
1373
|
+
if (!requiredFields) return;
|
|
1374
|
+
dispatch({
|
|
1375
|
+
type: "setRequiredFields",
|
|
1376
|
+
requiredFields,
|
|
1377
|
+
defaultData,
|
|
1378
|
+
optionalFields
|
|
1379
|
+
});
|
|
1380
|
+
}, [
|
|
1381
|
+
getRequiredFields,
|
|
1382
|
+
state.data,
|
|
1383
|
+
defaultData,
|
|
1384
|
+
optionalFields
|
|
1385
|
+
]);
|
|
1386
|
+
return {
|
|
1387
|
+
setData,
|
|
1388
|
+
setFormData,
|
|
1389
|
+
setValid,
|
|
1390
|
+
setErrors,
|
|
1391
|
+
handleChangeFor,
|
|
1392
|
+
triggerValidation,
|
|
1393
|
+
resetToDefaultData,
|
|
1394
|
+
isValid,
|
|
1395
|
+
allFields,
|
|
1396
|
+
requiredFields: state.requiredFields,
|
|
1397
|
+
optionalFields: state.optionalFields,
|
|
1398
|
+
trustedFields: state.trustedFields,
|
|
1399
|
+
obscuredFields: state.obscuredFields,
|
|
1400
|
+
valid: state.valid,
|
|
1401
|
+
errors: state.errors,
|
|
1402
|
+
data: state.data,
|
|
1403
|
+
fieldProblems: state.fieldProblems,
|
|
1404
|
+
defaultData,
|
|
1405
|
+
asyncErrors: state.asyncErrors
|
|
1406
|
+
};
|
|
1407
|
+
}
|
|
1408
|
+
//#endregion
|
|
1409
|
+
//#region src/utils/makeArrayOfRepeatedObjects.ts
|
|
1410
|
+
var makeArrayOfRepeatedObjects = (length, obj) => {
|
|
1411
|
+
const array = [];
|
|
1412
|
+
for (let i = 0; i < length; i += 1) array.push(cloneObject(obj));
|
|
1413
|
+
return array;
|
|
1414
|
+
};
|
|
1415
|
+
//#endregion
|
|
1416
|
+
//#region src/utils/masking/shiftRight.ts
|
|
1417
|
+
var shiftRight = (possibleShifts, matchedTokens, remainingTokens) => {
|
|
1418
|
+
let shiftsToTry = [...possibleShifts];
|
|
1419
|
+
let current = {
|
|
1420
|
+
matchedTokens,
|
|
1421
|
+
remainingTokens
|
|
1422
|
+
};
|
|
1423
|
+
while (current.remainingTokens.length > 0 && shiftsToTry.length > 0) {
|
|
1424
|
+
const possibleShift = shiftsToTry[0];
|
|
1425
|
+
const shifted = tryShift(current.matchedTokens, current.remainingTokens, possibleShift.fromIndex, possibleShift.shiftDistance);
|
|
1426
|
+
if (shifted === "notPossible") shiftsToTry = shiftsToTry.slice(1);
|
|
1427
|
+
else {
|
|
1428
|
+
current = shifted;
|
|
1429
|
+
shiftsToTry = [...possibleShifts];
|
|
1430
|
+
}
|
|
1431
|
+
}
|
|
1432
|
+
return current;
|
|
1433
|
+
};
|
|
1434
|
+
/**
|
|
1435
|
+
* Returns all possible shifts of optional inputs, sorted by best to worst
|
|
1436
|
+
* @param mask
|
|
1437
|
+
*/
|
|
1438
|
+
var findPossibleShifts = (mask) => {
|
|
1439
|
+
const inputOnlyMask = mask.filter((t) => t.type === "input");
|
|
1440
|
+
const optionals = inputOnlyMask.filter((t) => t.optional);
|
|
1441
|
+
const possibleShifts = [];
|
|
1442
|
+
for (const optional of optionals) {
|
|
1443
|
+
const index = inputOnlyMask.indexOf(optional);
|
|
1444
|
+
for (let i = index + 1; i < inputOnlyMask.length; i += 1) if (inputOnlyMask[i].type === "input") possibleShifts.push({
|
|
1445
|
+
fromIndex: index,
|
|
1446
|
+
shiftDistance: i - index
|
|
1447
|
+
});
|
|
1448
|
+
}
|
|
1449
|
+
return possibleShifts.sort((s1, s2) => {
|
|
1450
|
+
if (s1.fromIndex === s2.fromIndex) return s2.shiftDistance - s1.shiftDistance;
|
|
1451
|
+
return s1.fromIndex - s2.fromIndex;
|
|
1452
|
+
});
|
|
1453
|
+
};
|
|
1454
|
+
var tryShift = (matchedTokens, remainingTokens, fromIndex, shiftDistance) => {
|
|
1455
|
+
const normalizedTokens = [...matchedTokens.map((token, i) => ({
|
|
1456
|
+
...token,
|
|
1457
|
+
currentValue: token.char,
|
|
1458
|
+
originalIndex: i
|
|
1459
|
+
})), ...remainingTokens.map((token, i) => ({
|
|
1460
|
+
...token,
|
|
1461
|
+
currentValue: null,
|
|
1462
|
+
originalIndex: i + matchedTokens.length
|
|
1463
|
+
}))];
|
|
1464
|
+
const normalizedInputTokens = normalizedTokens.filter((token) => token.type === "input");
|
|
1465
|
+
if (!normalizedTokens[fromIndex] || normalizedTokens[fromIndex].currentValue === null) return "notPossible";
|
|
1466
|
+
if (shiftDistance > normalizedInputTokens.slice(fromIndex + 1).filter((t) => !t.currentValue).length) return "notPossible";
|
|
1467
|
+
for (let i = 0; i < normalizedInputTokens.length; i += 1) {
|
|
1468
|
+
const token = normalizedInputTokens[i];
|
|
1469
|
+
if (i < fromIndex) token.potentialValue = token.currentValue;
|
|
1470
|
+
else if (i < fromIndex + shiftDistance) token.potentialValue = null;
|
|
1471
|
+
else token.potentialValue = normalizedInputTokens[i - shiftDistance].currentValue;
|
|
1472
|
+
}
|
|
1473
|
+
if (!normalizedInputTokens.every((token) => {
|
|
1474
|
+
if (!token.potentialValue) return token.optional;
|
|
1475
|
+
return token.allow?.test(token.potentialValue) ?? true;
|
|
1476
|
+
})) return "notPossible";
|
|
1477
|
+
let matchedUpTo = 0;
|
|
1478
|
+
for (let i = 0; i < normalizedTokens.length; i += 1) {
|
|
1479
|
+
const token = normalizedInputTokens.find((t) => t.originalIndex === i) ?? normalizedTokens[i];
|
|
1480
|
+
if (token.type === "input" && !token.potentialValue && !token.optional) break;
|
|
1481
|
+
matchedUpTo = i + 1;
|
|
1482
|
+
}
|
|
1483
|
+
return {
|
|
1484
|
+
matchedTokens: normalizedTokens.slice(0, matchedUpTo).map((token) => ({
|
|
1485
|
+
...token,
|
|
1486
|
+
char: token.type === "nonInput" ? token.char : token.potentialValue
|
|
1487
|
+
})),
|
|
1488
|
+
remainingTokens: normalizedTokens.slice(matchedUpTo)
|
|
1489
|
+
};
|
|
1490
|
+
};
|
|
1491
|
+
//#endregion
|
|
1492
|
+
//#region src/utils/masking/maskHelpers.ts
|
|
1493
|
+
var nonInputs = (str, options) => Array.from(str).map((char) => ({
|
|
1494
|
+
type: "nonInput",
|
|
1495
|
+
char,
|
|
1496
|
+
includeInValue: options?.includeInValue ?? false,
|
|
1497
|
+
displayEagerly: options?.displayEagerly ?? true
|
|
1498
|
+
}));
|
|
1499
|
+
var spacer = nonInputs(" ")[0];
|
|
1500
|
+
var alphaInputs = (length, optional = false) => makeArrayOfRepeatedObjects(length, {
|
|
1501
|
+
type: "input",
|
|
1502
|
+
allow: /[A-Za-z]/,
|
|
1503
|
+
optional
|
|
1504
|
+
});
|
|
1505
|
+
var numericInputs = (length, optional = false) => makeArrayOfRepeatedObjects(length, {
|
|
1506
|
+
type: "input",
|
|
1507
|
+
allow: /\d/,
|
|
1508
|
+
optional
|
|
1509
|
+
});
|
|
1510
|
+
var alphanumericInputs = (length, optional = false) => makeArrayOfRepeatedObjects(length, {
|
|
1511
|
+
type: "input",
|
|
1512
|
+
allow: /[\dA-Za-z]/,
|
|
1513
|
+
optional
|
|
1514
|
+
});
|
|
1515
|
+
var customInputs = (length, regex, optional = false) => makeArrayOfRepeatedObjects(length, {
|
|
1516
|
+
type: "input",
|
|
1517
|
+
allow: regex,
|
|
1518
|
+
optional
|
|
1519
|
+
});
|
|
1520
|
+
var makeMask = (...tokens) => ({
|
|
1521
|
+
tokens,
|
|
1522
|
+
possibleShifts: findPossibleShifts(tokens)
|
|
1523
|
+
});
|
|
1524
|
+
//#endregion
|
|
1525
|
+
//#region src/utils/masking/transformers/uppercase.ts
|
|
1526
|
+
var uppercase = (str) => str?.toUpperCase() ?? str;
|
|
1527
|
+
//#endregion
|
|
1528
|
+
//#region src/utils/regex/patternValidators.ts
|
|
1529
|
+
var validateNotEmptyOnBlur = {
|
|
1530
|
+
modes: ["blur"],
|
|
1531
|
+
validate: (val) => !isEmpty(val),
|
|
1532
|
+
errorMessage: "fieldIsRequired"
|
|
1533
|
+
};
|
|
1534
|
+
var validateLegalCompanyName = [
|
|
1535
|
+
{
|
|
1536
|
+
modes: ["blur"],
|
|
1537
|
+
validate: hasText,
|
|
1538
|
+
errorMessage: "fieldIsRequired"
|
|
1539
|
+
},
|
|
1540
|
+
{
|
|
1541
|
+
modes: ["blur"],
|
|
1542
|
+
validate: (input) => !matchesRegex(NO_ALPHABET_REGEX, input),
|
|
1543
|
+
errorMessage: "nameMustContainLetters"
|
|
1544
|
+
},
|
|
1545
|
+
{
|
|
1546
|
+
modes: ["blur"],
|
|
1547
|
+
validate: (input) => !matchesRegex(EMOJI_REGEX, input) && !hasRepeatedCharacters(input) && isValidMinLength(input, 3) && !isInvalidName(input) && matchesRegex(OTHER_ENTITIES_VALID_CHAR_REGEX, input),
|
|
1548
|
+
errorMessage: "checkForTypos"
|
|
1549
|
+
}
|
|
1550
|
+
];
|
|
1551
|
+
var validateJaHaniLegalCompanyName = [
|
|
1552
|
+
{
|
|
1553
|
+
modes: ["blur"],
|
|
1554
|
+
validate: hasText,
|
|
1555
|
+
errorMessage: "fieldIsRequired"
|
|
1556
|
+
},
|
|
1557
|
+
{
|
|
1558
|
+
modes: ["blur"],
|
|
1559
|
+
validate: (input) => standardKanjiValidator(input),
|
|
1560
|
+
errorMessage: "nameMustContainLetters"
|
|
1561
|
+
},
|
|
1562
|
+
{
|
|
1563
|
+
modes: ["blur"],
|
|
1564
|
+
validate: (input) => !matchesRegex(EMOJI_REGEX, input) && !hasRepeatedCharacters(input) && isValidMinLength(input, 3) && !isInvalidName(input) && matchesRegex(OTHER_ENTITIES_VALID_CHAR_REGEX, input),
|
|
1565
|
+
errorMessage: "checkForTypos"
|
|
1566
|
+
}
|
|
1567
|
+
];
|
|
1568
|
+
var validateJaKanaLegalCompanyName = [
|
|
1569
|
+
{
|
|
1570
|
+
modes: ["blur"],
|
|
1571
|
+
validate: hasText,
|
|
1572
|
+
errorMessage: "fieldIsRequired"
|
|
1573
|
+
},
|
|
1574
|
+
{
|
|
1575
|
+
modes: ["blur"],
|
|
1576
|
+
validate: (input) => standardKatakanaValidator(input),
|
|
1577
|
+
errorMessage: "ensureValidFullWidthKatakana"
|
|
1578
|
+
},
|
|
1579
|
+
{
|
|
1580
|
+
modes: ["blur"],
|
|
1581
|
+
validate: (input) => !matchesRegex(EMOJI_REGEX, input) && !hasRepeatedCharacters(input) && isValidMinLength(input, 3) && !isInvalidName(input) && matchesRegex(OTHER_ENTITIES_VALID_CHAR_REGEX, input),
|
|
1582
|
+
errorMessage: "checkForTypos"
|
|
1583
|
+
}
|
|
1584
|
+
];
|
|
1585
|
+
var validateLatinSpaceMarkPunctuationNumbersOnlyOnBlur = {
|
|
1586
|
+
modes: ["blur"],
|
|
1587
|
+
validate: (input) => matchesRegex(LATIN_SPACE_MARK_PUNCTUATION_NUMBERS_REGEX, input),
|
|
1588
|
+
errorMessage: "kanjiAndKanaCharactersAreNotAllowed"
|
|
1589
|
+
};
|
|
1590
|
+
var validatePatternOnBlur = (pattern) => ({
|
|
1591
|
+
modes: ["blur"],
|
|
1592
|
+
validate: (val) => !!val && pattern.test(val)
|
|
1593
|
+
});
|
|
1594
|
+
//#endregion
|
|
1595
|
+
//#region src/context/FormRouterContext/FormRouterContextProvider.tsx
|
|
1596
|
+
var logger = createLogger();
|
|
1597
|
+
function FormRouterContextProvider({ children, forms, setFormIndex, goToFormByFormId }) {
|
|
1598
|
+
const fieldActionsRef = useRef$1({});
|
|
1599
|
+
const registerFieldAction = useCallback$1((fieldName, action) => {
|
|
1600
|
+
fieldActionsRef.current[fieldName] = action;
|
|
1601
|
+
}, []);
|
|
1602
|
+
const unregisterFieldAction = useCallback$1((fieldName) => {
|
|
1603
|
+
delete fieldActionsRef.current[fieldName];
|
|
1604
|
+
}, []);
|
|
1605
|
+
const getFieldAction = useCallback$1((fieldName) => {
|
|
1606
|
+
return fieldActionsRef.current[fieldName];
|
|
1607
|
+
}, []);
|
|
1608
|
+
const contextValue = useMemo$1(() => ({
|
|
1609
|
+
setFormIndex,
|
|
1610
|
+
goToFormByFormId,
|
|
1611
|
+
goToFormByFieldName: (fieldName) => {
|
|
1612
|
+
if (fieldName === "idDocument") fieldName = "idVerificationMethod";
|
|
1613
|
+
const formIndex = forms.findIndex((form) => form?.fields?.some((field) => field === fieldName));
|
|
1614
|
+
if (formIndex > -1) setFormIndex(formIndex);
|
|
1615
|
+
else logger.error("No form was found to have that field so form navigation failed.");
|
|
1616
|
+
},
|
|
1617
|
+
registerFieldAction,
|
|
1618
|
+
unregisterFieldAction,
|
|
1619
|
+
getFieldAction
|
|
1620
|
+
}), [
|
|
1621
|
+
setFormIndex,
|
|
1622
|
+
goToFormByFormId,
|
|
1623
|
+
registerFieldAction,
|
|
1624
|
+
unregisterFieldAction,
|
|
1625
|
+
getFieldAction,
|
|
1626
|
+
forms
|
|
1627
|
+
]);
|
|
1628
|
+
return /* @__PURE__ */ jsx(FormRouterContext.Provider, {
|
|
1629
|
+
value: contextValue,
|
|
1630
|
+
children
|
|
1631
|
+
});
|
|
1632
|
+
}
|
|
1633
|
+
var FormFlow_module_default = {
|
|
1634
|
+
"form-flow": "_form-flow_1eou7_1",
|
|
1635
|
+
formFlow: "_form-flow_1eou7_1",
|
|
1636
|
+
"form-flow-content": "_form-flow-content_1eou7_9",
|
|
1637
|
+
formFlowContent: "_form-flow-content_1eou7_9",
|
|
1638
|
+
"form-flow-footer": "_form-flow-footer_1eou7_30",
|
|
1639
|
+
formFlowFooter: "_form-flow-footer_1eou7_30",
|
|
1640
|
+
"form-flow-footer-border": "_form-flow-footer-border_1eou7_45",
|
|
1641
|
+
formFlowFooterBorder: "_form-flow-footer-border_1eou7_45",
|
|
1642
|
+
"form-flow-actions": "_form-flow-actions_1eou7_49",
|
|
1643
|
+
formFlowActions: "_form-flow-actions_1eou7_49",
|
|
1644
|
+
"form-flow-primary-actions": "_form-flow-primary-actions_1eou7_56",
|
|
1645
|
+
formFlowPrimaryActions: "_form-flow-primary-actions_1eou7_56"
|
|
1646
|
+
};
|
|
1647
|
+
//#endregion
|
|
1648
|
+
//#region src/components/Shared/FormFlow/FormFlow.tsx
|
|
1649
|
+
var FormFlow = ({ asModal = false, children, currentStep = 0, disableBackButton, disableNextButton, nextButtonLoading = false, forms, activeForm, gotoFormByFormIndex, gotoFormByFormId, handleBackClick, handleCancelClick, handleNextClick, loadingStatus, summary, summaryComponent, totalSteps = 1, isGlobalEntry = false }) => {
|
|
1650
|
+
const contentRef = useRef$1(null);
|
|
1651
|
+
const userEvents = useAnalyticsContext();
|
|
1652
|
+
const { t } = useTranslation("common");
|
|
1653
|
+
const [isConfirmPresented, setIsConfirmPresented] = useState$1(false);
|
|
1654
|
+
const [isSubmitting, setIsSubmitting] = useState$1(false);
|
|
1655
|
+
const isActionDisabled = isSubmitting || isConfirmPresented || loadingStatus === "loading";
|
|
1656
|
+
const hasBackButton = !!handleBackClick;
|
|
1657
|
+
const hasCancelButton = !!handleCancelClick;
|
|
1658
|
+
const isFirstStep = currentStep === 0;
|
|
1659
|
+
const isLastStep = currentStep === totalSteps - 1;
|
|
1660
|
+
const isSingleStepForm = totalSteps < 2;
|
|
1661
|
+
const progress = Math.floor(currentStep / (totalSteps - 1) * 100);
|
|
1662
|
+
const scrollToTop = () => {
|
|
1663
|
+
if (contentRef.current) contentRef.current.scroll({
|
|
1664
|
+
top: 0,
|
|
1665
|
+
behavior: "smooth"
|
|
1666
|
+
});
|
|
1667
|
+
};
|
|
1668
|
+
const handleSubmit = () => {
|
|
1669
|
+
setIsSubmitting(true);
|
|
1670
|
+
Promise.resolve(handleNextClick()).then(() => {
|
|
1671
|
+
setIsSubmitting(false);
|
|
1672
|
+
scrollToTop();
|
|
1673
|
+
});
|
|
1674
|
+
};
|
|
1675
|
+
const handleNext = () => {
|
|
1676
|
+
scrollToTop();
|
|
1677
|
+
handleNextClick();
|
|
1678
|
+
};
|
|
1679
|
+
const handleBack = () => {
|
|
1680
|
+
scrollToTop();
|
|
1681
|
+
handleBackClick?.();
|
|
1682
|
+
};
|
|
1683
|
+
const handleDismiss = () => {
|
|
1684
|
+
if (!hasCancelButton) return;
|
|
1685
|
+
setIsConfirmPresented(true);
|
|
1686
|
+
};
|
|
1687
|
+
const handleCancelDismiss = () => {
|
|
1688
|
+
userEvents.addPageEvent("Closed modal", {
|
|
1689
|
+
actionType: "close",
|
|
1690
|
+
label: "cancel"
|
|
1691
|
+
});
|
|
1692
|
+
setIsConfirmPresented(false);
|
|
1693
|
+
};
|
|
1694
|
+
const handleConfirmDismiss = () => {
|
|
1695
|
+
userEvents.addPageEvent("Clicked button", {
|
|
1696
|
+
actionType: "navigate",
|
|
1697
|
+
label: "leave"
|
|
1698
|
+
});
|
|
1699
|
+
setIsConfirmPresented(false);
|
|
1700
|
+
handleCancelClick?.();
|
|
1701
|
+
};
|
|
1702
|
+
const footerClassName = cx(FormFlow_module_default.formFlowFooter, { [FormFlow_module_default.formFlowFooterBorder]: isSingleStepForm });
|
|
1703
|
+
return /* @__PURE__ */ jsxs(MaybeModal, {
|
|
1704
|
+
inline: !asModal,
|
|
1705
|
+
onClose: handleDismiss,
|
|
1706
|
+
size: "large",
|
|
1707
|
+
showCloseButton: hasCancelButton,
|
|
1708
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
1709
|
+
ref: contentRef,
|
|
1710
|
+
className: FormFlow_module_default.formFlow,
|
|
1711
|
+
"data-form-valid": activeForm.isValid,
|
|
1712
|
+
"data-testid": "form-flow",
|
|
1713
|
+
children: [/* @__PURE__ */ jsx("div", {
|
|
1714
|
+
className: FormFlow_module_default.formFlowContent,
|
|
1715
|
+
children: /* @__PURE__ */ jsx(LoaderWrapper, {
|
|
1716
|
+
status: loadingStatus,
|
|
1717
|
+
formOpacityWhenLoading: 0,
|
|
1718
|
+
loaderSize: "large",
|
|
1719
|
+
children: /* @__PURE__ */ jsx(FormRouterContextProvider, {
|
|
1720
|
+
forms,
|
|
1721
|
+
setFormIndex: gotoFormByFormIndex,
|
|
1722
|
+
goToFormByFormId: gotoFormByFormId,
|
|
1723
|
+
children: isLastStep ? summaryComponent ? summaryComponent : summary !== void 0 ? /* @__PURE__ */ jsx(Summary, {
|
|
1724
|
+
...summary,
|
|
1725
|
+
forms,
|
|
1726
|
+
gotoForm: gotoFormByFormIndex
|
|
1727
|
+
}) : children : children
|
|
1728
|
+
})
|
|
1729
|
+
})
|
|
1730
|
+
}), /* @__PURE__ */ jsxs("div", {
|
|
1731
|
+
className: footerClassName,
|
|
1732
|
+
children: [!isSingleStepForm && /* @__PURE__ */ jsx(ProgressBar, {
|
|
1733
|
+
ariaLabel: t(($) => $["progress"]),
|
|
1734
|
+
progress
|
|
1735
|
+
}), /* @__PURE__ */ jsxs("div", {
|
|
1736
|
+
className: FormFlow_module_default.formFlowActions,
|
|
1737
|
+
children: [
|
|
1738
|
+
isFirstStep && hasCancelButton && /* @__PURE__ */ jsx(Button, {
|
|
1739
|
+
disabled: isActionDisabled || disableBackButton,
|
|
1740
|
+
onClick: handleDismiss,
|
|
1741
|
+
variant: "secondary",
|
|
1742
|
+
children: t(($) => $["cancel"])
|
|
1743
|
+
}),
|
|
1744
|
+
!isFirstStep && hasBackButton && /* @__PURE__ */ jsx(Button, {
|
|
1745
|
+
disabled: isActionDisabled || disableBackButton,
|
|
1746
|
+
icon: "chevron-left",
|
|
1747
|
+
onClick: handleBack,
|
|
1748
|
+
variant: "secondary",
|
|
1749
|
+
children: t(($) => $["back"])
|
|
1750
|
+
}),
|
|
1751
|
+
/* @__PURE__ */ jsx("div", {
|
|
1752
|
+
className: FormFlow_module_default.formFlowPrimaryActions,
|
|
1753
|
+
children: isLastStep && !isGlobalEntry ? /* @__PURE__ */ jsx(Button, {
|
|
1754
|
+
onClick: handleSubmit,
|
|
1755
|
+
loading: isSubmitting,
|
|
1756
|
+
children: t(($) => $["submit"])
|
|
1757
|
+
}) : /* @__PURE__ */ jsx(Button, {
|
|
1758
|
+
onClick: handleNext,
|
|
1759
|
+
disabled: isActionDisabled || disableNextButton,
|
|
1760
|
+
loading: nextButtonLoading,
|
|
1761
|
+
children: t(($) => $["continue"])
|
|
1762
|
+
})
|
|
1763
|
+
})
|
|
1764
|
+
]
|
|
1765
|
+
})]
|
|
1766
|
+
})]
|
|
1767
|
+
}), isConfirmPresented && /* @__PURE__ */ jsx(Confirm, {
|
|
1768
|
+
confirmText: t(($) => $["leave"]),
|
|
1769
|
+
description: t(($) => $["unsavedChangesDescription"]),
|
|
1770
|
+
onCancel: handleCancelDismiss,
|
|
1771
|
+
onConfirm: handleConfirmDismiss,
|
|
1772
|
+
title: t(($) => $["unsavedChanges"])
|
|
1773
|
+
})]
|
|
1774
|
+
});
|
|
1775
|
+
};
|
|
1776
|
+
//#endregion
|
|
1777
|
+
//#region src/context/FormContext/useFormContext.ts
|
|
1778
|
+
function useFormContext() {
|
|
1779
|
+
return useContext$1(FormContext);
|
|
1780
|
+
}
|
|
1781
|
+
//#endregion
|
|
1782
|
+
//#region src/utils/validationError.ts
|
|
1783
|
+
var API_VALIDATION_ERROR_CODE = "30_102";
|
|
1784
|
+
var ID_DOCUMENT_UPLOAD_ERROR_CODE = "30_105";
|
|
1785
|
+
var BANK_STATEMENT_UPLOAD_ERROR_CODE = "30_106";
|
|
1786
|
+
var CreateOrUpdateTransferInstrumentErrorMessage = { TRANSFER_INSTRUMENT_LIMIT_HAS_ALREADY_BEEN_MET: "Transfer instrument limit has already been met" };
|
|
1787
|
+
var validateErrorCode = (error, errorCode) => !!error && typeof error === "object" && "errorCode" in error && error.errorCode === errorCode;
|
|
1788
|
+
var isValidationError = (error) => validateErrorCode(error, API_VALIDATION_ERROR_CODE);
|
|
1789
|
+
var isIdDocumentUploadError = (error) => validateErrorCode(error, ID_DOCUMENT_UPLOAD_ERROR_CODE);
|
|
1790
|
+
var isBankStatementUploadError = (error) => validateErrorCode(error, BANK_STATEMENT_UPLOAD_ERROR_CODE);
|
|
1791
|
+
var isBusinessSelectionLegalArrangementError = (error) => {
|
|
1792
|
+
return typeof error === "object" && error.invalidFields?.length > 0 && error.invalidFields[0].name === "type";
|
|
1793
|
+
};
|
|
1794
|
+
var isRecord = (value) => !!value && typeof value === "object";
|
|
1795
|
+
var isValidationErrorCandidate = (value) => isRecord(value) && (value.errorCode === API_VALIDATION_ERROR_CODE || Array.isArray(value.invalidFields));
|
|
1796
|
+
var getSourceError = (value) => {
|
|
1797
|
+
if (!isRecord(value) || !isValidationErrorCandidate(value.sourceError)) return;
|
|
1798
|
+
return value.sourceError;
|
|
1799
|
+
};
|
|
1800
|
+
var getValidationError = (error) => {
|
|
1801
|
+
if (isRecord(error) && isValidationErrorCandidate(error.actualError)) return {
|
|
1802
|
+
...error.actualError,
|
|
1803
|
+
sourceError: getSourceError(error.actualError)
|
|
1804
|
+
};
|
|
1805
|
+
if (isValidationErrorCandidate(error)) return {
|
|
1806
|
+
...error,
|
|
1807
|
+
sourceError: getSourceError(error)
|
|
1808
|
+
};
|
|
1809
|
+
if (isRecord(error) && isValidationErrorCandidate(error.sourceError)) return { sourceError: error.sourceError };
|
|
1810
|
+
};
|
|
1811
|
+
var getInvalidFieldDisplayMessages = (invalidFields) => invalidFields?.map((field) => {
|
|
1812
|
+
if (!field.message) return;
|
|
1813
|
+
return field.name ? `${getFieldNameFromPath(field.name)}: ${field.message}` : field.message;
|
|
1814
|
+
}).filter((message) => Boolean(message)) ?? [];
|
|
1815
|
+
var getValidationErrorDisplayMessages = (error) => {
|
|
1816
|
+
const validationError = getValidationError(error);
|
|
1817
|
+
if (!validationError) return [];
|
|
1818
|
+
const invalidFieldMessages = [...getInvalidFieldDisplayMessages(validationError.invalidFields), ...getInvalidFieldDisplayMessages(validationError.sourceError?.invalidFields)];
|
|
1819
|
+
if (invalidFieldMessages.length) return invalidFieldMessages;
|
|
1820
|
+
const fallbackMessage = validationError.detail || validationError.sourceError?.detail || validationError.title || validationError.sourceError?.title;
|
|
1821
|
+
return fallbackMessage ? [fallbackMessage] : [];
|
|
1822
|
+
};
|
|
1823
|
+
var mapCreateOrUpdateTransferInstrumentErrorMessageToTranslatable = (error) => {
|
|
1824
|
+
if (!error) return "failedToUpdateDetails";
|
|
1825
|
+
switch (error?.sourceError?.detail) {
|
|
1826
|
+
case CreateOrUpdateTransferInstrumentErrorMessage.TRANSFER_INSTRUMENT_LIMIT_HAS_ALREADY_BEEN_MET: return "transferInstrumentLimitHasAlreadyBeenMet";
|
|
1827
|
+
default: return "failedToUpdateDetails";
|
|
1828
|
+
}
|
|
1829
|
+
};
|
|
1830
|
+
//#endregion
|
|
1831
|
+
//#region src/components/Shared/fields/CountryField/CountryField.tsx
|
|
1832
|
+
var COUNTRY_FIELD = ["country"];
|
|
1833
|
+
function CountryField({ name = "country", data, valid, errors, labels, readonly, handleChangeFor, helperText, allowedCountries, handleBlur }) {
|
|
1834
|
+
const { t } = useTranslation("common");
|
|
1835
|
+
const { dataset: countriesFromApi } = useDataset(datasetIdentifier.country);
|
|
1836
|
+
const countries = useMemo$1(() => countriesFromApi.filter((country) => allowedCountries ? allowedCountries.includes(country.id) : true), [allowedCountries, countriesFromApi]);
|
|
1837
|
+
return /* @__PURE__ */ jsx(Field, {
|
|
1838
|
+
name,
|
|
1839
|
+
label: labels?.country || t(($) => $["country"]),
|
|
1840
|
+
errorMessage: errors.country,
|
|
1841
|
+
isValid: valid.country,
|
|
1842
|
+
helper: helperText,
|
|
1843
|
+
dataTestId: "country",
|
|
1844
|
+
children: (childProps) => /* @__PURE__ */ jsx(Select, {
|
|
1845
|
+
...childProps,
|
|
1846
|
+
name,
|
|
1847
|
+
placeholder: t(($) => $["selectCountryRegion"]),
|
|
1848
|
+
selected: data.country,
|
|
1849
|
+
items: countries,
|
|
1850
|
+
readonly: (countries.length === 1 || readonly) && !!data,
|
|
1851
|
+
onChange: handleChangeFor("country"),
|
|
1852
|
+
onBlur: handleBlur
|
|
1853
|
+
})
|
|
1854
|
+
});
|
|
1855
|
+
}
|
|
1856
|
+
//#endregion
|
|
1857
|
+
//#region src/utils/masking/displayValueToPureValue.ts
|
|
1858
|
+
var cachedStripPatterns = /* @__PURE__ */ new Map();
|
|
1859
|
+
var makeStripPattern = (mask) => {
|
|
1860
|
+
const inputPatterns = mask.tokens.filter((token) => token.type === "input" && !!token.allow).map((token) => token.allow);
|
|
1861
|
+
const nonInputChars = mask.tokens.filter((token) => token.type === "nonInput" && !token.includeInValue).map((token) => token.char);
|
|
1862
|
+
const strippedChars = [...new Set(nonInputChars.filter((char) => !inputPatterns.some((pattern) => pattern.test(char))))];
|
|
1863
|
+
const stripPattern = new RegExp(`[${strippedChars.join("")}]`, "g");
|
|
1864
|
+
cachedStripPatterns.set(mask, stripPattern);
|
|
1865
|
+
return stripPattern;
|
|
1866
|
+
};
|
|
1867
|
+
/**
|
|
1868
|
+
* Takes a formatted value and converts it back into a pure value by stripping the non-input /
|
|
1869
|
+
* non-included characters in a given {@link Mask}.
|
|
1870
|
+
*
|
|
1871
|
+
* This is the inverse of {@link matchAgainstMask}.
|
|
1872
|
+
*
|
|
1873
|
+
* @see matchAgainstMask
|
|
1874
|
+
*/
|
|
1875
|
+
var displayValueToPureValue = (displayValue, mask) => {
|
|
1876
|
+
const stripPattern = cachedStripPatterns.get(mask) ?? makeStripPattern(mask);
|
|
1877
|
+
return displayValue.replaceAll(stripPattern, "");
|
|
1878
|
+
};
|
|
1879
|
+
//#endregion
|
|
1880
|
+
//#region src/utils/isValueObscured.ts
|
|
1881
|
+
var isValueObscured = (value) => typeof value === "string" && !!value.match(/[*]{1,}/)?.length;
|
|
1882
|
+
//#endregion
|
|
1883
|
+
//#region src/utils/masking/stripNonAllowedValues.ts
|
|
1884
|
+
var cachedAllowedPatterns = /* @__PURE__ */ new Map();
|
|
1885
|
+
/**
|
|
1886
|
+
* Creates a regular expression that matches any of the provided patterns.
|
|
1887
|
+
*
|
|
1888
|
+
* @param regexArray - An array of regular expressions.
|
|
1889
|
+
* @returns A combined regular expression.
|
|
1890
|
+
*/
|
|
1891
|
+
var combineRegexArray = (regexArray) => {
|
|
1892
|
+
const combinedPattern = regexArray.map((pattern) => {
|
|
1893
|
+
const match = String(pattern).match(/\/?(.*)\//);
|
|
1894
|
+
return match ? match[1] : pattern;
|
|
1895
|
+
}).join("|");
|
|
1896
|
+
return new RegExp(`(?:${combinedPattern})`, "g");
|
|
1897
|
+
};
|
|
1898
|
+
/**
|
|
1899
|
+
* Creates a regular expression that matches the allowed input patterns for the given mask.
|
|
1900
|
+
*
|
|
1901
|
+
* @param mask - The mask definition.
|
|
1902
|
+
* @returns The compiled regular expression.
|
|
1903
|
+
*/
|
|
1904
|
+
var createAllowedPattern = (mask) => {
|
|
1905
|
+
const inputPatterns = mask.tokens.filter((token) => token.type === "input" && !!token.allow).map((token) => token.allow);
|
|
1906
|
+
const allowedRegex = combineRegexArray([...new Set(inputPatterns.map((r) => r.toString()))].map((str) => {
|
|
1907
|
+
const [_, pattern] = str.match(/\/(.*)\/([gimsuy]*)/) || [];
|
|
1908
|
+
return new RegExp(pattern);
|
|
1909
|
+
}));
|
|
1910
|
+
cachedAllowedPatterns.set(mask, allowedRegex);
|
|
1911
|
+
return allowedRegex;
|
|
1912
|
+
};
|
|
1913
|
+
var replaceNonMatchingChars = (value, allowedInputPatterns) => {
|
|
1914
|
+
const matches = value.match(allowedInputPatterns);
|
|
1915
|
+
return matches ? matches.join("") : "";
|
|
1916
|
+
};
|
|
1917
|
+
var stripNonAllowedValues = (pureValue, mask) => {
|
|
1918
|
+
return replaceNonMatchingChars(pureValue, cachedAllowedPatterns.get(mask) ?? createAllowedPattern(mask));
|
|
1919
|
+
};
|
|
1920
|
+
//#endregion
|
|
1921
|
+
//#region src/utils/masking/matchAgainstMask.ts
|
|
1922
|
+
var getAvailableInputTokens = (tokens) => {
|
|
1923
|
+
const availableTokens = [];
|
|
1924
|
+
for (const token of tokens) {
|
|
1925
|
+
if (token.type === "nonInput") {
|
|
1926
|
+
if (token.includeInValue) availableTokens.push({
|
|
1927
|
+
...token,
|
|
1928
|
+
offset: tokens.indexOf(token)
|
|
1929
|
+
});
|
|
1930
|
+
continue;
|
|
1931
|
+
}
|
|
1932
|
+
availableTokens.push({
|
|
1933
|
+
...token,
|
|
1934
|
+
offset: tokens.indexOf(token)
|
|
1935
|
+
});
|
|
1936
|
+
if (token.type !== "input" || !token.optional) break;
|
|
1937
|
+
}
|
|
1938
|
+
return availableTokens;
|
|
1939
|
+
};
|
|
1940
|
+
var findMatchingToken = (tokensWithOffset, char) => tokensWithOffset.find((token) => token.type === "nonInput" || !token.allow || token.allow.test(char)) ?? null;
|
|
1941
|
+
var getEagerSuffix = (tokens) => {
|
|
1942
|
+
let suffix = "";
|
|
1943
|
+
for (const token of tokens) {
|
|
1944
|
+
if (token.type === "input") {
|
|
1945
|
+
if (token.optional) continue;
|
|
1946
|
+
else break;
|
|
1947
|
+
}
|
|
1948
|
+
if (!token.displayEagerly) break;
|
|
1949
|
+
suffix += token.char;
|
|
1950
|
+
}
|
|
1951
|
+
return suffix;
|
|
1952
|
+
};
|
|
1953
|
+
var getPotentialForMoreOptionalInput = (tokens) => tokens.some((token) => token.type === "input" && token.optional);
|
|
1954
|
+
/**
|
|
1955
|
+
* Takes some pure value e.g. `NL123456` and a {@link Mask}, and returns a `partialCorrect`,
|
|
1956
|
+
* `correct` or `mismatch` {@link MaskResult} accordingly.
|
|
1957
|
+
*
|
|
1958
|
+
* This is the inverse of {@link displayValueToPureValue}.
|
|
1959
|
+
*
|
|
1960
|
+
* @returns the result of matching the given value against the mask
|
|
1961
|
+
* @param pureValue the pure, unformatted input value
|
|
1962
|
+
* @param mask the mask to match against
|
|
1963
|
+
* @param acceptObscuredValue whether to accept
|
|
1964
|
+
*
|
|
1965
|
+
* @see displayValueToPureValue
|
|
1966
|
+
*/
|
|
1967
|
+
var matchAgainstMask = (pureValue, mask, acceptObscuredValue = false, stripNonAllowedInputs = false) => {
|
|
1968
|
+
let tokensToProcess = [...mask.tokens];
|
|
1969
|
+
let charsToProcess = pureValue;
|
|
1970
|
+
let charIndex = 0;
|
|
1971
|
+
let matchedTokens = [];
|
|
1972
|
+
if (acceptObscuredValue && isValueObscured(pureValue)) return {
|
|
1973
|
+
outcome: "obscureCorrect",
|
|
1974
|
+
displayValue: pureValue
|
|
1975
|
+
};
|
|
1976
|
+
const shiftChars = (increment) => {
|
|
1977
|
+
charIndex += increment;
|
|
1978
|
+
charsToProcess = charsToProcess.slice(increment);
|
|
1979
|
+
};
|
|
1980
|
+
const shiftTokens = (increment) => {
|
|
1981
|
+
tokensToProcess = tokensToProcess.slice(increment);
|
|
1982
|
+
};
|
|
1983
|
+
const displayValue = () => matchedTokens.map((token) => token.char).join("");
|
|
1984
|
+
const getNonInputCharacters = () => matchedTokens.filter((token) => token.type === "nonInput" && token.includeInValue === false).map((token) => token.char).join("");
|
|
1985
|
+
while (true) {
|
|
1986
|
+
let partialDisplayValue = displayValue();
|
|
1987
|
+
if (stripNonAllowedInputs) {
|
|
1988
|
+
partialDisplayValue = partialDisplayValue.replaceAll(getNonInputCharacters(), "");
|
|
1989
|
+
if (!partialDisplayValue.length) partialDisplayValue = stripNonAllowedValues(charsToProcess, mask);
|
|
1990
|
+
}
|
|
1991
|
+
const char = charsToProcess[0];
|
|
1992
|
+
const token = tokensToProcess[0];
|
|
1993
|
+
if (!char && !tokensToProcess.some((t) => t.type === "input" && !t.optional)) return {
|
|
1994
|
+
outcome: "correct",
|
|
1995
|
+
displayValue: displayValue() + getEagerSuffix(tokensToProcess),
|
|
1996
|
+
potentialForMoreOptionalInput: getPotentialForMoreOptionalInput(tokensToProcess)
|
|
1997
|
+
};
|
|
1998
|
+
if (!char) {
|
|
1999
|
+
const output = shiftRight(mask.possibleShifts, matchedTokens, tokensToProcess);
|
|
2000
|
+
matchedTokens = output.matchedTokens;
|
|
2001
|
+
tokensToProcess = output.remainingTokens;
|
|
2002
|
+
return {
|
|
2003
|
+
outcome: "partialCorrect",
|
|
2004
|
+
displayValue: displayValue() + getEagerSuffix(tokensToProcess)
|
|
2005
|
+
};
|
|
2006
|
+
}
|
|
2007
|
+
if (!token) return {
|
|
2008
|
+
outcome: "mismatch",
|
|
2009
|
+
badChar: char,
|
|
2010
|
+
mismatchAtChar: charIndex,
|
|
2011
|
+
mismatchedToken: "inputTooLong",
|
|
2012
|
+
partialDisplayValue
|
|
2013
|
+
};
|
|
2014
|
+
if (token.type === "nonInput") {
|
|
2015
|
+
if (token.includeInValue) {
|
|
2016
|
+
if (char !== token.char) return {
|
|
2017
|
+
outcome: "mismatch",
|
|
2018
|
+
badChar: char,
|
|
2019
|
+
mismatchAtChar: charIndex,
|
|
2020
|
+
mismatchedToken: token,
|
|
2021
|
+
partialDisplayValue
|
|
2022
|
+
};
|
|
2023
|
+
shiftChars(1);
|
|
2024
|
+
}
|
|
2025
|
+
matchedTokens.push(token);
|
|
2026
|
+
shiftTokens(1);
|
|
2027
|
+
}
|
|
2028
|
+
if (token.type === "input") {
|
|
2029
|
+
const matchingToken = findMatchingToken(getAvailableInputTokens(tokensToProcess), char);
|
|
2030
|
+
if (!matchingToken) return {
|
|
2031
|
+
outcome: "mismatch",
|
|
2032
|
+
badChar: char,
|
|
2033
|
+
mismatchAtChar: charIndex,
|
|
2034
|
+
mismatchedToken: token,
|
|
2035
|
+
partialDisplayValue
|
|
2036
|
+
};
|
|
2037
|
+
matchedTokens.push({
|
|
2038
|
+
...matchingToken,
|
|
2039
|
+
char
|
|
2040
|
+
});
|
|
2041
|
+
shiftTokens(matchingToken.offset + 1);
|
|
2042
|
+
shiftChars(1);
|
|
2043
|
+
}
|
|
2044
|
+
}
|
|
2045
|
+
};
|
|
2046
|
+
//#endregion
|
|
2047
|
+
//#region src/components/ui/molecules/InputEmail/InputEmail.tsx
|
|
2048
|
+
var InputEmail = forwardRef(({ onInput, transformInput, ...props }, ref) => {
|
|
2049
|
+
const [cursorPosition, setCursorPosition] = useState$1(null);
|
|
2050
|
+
const localRef = useForwardedRef(ref);
|
|
2051
|
+
const inputHandler = useCallback$1((event) => {
|
|
2052
|
+
const inputEl = event.currentTarget;
|
|
2053
|
+
if (transformInput) {
|
|
2054
|
+
setCursorPosition(inputEl.selectionStart);
|
|
2055
|
+
const transformedInput = transformInput(inputEl.value);
|
|
2056
|
+
onInput({
|
|
2057
|
+
...event,
|
|
2058
|
+
target: {
|
|
2059
|
+
...event.target,
|
|
2060
|
+
value: transformedInput
|
|
2061
|
+
}
|
|
2062
|
+
});
|
|
2063
|
+
} else onInput(event);
|
|
2064
|
+
}, [transformInput, onInput]);
|
|
2065
|
+
useLayoutEffect(() => {
|
|
2066
|
+
if (cursorPosition && localRef.current?.selectionStart !== cursorPosition) localRef?.current?.setSelectionRange(cursorPosition, cursorPosition, "none");
|
|
2067
|
+
}, [cursorPosition, localRef]);
|
|
2068
|
+
return /* @__PURE__ */ jsx(InputBase, {
|
|
2069
|
+
...props,
|
|
2070
|
+
onInput: inputHandler,
|
|
2071
|
+
ref: localRef,
|
|
2072
|
+
type: "email",
|
|
2073
|
+
autoCapitalize: "off"
|
|
2074
|
+
});
|
|
2075
|
+
});
|
|
2076
|
+
//#endregion
|
|
2077
|
+
//#region src/components/ui/molecules/InputTelephone/InputTelephone.tsx
|
|
2078
|
+
var InputTelephone = forwardRef(({ onInput, transformInput, ...props }, ref) => {
|
|
2079
|
+
const [cursorPosition, setCursorPosition] = useState$1(null);
|
|
2080
|
+
const localRef = useForwardedRef(ref);
|
|
2081
|
+
const inputHandler = useCallback$1((event) => {
|
|
2082
|
+
const inputEl = event.currentTarget;
|
|
2083
|
+
if (transformInput) {
|
|
2084
|
+
setCursorPosition(inputEl.selectionStart);
|
|
2085
|
+
const transformedInput = transformInput(inputEl.value);
|
|
2086
|
+
onInput({
|
|
2087
|
+
...event,
|
|
2088
|
+
target: {
|
|
2089
|
+
...event.target,
|
|
2090
|
+
value: transformedInput
|
|
2091
|
+
}
|
|
2092
|
+
});
|
|
2093
|
+
} else onInput(event);
|
|
2094
|
+
}, [transformInput, onInput]);
|
|
2095
|
+
useLayoutEffect(() => {
|
|
2096
|
+
if (cursorPosition && localRef.current?.selectionStart !== cursorPosition) localRef?.current?.setSelectionRange(cursorPosition, cursorPosition, "none");
|
|
2097
|
+
}, [cursorPosition, localRef]);
|
|
2098
|
+
return /* @__PURE__ */ jsx(InputBase, {
|
|
2099
|
+
...props,
|
|
2100
|
+
onInput: inputHandler,
|
|
2101
|
+
ref: localRef,
|
|
2102
|
+
type: "tel"
|
|
2103
|
+
});
|
|
2104
|
+
});
|
|
2105
|
+
var MaskedInput_module_default = {
|
|
2106
|
+
mismatch: "_mismatch_nyvqg_1",
|
|
2107
|
+
mismatchShake: "_mismatchShake_nyvqg_1"
|
|
2108
|
+
};
|
|
2109
|
+
//#endregion
|
|
2110
|
+
//#region src/components/ui/molecules/MaskedInput/MaskedInput.tsx
|
|
2111
|
+
var deriveInputState = (isValid, isFocused, isDisabled, isOptional, hasNullishValue, hasBlurred, errorMessage, shouldValidate, potentiallyMoreOptionalCharacters, formatGuidance, t) => {
|
|
2112
|
+
if (isDisabled) return { isError: false };
|
|
2113
|
+
if (isOptional && hasNullishValue) return { isError: false };
|
|
2114
|
+
if (isValid && (!potentiallyMoreOptionalCharacters || !isFocused)) return {
|
|
2115
|
+
isError: false,
|
|
2116
|
+
text: /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Icon, {
|
|
2117
|
+
name: "checkmark-small",
|
|
2118
|
+
className: "adyen-kyc-helper-text__valid-format-check"
|
|
2119
|
+
}), t(($) => $["formatIsCorrect"])] })
|
|
2120
|
+
};
|
|
2121
|
+
if (isFocused && formatGuidance) return {
|
|
2122
|
+
isError: false,
|
|
2123
|
+
text: formatGuidance
|
|
2124
|
+
};
|
|
2125
|
+
if (!isValid && (shouldValidate || hasBlurred)) return {
|
|
2126
|
+
isError: true,
|
|
2127
|
+
errorMessage,
|
|
2128
|
+
text: formatGuidance
|
|
2129
|
+
};
|
|
2130
|
+
return { isError: false };
|
|
2131
|
+
};
|
|
2132
|
+
var MISMATCH_ANIMATION_NAME = "mismatchShake";
|
|
2133
|
+
var Inner = ({ name, inputState, optional, disabled, readonly, placeholder, displayValue, inputRef, type, id, showingMismatch, onInput, onBlur, onFocus, onPaste, onKeyDown, ...props }) => {
|
|
2134
|
+
switch (type) {
|
|
2135
|
+
case "text": return /* @__PURE__ */ jsx(InputText, {
|
|
2136
|
+
id,
|
|
2137
|
+
"aria-describedby": props["aria-describedby"],
|
|
2138
|
+
"aria-label": props["aria-label"],
|
|
2139
|
+
"aria-labelledby": props["aria-labelledby"],
|
|
2140
|
+
"aria-invalid": inputState.isError,
|
|
2141
|
+
"aria-placeholder": placeholder,
|
|
2142
|
+
ref: inputRef,
|
|
2143
|
+
name,
|
|
2144
|
+
isValid: !inputState.isError,
|
|
2145
|
+
isInvalid: inputState.isError,
|
|
2146
|
+
required: !optional,
|
|
2147
|
+
disabled,
|
|
2148
|
+
readonly,
|
|
2149
|
+
placeholder,
|
|
2150
|
+
value: displayValue,
|
|
2151
|
+
className: showingMismatch ? MaskedInput_module_default.mismatch : void 0,
|
|
2152
|
+
onInput,
|
|
2153
|
+
onPaste,
|
|
2154
|
+
onKeyDown,
|
|
2155
|
+
onFocusHandler: onFocus,
|
|
2156
|
+
onBlurHandler: onBlur
|
|
2157
|
+
});
|
|
2158
|
+
case "email": return /* @__PURE__ */ jsx(InputEmail, {
|
|
2159
|
+
id,
|
|
2160
|
+
"aria-describedby": props["aria-describedby"],
|
|
2161
|
+
"aria-label": props["aria-label"],
|
|
2162
|
+
"aria-labelledby": props["aria-labelledby"],
|
|
2163
|
+
"aria-invalid": inputState.isError,
|
|
2164
|
+
"aria-placeholder": placeholder,
|
|
2165
|
+
ref: inputRef,
|
|
2166
|
+
name,
|
|
2167
|
+
isValid: !inputState.isError,
|
|
2168
|
+
isInvalid: inputState.isError,
|
|
2169
|
+
required: !optional,
|
|
2170
|
+
disabled,
|
|
2171
|
+
readonly,
|
|
2172
|
+
placeholder,
|
|
2173
|
+
value: displayValue,
|
|
2174
|
+
onInput,
|
|
2175
|
+
onPaste,
|
|
2176
|
+
onKeyDown,
|
|
2177
|
+
onFocusHandler: onFocus,
|
|
2178
|
+
onBlurHandler: onBlur
|
|
2179
|
+
});
|
|
2180
|
+
case "tel": return /* @__PURE__ */ jsx(InputTelephone, {
|
|
2181
|
+
id,
|
|
2182
|
+
"aria-describedby": props["aria-describedby"],
|
|
2183
|
+
"aria-label": props["aria-label"],
|
|
2184
|
+
"aria-labelledby": props["aria-labelledby"],
|
|
2185
|
+
"aria-invalid": inputState.isError,
|
|
2186
|
+
"aria-placeholder": placeholder,
|
|
2187
|
+
ref: inputRef,
|
|
2188
|
+
name,
|
|
2189
|
+
isValid: !inputState.isError,
|
|
2190
|
+
isInvalid: inputState.isError,
|
|
2191
|
+
required: !optional,
|
|
2192
|
+
disabled,
|
|
2193
|
+
readonly,
|
|
2194
|
+
placeholder,
|
|
2195
|
+
value: displayValue,
|
|
2196
|
+
onInput,
|
|
2197
|
+
onPaste,
|
|
2198
|
+
onKeyDown,
|
|
2199
|
+
onFocusHandler: onFocus,
|
|
2200
|
+
onBlurHandler: onBlur
|
|
2201
|
+
});
|
|
2202
|
+
}
|
|
2203
|
+
};
|
|
2204
|
+
var MaskedInput = ({ value, onInput, onBlur, onFocus, onMismatch: onMismatchExternal, isValid: validationIsValid, errorMessage, shouldValidate, mask, name, label, placeholder, transformOnType, type = "text", readonly = false, disabled = false, optional = false, formatGuidance = "", acceptObscuredValue = false, helper, helperPosition = "below", persistHelper = false, useFieldComponent = true, stripNonAllowedInputs = false }) => {
|
|
2205
|
+
const hasExistingData = !isEmpty(value);
|
|
2206
|
+
const [preservingMismatchedValue, setPreservingMismatchedValue] = useState$1(false);
|
|
2207
|
+
const [isFocused, setIsFocused] = useState$1(false);
|
|
2208
|
+
const [hasBlurred, setHasBlurred] = useState$1(hasExistingData);
|
|
2209
|
+
const [caretReturnPosition, setCaretReturnPosition] = useState$1(null);
|
|
2210
|
+
const inputRef = useRef$1(null);
|
|
2211
|
+
const [showingMismatch, setShowingMismatch] = useState$1(false);
|
|
2212
|
+
const { t } = useTranslation("ui");
|
|
2213
|
+
const onAnimationEnd = (event) => {
|
|
2214
|
+
if (!event.animationName.includes(MISMATCH_ANIMATION_NAME)) return;
|
|
2215
|
+
setShowingMismatch(false);
|
|
2216
|
+
};
|
|
2217
|
+
const onMismatch = useCallback$1((mismatch) => {
|
|
2218
|
+
if (!inputRef.current) return;
|
|
2219
|
+
setShowingMismatch(true);
|
|
2220
|
+
inputRef.current.addEventListener("animationend", onAnimationEnd);
|
|
2221
|
+
onMismatchExternal?.(mismatch);
|
|
2222
|
+
}, [onMismatchExternal]);
|
|
2223
|
+
useEffect$1(() => {
|
|
2224
|
+
const inputEl = inputRef.current;
|
|
2225
|
+
if (inputEl) return () => {
|
|
2226
|
+
inputEl.removeEventListener("animationend", onAnimationEnd);
|
|
2227
|
+
};
|
|
2228
|
+
}, []);
|
|
2229
|
+
const getMaskResult = useCallback$1((pureValue) => {
|
|
2230
|
+
if (!mask) return {
|
|
2231
|
+
outcome: "partialCorrect",
|
|
2232
|
+
displayValue: pureValue
|
|
2233
|
+
};
|
|
2234
|
+
return matchAgainstMask(transformOnType ? transformOnType(pureValue) : pureValue, mask, acceptObscuredValue, stripNonAllowedInputs);
|
|
2235
|
+
}, [
|
|
2236
|
+
mask,
|
|
2237
|
+
transformOnType,
|
|
2238
|
+
acceptObscuredValue,
|
|
2239
|
+
stripNonAllowedInputs
|
|
2240
|
+
]);
|
|
2241
|
+
const displayValueToPure = useCallback$1((displayValue) => {
|
|
2242
|
+
if (!mask) return displayValue;
|
|
2243
|
+
return displayValueToPureValue(displayValue, mask);
|
|
2244
|
+
}, [mask]);
|
|
2245
|
+
const maskResult = useMemo$1(() => getMaskResult(value), [getMaskResult, value]);
|
|
2246
|
+
const displayValue = preservingMismatchedValue ? value : maskResult.outcome === "mismatch" ? maskResult.partialDisplayValue : maskResult.displayValue;
|
|
2247
|
+
const inputState = deriveInputState(validationIsValid && maskResult.outcome !== "mismatch", isFocused, disabled, optional, !displayValue, hasBlurred, errorMessage, shouldValidate, maskResult.outcome === "correct" && !!maskResult.potentialForMoreOptionalInput, formatGuidance, t);
|
|
2248
|
+
useEffect$1(() => {
|
|
2249
|
+
if (mask && maskResult.outcome === "mismatch") {
|
|
2250
|
+
const strippedValue = displayValueToPure(value);
|
|
2251
|
+
if (getMaskResult(strippedValue).outcome !== "mismatch") {
|
|
2252
|
+
onInput(strippedValue);
|
|
2253
|
+
return;
|
|
2254
|
+
}
|
|
2255
|
+
setPreservingMismatchedValue(true);
|
|
2256
|
+
if (stripNonAllowedInputs) onInput(maskResult.partialDisplayValue);
|
|
2257
|
+
}
|
|
2258
|
+
}, [
|
|
2259
|
+
mask,
|
|
2260
|
+
maskResult,
|
|
2261
|
+
value,
|
|
2262
|
+
onInput,
|
|
2263
|
+
displayValueToPure,
|
|
2264
|
+
getMaskResult,
|
|
2265
|
+
stripNonAllowedInputs
|
|
2266
|
+
]);
|
|
2267
|
+
useLayoutEffect(() => {
|
|
2268
|
+
if (caretReturnPosition && inputRef.current && caretReturnPosition !== inputRef.current.selectionStart) {
|
|
2269
|
+
inputRef.current.setSelectionRange(caretReturnPosition, caretReturnPosition, "none");
|
|
2270
|
+
setCaretReturnPosition(null);
|
|
2271
|
+
}
|
|
2272
|
+
}, [caretReturnPosition]);
|
|
2273
|
+
const handleInput = useCallback$1((event) => {
|
|
2274
|
+
const inputEl = event.currentTarget;
|
|
2275
|
+
if (!inputEl) return;
|
|
2276
|
+
const newPureValue = displayValueToPure(inputEl.value);
|
|
2277
|
+
const newMaskResult = getMaskResult(newPureValue);
|
|
2278
|
+
const returnCaretLater = (offset = 0) => {
|
|
2279
|
+
if (!inputEl.selectionStart) return;
|
|
2280
|
+
setCaretReturnPosition(inputEl.selectionStart + offset);
|
|
2281
|
+
};
|
|
2282
|
+
const cancelInput = () => {
|
|
2283
|
+
returnCaretLater(-1);
|
|
2284
|
+
inputEl.value = displayValue;
|
|
2285
|
+
if (typeof event.preventDefault === "function") {
|
|
2286
|
+
event.preventDefault();
|
|
2287
|
+
event.stopPropagation();
|
|
2288
|
+
}
|
|
2289
|
+
};
|
|
2290
|
+
if (newMaskResult.outcome === "mismatch") {
|
|
2291
|
+
if (newMaskResult.partialDisplayValue) {
|
|
2292
|
+
if (newMaskResult.mismatchedToken === "inputTooLong" && displayValue) {
|
|
2293
|
+
cancelInput();
|
|
2294
|
+
onMismatch(newMaskResult);
|
|
2295
|
+
return;
|
|
2296
|
+
}
|
|
2297
|
+
cancelInput();
|
|
2298
|
+
onMismatch(newMaskResult);
|
|
2299
|
+
setPreservingMismatchedValue(false);
|
|
2300
|
+
onInput(newMaskResult.partialDisplayValue);
|
|
2301
|
+
return;
|
|
2302
|
+
}
|
|
2303
|
+
cancelInput();
|
|
2304
|
+
onMismatch(newMaskResult);
|
|
2305
|
+
return;
|
|
2306
|
+
}
|
|
2307
|
+
if (inputEl.selectionStart && inputEl.selectionStart < inputEl.value.length) returnCaretLater();
|
|
2308
|
+
setPreservingMismatchedValue(false);
|
|
2309
|
+
inputEl.value = newMaskResult.displayValue;
|
|
2310
|
+
onInput(newPureValue);
|
|
2311
|
+
}, [
|
|
2312
|
+
displayValue,
|
|
2313
|
+
displayValueToPure,
|
|
2314
|
+
getMaskResult,
|
|
2315
|
+
onInput,
|
|
2316
|
+
onMismatch
|
|
2317
|
+
]);
|
|
2318
|
+
const handleBlur = useCallback$1((event, fieldOnBlur) => {
|
|
2319
|
+
fieldOnBlur?.(event);
|
|
2320
|
+
const eventWithProcessedValue = {
|
|
2321
|
+
...event,
|
|
2322
|
+
currentTarget: {
|
|
2323
|
+
...event.currentTarget,
|
|
2324
|
+
value: displayValueToPure(event.currentTarget.value)
|
|
2325
|
+
},
|
|
2326
|
+
target: {
|
|
2327
|
+
...event.target,
|
|
2328
|
+
value: displayValueToPure(event.currentTarget.value)
|
|
2329
|
+
}
|
|
2330
|
+
};
|
|
2331
|
+
onBlur?.(eventWithProcessedValue);
|
|
2332
|
+
setIsFocused(false);
|
|
2333
|
+
setHasBlurred(true);
|
|
2334
|
+
}, [displayValueToPure, onBlur]);
|
|
2335
|
+
const handlePaste = useCallback$1((event) => {
|
|
2336
|
+
const pasteValue = event.clipboardData?.getData("text/plain");
|
|
2337
|
+
const inputEl = event.currentTarget;
|
|
2338
|
+
const { selectionStart, selectionEnd } = inputEl;
|
|
2339
|
+
if (!pasteValue || !selectionStart || selectionStart !== selectionEnd) return;
|
|
2340
|
+
const pureDisplayValue = displayValueToPure(displayValue);
|
|
2341
|
+
const purePasteValue = displayValueToPure(pasteValue);
|
|
2342
|
+
const newPureValue = pureDisplayValue.slice(0, selectionStart) + purePasteValue + pureDisplayValue.slice(selectionStart);
|
|
2343
|
+
if (newPureValue.startsWith(pureDisplayValue + pureDisplayValue)) {
|
|
2344
|
+
const withPrefixRemoved = newPureValue.replace(pureDisplayValue, "");
|
|
2345
|
+
event.preventDefault();
|
|
2346
|
+
inputEl.value = withPrefixRemoved;
|
|
2347
|
+
handleInput({
|
|
2348
|
+
...event,
|
|
2349
|
+
currentTarget: inputEl,
|
|
2350
|
+
target: inputEl
|
|
2351
|
+
});
|
|
2352
|
+
}
|
|
2353
|
+
}, [
|
|
2354
|
+
displayValue,
|
|
2355
|
+
displayValueToPure,
|
|
2356
|
+
handleInput
|
|
2357
|
+
]);
|
|
2358
|
+
const handleFocus = useCallback$1((event, fieldOnFocus) => {
|
|
2359
|
+
onFocus?.();
|
|
2360
|
+
fieldOnFocus?.(event);
|
|
2361
|
+
setIsFocused(true);
|
|
2362
|
+
}, [onFocus]);
|
|
2363
|
+
const handleKeyDown = useCallback$1((event) => {
|
|
2364
|
+
const inputEl = event.currentTarget;
|
|
2365
|
+
const isCaretAtEndWithNoSelection = inputEl.selectionStart === inputEl.value.length && inputEl.selectionStart === inputEl.selectionEnd;
|
|
2366
|
+
if (event.key !== KEYBOARD_KEYS.backspace || !isCaretAtEndWithNoSelection) return;
|
|
2367
|
+
event.preventDefault();
|
|
2368
|
+
const withLastCharRemoved = value.slice(0, value.length - 1);
|
|
2369
|
+
const newMaskResult = getMaskResult(withLastCharRemoved);
|
|
2370
|
+
if (newMaskResult.outcome === "mismatch") {
|
|
2371
|
+
inputEl.value = newMaskResult.partialDisplayValue;
|
|
2372
|
+
onMismatch(newMaskResult);
|
|
2373
|
+
} else {
|
|
2374
|
+
inputEl.value = newMaskResult.displayValue;
|
|
2375
|
+
onInput(withLastCharRemoved);
|
|
2376
|
+
}
|
|
2377
|
+
}, [
|
|
2378
|
+
getMaskResult,
|
|
2379
|
+
onInput,
|
|
2380
|
+
onMismatch,
|
|
2381
|
+
value
|
|
2382
|
+
]);
|
|
2383
|
+
const getHelper = () => {
|
|
2384
|
+
if (inputState.isError && !persistHelper) return inputState.text;
|
|
2385
|
+
if (helper) return /* @__PURE__ */ jsxs("span", { children: [/* @__PURE__ */ jsx("div", { children: helper }), /* @__PURE__ */ jsx("div", {
|
|
2386
|
+
style: { display: persistHelper ? "flex" : "unset" },
|
|
2387
|
+
children: inputState.text
|
|
2388
|
+
})] });
|
|
2389
|
+
return inputState.text;
|
|
2390
|
+
};
|
|
2391
|
+
return useFieldComponent ? /* @__PURE__ */ jsx(Field, {
|
|
2392
|
+
name,
|
|
2393
|
+
label,
|
|
2394
|
+
isValid: !inputState.isError,
|
|
2395
|
+
errorMessage: inputState.errorMessage,
|
|
2396
|
+
helper: getHelper(),
|
|
2397
|
+
helperPosition,
|
|
2398
|
+
disabled,
|
|
2399
|
+
optional,
|
|
2400
|
+
children: ({ onBlurHandler: fieldOnBlur, onFocusHandler: fieldOnFocus, id, ...childProps }) => /* @__PURE__ */ jsx(Inner, {
|
|
2401
|
+
...childProps,
|
|
2402
|
+
id,
|
|
2403
|
+
name,
|
|
2404
|
+
optional,
|
|
2405
|
+
disabled,
|
|
2406
|
+
readonly,
|
|
2407
|
+
placeholder,
|
|
2408
|
+
displayValue,
|
|
2409
|
+
inputRef,
|
|
2410
|
+
inputState,
|
|
2411
|
+
type,
|
|
2412
|
+
showingMismatch,
|
|
2413
|
+
onInput: handleInput,
|
|
2414
|
+
onBlur: (event) => {
|
|
2415
|
+
handleBlur(event, fieldOnBlur);
|
|
2416
|
+
},
|
|
2417
|
+
onPaste: handlePaste,
|
|
2418
|
+
onFocus: (event) => {
|
|
2419
|
+
handleFocus(event, fieldOnFocus);
|
|
2420
|
+
},
|
|
2421
|
+
onKeyDown: handleKeyDown
|
|
2422
|
+
})
|
|
2423
|
+
}) : /* @__PURE__ */ jsx(Inner, {
|
|
2424
|
+
name,
|
|
2425
|
+
"aria-label": label,
|
|
2426
|
+
optional,
|
|
2427
|
+
disabled,
|
|
2428
|
+
readonly,
|
|
2429
|
+
placeholder,
|
|
2430
|
+
displayValue,
|
|
2431
|
+
inputRef,
|
|
2432
|
+
inputState,
|
|
2433
|
+
type,
|
|
2434
|
+
showingMismatch,
|
|
2435
|
+
onInput: handleInput,
|
|
2436
|
+
onBlur: (event) => {
|
|
2437
|
+
handleBlur(event);
|
|
2438
|
+
},
|
|
2439
|
+
onPaste: handlePaste,
|
|
2440
|
+
onFocus: (event) => {
|
|
2441
|
+
handleFocus(event);
|
|
2442
|
+
},
|
|
2443
|
+
onKeyDown: handleKeyDown
|
|
2444
|
+
});
|
|
2445
|
+
};
|
|
2446
|
+
//#endregion
|
|
2447
|
+
//#region src/components/ui/atoms/Radio/Radio.tsx
|
|
2448
|
+
var Radio = ({ id, value, groupName, checked = false, disabled = false, onClick, className, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy }) => /* @__PURE__ */ jsx("input", {
|
|
2449
|
+
"aria-labelledby": ariaLabelledBy,
|
|
2450
|
+
"aria-describedby": ariaDescribedBy,
|
|
2451
|
+
className: cx(["adyen-kyc-input-radio adyen-kyc-input-radio__input", className]),
|
|
2452
|
+
id,
|
|
2453
|
+
type: "radio",
|
|
2454
|
+
checked,
|
|
2455
|
+
name: groupName,
|
|
2456
|
+
onClick,
|
|
2457
|
+
value,
|
|
2458
|
+
disabled
|
|
2459
|
+
});
|
|
2460
|
+
//#endregion
|
|
2461
|
+
//#region src/components/ui/atoms/RadioWithLabel/RadioWithLabel.tsx
|
|
2462
|
+
var RadioWithLabel = ({ value, label, content, groupName, checked = false, disabled = false, onClick }) => {
|
|
2463
|
+
const id = useId("radio");
|
|
2464
|
+
return /* @__PURE__ */ jsxs("label", {
|
|
2465
|
+
htmlFor: id,
|
|
2466
|
+
className: "adyen-kyc-input-radio",
|
|
2467
|
+
children: [/* @__PURE__ */ jsx(Radio, {
|
|
2468
|
+
id,
|
|
2469
|
+
checked,
|
|
2470
|
+
groupName,
|
|
2471
|
+
onClick,
|
|
2472
|
+
value,
|
|
2473
|
+
disabled
|
|
2474
|
+
}), /* @__PURE__ */ jsxs("div", {
|
|
2475
|
+
className: "adyen-kyc-input-radio__content",
|
|
2476
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
2477
|
+
className: "adyen-kyc-input-radio__label adyen-kyc-label__text",
|
|
2478
|
+
children: label
|
|
2479
|
+
}), content]
|
|
2480
|
+
})]
|
|
2481
|
+
});
|
|
2482
|
+
};
|
|
2483
|
+
//#endregion
|
|
2484
|
+
//#region src/components/ui/atoms/RadioGroup/RadioGroup.tsx
|
|
2485
|
+
function RadioGroup({ items, name, onChange, value, disabled = false, horizontal = false, showContentOnlyOnSelected = false, className, enableTracking = false }) {
|
|
2486
|
+
const { t, i18n } = useTranslation("common");
|
|
2487
|
+
const userEvents = useAnalyticsContext();
|
|
2488
|
+
const handleChange = (id) => {
|
|
2489
|
+
if (enableTracking) userEvents.addFieldEvent("Interacted with form field", {
|
|
2490
|
+
actionType: "input",
|
|
2491
|
+
field: name,
|
|
2492
|
+
returnValue: value
|
|
2493
|
+
});
|
|
2494
|
+
onChange(id);
|
|
2495
|
+
};
|
|
2496
|
+
return /* @__PURE__ */ jsx("div", {
|
|
2497
|
+
className: cx([
|
|
2498
|
+
"adyen-kyc-radio-group",
|
|
2499
|
+
{ "adyen-kyc-radio-group--horizontal": horizontal },
|
|
2500
|
+
className
|
|
2501
|
+
]),
|
|
2502
|
+
children: items.map((item) => {
|
|
2503
|
+
const isSelected = item.id === value;
|
|
2504
|
+
const visibleContent = isSelected || !showContentOnlyOnSelected ? item.content : void 0;
|
|
2505
|
+
const keyExists = i18n.exists?.(item.name, { ns: "common" });
|
|
2506
|
+
return /* @__PURE__ */ jsx(RadioWithLabel, {
|
|
2507
|
+
value: item.id,
|
|
2508
|
+
label: keyExists ? t(($) => $[item.name]) : item.name,
|
|
2509
|
+
content: visibleContent,
|
|
2510
|
+
groupName: name,
|
|
2511
|
+
checked: isSelected,
|
|
2512
|
+
disabled,
|
|
2513
|
+
onClick: () => {
|
|
2514
|
+
handleChange(item.id);
|
|
2515
|
+
}
|
|
2516
|
+
}, item.id);
|
|
2517
|
+
})
|
|
2518
|
+
});
|
|
2519
|
+
}
|
|
2520
|
+
//#endregion
|
|
2521
|
+
//#region src/utils/dropinUtils.ts
|
|
2522
|
+
/**
|
|
2523
|
+
* @@description Based requiredfields and optionalFields determine what forms need to be shown and add a summaryStep in the dropin
|
|
2524
|
+
*
|
|
2525
|
+
* @param forms
|
|
2526
|
+
* @param requiredFields
|
|
2527
|
+
* @param optionalFields
|
|
2528
|
+
* @param skipSummary
|
|
2529
|
+
*/
|
|
2530
|
+
var getRequiredForms = (forms, requiredFields, optionalFields, skipSummary) => {
|
|
2531
|
+
const reasons = [];
|
|
2532
|
+
const requiredForms = Object.values(forms).filter(({ formId }) => {
|
|
2533
|
+
if (requiredFields || optionalFields) {
|
|
2534
|
+
const hasRequired = Boolean(requiredFields?.[formId]?.length);
|
|
2535
|
+
const hasOptional = Boolean(optionalFields?.[formId]?.length);
|
|
2536
|
+
const isIncluded = hasRequired || hasOptional;
|
|
2537
|
+
const inclusionReasons = [];
|
|
2538
|
+
if (hasRequired) inclusionReasons.push("has required fields");
|
|
2539
|
+
if (hasOptional) inclusionReasons.push("has optional fields");
|
|
2540
|
+
if (isIncluded) reasons.push(`Form '${formId}': INCLUDED (${inclusionReasons.join(" & ")})`);
|
|
2541
|
+
else reasons.push(`Form '${formId}': EXCLUDED (no required or optional fields)`);
|
|
2542
|
+
return isIncluded;
|
|
2543
|
+
}
|
|
2544
|
+
reasons.push(`Form '${formId}': INCLUDED (no required/optional fields check)`);
|
|
2545
|
+
return true;
|
|
2546
|
+
});
|
|
2547
|
+
formDebugInfo.value = {
|
|
2548
|
+
...formDebugInfo.value,
|
|
2549
|
+
__FORMS__: {
|
|
2550
|
+
status: "INFO",
|
|
2551
|
+
reasons
|
|
2552
|
+
}
|
|
2553
|
+
};
|
|
2554
|
+
if (skipSummary) return requiredForms;
|
|
2555
|
+
return [...requiredForms, summaryStep];
|
|
2556
|
+
};
|
|
2557
|
+
/**
|
|
2558
|
+
* @description Based on validity of fields from formValidity and existence of validationErrors/Verification errors from backend determine whether the forms needs to be shown as valid or not
|
|
2559
|
+
*
|
|
2560
|
+
* @param forms
|
|
2561
|
+
* @param formValidity
|
|
2562
|
+
* @param problems
|
|
2563
|
+
*/
|
|
2564
|
+
var addValidityToForms = (forms, formValidity, problems) => forms.map(({ formId, formName, fields }) => ({
|
|
2565
|
+
formId,
|
|
2566
|
+
formName,
|
|
2567
|
+
fields,
|
|
2568
|
+
isValid: formValidity?.[formId] ?? false,
|
|
2569
|
+
hasServerValidationErrors: Boolean(problems?.validationErrors?.[formId])
|
|
2570
|
+
}));
|
|
2571
|
+
//#endregion
|
|
2572
|
+
export { nonInputs as A, preTranslatedSummaryItem as B, validateNotEmptyOnBlur as C, alphanumericInputs as D, alphaInputs as E, isTruthyValidator as F, roleMetadata as G, Summary_module_default as H, useFormComposer as I, trackNavigation as J, createFormUtils as K, Summary as L, spacer as M, useMultiForm as N, customInputs as O, isNotEmptyValidator as P, summaryStep as R, validateLegalCompanyName as S, uppercase as T, getRoleName as U, summaryItem as V, getRoleTagVariant as W, FormContextProvider as Y, FormFlow as _, MaskedInput as a, validateJaKanaLegalCompanyName as b, COUNTRY_FIELD as c, isBankStatementUploadError as d, isBusinessSelectionLegalArrangementError as f, useFormContext as g, mapCreateOrUpdateTransferInstrumentErrorMessageToTranslatable as h, RadioWithLabel as i, numericInputs as j, makeMask as k, CountryField as l, isValidationError as m, getRequiredForms as n, InputEmail as o, isIdDocumentUploadError as p, mergeFieldMetadataIntoProps as q, RadioGroup as r, isValueObscured as s, addValidityToForms as t, getValidationErrorDisplayMessages as u, FormFlow_module_default as v, validatePatternOnBlur as w, validateLatinSpaceMarkPunctuationNumbersOnlyOnBlur as x, validateJaHaniLegalCompanyName as y, isSummaryItem as z };
|