@adyen/kyc-components
Version:
This guide assumes that you have already an account with Adyen. A legalEntity needs to be created, and you need to have a `legalEntityId` to instatiate a Component.
1,116 lines (1,115 loc) • 86 kB
JavaScript
try {
let e = "undefined" != typeof window ? window : "undefined" != typeof global ? global : "undefined" != typeof globalThis ? globalThis : "undefined" != typeof self ? self : {}, n = new e.Error().stack;
n && (e._sentryDebugIds = e._sentryDebugIds || {}, e._sentryDebugIds[n] = "faccf4ef-35ec-402c-b03d-356be9f36c70", e._sentryDebugIdIdentifier = "sentry-dbid-faccf4ef-35ec-402c-b03d-356be9f36c70");
} catch (e) {}
import { a as Icon, i as Typography, n as addResourceBundles, o as createLogger, r as useTranslation } from "./translation-BFxyJ1c5.js";
import { n as IconButton, r as Loader, t as Button } from "./Button-oj6H8OrC.js";
import { n as httpGet, r as httpPost, s as useApiContext } from "./http-D1NDkBxF.js";
import { n as useLegalEntities, r as useLegalEntity, t as ROOT_LE } from "./useLegalEntity-yxi9XhLi.js";
import { t as getLegalEntityCountry } from "./getLegalEntityCountry-C6bSV6sB.js";
import { c as objectsDeepEqual, t as useAnalyticsContext } from "./useAnalyticsContext-BVFDMrVE.js";
import { a as translateTranslatable } from "./utils-B807QaDx.js";
import { t as _rolldown_dynamic_import_helper_default } from "./_rolldown_dynamic_import_helper-rq_tsyLP.js";
import { t as StackLayout } from "./StackLayout-Bhbj68nx.js";
import { n as TASK_STATUS_POLLING_INTERVAL_MS } from "./taskStatus-C7XU4UIF.js";
import { t as Header } from "./Header-CPmJyuoP.js";
import { t as Alert } from "./Alert-C6gL3JIt.js";
import { C as EntityTypes } from "./processCapabilities-DlZY9-Jc.js";
import { t as useBusinessLines } from "./useBusinessLines-CgnQUuie.js";
import { t as useTaskStatus } from "./useTaskStatus-PqBc0I7k.js";
import { t as Card } from "./Card-vYndix5Y.js";
import { t as useToastContext } from "./useToastContext-CYgfHjSb.js";
import { n as useCapabilityProblems, t as getProblemsForEntity } from "./getProblemsForEntity-BLcIg3x_.js";
import { t as useInvalidateRootLegalEntity } from "./invalidateRootLegalEntity-CZr0iiji.js";
import { t as Avatar } from "./Avatar-CKmUpMXT.js";
import { t as Modal } from "./Modal-CioQJ7Q7.js";
import { t as Confirm } from "./Confirm-B6TWSuab.js";
import { t as Image } from "./Image-BEzOZ1tt.js";
import { t as useCreateLegalEntity } from "./useCreateLegalEntity-BK1XURnK.js";
import { t as useUpdateLegalEntity } from "./useUpdateLegalEntity-CtaRaKZ6.js";
import { n as FormFlow, r as FormContextProvider, t as useFormContext } from "./useFormContext-Cx9-3iXR.js";
import { i as useFormComposer, n as getRequiredForms, t as addValidityToForms } from "./dropinUtils-IdasFZCU.js";
import { t as StructuredList } from "./StructuredList-w0Z2zLTk.js";
import { t as ErrorPanel } from "./ErrorPanel-B536hgSc.js";
import { t as createFormUtils } from "./formUtils-DCvL3uZG.js";
import { t as useMultiForm } from "./useMultiForm-B3e1ImN3.js";
import { t as useTaskLandedEvent } from "./useTaskLandedEvent-DInxWeqN.js";
import { o as createDocumentRequest, s as documentApiUtils } from "./validate-DDKy88ac.js";
import { r as formatObject } from "./utils-oc3EdK6K.js";
import { t as Field } from "./Field-pcJkjIG_.js";
import { t as TileGroup } from "./TileGroup-D0YbtzZ0.js";
import { t as LandingLayout } from "./LandingLayout-z8j2xiqg.js";
import { t as Select } from "./Select-CcSRI-H0.js";
import { t as Checkbox } from "./Checkbox-BCYjFPa4.js";
import { t as TextArea } from "./TextArea-CRLeP4x6.js";
import { t as Dropzone } from "./Dropzone-68UX-Puq.js";
import { t as InputText } from "./InputText-C30dZxS4.js";
import { t as InputDate } from "./InputDate-XX9jaw9v.js";
import { n as CountryField } from "./CountryField-Dh4DfjBf.js";
import { t as RadioGroup } from "./RadioGroup-7g7Xv9rl.js";
import { t as InputGroup } from "./InputGroup-CVYzCygf.js";
import { t as isEmpty } from "./isEmpty-Dw2W8jeR.js";
import { n as validateDateNotInTheFuture } from "./validate-Da7Onair.js";
import { C as getSourceOfFundsRequiredForms, D as parseSofOriginatorPayload, E as parseSOFDocumentDescription, O as sofCategoryItemMapper, S as getSourceOfFundsRequiredFields, T as parseOriginatorDetails, _ as getServiceTranslation, a as allowedCurrencies, b as getSofCardDetails, c as getAdditionalDataForOriginator, d as getDocumentLists, f as getDocumentRequirements, g as getRelevantErrors, h as getPageHeadings, i as TODAY_DATE, k as formatAmountWithCurrency, l as getAdditionalDataSchemaKeys, m as getInputErrors, o as areSourceOfFundsEqual, p as getGettingStartedCardDetails, r as SOF_INVALID_INPUT_ERROR_CODES, s as formatDateForInput, t as ALLOWED_SOF_SERVICES, u as getApplicableBusinessLines, v as getServiceTranslationKey, w as getUniqueRemediationActions, x as getSourceOfFundsPayload, y as getServiceTranslationSelectTitle } from "./utils-DRjqyP-s.js";
import { lazy } from "preact/compat";
import { useCallback as useCallback$1, useEffect as useEffect$1, useMemo as useMemo$1, useState as useState$1 } from "preact/hooks";
import { Fragment as Fragment$1, jsx, jsxs } from "preact/jsx-runtime";
import { signal } from "@preact/signals";
import { useMutation, useQuery, useQueryClient } from "@tanstack/preact-query";
//#region src/api/businessLines/useUpdateSourceOfFunds.ts
var updateSourceOfFunds = async (businessLineId, legalEntityId, baseUrl, data) => {
return httpPost({
baseUrl,
path: `legalEntities/${legalEntityId}/businessLines/${businessLineId}/sourceOfFunds`
}, data);
};
var useUpdateSourceOfFunds = (options) => {
const { rootLegalEntityId, baseUrl } = useApiContext();
const invalidateRootLegalEntity = useInvalidateRootLegalEntity();
return useMutation({
mutationFn: ({ businessLineId, ...requestData }) => updateSourceOfFunds(businessLineId, rootLegalEntityId.value, baseUrl.value, requestData),
onSuccess: async () => {
await invalidateRootLegalEntity();
},
...options
});
};
var sourceOfFundsComponentsKeyMapping = {
"sourceOfFundsType.type": "sourceOfFunds.type",
"additionalData.description": "sourceOfFunds.description",
"additionalData.amount": "sourceOfFunds.amount",
"additionalData.dateOfFundsReceived": "sourceOfFunds.dateOfFundsReceived",
"additionalData.purpose": "sourceOfFunds.purpose",
"additionalData.relationship": "sourceOfFunds.relationship",
"additionalData.originatorLegalEntityId": "sourceOfFunds.originatorLegalEntityId",
"additionalData.financiers": "sourceOfFunds.financiers",
"additionalData.cryptocurrencyExchange": "sourceOfFunds.cryptocurrencyExchange",
"additionalData.dateOfSourceEvent": "sourceOfFunds.dateOfSourceEvent",
"additionalData.website": "sourceOfFunds.website",
"additionalData.legalName": "sourceOfFunds.legalName",
"additionalData.firstName": "sourceOfFunds.firstName",
"additionalData.lastName": "sourceOfFunds.lastName",
"additionalData.country": "sourceOfFunds.country",
"additionalData.originatorType": "sourceOfFunds.originatorType"
};
//#endregion
//#region src/components/EFP/mapping/mapSourceOfFundToSourceOfFundsSchema.ts
var mapSourceOfFundToSourceOfFundsSchema = (businessLine) => formatObject(businessLine, sourceOfFundsComponentsKeyMapping);
//#endregion
//#region src/components/EFP/tasks/SourceOfFundsDropin/sofStore.ts
var sofErrorMessage = signal(void 0);
var setSofErrorMessage = (message) => {
sofErrorMessage.value = message;
};
var clearSofErrorMessage = () => {
sofErrorMessage.value = void 0;
};
//#endregion
//#region src/api/datasets/useSourceOfFundsTypes.ts
var getSourceOfFundsTypes = async (baseUrl) => {
return httpGet({
baseUrl,
path: `datasets/sourceOfFundsTypes`
});
};
var useSourceOfFundsTypes = (options) => {
const { baseUrl } = useApiContext();
return useQuery({
queryKey: ["sourceOfFundsTypes"],
queryFn: () => getSourceOfFundsTypes(baseUrl.value),
...options
});
};
var SourceOfFunds_module_default = {
"source-of-funds": "adyen-kyc-source-of-funds",
sourceOfFunds: "adyen-kyc-source-of-funds",
"source-of-funds-wrapper-loading": "adyen-kyc-source-of-funds-wrapper-loading",
sourceOfFundsWrapperLoading: "adyen-kyc-source-of-funds-wrapper-loading",
"source-of-funds-wrapper-heading": "adyen-kyc-source-of-funds-wrapper-heading",
sourceOfFundsWrapperHeading: "adyen-kyc-source-of-funds-wrapper-heading",
"source-of-funds-wrapper-description": "adyen-kyc-source-of-funds-wrapper-description",
sourceOfFundsWrapperDescription: "adyen-kyc-source-of-funds-wrapper-description",
"source-of-funds-same-as-checkbox": "adyen-kyc-source-of-funds-same-as-checkbox",
sourceOfFundsSameAsCheckbox: "adyen-kyc-source-of-funds-same-as-checkbox",
"source-of-funds-getting-started": "adyen-kyc-source-of-funds-getting-started",
sourceOfFundsGettingStarted: "adyen-kyc-source-of-funds-getting-started",
"source-of-funds-getting-started-heading": "adyen-kyc-source-of-funds-getting-started-heading",
sourceOfFundsGettingStartedHeading: "adyen-kyc-source-of-funds-getting-started-heading",
"source-of-funds-getting-started-body": "adyen-kyc-source-of-funds-getting-started-body",
sourceOfFundsGettingStartedBody: "adyen-kyc-source-of-funds-getting-started-body",
"source-of-funds-getting-started-error": "adyen-kyc-source-of-funds-getting-started-error",
sourceOfFundsGettingStartedError: "adyen-kyc-source-of-funds-getting-started-error",
"source-of-funds-getting-started-error-actions": "adyen-kyc-source-of-funds-getting-started-error-actions",
sourceOfFundsGettingStartedErrorActions: "adyen-kyc-source-of-funds-getting-started-error-actions",
"source-of-funds-getting-started-cards": "adyen-kyc-source-of-funds-getting-started-cards",
sourceOfFundsGettingStartedCards: "adyen-kyc-source-of-funds-getting-started-cards",
"source-of-funds-getting-started-cards-card": "adyen-kyc-source-of-funds-getting-started-cards-card",
sourceOfFundsGettingStartedCardsCard: "adyen-kyc-source-of-funds-getting-started-cards-card",
"source-of-funds-getting-started-cards-card-header": "adyen-kyc-source-of-funds-getting-started-cards-card-header",
sourceOfFundsGettingStartedCardsCardHeader: "adyen-kyc-source-of-funds-getting-started-cards-card-header",
"source-of-funds-getting-started-cards-card-body": "adyen-kyc-source-of-funds-getting-started-cards-card-body",
sourceOfFundsGettingStartedCardsCardBody: "adyen-kyc-source-of-funds-getting-started-cards-card-body",
"source-of-funds-getting-started-actions": "adyen-kyc-source-of-funds-getting-started-actions",
sourceOfFundsGettingStartedActions: "adyen-kyc-source-of-funds-getting-started-actions",
"source-of-funds-additional-data-form": "adyen-kyc-source-of-funds-additional-data-form",
sourceOfFundsAdditionalDataForm: "adyen-kyc-source-of-funds-additional-data-form",
"source-of-funds-third-party-funding-financier-group": "adyen-kyc-source-of-funds-third-party-funding-financier-group",
sourceOfFundsThirdPartyFundingFinancierGroup: "adyen-kyc-source-of-funds-third-party-funding-financier-group",
"source-of-funds-third-party-funding-name-avatar-group": "adyen-kyc-source-of-funds-third-party-funding-name-avatar-group",
sourceOfFundsThirdPartyFundingNameAvatarGroup: "adyen-kyc-source-of-funds-third-party-funding-name-avatar-group",
"source-of-funds-third-party-funding-name-address-group": "adyen-kyc-source-of-funds-third-party-funding-name-address-group",
sourceOfFundsThirdPartyFundingNameAddressGroup: "adyen-kyc-source-of-funds-third-party-funding-name-address-group",
"source-of-funds-sof-financier-form-error": "adyen-kyc-source-of-funds-sof-financier-form-error",
sourceOfFundsSofFinancierFormError: "adyen-kyc-source-of-funds-sof-financier-form-error",
"source-of-funds-sof-financier-form-name-group": "adyen-kyc-source-of-funds-sof-financier-form-name-group",
sourceOfFundsSofFinancierFormNameGroup: "adyen-kyc-source-of-funds-sof-financier-form-name-group",
"source-of-funds-financier-footer": "adyen-kyc-source-of-funds-financier-footer",
sourceOfFundsFinancierFooter: "adyen-kyc-source-of-funds-financier-footer",
"source-of-funds-grid-container": "adyen-kyc-source-of-funds-grid-container",
sourceOfFundsGridContainer: "adyen-kyc-source-of-funds-grid-container",
"source-of-funds-sub-heading": "adyen-kyc-source-of-funds-sub-heading",
sourceOfFundsSubHeading: "adyen-kyc-source-of-funds-sub-heading",
"source-of-funds-upload-modal-content-field": "adyen-kyc-source-of-funds-upload-modal-content-field",
sourceOfFundsUploadModalContentField: "adyen-kyc-source-of-funds-upload-modal-content-field",
"source-of-funds-upload-modal-content-field-radio-group": "adyen-kyc-source-of-funds-upload-modal-content-field-radio-group",
sourceOfFundsUploadModalContentFieldRadioGroup: "adyen-kyc-source-of-funds-upload-modal-content-field-radio-group",
"source-of-funds-upload-modal-content-requirements-container": "adyen-kyc-source-of-funds-upload-modal-content-requirements-container",
sourceOfFundsUploadModalContentRequirementsContainer: "adyen-kyc-source-of-funds-upload-modal-content-requirements-container",
"source-of-funds-upload-list-heading": "adyen-kyc-source-of-funds-upload-list-heading",
sourceOfFundsUploadListHeading: "adyen-kyc-source-of-funds-upload-list-heading",
"source-of-funds-modal": "adyen-kyc-source-of-funds-modal",
sourceOfFundsModal: "adyen-kyc-source-of-funds-modal"
};
//#endregion
//#region src/components/EFP/tasks/SourceOfFundsDropin/SOFAdditionalData/AdditionalDataForAssetSale.tsx
function AdditionalDataForAssetSale(props) {
const [isFocused, setIsFocused] = useState$1(false);
const { formUtils, data, errors, valid, fieldProblems, handleChangeFor, handleAmountChange } = props;
const { t: commonT } = useTranslation("common");
const handleOnAmountBlur = () => {
setIsFocused(false);
handleAmountChange("amount");
};
return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs("div", {
className: SourceOfFunds_module_default.sourceOfFundsGridContainer,
children: [/* @__PURE__ */ jsx(Field, {
el: "fieldset",
name: "amount",
label: formUtils.getLabel("amount", "saleAmount"),
errorMessage: formUtils.getErrorMessage("amount", errors, fieldProblems),
children: (childProps) => /* @__PURE__ */ jsxs(InputGroup, {
...childProps,
id: "currencyGroup",
isFocused,
isInvalid: Boolean(!valid.amount && errors.amount),
children: [/* @__PURE__ */ jsx(Select, {
name: "currency",
"aria-label": commonT(($) => $["currency"]),
isMulti: false,
items: allowedCurrencies,
selected: data.amount?.currency,
placeholder: commonT(($) => $["select"]),
onChange: handleAmountChange("currency"),
minimal: true
}), /* @__PURE__ */ jsx(InputText, {
...childProps,
name: "amount",
value: data.amount?.value,
readonly: formUtils.isReadOnly("amount"),
onInput: handleAmountChange("amount"),
onBlur: handleOnAmountBlur,
"aria-required": true,
"aria-invalid": !valid.amount,
isValid: valid.amount,
onFocusHandler: () => setIsFocused(true)
})]
})
}), /* @__PURE__ */ jsx(Field, {
name: "dateOfSourceEvent",
label: formUtils.getLabel("dateOfSourceEvent", "dateOfSale"),
errorMessage: formUtils.getErrorMessage("dateOfSourceEvent", errors, fieldProblems),
isValid: valid.dateOfSourceEvent,
children: (childProps) => /* @__PURE__ */ jsx(InputDate, {
...childProps,
name: "dateOfSourceEvent",
value: formatDateForInput(data.dateOfSourceEvent),
onInput: handleChangeFor("dateOfSourceEvent", "input"),
onBlur: handleChangeFor("dateOfSourceEvent", "blur"),
"aria-required": true,
"aria-invalid": !valid.dateOfSourceEvent,
max: TODAY_DATE
})
})]
}), /* @__PURE__ */ jsx(Field, {
name: "description",
label: formUtils.getLabel("description", "propertyDescription"),
errorMessage: formUtils.getErrorMessage("description", errors, fieldProblems),
isValid: valid.description,
children: (childProps) => /* @__PURE__ */ jsx(TextArea, {
...childProps,
name: "description",
value: data.description,
maxLength: 200,
onInput: handleChangeFor("description"),
onBlur: handleChangeFor("description"),
"aria-invalid": !valid.description
})
})] });
}
//#endregion
//#region src/components/EFP/tasks/SourceOfFundsDropin/SOFAdditionalData/AdditionalDataForBusiness.tsx
function AdditionalDataForBusiness(props) {
const [isFocused, setIsFocused] = useState$1(false);
const { formUtils, data, errors, valid, fieldProblems, handleChangeFor, handleAmountChange } = props;
const { t: commonT } = useTranslation("common");
const handleOnAmountBlur = () => {
setIsFocused(false);
handleAmountChange("amount");
};
return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Field, {
el: "fieldset",
name: "amount",
label: formUtils.getLabel("amount", "annualTurnover"),
errorMessage: formUtils.getErrorMessage("amount", errors, fieldProblems),
helper: commonT(($) => $["useFiguresFromTheMostRecentYearAvailable"]),
helperPosition: "below",
children: (childProps) => /* @__PURE__ */ jsxs(InputGroup, {
...childProps,
id: "currencyGroup",
isFocused,
isInvalid: Boolean(!valid.amount && errors.amount),
children: [/* @__PURE__ */ jsx(Select, {
name: "currency",
"aria-label": commonT(($) => $["currency"]),
isMulti: false,
items: allowedCurrencies,
selected: data.amount?.currency,
placeholder: commonT(($) => $["select"]),
onChange: handleAmountChange("currency"),
minimal: true
}), /* @__PURE__ */ jsx(InputText, {
...childProps,
name: "amount",
value: data.amount?.value,
readonly: formUtils.isReadOnly("amount"),
onInput: handleAmountChange("amount"),
onBlur: handleOnAmountBlur,
"aria-required": true,
"aria-invalid": !valid.amount,
isValid: valid.amount,
onFocusHandler: () => setIsFocused(true)
})]
})
}), /* @__PURE__ */ jsx(Field, {
name: "description",
label: formUtils.getLabel("description", "businessDescription"),
errorMessage: formUtils.getErrorMessage("description", errors, fieldProblems),
isValid: valid.description,
children: (childProps) => /* @__PURE__ */ jsx(TextArea, {
...childProps,
name: "description",
value: data.description,
maxLength: 200,
onInput: handleChangeFor("description"),
onBlur: handleChangeFor("description"),
"aria-invalid": !valid.description
})
})] });
}
//#endregion
//#region src/components/EFP/tasks/SourceOfFundsDropin/SOFAdditionalData/AdditionalDataForCryptocurrency.tsx
function AdditionalDataForCryptocurrency(props) {
const { t: sofT } = useTranslation("sof");
const { formUtils, data, errors, valid, fieldProblems, handleChangeFor } = props;
return /* @__PURE__ */ jsx(Field, {
name: "cryptocurrencyExchange",
label: formUtils.getLabel("cryptocurrencyExchange", "cryptocurrencyExchange"),
errorMessage: formUtils.getErrorMessage("cryptocurrencyExchange", errors, fieldProblems),
isValid: valid.cryptocurrencyExchange,
helper: sofT(($) => $["nameOfTheExchangeWhereTheCryptocurrencyWasHeldPriorToSale"]),
helperPosition: "below",
children: (childProps) => /* @__PURE__ */ jsx(InputText, {
...childProps,
name: "cryptocurrencyExchange",
value: data.cryptocurrencyExchange,
readonly: formUtils.isReadOnly("cryptocurrencyExchange"),
onInput: handleChangeFor("cryptocurrencyExchange", "input"),
onBlur: handleChangeFor("cryptocurrencyExchange", "blur"),
"aria-required": true,
"aria-invalid": !valid.cryptocurrencyExchange,
isValid: valid.cryptocurrencyExchange
})
});
}
//#endregion
//#region src/components/EFP/tasks/SourceOfFundsDropin/SOFAdditionalData/AdditionalDataOriginatorLegalEntity.tsx
var radioItems = [{
id: "individual",
name: "individual"
}, {
id: "organization",
name: "organization"
}];
function AdditionalDataOriginatorLegalEntity(props) {
const { t: sofT } = useTranslation("sof");
const { formUtils, data, errors, valid, fieldProblems, handleChangeFor, sourceOfFundsType } = props;
const isDonations = useMemo$1(() => sourceOfFundsType === "donations", [sourceOfFundsType]);
const countryTranslationKey = isDonations && data?.originatorType === "individual" ? "donorsCountryOfResidence" : data?.originatorType === "organization" ? "organizationsCountryOfOperation" : "decedentsCountryOfDeath";
return /* @__PURE__ */ jsxs(Fragment$1, { children: [
/* @__PURE__ */ jsx(Field, {
el: "fieldset",
name: "originatorType",
className: SourceOfFunds_module_default.sourceOfFundsUploadModalContentField,
label: sofT(($) => $[isDonations ? "whereDidThisGiftOrDonationComeFrom" : "whereDidThisInheritanceComeFrom"]),
errorMessage: formUtils.getErrorMessage("originatorType", errors, fieldProblems),
isValid: valid.originatorType,
children: (childProps) => /* @__PURE__ */ jsx(RadioGroup, {
...childProps,
name: "originatorType",
className: SourceOfFunds_module_default.sourceOfFundsUploadModalContentFieldRadioGroup,
items: radioItems,
value: data.originatorType,
disabled: false,
onChange: handleChangeFor("originatorType", "input"),
"aria-required": true
})
}),
data?.originatorType === "organization" && /* @__PURE__ */ jsx(Field, {
name: "legalName",
label: formUtils.getLabel("legalName", "organizationsLegalName"),
errorMessage: formUtils.getErrorMessage("legalName", errors, fieldProblems),
isValid: valid.legalName,
children: (childProps) => /* @__PURE__ */ jsx(InputText, {
...childProps,
name: "legalName",
value: data.legalName,
readonly: formUtils.isReadOnly("legalName"),
onInput: handleChangeFor("legalName", "input"),
onBlur: handleChangeFor("legalName", "blur"),
"aria-required": true,
"aria-invalid": !valid.legalName,
isValid: valid.legalName
})
}),
data?.originatorType === "individual" && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Field, {
name: "firstName",
label: formUtils.getLabel("firstName", isDonations ? "donorsLegalFirstName" : "decedentsLegalFirstName"),
errorMessage: formUtils.getErrorMessage("firstName", errors, fieldProblems),
isValid: valid.firstName,
children: (childProps) => /* @__PURE__ */ jsx(InputText, {
...childProps,
name: "firstName",
value: data.firstName,
readonly: formUtils.isReadOnly("firstName"),
onInput: handleChangeFor("firstName", "input"),
onBlur: handleChangeFor("firstName", "blur"),
"aria-required": true,
"aria-invalid": !valid.firstName,
isValid: valid.firstName
})
}), /* @__PURE__ */ jsx(Field, {
name: "lastName",
label: formUtils.getLabel("lastName", isDonations ? "donorsLegalLastName" : "decedentsLegalLastName"),
errorMessage: formUtils.getErrorMessage("lastName", errors, fieldProblems),
isValid: valid.lastName,
children: (childProps) => /* @__PURE__ */ jsx(InputText, {
...childProps,
name: "lastName",
value: data.lastName,
readonly: formUtils.isReadOnly("lastName"),
onInput: handleChangeFor("lastName", "input"),
onBlur: handleChangeFor("lastName", "blur"),
"aria-required": true,
"aria-invalid": !valid.lastName,
isValid: valid.lastName
})
})] }),
data?.originatorType && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Field, {
name: "relationship",
label: formUtils.getLabel("relationship", isDonations && data?.originatorType === "individual" ? "yourRelationshipToDonor" : data?.originatorType === "organization" ? "yourRelationshipToOrganization" : "yourRelationshipToDecedent"),
errorMessage: formUtils.getErrorMessage("relationship", errors, fieldProblems),
isValid: valid.relationship,
children: (childProps) => /* @__PURE__ */ jsx(InputText, {
...childProps,
name: "relationship",
value: data.relationship,
readonly: formUtils.isReadOnly("relationship"),
onInput: handleChangeFor("relationship", "input"),
onBlur: handleChangeFor("relationship", "blur"),
"aria-required": true,
"aria-invalid": !valid.relationship,
isValid: valid.relationship
})
}), /* @__PURE__ */ jsx(CountryField, {
data: { country: data.country },
valid: { country: valid.country },
errors: { country: formUtils.getErrorMessage("country", errors, fieldProblems) },
labels: { country: sofT(($) => $[countryTranslationKey]) },
readonly: formUtils.isReadOnly("country"),
handleChangeFor
})] })
] });
}
//#endregion
//#region src/components/EFP/tasks/SourceOfFundsDropin/SOFAdditionalData/AdditionalDataForDonation.tsx
function AdditionalDataForDonation(props) {
const { formUtils, data, errors, valid, fieldProblems, handleChangeFor } = props;
return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(AdditionalDataOriginatorLegalEntity, {
formUtils,
handleChangeFor,
data,
errors,
valid,
fieldProblems,
sourceOfFundsType: "donations"
}), /* @__PURE__ */ jsxs("div", {
className: SourceOfFunds_module_default.sourceOfFundsGridContainer,
children: [/* @__PURE__ */ jsx(Field, {
name: "purpose",
label: formUtils.getLabel("purpose", "reason"),
errorMessage: formUtils.getErrorMessage("purpose", errors, fieldProblems),
isValid: valid.purpose,
children: (childProps) => /* @__PURE__ */ jsx(InputText, {
...childProps,
name: "purpose",
value: data.purpose,
readonly: formUtils.isReadOnly("purpose"),
onInput: handleChangeFor("purpose", "input"),
onBlur: handleChangeFor("purpose", "blur"),
"aria-required": true,
"aria-invalid": !valid.purpose,
isValid: valid.purpose
})
}), /* @__PURE__ */ jsx(Field, {
name: "dateOfFundsReceived",
label: formUtils.getLabel("dateOfFundsReceived", "date"),
errorMessage: formUtils.getErrorMessage("dateOfFundsReceived", errors, fieldProblems),
isValid: valid.dateOfFundsReceived,
children: (childProps) => /* @__PURE__ */ jsx(InputDate, {
...childProps,
name: "dateOfFundsReceived",
value: formatDateForInput(data.dateOfFundsReceived),
onInput: handleChangeFor("dateOfFundsReceived", "input"),
onBlur: handleChangeFor("dateOfFundsReceived", "blur"),
"aria-required": true,
"aria-invalid": !valid.dateOfFundsReceived,
max: TODAY_DATE
})
})]
})] });
}
//#endregion
//#region src/components/EFP/tasks/SourceOfFundsDropin/SOFAdditionalData/AdditionalDataForGambling.tsx
function AdditionalDataForGambling(props) {
const { t: commonT } = useTranslation("common");
const [focusedInput, setFocusedInput] = useState$1();
const { formUtils, data, errors, valid, fieldProblems, handleChangeFor, handleAmountChange } = props;
const handleOnAmountBlur = () => {
setFocusedInput(void 0);
handleAmountChange("amount");
};
return /* @__PURE__ */ jsxs(Fragment$1, { children: [
/* @__PURE__ */ jsx(Field, {
el: "fieldset",
name: "amount",
label: formUtils.getLabel("amount", "totalAmountWon"),
errorMessage: formUtils.getErrorMessage("amount", errors, fieldProblems),
children: (childProps) => /* @__PURE__ */ jsxs(InputGroup, {
...childProps,
id: "currencyGroup",
isFocused: focusedInput === "amount",
isInvalid: Boolean(!valid.amount && errors.amount),
children: [/* @__PURE__ */ jsx(Select, {
name: "currency",
"aria-label": commonT(($) => $["currency"]),
isMulti: false,
items: allowedCurrencies,
selected: data.amount?.currency,
placeholder: commonT(($) => $["select"]),
onChange: handleAmountChange("currency"),
minimal: true
}), /* @__PURE__ */ jsx(InputText, {
...childProps,
name: "amount",
value: data.amount?.value,
readonly: formUtils.isReadOnly("amount"),
onInput: handleAmountChange("amount"),
onBlur: handleOnAmountBlur,
"aria-required": true,
"aria-invalid": !valid.amount,
isValid: valid.amount,
onFocusHandler: () => setFocusedInput("amount")
})]
})
}),
/* @__PURE__ */ jsx(Field, {
name: "dateOfSourceEvent",
label: formUtils.getLabel("dateOfSourceEvent", "dateOfWinning"),
errorMessage: formUtils.getErrorMessage("dateOfSourceEvent", errors, fieldProblems),
isValid: valid.dateOfSourceEvent,
children: (childProps) => /* @__PURE__ */ jsx(InputDate, {
...childProps,
name: "dateOfSourceEvent",
value: formatDateForInput(data.dateOfSourceEvent),
onInput: handleChangeFor("dateOfSourceEvent", "input"),
onBlur: handleChangeFor("dateOfSourceEvent", "blur"),
"aria-required": true,
"aria-invalid": !valid.dateOfSourceEvent,
max: TODAY_DATE
})
}),
/* @__PURE__ */ jsx(Field, {
name: "website",
label: formUtils.getLabel("website", "gamblingEstablishmentWebsite"),
errorMessage: formUtils.getErrorMessage("website", errors, fieldProblems),
children: (childProps) => /* @__PURE__ */ jsx(InputGroup, {
...childProps,
id: "websiteGroup",
isFocused: focusedInput === "website",
isInvalid: Boolean(!valid.website && errors.website),
children: /* @__PURE__ */ jsx(InputText, {
...childProps,
placeholder: "https://",
name: "website",
value: data.website,
readonly: formUtils.isReadOnly("website"),
onInput: handleChangeFor("website", "input"),
onBlur: handleChangeFor("website", "blur"),
"aria-required": true,
"aria-invalid": !valid.website,
isValid: valid.website,
onFocusHandler: () => setFocusedInput("website")
})
})
})
] });
}
//#endregion
//#region src/components/EFP/tasks/SourceOfFundsDropin/SOFAdditionalData/AdditionalDataForInheritance.tsx
function AdditionalDataForInheritance(props) {
const [isFocused, setIsFocused] = useState$1(false);
const { formUtils, data, errors, valid, fieldProblems, handleChangeFor, handleAmountChange } = props;
const { t: commonT } = useTranslation("common");
const handleOnAmountBlur = () => {
setIsFocused(false);
handleAmountChange("amount");
};
return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(AdditionalDataOriginatorLegalEntity, {
formUtils,
handleChangeFor,
data,
errors,
valid,
fieldProblems,
sourceOfFundsType: "inheritance"
}), /* @__PURE__ */ jsxs("div", {
className: SourceOfFunds_module_default.sourceOfFundsGridContainer,
children: [/* @__PURE__ */ jsx(Field, {
el: "fieldset",
name: "amount",
label: formUtils.getLabel("amount", "inheritanceAmount"),
errorMessage: formUtils.getErrorMessage("amount", errors, fieldProblems),
children: (childProps) => /* @__PURE__ */ jsxs(InputGroup, {
...childProps,
id: "currencyGroup",
isFocused,
isInvalid: Boolean(!valid.amount && errors.amount),
children: [/* @__PURE__ */ jsx(Select, {
name: "currency",
"aria-label": commonT(($) => $["currency"]),
isMulti: false,
items: allowedCurrencies ?? [],
selected: data.amount?.currency,
placeholder: commonT(($) => $["select"]),
onChange: handleAmountChange("currency"),
minimal: true
}), /* @__PURE__ */ jsx(InputText, {
...childProps,
name: "amount",
value: data.amount?.value,
readonly: formUtils.isReadOnly("amount"),
onInput: handleAmountChange("amount"),
onBlur: handleOnAmountBlur,
"aria-required": true,
"aria-invalid": !valid.amount,
isValid: valid.amount,
onFocusHandler: () => setIsFocused(true)
})]
})
}), /* @__PURE__ */ jsx(Field, {
name: "dateOfFundsReceived",
label: formUtils.getLabel("dateOfFundsReceived", "inheritanceReceivedOn"),
errorMessage: formUtils.getErrorMessage("dateOfFundsReceived", errors, fieldProblems),
isValid: valid.dateOfFundsReceived,
children: (childProps) => /* @__PURE__ */ jsx(InputDate, {
...childProps,
name: "dateOfFundsReceived",
value: formatDateForInput(data.dateOfFundsReceived),
onInput: handleChangeFor("dateOfFundsReceived", "input"),
onBlur: handleChangeFor("dateOfFundsReceived", "blur"),
"aria-required": true,
"aria-invalid": !valid.dateOfFundsReceived,
max: TODAY_DATE
})
})]
})] });
}
//#endregion
//#region src/components/EFP/tasks/SourceOfFundsDropin/SOFAdditionalData/SOFFinancierModal.tsx
var SOFFinancierModal = (props) => {
const { t: sofT } = useTranslation("sof");
const { t: commonT } = useTranslation("common");
const { financier, handleModalClose, indexNumber, handleFinancierUpdate } = props;
const [formData, setFormData] = useState$1(financier);
const [formErrors, setFormErrors] = useState$1({});
const [confirmOpen, setConfirmOpen] = useState$1(false);
const [isFocused, setIsFocused] = useState$1(false);
const [errorMessage, setErrorMessage] = useState$1("");
const handleInputUpdate = (key, e) => {
const inputEl = e.target;
setErrorMessage("");
const value = inputEl?.value;
let inputData = { [key]: value };
if (["amount", "currency"].includes(key)) inputData = { amount: {
currency: key === "currency" ? value : formData?.amount?.currency,
value: key === "currency" ? formData?.amount?.value : value
} };
const data = {
...formData,
...inputData
};
setFormData(data);
setFormErrors(getInputErrors({
formErrors,
data,
key,
value
}));
};
const handleOnAmountBlur = () => {
setIsFocused(false);
setFormErrors(getInputErrors({
formErrors,
data: formData,
key: "amount",
value: formData?.amount?.value
}));
};
const allFieldsFilled = (data) => {
return data?.firstName && data?.lastName && data?.location && data?.amount?.currency && !Number.isNaN(Number(data?.amount?.value));
};
const handleFinancierSave = () => {
if (formData && allFieldsFilled(formData)) {
handleFinancierUpdate({
formData,
indexNumber
});
handleModalClose();
} else {
setFormErrors([
"firstName",
"lastName",
"location",
"amount"
].reduce((acc, key) => {
const value = key === "amount" ? formData?.amount?.value : formData?.[key];
return {
...acc,
...getInputErrors({
formErrors: void 0,
data: formData,
key,
value
})
};
}, {}));
setErrorMessage(sofT(($) => $["pleaseFillInAllFields"]));
}
};
const handleFinancierDelete = async () => {
handleFinancierUpdate({ indexNumber });
handleModalClose();
};
return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Modal, {
onClose: handleModalClose,
ariaLabel: sofT(($) => $["investorDetails"]),
inset: true,
children: /* @__PURE__ */ jsxs("div", {
className: SourceOfFunds_module_default.sourceOfFundsModal,
children: [
/* @__PURE__ */ jsx(Typography, {
variant: "title-l",
el: "h3",
className: SourceOfFunds_module_default.sourceOfFundsGettingStartedHelpHeader,
children: sofT(($) => $["investorDetails"])
}),
/* @__PURE__ */ jsxs("div", {
className: SourceOfFunds_module_default.sourceOfFundsSofFinancierForm,
children: [
errorMessage && /* @__PURE__ */ jsx(Alert, {
title: sofT(($) => $["errorSubmittingData"]),
variant: "error",
className: SourceOfFunds_module_default.sourceOfFundsSofFinancierFormError,
children: errorMessage
}),
/* @__PURE__ */ jsxs("div", {
className: SourceOfFunds_module_default.sourceOfFundsSofFinancierFormNameGroup,
children: [/* @__PURE__ */ jsx(Field, {
name: "firstName",
label: commonT(($) => $["firstName"]),
errorMessage: formErrors.firstName,
isValid: !formErrors.firstName,
children: (childProps) => /* @__PURE__ */ jsx(InputText, {
...childProps,
name: "firstName",
value: formData?.firstName,
onInput: (e) => handleInputUpdate("firstName", e),
onBlur: (e) => handleInputUpdate("firstName", e),
"aria-required": true,
"aria-invalid": Boolean(formErrors.firstName),
isValid: !formErrors.firstName
})
}), /* @__PURE__ */ jsx(Field, {
name: "lastName",
label: commonT(($) => $["lastName"]),
errorMessage: formErrors.lastName,
isValid: !formErrors.lastName,
children: (childProps) => /* @__PURE__ */ jsx(InputText, {
...childProps,
name: "lastName",
value: formData?.lastName,
onInput: (e) => handleInputUpdate("lastName", e),
onBlur: (e) => handleInputUpdate("lastName", e),
"aria-required": true,
"aria-invalid": Boolean(formErrors.lastName),
isValid: !formErrors.lastName
})
})]
}),
/* @__PURE__ */ jsx(Field, {
name: "location",
label: sofT(($) => $["investorLocation"]),
errorMessage: formErrors.location,
isValid: !formErrors.location,
helperPosition: "below",
showErrorIconBottom: true,
helper: sofT(($) => $["theCityAndCountryRegion"]),
children: (childProps) => /* @__PURE__ */ jsx(InputText, {
...childProps,
name: "location",
value: formData?.location,
onInput: (e) => handleInputUpdate("location", e),
onBlur: (e) => handleInputUpdate("location", e),
"aria-required": true,
"aria-invalid": Boolean(formErrors.location),
isValid: !formErrors.location
})
}),
/* @__PURE__ */ jsx(Field, {
el: "fieldset",
name: "amount",
label: sofT(($) => $["investmentAmount"]),
errorMessage: formErrors.amount,
isValid: !formErrors.amount,
children: (childProps) => /* @__PURE__ */ jsxs(InputGroup, {
...childProps,
id: "currencyGroup",
isFocused,
children: [/* @__PURE__ */ jsx(Select, {
minimal: true,
name: "currency",
"aria-label": commonT(($) => $["currency"]),
isMulti: false,
items: allowedCurrencies,
selected: formData?.amount?.currency,
placeholder: commonT(($) => $["select"]),
onChange: (e) => handleInputUpdate("currency", e)
}), /* @__PURE__ */ jsx(InputText, {
...childProps,
name: "amount",
value: formData?.amount?.value,
onInput: (e) => handleInputUpdate("amount", e),
onBlur: handleOnAmountBlur,
"aria-required": true,
onFocusHandler: () => setIsFocused(true)
})]
})
})
]
}),
/* @__PURE__ */ jsxs("div", {
className: SourceOfFunds_module_default.sourceOfFundsFinancierFooter,
children: [/* @__PURE__ */ jsx(Button, {
onClick: handleFinancierSave,
children: commonT(($) => $["save"])
}), Number.isFinite(indexNumber) && /* @__PURE__ */ jsx(Button, {
variant: "tertiary",
onClick: () => setConfirmOpen(true),
children: sofT(($) => $["deleteInvestorDetails"])
})]
})
]
})
}), confirmOpen && /* @__PURE__ */ jsx(Confirm, {
title: sofT(($) => $["areYouSureYouWantToDeleteThisInvestorDetails"]),
confirmText: commonT(($) => $["delete"]),
onConfirm: handleFinancierDelete,
onCancel: () => setConfirmOpen(false),
critical: true
})] });
};
//#endregion
//#region src/components/EFP/tasks/SourceOfFundsDropin/SOFAdditionalData/AdditionalDataForThirdParty.tsx
function AdditionalDataForThirdParty(props) {
const [showFinancierModal, setShowFinancierModal] = useState$1(false);
const [activeFinancier, setActiveFinancier] = useState$1();
const [activeIndex, setActiveIndex] = useState$1();
const { data, fieldProblems, errors, handleChangeFor, formUtils, valid } = props;
const { t: commonT } = useTranslation("common");
const { t: sofT } = useTranslation("sof");
const handleToggleFinancierModal = () => {
setActiveFinancier(void 0);
setActiveIndex(void 0);
setShowFinancierModal((prev) => !prev);
};
const handleShowUpdateFinancierModal = (index) => {
if (!data.financiers) return;
const financier = data.financiers[index];
setActiveFinancier(financier);
setActiveIndex(index);
setShowFinancierModal(true);
};
const handleFinancierUpdate = ({ formData, indexNumber }) => {
const existingFinanciers = data.financiers || [];
let newFinanciers = [];
if (!formData) {
if (indexNumber !== void 0) newFinanciers = existingFinanciers.filter((_, index) => index !== indexNumber);
} else {
newFinanciers = [...existingFinanciers, formData];
if (Number.isFinite(indexNumber)) newFinanciers = existingFinanciers.map((existingFinancier, i) => i === indexNumber ? formData : existingFinancier);
}
const financierEvent = { target: {
name: "financiers",
value: newFinanciers
} };
handleChangeFor("financiers")(financierEvent);
};
const errorMessage = formUtils.getErrorMessage("financiers", errors, fieldProblems);
return /* @__PURE__ */ jsxs(Fragment$1, { children: [
errors.financiers && !valid.financiers && /* @__PURE__ */ jsx(Alert, {
title: typeof errorMessage == "boolean" ? void 0 : translateTranslatable(commonT, errorMessage),
variant: "error",
className: SourceOfFunds_module_default.sourceOfFundsSofFinancierFormError,
children: sofT(($) => $["addAtLeastOneInvestor"])
}),
data.financiers?.map((financier, index) => /* @__PURE__ */ jsxs("button", {
type: "button",
onClick: () => handleShowUpdateFinancierModal(index),
className: SourceOfFunds_module_default.sourceOfFundsThirdPartyFundingFinancierGroup,
children: [/* @__PURE__ */ jsxs("div", {
className: SourceOfFunds_module_default.sourceOfFundsThirdPartyFundingNameAvatarGroup,
children: [/* @__PURE__ */ jsx(Avatar, {
iconName: "user",
circle: true
}), /* @__PURE__ */ jsxs("div", {
className: SourceOfFunds_module_default.sourceOfFundsThirdPartyFundingNameAddressGroup,
children: [/* @__PURE__ */ jsxs(Typography, {
el: "div",
variant: "body-strongest",
children: [
financier.firstName,
" ",
financier.lastName
]
}), /* @__PURE__ */ jsx(Typography, {
el: "div",
variant: "caption",
children: financier.location
})]
})]
}), /* @__PURE__ */ jsx("div", { children: financier.amount?.currency && financier.amount?.value ? formatAmountWithCurrency(financier.amount.value, financier.amount?.currency) : "" })]
}, index)),
/* @__PURE__ */ jsx("button", {
type: "button",
className: SourceOfFunds_module_default.sourceOfFundsThirdPartyFundingFinancierGroup,
onClick: handleToggleFinancierModal,
children: /* @__PURE__ */ jsxs("div", {
className: SourceOfFunds_module_default.sourceOfFundsThirdPartyFundingNameAvatarGroup,
children: [/* @__PURE__ */ jsx(Avatar, {
iconName: "plus",
variant: "tertiary",
circle: true
}), /* @__PURE__ */ jsx(Typography, {
el: "div",
variant: "body-strongest",
children: sofT(($) => $["addInvestor"])
})]
})
}),
showFinancierModal && /* @__PURE__ */ jsx(SOFFinancierModal, {
financier: activeFinancier,
indexNumber: activeIndex,
handleModalClose: handleToggleFinancierModal,
handleFinancierUpdate
})
] });
}
//#endregion
//#region src/components/EFP/tasks/SourceOfFundsDropin/SourceOfFundsAdditionalData.tsx
function SourceOfFundsAdditionalData(props) {
const { t } = useTranslation("common");
const { form } = useFormContext();
const { handleChangeFor: multiFormHandleChangeFor, data: { additionalData: data, sourceOfFundsType }, errors: { additionalData: errors }, valid: { additionalData: valid }, fieldProblems: { additionalData: fieldProblems } } = form;
const handleChangeFor = useMemo$1(() => (key, mode) => multiFormHandleChangeFor(key, "additionalData", mode), [multiFormHandleChangeFor]);
const handleAmountChange = (key) => (e) => {
const rawValue = e.target.value;
const updatedAmount = {
...data?.amount,
...key === "currency" ? { currency: rawValue } : { value: rawValue === "" ? void 0 : Number(rawValue) }
};
handleChangeFor("amount")({ target: {
name: "amount",
value: updatedAmount
} });
};
const formUtils = createFormUtils(props, t);
const additionalDataProps = {
formUtils,
handleChangeFor,
data,
errors,
valid,
fieldProblems,
handleAmountChange
};
const renderSubForms = () => {
switch (sourceOfFundsType?.type) {
case "gamblingWinnings": return /* @__PURE__ */ jsx(AdditionalDataForGambling, { ...additionalDataProps });
case "cryptocurrencyIncome": return /* @__PURE__ */ jsx(AdditionalDataForCryptocurrency, { ...additionalDataProps });
case "business": return /* @__PURE__ */ jsx(AdditionalDataForBusiness, { ...additionalDataProps });
case "assetSale": return /* @__PURE__ */ jsx(AdditionalDataForAssetSale, { ...additionalDataProps });
case "thirdPartyFunding": return /* @__PURE__ */ jsx(AdditionalDataForThirdParty, { ...additionalDataProps });
case "inheritance": return /* @__PURE__ */ jsx(AdditionalDataForInheritance, { ...additionalDataProps });
case "donations": return /* @__PURE__ */ jsx(AdditionalDataForDonation, { ...additionalDataProps });
default: return null;
}
};
return /* @__PURE__ */ jsxs("form", {
className: SourceOfFunds_module_default.sourceOfFundsAdditionalDataForm,
children: [/* @__PURE__ */ jsx(ErrorPanel, {
verificationErrors: props?.formVerificationErrors,
validationErrors: props?.fieldValidationErrors,
formUtils,
id: "ariaErrorField"
}), renderSubForms()]
});
}
//#endregion
//#region src/components/EFP/tasks/SourceOfFundsDropin/SourceOfFundsType.tsx
function SourceOfFundsType(props) {
const { t } = useTranslation(["common", "sof"]);
const { data: formData, categories, errors: formErrors, fieldValidationErrors: formFieldProblems, sameAsOption, useSameAs, onUseSameAsChange } = props;
const { form } = useFormContext();
const { handleChangeFor } = form;
const handleFieldChange = (fieldName, mode) => handleChangeFor(fieldName, "sourceOfFundsType", mode);
const handleUseSameAsChange = (isChecked) => {
onUseSameAsChange?.(isChecked);
};
const formUtils = createFormUtils(props, t);
const categoryItems = [{
value: "adyen",
label: t(($) => $["transactionsOnThisPlatform"], { ns: "sof" }),
icon: getIconById("adyen")
}, ...categories?.map((item) => ({
value: item.id,
label: t(($) => $[sofCategoryItemMapper[item.name]], { ns: "sof" }),
icon: getIconById(item.id)
})) ?? []];
const errorMessage = formUtils.getErrorMessage("type", formErrors, formFieldProblems);
return /* @__PURE__ */ jsxs(Fragment$1, { children: [sameAsOption && /* @__PURE__ */ jsx("div", {
className: SourceOfFunds_module_default.sourceOfFundsSameAsCheckbox,
children: /* @__PURE__ */ jsx(Field, {
name: "useSameAs",
children: (childProps) => /* @__PURE__ */ jsx(Checkbox, {
...childProps,
"aria-required": false,
"aria-invalid": false,
name: "useSameAs",
label: t(($) => $["useSameFundingSourceAndDetails"], { ns: "sof" }),
checked: Boolean(useSameAs),
onChange: handleUseSameAsChange
})
})
}), /* @__PURE__ */ jsx(Field, {
el: "fieldset",
name: "type",
children: () => /* @__PURE__ */ jsx(TileGroup, {
name: "type",
tiles: categoryItems,
errorMessage: typeof errorMessage !== "boolean" ? translateTranslatable(t, errorMessage) : void 0,
selected: formData?.type ? formData.type : [],
onChange: handleFieldChange("type", "input")
})
})] });
}
function getIconById(id) {
switch (id) {
case "adyen": return "store";
case "business": return "revenue-accelerate";
case "assetSale": return "house";
case "dividendIncome": return "graph-up";
case "thirdPartyFunding": return "graph";
case "employment": return "headquarter";
case "donations": return "gift";
case "inheritance": return "certificate";
case "financialAid": return "capital";
case "rentalIncome": return "house";
case "royaltyIncome": return "cash-stack";
case "pensionIncome": return "bank";
case "insuranceSettlement": return "funds-in";
case "cryptocurrencyIncome": return "coins";
case "loans": return "capital";
case "gamblingWinnings": return "cash-stack";
default: return "contract";
}
}
//#endregion
//#region src/components/EFP/tasks/SourceOfFundsDropin/SourceOfFunds.tsx
function SourceOfFunds(props) {
const { activeForm, activeBusinessLine, sourceOfFundsType, sameAsOption, useSameAs, onUseSameAsChange } = props;
const { form } = useFormContext();
const { data: formData, errors, valid, fieldProblems: fieldValidationErrors } = form;
const { data: sourceOfFundsTypesData, isLoading } = useSourceOfFundsTypes();
const { t: sofT } = useTranslation("sof");
const pageHeadings = useMemo$1(() => getPageHeadings(sourceOfFundsType ?? "adyen"), [sourceOfFundsType]);
return isLoading || !activeBusinessLine ? /* @__PURE__ */ jsx("div", {
className: SourceOfFunds_module_default.sourceOfFundsWrapperLoading,
children: /* @__PURE__ */ jsx(Loader, {})
}) : /* @__PURE__ */ jsxs("div", {
className: "adyen-kyc-form-wrapper",
children: [
/* @__PURE__ */ jsxs("div", {
className: SourceOfFunds_module_default.sourceOfFundsWrapperHeading,
children: [/* @__PURE__ */ jsx(Typography, {
el: "h1",
variant: "title-l",
children: activeForm?.formId === "additionalData" ? sofT(($) => $[pageHeadings.heading]) : sofT(($) => $["selectASourceOfFunding"], { type: getServiceTranslationSelectTitle(sofT, activeBusinessLine?.service || "").toLowerCase() })
}), /* @__PURE__ */ jsxs(Typography, {
className: SourceOfFunds_module_default.sourceOfFundsWrapperDescription,
children: [activeForm?.formId === "additionalData" && pageHeadings.description && sofT(($) => $[pageHeadings.description]), sourceOfFundsTypesData?.length === 0 && sofT(($) => $["noCategoriesAvailable"])]
})]
}),
sofErrorMessage.value && /* @__PURE__ */ jsxs(Typography, {
variant: "caption",
color: "critical",
"aria-live": "polite",
className: "adyen-kyc-u-justify-content-center adyen-kyc-u-display-flex",
children: [/* @__PURE__ */ jsx(Icon, {
name: "field-error",
className: "adyen-kyc-u-margin-right-2"
}), /* @__PURE__ */ jsx("span", { children: sofErrorMessage.value })]
}),
activeForm?.formId === "sourceOfFundsType" && /* @__PURE__ */ jsx(SourceOfFundsType, {
categories: sourceOfFundsTypesData,
data: formData?.sourceOfFundsType,
errors: errors?.sourceOfFundsType,