@swan-io/shared-business 1.1.0 → 1.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swan-io/shared-business",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "engines": {
     "node": ">=14.0.0",
     "yarn": "^1.20.0"
@@ -22,11 +22,14 @@
     "not ie <= 11",
     "safari >= 12"
   ],
+  "license": "MIT",
   "dependencies": {
     "@formatjs/intl": "2.6.7",
+    "@googlemaps/js-api-loader": "1.15.1",
     "@swan-io/boxed": "0.12.1",
-    "@swan-io/lake": "1.0.0",
+    "@swan-io/lake": "*",
     "react": "18.2.0",
+    "react-atomic-state": "1.2.7",
     "react-dom": "18.2.0",
     "react-native-web": "0.18.12",
     "react-ux-form": "1.3.0",
@@ -35,6 +38,7 @@
   "devDependencies": {
     "@testing-library/react": "13.4.0",
     "@testing-library/user-event": "14.4.3",
+    "@types/google.maps": "3.52.2",
     "@types/react": "18.0.28",
     "@types/react-dom": "18.0.11",
     "@types/react-native": "0.70.11",

package/src/components/AddressFormPart.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+import { CountryCCA3 } from "@swan-io/shared-business/src/constants/countries";
+import { useForm } from "react-ux-form";
+type AddressField = {
+    address: string;
+    city: string;
+    postalCode: string;
+};
+type FormProps = Pick<ReturnType<typeof useForm<AddressField>>, "Field" | "setFieldValue" | "listenFields">;
+type Props = {
+    initialAddress: string;
+    initialCity: string;
+    initialPostalCode: string;
+    country: CountryCCA3;
+    label: string;
+    optionalLabel?: string;
+    placeholder?: string;
+    isLarge: boolean;
+} & FormProps;
+export declare const AddressFormPart: ({ initialAddress, initialCity, initialPostalCode, country, label, optionalLabel, placeholder, Field, setFieldValue, listenFields, isLarge, }: Props) => JSX.Element;
+export {};

package/src/components/AddressFormPart.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { AddressSearchInput } from "@swan-io/shared-business/src/components/AddressSearchInput";
+import { LakeButton } from "@swan-io/lake/src/components/LakeButton";
+import { LakeLabel } from "@swan-io/lake/src/components/LakeLabel";
+import { LakeTextInput } from "@swan-io/lake/src/components/LakeTextInput";
+import { Space } from "@swan-io/lake/src/components/Space";
+import { useBoolean } from "@swan-io/lake/src/hooks/useBoolean";
+import { useCallback, useEffect } from "react";
+import { locale, t } from "../utils/i18n";
+export const AddressFormPart = ({ initialAddress, initialCity, initialPostalCode, country, label, optionalLabel, placeholder, Field, setFieldValue, listenFields, isLarge, }) => {
+    const [manualModeEnabled, setManualMode] = useBoolean(initialAddress !== "" || initialCity !== "" || initialPostalCode !== "");
+    useEffect(() => {
+        if (!manualModeEnabled) {
+            return listenFields(["city", "postalCode"], () => {
+                setManualMode.on();
+            });
+        }
+    }, [manualModeEnabled, listenFields, setManualMode]);
+    const onSuggestion = useCallback((place) => {
+        setFieldValue("address", place.completeAddress);
+        setFieldValue("city", place.city);
+        setFieldValue("postalCode", place.postalCode);
+        setManualMode.on();
+    }, [setManualMode, setFieldValue]);
+    return (_jsxs(_Fragment, { children: [_jsx(Field, { name: "address", children: ({ ref, value, onChange, error }) => (_jsx(LakeLabel, { label: label ?? t("addressFormPart.addressLabel"), optionalLabel: optionalLabel, render: id => (_jsx(AddressSearchInput, { inputRef: ref, emptyResultText: t("common.noResult"), placeholder: placeholder ?? t("addressFormPart.placeholder"), language: locale.language, id: id, country: country, value: value, error: error, onValueChange: onChange, onSuggestion: onSuggestion })), actions: !manualModeEnabled && isLarge ? (_jsx(LakeButton, { mode: "secondary", size: "small", onPress: setManualMode.on, children: t("addressFormPart.setManual") })) : null })) }), !manualModeEnabled && !isLarge ? (_jsx(LakeButton, { mode: "secondary", size: "small", onPress: setManualMode.on, children: t("addressFormPart.setManual") })) : null, manualModeEnabled ? (_jsxs(_Fragment, { children: [_jsx(Space, { height: 12 }), _jsx(Field, { name: "city", children: ({ ref, value, valid, error, onChange }) => (_jsx(LakeLabel, { label: t("addressFormPart.cityLabel"), render: id => (_jsx(LakeTextInput, { ref: ref, nativeID: id, value: value, valid: valid, error: error, onChangeText: onChange })) })) }), _jsx(Space, { height: 12 }), _jsx(Field, { name: "postalCode", children: ({ ref, value, valid, error, onChange }) => (_jsx(LakeLabel, { label: t("addressFormPart.postCodeLabel"), render: id => (_jsx(LakeTextInput, { ref: ref, nativeID: id, value: value, valid: valid, error: error, onChangeText: onChange })) })) })] })) : null] }));
+};

package/src/components/AddressSearchInput.d.ts

@@ -1,11 +1,6 @@
-/// <reference types="react" />
-import { CountryCCA3 } from "../constants/countries";
+import { CountryCCA3 } from "@swan-io/shared-business/src/constants/countries";
+import { MutableRefObject } from "react";
 import { StyleProp, ViewStyle } from "react-native";
-type Suggestion = {
-    id: string;
-    firstLine: string;
-    secondLine: string;
-};
 export type PlaceDetail = {
     completeAddress: string;
     streetNumber: string;
@@ -14,19 +9,20 @@ export type PlaceDetail = {
     postalCode: string;
 };
 type Props = {
+    inputRef?: MutableRefObject<unknown>;
     id?: string;
     country: CountryCCA3;
     disabled?: boolean;
     error?: string;
-    onSuggestionRequest: (input: string) => Promise<Suggestion[]>;
-    onSelectSuggestion: (suggestion: Suggestion) => Promise<PlaceDetail>;
+    onSuggestion?: (suggestion: PlaceDetail) => void;
     onValueChange: (value: string) => void;
-    emptyResultText: string;
     style?: StyleProp<ViewStyle>;
     value?: string;
+    language: "en" | "es" | "de" | "fr" | "it" | "nl" | "pt";
     placeholder: string;
     shouldDisplaySuggestions?: boolean;
-    ListFooterComponent?: React.ReactNode;
+    emptyResultText: string;
+    apiKey?: string;
 };
-export declare const AddressSearchInput: ({ id, country, disabled, error, value: initialValue, onValueChange, onSuggestionRequest, onSelectSuggestion, emptyResultText, placeholder, shouldDisplaySuggestions, ListFooterComponent, }: Props) => JSX.Element;
+export declare const AddressSearchInput: ({ inputRef, id, country, disabled, error, value: initialValue, onValueChange, onSuggestion, language, placeholder, shouldDisplaySuggestions, emptyResultText, apiKey, }: Props) => JSX.Element | null;
 export {};

package/src/components/AddressSearchInput.js

@@ -1,13 +1,47 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { AsyncData, Future } from "@swan-io/boxed";
+import { countriesWithMultipleCCA3, getCCA3forCCA2, } from "@swan-io/shared-business/src/constants/countries";
+import { AutoWidthImage } from "@swan-io/lake/src/components/AutoWidthImage";
+import { Box } from "@swan-io/lake/src/components/Box";
 import { LakeCombobox } from "@swan-io/lake/src/components/LakeCombobox";
 import { LakeTextInput } from "@swan-io/lake/src/components/LakeTextInput";
-import { useEffect, useRef, useState } from "react";
-import { LakeText } from "@swan-io/lake/src/components/LakeText";
-export const AddressSearchInput = ({ id, country, disabled, error, value: initialValue, onValueChange, onSuggestionRequest, onSelectSuggestion, emptyResultText, placeholder, shouldDisplaySuggestions = true, ListFooterComponent, }) => {
+import { colors } from "@swan-io/lake/src/constants/colors";
+import { typography } from "@swan-io/lake/src/constants/typography";
+import { useFirstMountState } from "@swan-io/lake/src/hooks/useFirstMountState";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { StyleSheet, Text } from "react-native";
+import { match } from "ts-pattern";
+import poweredByGoogle from "../assets/images/powered_by_google_on_white_hdpi.png";
+import { useGoogleMapSDK } from "../hooks/useGoogleMapSDK";
+const styles = StyleSheet.create({
+    itemTitle: {
+        ...typography.bodyLarge,
+        lineHeight: typography.lineHeights.title,
+    },
+    itemSubtitle: {
+        ...typography.bodySmall,
+        color: colors.gray[50],
+    },
+    poweredByGoogle: {
+        paddingVertical: 8,
+        paddingHorizontal: 16,
+    },
+});
+export const AddressSearchInput = ({ inputRef, id, country, disabled, error, value: initialValue, onValueChange, onSuggestion, language, placeholder, shouldDisplaySuggestions = true, emptyResultText, apiKey, }) => {
+    const isFirstMount = useFirstMountState();
     const [state, setState] = useState(AsyncData.NotAsked());
     const [value, setValue] = useState(initialValue ?? "");
     const showTriggerSearchRef = useRef(true);
+    const sdk = useGoogleMapSDK({
+        language,
+        apiKey,
+    });
+    const autocomplete = useMemo(() => sdk.map(google => new google.maps.places.AutocompleteService()), [sdk]);
+    useEffect(() => {
+        if (!isFirstMount && initialValue != null) {
+            setValue(initialValue);
+        }
+    }, [isFirstMount, initialValue]);
     useEffect(() => {
         if (value.length <= 3 || !shouldDisplaySuggestions || showTriggerSearchRef.current === false) {
             return setState(AsyncData.NotAsked());
@@ -15,24 +49,73 @@ export const AddressSearchInput = ({ id, country, disabled, error, value: initia
         setState(AsyncData.Loading());
         const request = Future.make(resolve => {
             const timeoutId = setTimeout(() => {
-                Future.fromPromise(onSuggestionRequest(value)).onResolve(resolve);
+                if (autocomplete.isDone()) {
+                    Future.fromPromise(autocomplete.get().getPlacePredictions({
+                        input: value,
+                        componentRestrictions: { country: countriesWithMultipleCCA3[country] ?? [country] },
+                        types: ["address"],
+                    })).onResolve(resolve);
+                }
             }, 250);
             return () => clearTimeout(timeoutId);
-        });
+        }).mapOk(({ predictions }) => predictions.map(p => ({ value: p.place_id, prediction: p })), true);
         request.onResolve(value => setState(AsyncData.Done(value)));
         return () => request.cancel();
-    }, [country, value, shouldDisplaySuggestions, onSuggestionRequest]);
+    }, [country, value, autocomplete, shouldDisplaySuggestions]);
     useEffect(() => {
         showTriggerSearchRef.current = true;
     }, [value]);
-    if (shouldDisplaySuggestions) {
-        return (_jsx(LakeCombobox, { nativeID: id, placeholder: placeholder, value: value, items: state, icon: "search-filled", disabled: disabled, error: error, ListFooterComponent: ListFooterComponent, onSelectItem: suggestion => onSelectSuggestion(suggestion), onValueChange: value => {
-                setValue(value);
-                onValueChange(value);
-            }, keyExtractor: item => item.id, emptyResultText: emptyResultText, renderItem: item => (_jsxs(_Fragment, { children: [_jsx(LakeText, { variant: "semibold", children: item.firstLine }), _jsx(LakeText, { variant: "smallRegular", children: item.secondLine })] })) }));
-    }
-    return (_jsx(LakeTextInput, { nativeID: id, placeholder: placeholder, value: value, icon: "search-filled", disabled: disabled, error: error, onChangeText: value => {
-            setValue(value);
-            onValueChange(value);
-        } }));
+    return sdk.match({
+        NotAsked: () => null,
+        Loading: () => null,
+        Done: google => {
+            if (shouldDisplaySuggestions) {
+                const place = new google.maps.places.PlacesService(document.createElement("div"));
+                const selectAddress = (suggestion) => {
+                    place.getDetails({ placeId: suggestion.value }, placeDetail => {
+                        const result = {
+                            completeAddress: "",
+                            streetNumber: "",
+                            postalCode: "",
+                            country: "",
+                            city: "",
+                        };
+                        placeDetail?.address_components?.forEach(({ types, short_name, long_name }) => {
+                            const type = types[0];
+                            match(type)
+                                .with("street_number", () => (result.streetNumber = long_name))
+                                .with("route", () => (result.completeAddress = long_name))
+                                .with("postal_code", () => (result.postalCode = short_name))
+                                .with("country", () => (result.country = getCCA3forCCA2(short_name) ?? short_name))
+                                .with("locality", () => (result.city = long_name))
+                                .otherwise(() => { });
+                        });
+                        if (result.streetNumber != "") {
+                            if (placeDetail?.name === `${result.completeAddress} ${result.streetNumber}`) {
+                                result.completeAddress = `${result.completeAddress} ${result.streetNumber}`;
+                            }
+                            else {
+                                result.completeAddress = `${result.streetNumber} ${result.completeAddress}`;
+                            }
+                        }
+                        showTriggerSearchRef.current = false;
+                        setValue(result.completeAddress);
+                        onSuggestion?.(result);
+                    });
+                };
+                return (_jsx(LakeCombobox, { inputRef: inputRef, nativeID: id, placeholder: placeholder, value: value, items: state, icon: "search-filled", disabled: disabled, error: error, ListFooterComponent: _jsx(Box, { direction: "row", justifyContent: "end", style: styles.poweredByGoogle, children: _jsx(AutoWidthImage, { height: 14, sourceUri: poweredByGoogle }) }), onSelectItem: suggestion => selectAddress(suggestion), onValueChange: value => {
+                        setValue(value);
+                        onValueChange(value);
+                    }, keyExtractor: item => item.value, emptyResultText: emptyResultText, renderItem: item => (_jsxs(_Fragment, { children: [_jsx(Text, { numberOfLines: 1, selectable: false, style: styles.itemTitle, children: item.prediction.structured_formatting.main_text }), _jsx(Text, { numberOfLines: 1, selectable: false, style: styles.itemSubtitle, children: item.prediction.structured_formatting.secondary_text })] })) }));
+            }
+            return (_jsx(LakeTextInput
+            // @ts-expect-error
+            , { 
+                // @ts-expect-error
+                ref: inputRef, nativeID: id, placeholder: placeholder, value: value, icon: "search-filled", disabled: disabled, error: error, onChangeText: value => {
+                    setValue(value);
+                    onValueChange(value);
+                } }));
+        },
+    });
 };

package/src/components/BeneficiaryForm.d.ts

@@ -0,0 +1,39 @@
+/// <reference types="react" />
+import { CountryCCA3 } from "../constants/countries";
+type BeneficiaryType = "HasCapital" | "LegalRepresentative" | "Other";
+type AccountCountry = "DEU" | "ESP" | "FRA";
+export type BeneficiaryFormStep = "common" | "address";
+export type EditorState = {
+    reference: string;
+    firstName: string;
+    lastName: string;
+    birthDate: string;
+    birthCountryCode: CountryCCA3;
+    birthCity: string;
+    birthCityPostalCode: string;
+    type: BeneficiaryType;
+    indirect: boolean;
+    direct: boolean;
+    totalCapitalPercentage?: number;
+    residencyAddressLine1?: string;
+    residencyAddressCity?: string;
+    residencyAddressCountry?: string;
+    residencyAddressPostalCode?: string;
+    taxIdentificationNumber?: string;
+};
+type Props = {
+    initialState?: EditorState;
+    accountCountry: AccountCountry;
+    step: BeneficiaryFormStep;
+    onStepChange: (step: BeneficiaryFormStep) => void;
+    onSave: (editorState: EditorState) => void | Promise<void>;
+    onClose: () => void;
+    onCityLoadError: (error: unknown) => void;
+};
+export type BeneficiaryFormRef = {
+    cancel: () => void;
+    submit: () => void;
+};
+export declare const validateUbo: (editorState: EditorState, accountCountry: AccountCountry) => Partial<Record<keyof EditorState, string | undefined>>;
+export declare const BeneficiaryForm: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<BeneficiaryFormRef | undefined>>;
+export {};

package/src/components/BeneficiaryForm.js

@@ -0,0 +1,282 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Box } from "@swan-io/lake/src/components/Box";
+import { LakeLabelledCheckbox } from "@swan-io/lake/src/components/LakeCheckbox";
+import { LakeLabel } from "@swan-io/lake/src/components/LakeLabel";
+import { LakeText } from "@swan-io/lake/src/components/LakeText";
+import { LakeTextInput } from "@swan-io/lake/src/components/LakeTextInput";
+import { RadioGroup } from "@swan-io/lake/src/components/RadioGroup";
+import { ResponsiveContainer } from "@swan-io/lake/src/components/ResponsiveContainer";
+import { Space } from "@swan-io/lake/src/components/Space";
+import { StepDots } from "@swan-io/lake/src/components/StepDots";
+import { breakpoints, colors } from "@swan-io/lake/src/constants/design";
+import { noop } from "@swan-io/lake/src/utils/function";
+import { isNotNullish, isNotNullishOrEmpty } from "@swan-io/lake/src/utils/nullish";
+import { forwardRef, useEffect, useImperativeHandle, useRef, useState } from "react";
+import { StyleSheet, View } from "react-native";
+import { hasDefinedKeys, useForm } from "react-ux-form";
+import { Rifm } from "rifm";
+import { match } from "ts-pattern";
+import { v4 as uuid } from "uuid";
+import { individualCountriesItems, isCountryCCA3 } from "../constants/countries";
+import { decodeBirthDate, encodeBirthDate } from "../utils/date";
+import { locale, rifmDateProps, t } from "../utils/i18n";
+import { validateBooleanRequired, validateIndividualTaxNumber, validateNullableRequired, validateRequired, } from "../utils/validation";
+import { AddressFormPart } from "./AddressFormPart";
+import { CountryPicker } from "./CountryPicker";
+import { LakeCityInput } from "./LakeCityInput";
+const styles = StyleSheet.create({
+    inputContainer: {
+        flex: 1,
+    },
+});
+const beneficiaryTypes = [
+    {
+        value: "LegalRepresentative",
+        name: t("beneficiaryForm.beneficiary.legalRepresentative"),
+    },
+    { value: "HasCapital", name: t("beneficiaryForm.beneficiary.ownershipOfCapital") },
+    { value: "Other", name: t("beneficiaryForm.beneficiary.other") },
+];
+export const validateUbo = (editorState, accountCountry) => {
+    const isAddressRequired = accountCountry === "DEU";
+    return {
+        firstName: validateNullableRequired(editorState.firstName),
+        lastName: validateNullableRequired(editorState.lastName),
+        birthDate: validateNullableRequired(editorState.birthDate),
+        birthCountryCode: validateNullableRequired(editorState.birthCountryCode),
+        birthCity: validateNullableRequired(editorState.birthCity),
+        birthCityPostalCode: validateNullableRequired(editorState.birthCityPostalCode),
+        type: validateNullableRequired(editorState.type),
+        totalCapitalPercentage: editorState.type === "HasCapital"
+            ? validateNullableRequired(editorState.totalCapitalPercentage?.toString())
+            : undefined,
+        residencyAddressLine1: isAddressRequired
+            ? validateNullableRequired(editorState.residencyAddressLine1)
+            : undefined,
+        residencyAddressCity: isAddressRequired
+            ? validateNullableRequired(editorState.residencyAddressCity)
+            : undefined,
+        residencyAddressCountry: isAddressRequired
+            ? validateNullableRequired(editorState.residencyAddressCountry)
+            : undefined,
+        residencyAddressPostalCode: isAddressRequired
+            ? validateNullableRequired(editorState.residencyAddressPostalCode)
+            : undefined,
+        taxIdentificationNumber: validateIndividualTaxNumber(editorState.taxIdentificationNumber ?? ""),
+        indirect: editorState.type !== "HasCapital" || editorState.direct === true
+            ? undefined
+            : validateBooleanRequired(editorState.indirect),
+        direct: editorState.type !== "HasCapital" || editorState.indirect === true
+            ? undefined
+            : validateBooleanRequired(editorState.direct),
+    };
+};
+const getCapitalType = (direct, indirect) => {
+    if (direct === true && indirect === true) {
+        return "both";
+    }
+    if (direct === true) {
+        return "direct";
+    }
+    if (indirect === true) {
+        return "indirect";
+    }
+    return "none";
+};
+const getDirectAndIndirect = (capitalType) => {
+    return match(capitalType)
+        .with("both", () => [true, true])
+        .with("direct", () => [true, false])
+        .with("indirect", () => [false, true])
+        .with("none", () => [false, false])
+        .exhaustive();
+};
+/**
+ * This component was created to handle validation easily with react-ux-form
+ * Without this component, we have to validate direct and indirect checkboxes separately
+ * But validation is run only onChange or onSubmit, so when both checkboxes were unchecked, check one of them doesn't revalidate the other one
+ * Another way is combining direct and indirect values with `formStatus` but the error appears or disappears too early
+ * So with this component we need only 1 validator making possible the best UX without caveats
+ */
+const CapitalTypeCheckboxes = ({ value, error, onChange }) => {
+    return (_jsxs(View, { children: [_jsxs(Box, { direction: "row", alignItems: "center", children: [_jsx(LakeLabelledCheckbox, { value: value === "direct" || value === "both", onValueChange: direct => {
+                            match({ direct, value })
+                                .with({ direct: true, value: "none" }, () => onChange("direct"))
+                                .with({ direct: true, value: "indirect" }, () => onChange("both"))
+                                .with({ direct: false, value: "direct" }, () => onChange("none"))
+                                .with({ direct: false, value: "both" }, () => onChange("indirect"))
+                                // other cases are impossible so we don't need to handle them
+                                .otherwise(noop);
+                        }, label: t("beneficiaryForm.beneficiary.directly"), isError: error != null }), _jsx(Space, { width: 24 }), _jsx(LakeLabelledCheckbox, { value: value === "indirect" || value === "both", onValueChange: indirect => {
+                            match({ indirect, value })
+                                .with({ indirect: true, value: "none" }, () => onChange("indirect"))
+                                .with({ indirect: true, value: "direct" }, () => onChange("both"))
+                                .with({ indirect: false, value: "indirect" }, () => onChange("none"))
+                                .with({ indirect: false, value: "both" }, () => onChange("direct"))
+                                // other cases are impossible so we don't need to handle them
+                                .otherwise(noop);
+                        }, label: t("beneficiaryForm.beneficiary.indirectly"), isError: error != null })] }), _jsx(Space, { height: 4 }), _jsx(LakeText, { color: colors.negative[400], children: error ?? " " })] }));
+};
+const formSteps = ["common", "address"];
+const requiredStepFields = [
+    "firstName",
+    "lastName",
+    "birthDate",
+    "birthCountryCode",
+    "birthCity",
+    "birthCityPostalCode",
+    "type",
+];
+export const BeneficiaryForm = forwardRef(({ initialState, accountCountry, step, onStepChange, onClose, onSave, onCityLoadError }, ref) => {
+    const [reference] = useState(() => initialState?.reference ?? uuid());
+    const isAddressRequired = accountCountry === "DEU";
+    const commonStepValues = useRef();
+    const initialBirthDate = initialState?.birthDate;
+    const { Field, FieldsListener, setFieldValue, submitForm, listenFields, validateField } = useForm({
+        firstName: {
+            initialValue: initialState?.firstName ?? "",
+            validate: validateNullableRequired,
+            sanitize: value => value?.trim(),
+        },
+        lastName: {
+            initialValue: initialState?.lastName ?? "",
+            validate: validateNullableRequired,
+            sanitize: value => value?.trim(),
+        },
+        birthDate: {
+            initialValue: isNotNullishOrEmpty(initialBirthDate)
+                ? decodeBirthDate(initialBirthDate)
+                : "",
+            validate: validateNullableRequired,
+            sanitize: value => value?.trim(),
+        },
+        birthCountryCode: {
+            initialValue: initialState?.birthCountryCode ?? accountCountry,
+            validate: validateNullableRequired,
+        },
+        birthCity: {
+            initialValue: initialState?.birthCity ?? "",
+            validate: validateNullableRequired,
+            sanitize: value => value?.trim(),
+        },
+        birthCityPostalCode: {
+            initialValue: initialState?.birthCityPostalCode ?? "",
+            validate: validateNullableRequired,
+            sanitize: value => value?.trim(),
+        },
+        type: {
+            initialValue: initialState?.type ?? "LegalRepresentative",
+            validate: validateRequired,
+        },
+        capitalType: {
+            initialValue: getCapitalType(initialState?.direct, initialState?.indirect),
+            validate: (value, { getFieldState }) => {
+                const type = getFieldState("type");
+                if (type.value === "HasCapital" && value === "none") {
+                    return t("beneficiaryForm.beneficiary.directOrIndirect");
+                }
+                return undefined;
+            },
+        },
+        totalCapitalPercentage: {
+            initialValue: initialState?.totalCapitalPercentage?.toString(),
+            validate: validateNullableRequired,
+            sanitize: value => value?.trim(),
+        },
+        address: {
+            initialValue: initialState?.residencyAddressLine1,
+            validate: isAddressRequired ? validateNullableRequired : undefined,
+            sanitize: value => value?.trim(),
+        },
+        city: {
+            initialValue: initialState?.residencyAddressCity,
+            validate: isAddressRequired ? validateNullableRequired : undefined,
+            sanitize: value => value?.trim(),
+        },
+        postalCode: {
+            initialValue: initialState?.residencyAddressPostalCode,
+            validate: isAddressRequired ? validateNullableRequired : undefined,
+            sanitize: value => value?.trim(),
+        },
+        country: {
+            initialValue: isCountryCCA3(initialState?.residencyAddressCountry)
+                ? initialState?.residencyAddressCountry
+                : accountCountry,
+            validate: isAddressRequired ? validateNullableRequired : undefined,
+        },
+        taxIdentificationNumber: {
+            initialValue: initialState?.taxIdentificationNumber,
+            validate: validateIndividualTaxNumber,
+            sanitize: value => value?.trim(),
+        },
+    });
+    const hasBeenSubmittedOnce = useRef(false);
+    useEffect(() => {
+        return listenFields(["type"], () => {
+            if (hasBeenSubmittedOnce.current) {
+                // The setTimeout is needed here so that the `validateField`
+                // runs *after* the <Field /> mounts, as it's a no-op if not mounted
+                setTimeout(() => {
+                    void validateField("totalCapitalPercentage");
+                }, 100);
+            }
+        });
+    }, [listenFields, validateField]);
+    useImperativeHandle(ref, () => {
+        return {
+            cancel: () => {
+                match(step)
+                    .with("common", () => onClose())
+                    .with("address", () => onStepChange("common"))
+                    .exhaustive();
+            },
+            submit: () => {
+                hasBeenSubmittedOnce.current = true;
+                submitForm(values => {
+                    if (step === "common" &&
+                        isAddressRequired &&
+                        hasDefinedKeys(values, requiredStepFields)) {
+                        commonStepValues.current = values;
+                        onStepChange("address");
+                        return;
+                    }
+                    const allStepsValues = { ...commonStepValues.current, ...values };
+                    if (hasDefinedKeys(allStepsValues, requiredStepFields)) {
+                        const [direct, indirect] = getDirectAndIndirect(values.capitalType ?? "none");
+                        return onSave({
+                            reference,
+                            firstName: allStepsValues.firstName,
+                            lastName: allStepsValues.lastName,
+                            birthDate: encodeBirthDate(allStepsValues.birthDate),
+                            birthCountryCode: allStepsValues.birthCountryCode,
+                            birthCity: allStepsValues.birthCity,
+                            birthCityPostalCode: allStepsValues.birthCityPostalCode,
+                            type: allStepsValues.type,
+                            indirect,
+                            direct,
+                            totalCapitalPercentage: isNotNullish(allStepsValues.totalCapitalPercentage)
+                                ? parseInt(allStepsValues.totalCapitalPercentage, 10)
+                                : undefined,
+                            residencyAddressLine1: allStepsValues.address,
+                            residencyAddressCity: allStepsValues.city,
+                            residencyAddressCountry: allStepsValues.country,
+                            residencyAddressPostalCode: allStepsValues.postalCode,
+                            taxIdentificationNumber: allStepsValues.taxIdentificationNumber,
+                        });
+                    }
+                });
+            },
+        };
+    });
+    return (_jsx(ResponsiveContainer, { breakpoint: breakpoints.tiny, children: ({ small, large }) => (_jsxs(_Fragment, { children: [match(step)
+                    .with("common", () => (_jsxs(View, { accessibilityRole: "form", children: [_jsxs(Box, { direction: small ? "column" : "row", children: [_jsx(Field, { name: "firstName", children: ({ value, onChange, error }) => (_jsx(LakeLabel, { label: t("beneficiaryForm.beneficiary.firstName"), style: styles.inputContainer, render: id => (_jsx(LakeTextInput, { error: error, placeholder: t("beneficiaryForm.beneficiary.firstNamePlaceholder"), nativeID: id, value: value, onChangeText: onChange })) })) }), _jsx(Space, { width: 12 }), _jsx(Field, { name: "lastName", children: ({ value, onChange, error }) => (_jsx(LakeLabel, { label: t("beneficiaryForm.beneficiary.lastName"), style: styles.inputContainer, render: id => (_jsx(LakeTextInput, { error: error, placeholder: t("beneficiaryForm.beneficiary.lastNamePlaceholder"), nativeID: id, value: value, onChangeText: onChange })) })) })] }), _jsxs(Box, { direction: small ? "column" : "row", children: [_jsx(Field, { name: "birthDate", children: ({ value, onChange, error }) => (_jsx(LakeLabel, { label: t("beneficiaryForm.beneficiary.birthDate"), style: styles.inputContainer, render: id => (_jsx(Rifm, { value: value ?? "", onChange: onChange, ...rifmDateProps, children: ({ value, onChange }) => (_jsx(LakeTextInput, { error: error, placeholder: locale.datePlaceholder, nativeID: id, value: value, onChange: onChange })) })) })) }), _jsx(Space, { width: 12 }), _jsx(Field, { name: "birthCountryCode", children: ({ value, onChange, error }) => (_jsx(LakeLabel, { label: t("beneficiaryForm.beneficiary.birthCountry"), style: styles.inputContainer, render: id => (_jsx(CountryPicker, { nativeID: id, error: error, value: value, placeholder: t("beneficiaryForm.beneficiary.birthCountryPlaceholder"), items: individualCountriesItems, onValueChange: onChange })) })) })] }), _jsx(Box, { direction: small ? "column" : "row", children: _jsx(FieldsListener, { names: ["birthCountryCode"], children: ({ birthCountryCode }) => (_jsxs(_Fragment, { children: [_jsx(Field, { name: "birthCity", children: ({ value, onChange, error }) => (_jsx(LakeLabel, { label: t("beneficiaryForm.beneficiary.birthCity"), style: styles.inputContainer, render: id => (_jsx(LakeCityInput, { nativeID: id, error: error, country: birthCountryCode.value, value: value ?? "", onValueChange: onChange, placeholder: birthCountryCode.value == null
+                                                        ? t("beneficiaryForm.beneficiary.fillBirthCountry")
+                                                        : t("beneficiaryForm.beneficiary.birthCityPlaceholder"), onSuggestion: place => {
+                                                        onChange(place.city);
+                                                        setFieldValue("birthCityPostalCode", place.postalCode);
+                                                    }, onLoadError: onCityLoadError })) })) }), _jsx(Space, { width: 12 }), _jsx(Field, { name: "birthCityPostalCode", children: ({ value, onChange, error }) => (_jsx(LakeLabel, { label: t("beneficiaryForm.beneficiary.birthPostalCode"), style: styles.inputContainer, render: id => (_jsx(LakeTextInput, { error: error, placeholder: birthCountryCode.value == null
+                                                        ? t("beneficiaryForm.beneficiary.fillBirthCountry")
+                                                        : t("beneficiaryForm.beneficiary.birthPostalCodePlaceholder"), nativeID: id, disabled: birthCountryCode.value === undefined, value: value, onChangeText: onChange })) })) })] })) }) }), _jsx(Field, { name: "type", children: ({ value, onChange }) => (_jsx(LakeLabel, { label: t("beneficiaryForm.beneficiary.type"), type: "radioGroup", render: () => (_jsx(RadioGroup, { direction: "row", value: value, onValueChange: onChange, items: beneficiaryTypes })) })) }), _jsx(FieldsListener, { names: ["type"], children: ({ type }) => type.value === "HasCapital" ? (_jsxs(_Fragment, { children: [_jsx(Field, { name: "totalCapitalPercentage", children: ({ value, onChange, error }) => (_jsx(LakeLabel, { label: t("beneficiaryForm.beneficiary.totalCapitalPercentage"), render: id => (_jsx(LakeTextInput, { error: error, unit: "%", keyboardType: "decimal-pad", accessibilityValueMin: 0, accessibilityValueMax: 100, nativeID: id, value: value, onChangeText: onChange })) })) }), _jsx(Space, { height: 12 }), _jsx(Field, { name: "capitalType", children: ({ value, error, onChange }) => (_jsx(CapitalTypeCheckboxes, { value: value ?? "none", error: error, onChange: onChange })) })] })) : null })] })))
+                    .with("address", () => (_jsxs(View, { accessibilityRole: "form", children: [_jsx(Field, { name: "country", children: ({ value, onChange }) => (_jsx(LakeLabel, { label: t("beneficiaryForm.beneficiary.country"), render: id => (_jsx(CountryPicker, { nativeID: id, value: value, items: individualCountriesItems, onValueChange: onChange })) })) }), _jsx(Space, { height: 12 }), _jsx(FieldsListener, { names: ["country"], children: ({ country }) => (_jsxs(_Fragment, { children: [_jsx(AddressFormPart, { initialAddress: initialState?.residencyAddressLine1 ?? "", initialCity: initialState?.residencyAddressCity ?? "", initialPostalCode: initialState?.residencyAddressPostalCode ?? "", country: country?.value ?? accountCountry, label: t("beneficiaryForm.beneficiary.address"), Field: Field, setFieldValue: setFieldValue, listenFields: listenFields, isLarge: large }), country?.value === "DEU" && (_jsxs(_Fragment, { children: [_jsx(Space, { height: 12 }), _jsx(Field, { name: "taxIdentificationNumber", children: ({ value, error, valid, onChange }) => (_jsx(LakeLabel, { label: t("beneficiaryForm.beneficiary.taxIdentificationNumber"), optionalLabel: t("common.optional"), render: id => (_jsx(LakeTextInput, { nativeID: id, placeholder: t("beneficiaryForm.beneficiary.taxIdentificationNumberPlaceholder"), value: value, error: error, valid: valid, onChangeText: onChange })) })) })] }))] })) })] })))
+                    .exhaustive(), isAddressRequired && (_jsxs(_Fragment, { children: [_jsx(Space, { height: 12 }), _jsx(StepDots, { currentStep: step, steps: formSteps })] }))] })) }));
+});

package/src/components/LakeCityInput.d.ts

@@ -0,0 +1,20 @@
+/// <reference types="react" />
+import { CountryCCA3 } from "../constants/countries";
+type PlaceDetail = {
+    city: string;
+    postalCode: string;
+};
+type Props = {
+    value: string;
+    onValueChange: (value: string) => void;
+    country?: CountryCCA3;
+    disabled?: boolean;
+    error?: string;
+    nativeID?: string;
+    placeholder?: string;
+    onSuggestion?: (place: PlaceDetail) => void;
+    onLoadError: (error: unknown) => void;
+    apiKey?: string;
+};
+export declare const LakeCityInput: ({ value, onValueChange, country, disabled, placeholder, nativeID, error, onSuggestion, onLoadError, apiKey, }: Props) => JSX.Element | null;
+export {};

package/src/components/LakeCityInput.js

@@ -0,0 +1,86 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { AsyncData, Future } from "@swan-io/boxed";
+import { useGoogleMapSDK } from "@swan-io/shared-business/src/hooks/useGoogleMapSDK";
+import { AutoWidthImage } from "@swan-io/lake/src/components/AutoWidthImage";
+import { Box } from "@swan-io/lake/src/components/Box";
+import { LakeCombobox } from "@swan-io/lake/src/components/LakeCombobox";
+import { colors } from "@swan-io/lake/src/constants/design";
+import { typography } from "@swan-io/lake/src/constants/typography";
+import { isNotNullish, isNullish } from "@swan-io/lake/src/utils/nullish";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { StyleSheet, Text } from "react-native";
+import { match } from "ts-pattern";
+import poweredByGoogle from "../assets/images/powered_by_google_on_white_hdpi.png";
+import { countriesWithMultipleCCA3 } from "../constants/countries";
+import { t } from "../utils/i18n";
+const styles = StyleSheet.create({
+    itemTitle: {
+        ...typography.bodyLarge,
+        lineHeight: typography.lineHeights.title,
+    },
+    itemSubtitle: {
+        ...typography.bodySmall,
+        color: colors.gray[400],
+    },
+    poweredByGoogle: {
+        paddingVertical: 8,
+        paddingHorizontal: 16,
+    },
+});
+export const LakeCityInput = ({ value, onValueChange, country, disabled, placeholder, nativeID, error, onSuggestion, onLoadError, apiKey, }) => {
+    const [state, setState] = useState(AsyncData.NotAsked());
+    const comboboxRef = useRef(null);
+    const sdk = useGoogleMapSDK({ apiKey });
+    const autocomplete = useMemo(() => sdk.map(google => new google.maps.places.AutocompleteService()), [sdk]);
+    useEffect(() => {
+        if (value.length <= 3) {
+            return setState(AsyncData.NotAsked());
+        }
+        setState(AsyncData.Loading());
+        if (isNotNullish(country)) {
+            const request = Future.make(resolve => {
+                const timeoutId = setTimeout(() => {
+                    if (autocomplete.isDone()) {
+                        Future.fromPromise(autocomplete.get().getPlacePredictions({
+                            input: value,
+                            componentRestrictions: {
+                                country: [...(countriesWithMultipleCCA3[country] ?? "")],
+                            },
+                            types: ["(cities)"],
+                        })).onResolve(resolve);
+                    }
+                }, 250);
+                return () => clearTimeout(timeoutId);
+            }).mapOk(({ predictions }) => predictions.map(p => ({ value: p.place_id, prediction: p })), true);
+            request.tapError(onLoadError).onResolve(value => setState(AsyncData.Done(value)));
+            return () => request.cancel();
+        }
+    }, [country, value, autocomplete, onLoadError]);
+    return sdk.match({
+        NotAsked: () => null,
+        Loading: () => null,
+        Done: google => {
+            const place = new google.maps.places.PlacesService(document.createElement("div"));
+            const selectAddress = (suggestion) => {
+                place.getDetails({ placeId: suggestion.value }, placeDetail => {
+                    const result = {
+                        postalCode: "",
+                        city: "",
+                    };
+                    placeDetail?.address_components?.forEach(({ types, short_name, long_name }) => {
+                        const type = types[0];
+                        match(type)
+                            .with("postal_code", () => (result.postalCode = short_name))
+                            .with("locality", () => (result.city = long_name))
+                            .otherwise(() => { });
+                    });
+                    onSuggestion?.(result);
+                    if (comboboxRef.current) {
+                        comboboxRef.current.close();
+                    }
+                });
+            };
+            return (_jsx(LakeCombobox, { ref: comboboxRef, placeholder: placeholder, value: value, items: state, icon: "search-filled", disabled: isNullish(country) || disabled, error: error, onValueChange: onValueChange, nativeID: nativeID, ListFooterComponent: _jsx(Box, { direction: "row", justifyContent: "end", style: styles.poweredByGoogle, children: _jsx(AutoWidthImage, { height: 14, sourceUri: poweredByGoogle }) }), onSelectItem: selectAddress, emptyResultText: t("common.noResult"), keyExtractor: item => item.value, renderItem: item => (_jsxs(_Fragment, { children: [_jsx(Text, { numberOfLines: 1, selectable: false, style: styles.itemTitle, children: item.prediction.structured_formatting.main_text }), _jsx(Text, { numberOfLines: 1, selectable: false, style: styles.itemSubtitle, children: item.prediction.structured_formatting.secondary_text })] })) }));
+        },
+    });
+};

package/src/components/SupportingDocument.d.ts

@@ -24,7 +24,7 @@ type Props = {
     requiredDocumentTypes: SupportingDocumentPurposeEnum[];
     onChange?: (documents: Document[]) => void;
     country?: CountryCCA3;
-    typeOfRepresentation?: TypeOfRepresentation;
+    withoutRepresentationRadio?: boolean;
 };
 export type SupportingDocumentRef = {
     submit: (callback: (value: boolean) => void) => void;

package/src/components/SupportingDocument.js

@@ -9,8 +9,8 @@ import { LakeText } from "@swan-io/lake/src/components/LakeText";
 import { LakeTooltip } from "@swan-io/lake/src/components/LakeTooltip";
 import { Pressable } from "@swan-io/lake/src/components/Pressable";
 import { Space } from "@swan-io/lake/src/components/Space";
+import { UploadArea } from "./UploadArea";
 import { isNotNullish, isNullish } from "@swan-io/lake/src/utils/nullish";
-import { UploadArea } from "@swan-io/shared-business/src/components/UploadArea";
 import { forwardRef, useEffect, useImperativeHandle, useMemo, useState } from "react";
 import { StyleSheet } from "react-native";
 import { useForm } from "react-ux-form";
@@ -32,10 +32,10 @@ const styles = StyleSheet.create({
         cursor: "default",
     },
 });
-const Help = ({ text, width, onPress, }) => {
-    return (_jsx(LakeTooltip, { content: t(text), width: width, togglableOnFocus: true, placement: "top", children: _jsx(LakeButton, { mode: "tertiary", color: "gray", icon: "question-circle-regular", onPress: onPress, disabled: onPress == null, style: [styles.button, onPress == null && styles.buttonWithDefaultCursor], accessibilityLabel: t("supportingDoc.whatIsThis") }) }));
+const Help = ({ text, label, width, onPress, }) => {
+    return (_jsx(LakeTooltip, { content: t(text), width: width, togglableOnFocus: true, placement: "top", children: _jsx(LakeButton, { mode: "tertiary", size: "small", color: "gray", icon: "question-circle-regular", onPress: onPress, disabled: onPress == null, style: [styles.button, onPress == null && styles.buttonWithDefaultCursor], accessibilityLabel: t("supportingDoc.whatIsThis"), children: label }) }));
 };
-export const SupportingDocument = forwardRef(({ documents, getAwsUrl, onChange, requiredDocumentTypes, country, typeOfRepresentation }, externalRef) => {
+export const SupportingDocument = forwardRef(({ documents, getAwsUrl, onChange, requiredDocumentTypes, country, withoutRepresentationRadio }, externalRef) => {
     const initialValues = useMemo(() => documents.reduce((acc, doc) => {
         return {
             ...acc,
@@ -147,7 +147,7 @@ export const SupportingDocument = forwardRef(({ documents, getAwsUrl, onChange,
         })
             .catch(console.error);
     };
-    return (_jsxs(Form, { children: [typeOfRepresentation == null && (_jsx(LakeLabel, { label: t("supportingDoc.whoAreYou"), render: () => (_jsxs(LakeButtonGroup, { children: [_jsx(Pressable, { onPress: () => setIsOther(false), children: _jsxs(Box, { direction: "row", alignItems: "center", children: [_jsx(LakeRadio, { value: !isOther, color: "current" }), _jsx(Space, { width: 12 }), _jsx(LakeText, { children: t("supportingDoc.legalRepresentative") })] }) }), _jsx(Space, { width: 24 }), _jsx(Pressable, { onPress: () => setIsOther(true), children: _jsxs(Box, { direction: "row", alignItems: "center", children: [_jsx(LakeRadio, { value: isOther, color: "current" }), _jsx(Space, { width: 12 }), _jsx(LakeText, { children: t("supportingDoc.other") })] }) })] })) })), requiredDocumentTypes.some(t => t === "CompanyRegistration") && (_jsxs(_Fragment, { children: [_jsx(LakeLabel, { label: t("supportingDoc.companyRegistration"), help: _jsx(Help, { text: "supportingDoc.companyRegistration.description" }), render: () => (_jsx(Field, { name: "CompanyRegistration", children: ({ value, onChange, error }) => (_jsx(UploadArea, { layout: "horizontal", error: error, onDropAccepted: files => {
+    return (_jsxs(Form, { children: [withoutRepresentationRadio !== true && (_jsx(LakeLabel, { label: t("supportingDoc.whoAreYou"), render: () => (_jsxs(LakeButtonGroup, { children: [_jsx(Pressable, { onPress: () => setIsOther(false), children: _jsxs(Box, { direction: "row", alignItems: "center", children: [_jsx(LakeRadio, { value: !isOther, color: "current" }), _jsx(Space, { width: 12 }), _jsx(LakeText, { children: t("supportingDoc.legalRepresentative") })] }) }), _jsx(Space, { width: 24 }), _jsx(Pressable, { onPress: () => setIsOther(true), children: _jsxs(Box, { direction: "row", alignItems: "center", children: [_jsx(LakeRadio, { value: isOther, color: "current" }), _jsx(Space, { width: 12 }), _jsx(LakeText, { children: t("supportingDoc.other") })] }) })] })) })), requiredDocumentTypes.some(t => t === "CompanyRegistration") && (_jsxs(_Fragment, { children: [_jsx(LakeLabel, { label: t("supportingDoc.companyRegistration"), help: _jsx(Help, { text: "supportingDoc.companyRegistration.description" }), render: () => (_jsx(Field, { name: "CompanyRegistration", children: ({ value, onChange, error }) => (_jsx(UploadArea, { layout: "horizontal", error: error, onDropAccepted: files => {
                                     onChange([...value, { id: NO_ID_YET }]);
                                     handleUpload(files, "CompanyRegistration");
                                 }, documents: value, accept: ACCEPTED_FORMATS, icon: "document-regular", description: t("supportingDoc.documentTypes"), maxSize: MAX_SUPPORTING_DOCUMENT_UPLOAD_SIZE })) })) }), _jsx(Space, { height: 24 })] })), requiredDocumentTypes.some(t => t === "AssociationRegistration") && (_jsxs(_Fragment, { children: [_jsx(LakeLabel, { label: t("supportingDoc.associationRegistration"), help: _jsx(Help, { text: "supportingDoc.associationRegistration.description" }), render: () => (_jsx(Field, { name: "AssociationRegistration", children: ({ value, onChange, error }) => (_jsx(UploadArea, { layout: "horizontal", onDropAccepted: files => {
@@ -156,11 +156,11 @@ export const SupportingDocument = forwardRef(({ documents, getAwsUrl, onChange,
                                 }, error: error, documents: value, accept: ACCEPTED_FORMATS, icon: "document-regular", description: t("supportingDoc.documentTypes"), maxSize: MAX_SUPPORTING_DOCUMENT_UPLOAD_SIZE })) })) }), _jsx(Space, { height: 24 })] })), requiredDocumentTypes.some(t => t === "SignedStatus") && (_jsxs(_Fragment, { children: [_jsx(LakeLabel, { label: t("supportingDoc.signedStatus"), help: _jsx(Help, { text: "supportingDoc.signedStatus.description" }), render: () => (_jsx(Field, { name: "SignedStatus", children: ({ value, onChange, error }) => (_jsx(UploadArea, { layout: "horizontal", onDropAccepted: files => {
                                     onChange([...value, { id: NO_ID_YET }]);
                                     handleUpload(files, "SignedStatus");
-                                }, error: error, documents: value, accept: ACCEPTED_FORMATS, icon: "document-regular", description: t("supportingDoc.documentTypes"), maxSize: MAX_SUPPORTING_DOCUMENT_UPLOAD_SIZE })) })) }), _jsx(Space, { height: 24 })] })), requiredDocumentTypes.length === 0 && !isOther ? (_jsxs(_Fragment, { children: [_jsx(Space, { height: 24 }), _jsx(LakeText, { children: t("supportingDoc.noRequiredDocuments") }), _jsx(Space, { height: 24 })] })) : null, typeOfRepresentation === "LegalRepresentative" || isOther ? (_jsxs(_Fragment, { children: [_jsx(LakeLabel, { label: t("supportingDoc.proofOfIdentity"), help: _jsx(Help, { width: 600, text: "supportingDoc.proofOfIdentity.description" }), render: () => (_jsx(Field, { name: "ProofOfIdentity", children: ({ value, onChange, error }) => (_jsx(UploadArea, { layout: "horizontal", onDropAccepted: files => {
+                                }, error: error, documents: value, accept: ACCEPTED_FORMATS, icon: "document-regular", description: t("supportingDoc.documentTypes"), maxSize: MAX_SUPPORTING_DOCUMENT_UPLOAD_SIZE })) })) }), _jsx(Space, { height: 24 })] })), (requiredDocumentTypes.some(t => t === "ProofOfIdentity") || isOther) && (_jsxs(_Fragment, { children: [_jsx(LakeLabel, { label: t("supportingDoc.proofOfIdentity"), help: _jsx(Help, { width: 600, text: "supportingDoc.proofOfIdentity.description" }), render: () => (_jsx(Field, { name: "ProofOfIdentity", children: ({ value, onChange, error }) => (_jsx(UploadArea, { layout: "horizontal", onDropAccepted: files => {
                                     onChange([...value, { id: NO_ID_YET }]);
                                     handleUpload(files, "ProofOfIdentity");
-                                }, error: error, documents: value, accept: ACCEPTED_FORMATS, icon: "document-regular", description: t("supportingDoc.documentTypes"), maxSize: MAX_SUPPORTING_DOCUMENT_UPLOAD_SIZE })) })) }), _jsx(Space, { height: 24 }), _jsx(LakeLabel, { label: t("supportingDoc.powerAttornySigned"), help: _jsx(Help, { text: "supportingDoc.powerAttornySigned.description", onPress: () => setShowPowerOfAttorneyModal(true) }), render: () => (_jsx(Field, { name: "Other", children: ({ value, onChange, error }) => (_jsx(UploadArea, { layout: "horizontal", onDropAccepted: files => {
+                                }, error: error, documents: value, accept: ACCEPTED_FORMATS, icon: "document-regular", description: t("supportingDoc.documentTypes"), maxSize: MAX_SUPPORTING_DOCUMENT_UPLOAD_SIZE })) })) }), _jsx(Space, { height: 24 })] })), (requiredDocumentTypes.some(t => t === "PowerOfAttorney") || isOther) && (_jsxs(_Fragment, { children: [_jsx(LakeLabel, { label: t("supportingDoc.powerAttornySigned"), help: _jsx(Help, { text: "supportingDoc.powerAttornySigned.description", label: t("supportingDoc.whatIsThis"), onPress: () => setShowPowerOfAttorneyModal(true) }), render: () => (_jsx(Field, { name: "Other", children: ({ value, onChange, error }) => (_jsx(UploadArea, { layout: "horizontal", onDropAccepted: files => {
                                     onChange([...value, { id: NO_ID_YET }]);
                                     handleUpload(files, "Other");
-                                }, error: error, documents: value, accept: ACCEPTED_FORMATS, icon: "document-regular", description: t("supportingDoc.documentTypes"), maxSize: MAX_SUPPORTING_DOCUMENT_UPLOAD_SIZE })) })) }), _jsxs(LakeModal, { visible: showPowerOfAttorneyModal, title: t("supportingDoc.powerAttorney"), icon: "document-regular", onPressClose: () => setShowPowerOfAttorneyModal(false), children: [_jsx(LakeText, { children: t("supportingDoc.powerAttornySigned.description") }), _jsx(Space, { height: 16 }), _jsx(LakeButtonGroup, { paddingBottom: 0, children: _jsx(LakeButton, { grow: true, color: "current", onPress: () => window.open(`/power-of-attorney-template/${country === "FRA" ? "fr" : "en"}.pdf`), children: t("supportingDoc.downloadTemplate") }) })] })] })) : null] }));
+                                }, error: error, documents: value, accept: ACCEPTED_FORMATS, icon: "document-regular", description: t("supportingDoc.documentTypes"), maxSize: MAX_SUPPORTING_DOCUMENT_UPLOAD_SIZE })) })) }), _jsx(Space, { height: 24 })] })), requiredDocumentTypes.length === 0 && (!isOther || withoutRepresentationRadio === true) ? (_jsxs(_Fragment, { children: [_jsx(Space, { height: 24 }), _jsx(LakeText, { children: t("supportingDoc.noRequiredDocuments") }), _jsx(Space, { height: 24 })] })) : null, _jsxs(LakeModal, { visible: showPowerOfAttorneyModal, title: t("supportingDoc.powerAttorney"), icon: "document-regular", onPressClose: () => setShowPowerOfAttorneyModal(false), children: [_jsx(LakeText, { children: t("supportingDoc.powerAttornySigned.description") }), _jsx(Space, { height: 16 }), _jsx(LakeButtonGroup, { paddingBottom: 0, children: _jsx(LakeButton, { grow: true, color: "current", onPress: () => window.open(`/power-of-attorney-template/${country === "FRA" ? "fr" : "en"}.pdf`), children: t("supportingDoc.downloadTemplate") }) })] })] }));
 });

package/src/components/UploadArea.js

@@ -1,19 +1,19 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { formatNestedMessage, t } from "../utils/i18n";
 import { Box } from "@swan-io/lake/src/components/Box";
-import { FileTile } from "@swan-io/lake/src/components/FileTile";
 import { Icon } from "@swan-io/lake/src/components/Icon";
 import { LakeHeading } from "@swan-io/lake/src/components/LakeHeading";
 import { LakeText } from "@swan-io/lake/src/components/LakeText";
 import { Space } from "@swan-io/lake/src/components/Space";
-import { commonStyles } from "@swan-io/lake/src/constants/commonStyles";
 import { backgroundColor, colors, gray75, radii, shadows, spacings, } from "@swan-io/lake/src/constants/design";
-import { useBoolean } from "@swan-io/lake/src/hooks/useBoolean";
-import { getIconNameFromFilename } from "@swan-io/lake/src/utils/file";
 import { isNotNullish, isNullish } from "@swan-io/lake/src/utils/nullish";
-import { formatNestedMessage, t } from "@swan-io/shared-business/src/utils/i18n";
 import { Fragment, useLayoutEffect, useRef } from "react";
 import { useDropzone } from "react-dropzone";
 import { StyleSheet, Text, View } from "react-native";
+import { commonStyles } from "@swan-io/lake/src/constants/commonStyles";
+import { useBoolean } from "@swan-io/lake/src/hooks/useBoolean";
+import { getIconNameFromFilename } from "@swan-io/lake/src/utils/file";
+import { FileTile } from "@swan-io/lake/src/components/FileTile";
 const styles = StyleSheet.create({
     container: {
         backgroundColor: backgroundColor.accented,

package/src/constants/countries.d.ts

@@ -1981,22 +1981,22 @@ export type Country = (typeof countries)[number];
 export type CountryCCA2 = (typeof countries)[number]["cca2"];
 export type CountryCCA3 = (typeof countries)[number]["cca3"];
 export declare const getCCA2forCCA3: (cca3: CountryCCA3) => "BA" | "CA" | "ID" | "AX" | "AS" | "AD" | "AO" | "AI" | "AQ" | "AG" | "AR" | "AW" | "AU" | "AZ" | "BS" | "BD" | "BB" | "BE" | "BZ" | "BJ" | "BM" | "BO" | "BQ" | "BW" | "BV" | "BR" | "VG" | "BF" | "BI" | "CV" | "CM" | "KY" | "CZ" | "CL" | "CX" | "CC" | "CO" | "CK" | "CR" | "CI" | "CU" | "CW" | "DK" | "DE" | "DJ" | "DM" | "EC" | "EE" | "IE" | "SV" | "ES" | "FK" | "FJ" | "FO" | "FR" | "GA" | "GM" | "GH" | "GI" | "GD" | "GP" | "GU" | "GT" | "GG" | "GW" | "GQ" | "GN" | "GY" | "GF" | "HT" | "HM" | "HN" | "HR" | "IS" | "IM" | "IT" | "JM" | "JE" | "GL" | "KH" | "KZ" | "KE" | "KI" | "CF" | "KM" | "RE" | "LV" | "LS" | "LR" | "LI" | "LT" | "LU" | "MG" | "HU" | "MH" | "MW" | "MY" | "MV" | "ML" | "MT" | "MQ" | "MU" | "YT" | "MX" | "FM" | "MZ" | "MD" | "MC" | "MS" | "NA" | "NL" | "BN" | "NZ" | "NI" | "NE" | "NG" | "NU" | "NF" | "NO" | "MP" | "NC" | "AT" | "UZ" | "PK" | "PW" | "PA" | "PG" | "PY" | "PE" | "PH" | "PN" | "PL" | "PF" | "PT" | "PR" | "DO" | "XK" | "CD" | "CG" | "RO" | "RW" | "KN" | "LC" | "VC" | "BL" | "MF" | "PM" | "WS" | "SM" | "ST" | "CH" | "SN" | "SC" | "AL" | "SL" | "SG" | "SI" | "SK" | "SB" | "SO" | "ZA" | "GS" | "SS" | "LK" | "FI" | "SR" | "SE" | "SZ" | "TZ" | "TD" | "TF" | "TL" | "TG" | "TO" | "TT" | "TR" | "TM" | "TC" | "TV" | "UG" | "GB" | "US" | "UM" | "VI" | "UY" | "VU" | "VA" | "VE" | "VN" | "WF" | "ZM" | "ZW" | "BT" | "GR" | "CY" | "BY" | "BG" | "KG" | "MK" | "MN" | "RU" | "RS" | "TJ" | "UA" | "ME" | "AM" | "IL" | "AF" | "JO" | "DZ" | "SD" | "EH" | "IQ" | "SA" | "KW" | "MA" | "YE" | "IR" | "TN" | "AE" | "SY" | "OM" | "PS" | "QA" | "LB" | "EG" | "MR" | "NP" | "IN" | "TH" | "LA" | "MM" | "GE" | "ET" | "ER" | "BH" | "LY" | "CN" | "JP" | "MO" | "TW" | "HK" | "KR" | "KP" | undefined;
-export declare const getCCA3forCCA2: (cca2: CountryCCA2) => "ALA" | "ASM" | "AND" | "AGO" | "AIA" | "ATA" | "ATG" | "ARG" | "ABW" | "AUS" | "AZE" | "BHS" | "BGD" | "BRB" | "BEL" | "BLZ" | "BEN" | "BMU" | "BOL" | "BES" | "BIH" | "BWA" | "BVT" | "BRA" | "VGB" | "BFA" | "BDI" | "CPV" | "CMR" | "CAN" | "CYM" | "CZE" | "CHL" | "CXR" | "CCK" | "COL" | "COK" | "CRI" | "CIV" | "CUB" | "CUW" | "DNK" | "DEU" | "DJI" | "DMA" | "ECU" | "EST" | "IRL" | "SLV" | "ESP" | "FLK" | "FJI" | "FRO" | "FRA" | "GAB" | "GMB" | "GHA" | "GIB" | "GRD" | "GLP" | "GUM" | "GTM" | "GGY" | "GNB" | "GNQ" | "GIN" | "GUY" | "GUF" | "HTI" | "HMD" | "HND" | "HRV" | "IDN" | "ISL" | "IMN" | "ITA" | "JAM" | "JEY" | "GRL" | "KHM" | "KAZ" | "KEN" | "KIR" | "CAF" | "COM" | "REU" | "LVA" | "LSO" | "LBR" | "LIE" | "LTU" | "LUX" | "MDG" | "HUN" | "MHL" | "MWI" | "MYS" | "MDV" | "MLI" | "MLT" | "MTQ" | "MUS" | "MYT" | "MEX" | "FSM" | "MOZ" | "MDA" | "MCO" | "MSR" | "NAM" | "NLD" | "BRN" | "NZL" | "NIC" | "NER" | "NGA" | "NIU" | "NFK" | "NOR" | "MNP" | "NCL" | "AUT" | "UZB" | "PAK" | "PLW" | "PAN" | "PNG" | "PRY" | "PER" | "PHL" | "PCN" | "POL" | "PYF" | "PRT" | "PRI" | "DOM" | "UNK" | "COD" | "COG" | "ROU" | "RWA" | "KNA" | "LCA" | "VCT" | "BLM" | "MAF" | "SPM" | "WSM" | "SMR" | "STP" | "CHE" | "SEN" | "SYC" | "ALB" | "SLE" | "SGP" | "SVN" | "SVK" | "SLB" | "SOM" | "ZAF" | "SGS" | "SSD" | "LKA" | "FIN" | "SUR" | "SWE" | "SWZ" | "TZA" | "TCD" | "ATF" | "TLS" | "TGO" | "TON" | "TTO" | "TUR" | "TKM" | "TCA" | "TUV" | "UGA" | "GBR" | "USA" | "UMI" | "VIR" | "URY" | "VUT" | "VAT" | "VEN" | "VNM" | "WLF" | "ZMB" | "ZWE" | "BTN" | "GRC" | "CYP" | "BLR" | "BGR" | "KGZ" | "MKD" | "MNG" | "RUS" | "SRB" | "TJK" | "UKR" | "MNE" | "ARM" | "ISR" | "AFG" | "JOR" | "DZA" | "SDN" | "ESH" | "IRQ" | "SAU" | "KWT" | "MAR" | "YEM" | "IRN" | "TUN" | "ARE" | "SYR" | "OMN" | "PSE" | "QAT" | "LBN" | "EGY" | "MRT" | "NPL" | "IND" | "THA" | "LAO" | "MMR" | "GEO" | "ETH" | "ERI" | "BHR" | "LBY" | "CHN" | "JPN" | "MAC" | "TWN" | "HKG" | "KOR" | "PRK" | undefined;
+export declare const getCCA3forCCA2: (cca2: CountryCCA2) => "PNG" | "ALA" | "ASM" | "AND" | "AGO" | "AIA" | "ATA" | "ATG" | "ARG" | "ABW" | "AUS" | "AZE" | "BHS" | "BGD" | "BRB" | "BEL" | "BLZ" | "BEN" | "BMU" | "BOL" | "BES" | "BIH" | "BWA" | "BVT" | "BRA" | "VGB" | "BFA" | "BDI" | "CPV" | "CMR" | "CAN" | "CYM" | "CZE" | "CHL" | "CXR" | "CCK" | "COL" | "COK" | "CRI" | "CIV" | "CUB" | "CUW" | "DNK" | "DEU" | "DJI" | "DMA" | "ECU" | "EST" | "IRL" | "SLV" | "ESP" | "FLK" | "FJI" | "FRO" | "FRA" | "GAB" | "GMB" | "GHA" | "GIB" | "GRD" | "GLP" | "GUM" | "GTM" | "GGY" | "GNB" | "GNQ" | "GIN" | "GUY" | "GUF" | "HTI" | "HMD" | "HND" | "HRV" | "IDN" | "ISL" | "IMN" | "ITA" | "JAM" | "JEY" | "GRL" | "KHM" | "KAZ" | "KEN" | "KIR" | "CAF" | "COM" | "REU" | "LVA" | "LSO" | "LBR" | "LIE" | "LTU" | "LUX" | "MDG" | "HUN" | "MHL" | "MWI" | "MYS" | "MDV" | "MLI" | "MLT" | "MTQ" | "MUS" | "MYT" | "MEX" | "FSM" | "MOZ" | "MDA" | "MCO" | "MSR" | "NAM" | "NLD" | "BRN" | "NZL" | "NIC" | "NER" | "NGA" | "NIU" | "NFK" | "NOR" | "MNP" | "NCL" | "AUT" | "UZB" | "PAK" | "PLW" | "PAN" | "PRY" | "PER" | "PHL" | "PCN" | "POL" | "PYF" | "PRT" | "PRI" | "DOM" | "UNK" | "COD" | "COG" | "ROU" | "RWA" | "KNA" | "LCA" | "VCT" | "BLM" | "MAF" | "SPM" | "WSM" | "SMR" | "STP" | "CHE" | "SEN" | "SYC" | "ALB" | "SLE" | "SGP" | "SVN" | "SVK" | "SLB" | "SOM" | "ZAF" | "SGS" | "SSD" | "LKA" | "FIN" | "SUR" | "SWE" | "SWZ" | "TZA" | "TCD" | "ATF" | "TLS" | "TGO" | "TON" | "TTO" | "TUR" | "TKM" | "TCA" | "TUV" | "UGA" | "GBR" | "USA" | "UMI" | "VIR" | "URY" | "VUT" | "VAT" | "VEN" | "VNM" | "WLF" | "ZMB" | "ZWE" | "BTN" | "GRC" | "CYP" | "BLR" | "BGR" | "KGZ" | "MKD" | "MNG" | "RUS" | "SRB" | "TJK" | "UKR" | "MNE" | "ARM" | "ISR" | "AFG" | "JOR" | "DZA" | "SDN" | "ESH" | "IRQ" | "SAU" | "KWT" | "MAR" | "YEM" | "IRN" | "TUN" | "ARE" | "SYR" | "OMN" | "PSE" | "QAT" | "LBN" | "EGY" | "MRT" | "NPL" | "IND" | "THA" | "LAO" | "MMR" | "GEO" | "ETH" | "ERI" | "BHR" | "LBY" | "CHN" | "JPN" | "MAC" | "TWN" | "HKG" | "KOR" | "PRK" | undefined;
 export declare const getCountryNameByCCA3: (cca3: string) => string;
 export declare const companyWithUboCountries: readonly ["BEL", "DEU", "FRA", "ITA", "LTU", "LUX", "NLD"];
 export type CompanyWithUboCountryCCA3 = (typeof companyWithUboCountries)[number];
 declare const individualCountries: ("BEL" | "CZE" | "DNK" | "DEU" | "EST" | "IRL" | "ESP" | "FRA" | "HRV" | "ISL" | "ITA" | "LVA" | "LIE" | "LTU" | "LUX" | "HUN" | "MLT" | "NLD" | "NOR" | "AUT" | "POL" | "PRT" | "ROU" | "SVN" | "SVK" | "FIN" | "SWE" | "GRC" | "CYP" | "BGR")[];
 export type IndividualCountryCCA3 = (typeof individualCountries)[number];
 export declare const individualCountriesItems: CountryItem<IndividualCountryCCA3>[];
-declare const companyCountries: ("BEL" | "CZE" | "DNK" | "DEU" | "EST" | "IRL" | "ESP" | "FRA" | "HRV" | "ISL" | "ITA" | "LVA" | "LIE" | "LTU" | "LUX" | "HUN" | "MLT" | "NLD" | "AUT" | "POL" | "PRT" | "ROU" | "SVN" | "SVK" | "FIN" | "SWE" | "GRC" | "BGR")[];
+declare const companyCountries: ("BEL" | "CZE" | "DNK" | "DEU" | "EST" | "IRL" | "ESP" | "FRA" | "HRV" | "ISL" | "ITA" | "LVA" | "LIE" | "LTU" | "LUX" | "HUN" | "MLT" | "NLD" | "NOR" | "AUT" | "POL" | "PRT" | "ROU" | "SVN" | "SVK" | "FIN" | "SWE" | "GRC" | "CYP" | "BGR")[];
 export type CompanyCountryCCA3 = (typeof companyCountries)[number];
 export declare const companyCountriesItems: CountryItem<CompanyCountryCCA3>[];
 export declare const countriesWithMultipleCCA3: Partial<Record<CountryCCA3, string[]>>;
-export declare const isCountryCCA3: (value: unknown) => value is "ALA" | "ASM" | "AND" | "AGO" | "AIA" | "ATA" | "ATG" | "ARG" | "ABW" | "AUS" | "AZE" | "BHS" | "BGD" | "BRB" | "BEL" | "BLZ" | "BEN" | "BMU" | "BOL" | "BES" | "BIH" | "BWA" | "BVT" | "BRA" | "VGB" | "BFA" | "BDI" | "CPV" | "CMR" | "CAN" | "CYM" | "CZE" | "CHL" | "CXR" | "CCK" | "COL" | "COK" | "CRI" | "CIV" | "CUB" | "CUW" | "DNK" | "DEU" | "DJI" | "DMA" | "ECU" | "EST" | "IRL" | "SLV" | "ESP" | "FLK" | "FJI" | "FRO" | "FRA" | "GAB" | "GMB" | "GHA" | "GIB" | "GRD" | "GLP" | "GUM" | "GTM" | "GGY" | "GNB" | "GNQ" | "GIN" | "GUY" | "GUF" | "HTI" | "HMD" | "HND" | "HRV" | "IDN" | "ISL" | "IMN" | "ITA" | "JAM" | "JEY" | "GRL" | "KHM" | "KAZ" | "KEN" | "KIR" | "CAF" | "COM" | "REU" | "LVA" | "LSO" | "LBR" | "LIE" | "LTU" | "LUX" | "MDG" | "HUN" | "MHL" | "MWI" | "MYS" | "MDV" | "MLI" | "MLT" | "MTQ" | "MUS" | "MYT" | "MEX" | "FSM" | "MOZ" | "MDA" | "MCO" | "MSR" | "NAM" | "NLD" | "BRN" | "NZL" | "NIC" | "NER" | "NGA" | "NIU" | "NFK" | "NOR" | "MNP" | "NCL" | "AUT" | "UZB" | "PAK" | "PLW" | "PAN" | "PNG" | "PRY" | "PER" | "PHL" | "PCN" | "POL" | "PYF" | "PRT" | "PRI" | "DOM" | "UNK" | "COD" | "COG" | "ROU" | "RWA" | "KNA" | "LCA" | "VCT" | "BLM" | "MAF" | "SPM" | "WSM" | "SMR" | "STP" | "CHE" | "SEN" | "SYC" | "ALB" | "SLE" | "SGP" | "SVN" | "SVK" | "SLB" | "SOM" | "ZAF" | "SGS" | "SSD" | "LKA" | "FIN" | "SUR" | "SWE" | "SWZ" | "TZA" | "TCD" | "ATF" | "TLS" | "TGO" | "TON" | "TTO" | "TUR" | "TKM" | "TCA" | "TUV" | "UGA" | "GBR" | "USA" | "UMI" | "VIR" | "URY" | "VUT" | "VAT" | "VEN" | "VNM" | "WLF" | "ZMB" | "ZWE" | "BTN" | "GRC" | "CYP" | "BLR" | "BGR" | "KGZ" | "MKD" | "MNG" | "RUS" | "SRB" | "TJK" | "UKR" | "MNE" | "ARM" | "ISR" | "AFG" | "JOR" | "DZA" | "SDN" | "ESH" | "IRQ" | "SAU" | "KWT" | "MAR" | "YEM" | "IRN" | "TUN" | "ARE" | "SYR" | "OMN" | "PSE" | "QAT" | "LBN" | "EGY" | "MRT" | "NPL" | "IND" | "THA" | "LAO" | "MMR" | "GEO" | "ETH" | "ERI" | "BHR" | "LBY" | "CHN" | "JPN" | "MAC" | "TWN" | "HKG" | "KOR" | "PRK";
+export declare const isCountryCCA3: (value: unknown) => value is "PNG" | "ALA" | "ASM" | "AND" | "AGO" | "AIA" | "ATA" | "ATG" | "ARG" | "ABW" | "AUS" | "AZE" | "BHS" | "BGD" | "BRB" | "BEL" | "BLZ" | "BEN" | "BMU" | "BOL" | "BES" | "BIH" | "BWA" | "BVT" | "BRA" | "VGB" | "BFA" | "BDI" | "CPV" | "CMR" | "CAN" | "CYM" | "CZE" | "CHL" | "CXR" | "CCK" | "COL" | "COK" | "CRI" | "CIV" | "CUB" | "CUW" | "DNK" | "DEU" | "DJI" | "DMA" | "ECU" | "EST" | "IRL" | "SLV" | "ESP" | "FLK" | "FJI" | "FRO" | "FRA" | "GAB" | "GMB" | "GHA" | "GIB" | "GRD" | "GLP" | "GUM" | "GTM" | "GGY" | "GNB" | "GNQ" | "GIN" | "GUY" | "GUF" | "HTI" | "HMD" | "HND" | "HRV" | "IDN" | "ISL" | "IMN" | "ITA" | "JAM" | "JEY" | "GRL" | "KHM" | "KAZ" | "KEN" | "KIR" | "CAF" | "COM" | "REU" | "LVA" | "LSO" | "LBR" | "LIE" | "LTU" | "LUX" | "MDG" | "HUN" | "MHL" | "MWI" | "MYS" | "MDV" | "MLI" | "MLT" | "MTQ" | "MUS" | "MYT" | "MEX" | "FSM" | "MOZ" | "MDA" | "MCO" | "MSR" | "NAM" | "NLD" | "BRN" | "NZL" | "NIC" | "NER" | "NGA" | "NIU" | "NFK" | "NOR" | "MNP" | "NCL" | "AUT" | "UZB" | "PAK" | "PLW" | "PAN" | "PRY" | "PER" | "PHL" | "PCN" | "POL" | "PYF" | "PRT" | "PRI" | "DOM" | "UNK" | "COD" | "COG" | "ROU" | "RWA" | "KNA" | "LCA" | "VCT" | "BLM" | "MAF" | "SPM" | "WSM" | "SMR" | "STP" | "CHE" | "SEN" | "SYC" | "ALB" | "SLE" | "SGP" | "SVN" | "SVK" | "SLB" | "SOM" | "ZAF" | "SGS" | "SSD" | "LKA" | "FIN" | "SUR" | "SWE" | "SWZ" | "TZA" | "TCD" | "ATF" | "TLS" | "TGO" | "TON" | "TTO" | "TUR" | "TKM" | "TCA" | "TUV" | "UGA" | "GBR" | "USA" | "UMI" | "VIR" | "URY" | "VUT" | "VAT" | "VEN" | "VNM" | "WLF" | "ZMB" | "ZWE" | "BTN" | "GRC" | "CYP" | "BLR" | "BGR" | "KGZ" | "MKD" | "MNG" | "RUS" | "SRB" | "TJK" | "UKR" | "MNE" | "ARM" | "ISR" | "AFG" | "JOR" | "DZA" | "SDN" | "ESH" | "IRQ" | "SAU" | "KWT" | "MAR" | "YEM" | "IRN" | "TUN" | "ARE" | "SYR" | "OMN" | "PSE" | "QAT" | "LBN" | "EGY" | "MRT" | "NPL" | "IND" | "THA" | "LAO" | "MMR" | "GEO" | "ETH" | "ERI" | "BHR" | "LBY" | "CHN" | "JPN" | "MAC" | "TWN" | "HKG" | "KOR" | "PRK";
 export declare const isCountryCCA2: (value: unknown) => value is "BA" | "CA" | "ID" | "AX" | "AS" | "AD" | "AO" | "AI" | "AQ" | "AG" | "AR" | "AW" | "AU" | "AZ" | "BS" | "BD" | "BB" | "BE" | "BZ" | "BJ" | "BM" | "BO" | "BQ" | "BW" | "BV" | "BR" | "VG" | "BF" | "BI" | "CV" | "CM" | "KY" | "CZ" | "CL" | "CX" | "CC" | "CO" | "CK" | "CR" | "CI" | "CU" | "CW" | "DK" | "DE" | "DJ" | "DM" | "EC" | "EE" | "IE" | "SV" | "ES" | "FK" | "FJ" | "FO" | "FR" | "GA" | "GM" | "GH" | "GI" | "GD" | "GP" | "GU" | "GT" | "GG" | "GW" | "GQ" | "GN" | "GY" | "GF" | "HT" | "HM" | "HN" | "HR" | "IS" | "IM" | "IT" | "JM" | "JE" | "GL" | "KH" | "KZ" | "KE" | "KI" | "CF" | "KM" | "RE" | "LV" | "LS" | "LR" | "LI" | "LT" | "LU" | "MG" | "HU" | "MH" | "MW" | "MY" | "MV" | "ML" | "MT" | "MQ" | "MU" | "YT" | "MX" | "FM" | "MZ" | "MD" | "MC" | "MS" | "NA" | "NL" | "BN" | "NZ" | "NI" | "NE" | "NG" | "NU" | "NF" | "NO" | "MP" | "NC" | "AT" | "UZ" | "PK" | "PW" | "PA" | "PG" | "PY" | "PE" | "PH" | "PN" | "PL" | "PF" | "PT" | "PR" | "DO" | "XK" | "CD" | "CG" | "RO" | "RW" | "KN" | "LC" | "VC" | "BL" | "MF" | "PM" | "WS" | "SM" | "ST" | "CH" | "SN" | "SC" | "AL" | "SL" | "SG" | "SI" | "SK" | "SB" | "SO" | "ZA" | "GS" | "SS" | "LK" | "FI" | "SR" | "SE" | "SZ" | "TZ" | "TD" | "TF" | "TL" | "TG" | "TO" | "TT" | "TR" | "TM" | "TC" | "TV" | "UG" | "GB" | "US" | "UM" | "VI" | "UY" | "VU" | "VA" | "VE" | "VN" | "WF" | "ZM" | "ZW" | "BT" | "GR" | "CY" | "BY" | "BG" | "KG" | "MK" | "MN" | "RU" | "RS" | "TJ" | "UA" | "ME" | "AM" | "IL" | "AF" | "JO" | "DZ" | "SD" | "EH" | "IQ" | "SA" | "KW" | "MA" | "YE" | "IR" | "TN" | "AE" | "SY" | "OM" | "PS" | "QA" | "LB" | "EG" | "MR" | "NP" | "IN" | "TH" | "LA" | "MM" | "GE" | "ET" | "ER" | "BH" | "LY" | "CN" | "JP" | "MO" | "TW" | "HK" | "KR" | "KP";
 export declare const isIndividualCountryCCA3: (value: unknown) => value is "BEL" | "CZE" | "DNK" | "DEU" | "EST" | "IRL" | "ESP" | "FRA" | "HRV" | "ISL" | "ITA" | "LVA" | "LIE" | "LTU" | "LUX" | "HUN" | "MLT" | "NLD" | "NOR" | "AUT" | "POL" | "PRT" | "ROU" | "SVN" | "SVK" | "FIN" | "SWE" | "GRC" | "CYP" | "BGR";
-export declare const isCompanyCountryCCA3: (value: unknown) => value is "BEL" | "CZE" | "DNK" | "DEU" | "EST" | "IRL" | "ESP" | "FRA" | "HRV" | "ISL" | "ITA" | "LVA" | "LIE" | "LTU" | "LUX" | "HUN" | "MLT" | "NLD" | "AUT" | "POL" | "PRT" | "ROU" | "SVN" | "SVK" | "FIN" | "SWE" | "GRC" | "BGR";
+export declare const isCompanyCountryCCA3: (value: unknown) => value is "BEL" | "CZE" | "DNK" | "DEU" | "EST" | "IRL" | "ESP" | "FRA" | "HRV" | "ISL" | "ITA" | "LVA" | "LIE" | "LTU" | "LUX" | "HUN" | "MLT" | "NLD" | "NOR" | "AUT" | "POL" | "PRT" | "ROU" | "SVN" | "SVK" | "FIN" | "SWE" | "GRC" | "CYP" | "BGR";
 export declare const isCompanyWithUboCountryCCA3: (value: unknown) => value is "BEL" | "DEU" | "FRA" | "ITA" | "LTU" | "LUX" | "NLD";
 export declare const individualFallbackCountry: "BEL" | "CZE" | "DNK" | "DEU" | "EST" | "IRL" | "ESP" | "FRA" | "HRV" | "ISL" | "ITA" | "LVA" | "LIE" | "LTU" | "LUX" | "HUN" | "MLT" | "NLD" | "NOR" | "AUT" | "POL" | "PRT" | "ROU" | "SVN" | "SVK" | "FIN" | "SWE" | "GRC" | "CYP" | "BGR";
-export declare const companyFallbackCountry: "BEL" | "CZE" | "DNK" | "DEU" | "EST" | "IRL" | "ESP" | "FRA" | "HRV" | "ISL" | "ITA" | "LVA" | "LIE" | "LTU" | "LUX" | "HUN" | "MLT" | "NLD" | "AUT" | "POL" | "PRT" | "ROU" | "SVN" | "SVK" | "FIN" | "SWE" | "GRC" | "BGR";
+export declare const companyFallbackCountry: "BEL" | "CZE" | "DNK" | "DEU" | "EST" | "IRL" | "ESP" | "FRA" | "HRV" | "ISL" | "ITA" | "LVA" | "LIE" | "LTU" | "LUX" | "HUN" | "MLT" | "NLD" | "NOR" | "AUT" | "POL" | "PRT" | "ROU" | "SVN" | "SVK" | "FIN" | "SWE" | "GRC" | "CYP" | "BGR";
 export {};

package/src/constants/countries.js

@@ -2327,6 +2327,8 @@ const companyCountries = [
     "SVK",
     "SVN",
     "BGR",
+    "CYP",
+    "NOR",
 ];
 export const companyCountriesItems = companyCountries
     .map(cca3 => ({

package/src/hooks/useGoogleMapSDK.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="google.maps" />
+import { AsyncData } from "@swan-io/boxed";
+type Props = {
+    language?: string;
+    apiKey?: string;
+};
+export declare const useGoogleMapSDK: ({ language, apiKey }: Props) => AsyncData<typeof google>;
+export {};

package/src/hooks/useGoogleMapSDK.js

@@ -0,0 +1,22 @@
+import { AsyncData } from "@swan-io/boxed";
+import { useEffect } from "react";
+import { atom, useAtom } from "react-atomic-state";
+import { Loader } from "@googlemaps/js-api-loader";
+const sdk = atom(AsyncData.NotAsked());
+export const useGoogleMapSDK = ({ language, apiKey }) => {
+    const googleSdk = useAtom(sdk);
+    useEffect(() => {
+        if (googleSdk.isNotAsked()) {
+            if (apiKey != undefined) {
+                sdk.set(AsyncData.Loading());
+                void new Loader({
+                    apiKey,
+                    language,
+                })
+                    .load()
+                    .then(google => sdk.set(AsyncData.Done(google)));
+            }
+        }
+    }, [language, googleSdk, apiKey]);
+    return googleSdk;
+};

package/src/utils/i18n.d.ts

@@ -1,8 +1,8 @@
-import { Props } from "@swan-io/lake/src/utils/rifm";
+import { RifmProps } from "@swan-io/lake/src/utils/rifm";
 import { ReactElement, ReactNode } from "react";
 import translationEN from "../locales/en.json";
 declare const supportedLanguages: readonly ["en", "es", "de", "fr", "it", "nl", "pt"];
-type SupportedLanguage = (typeof supportedLanguages)[number];
+type SupportedLanguage = typeof supportedLanguages[number];
 type TranslationParams = Record<string, string | number>;
 export type TranslationKey = keyof typeof translationEN;
 type Locale = {
@@ -17,5 +17,5 @@ type Locale = {
 export declare const locale: Locale;
 export declare const t: (key: TranslationKey, params?: TranslationParams) => string;
 export declare const formatNestedMessage: (key: TranslationKey, params: Record<string, string | number | ReactElement<any, string | import("react").JSXElementConstructor<any>> | ((children: ReactNode) => ReactNode)>) => (string | ReactElement<unknown, string | import("react").JSXElementConstructor<any>>)[];
-export declare const rifmDateProps: Props;
+export declare const rifmDateProps: RifmProps;
 export {};

package/README.md

@@ -1 +0,0 @@
-# @swan-io/shared-business

package/src/third-party/Pappers.d.ts

@@ -1,8 +0,0 @@
-import { Future, Result } from "@swan-io/boxed";
-export type CompanySuggestion = {
-    city: string;
-    name: string;
-    siren: string;
-    value: string;
-};
-export declare const queryCompanies: (_query: string) => Future<Result<Array<CompanySuggestion>, Error>>;

package/src/third-party/Pappers.js

@@ -1,36 +0,0 @@
-import { Future, Result } from "@swan-io/boxed";
-import { isNotNullish } from "@swan-io/lake/src/utils/nullish";
-export const queryCompanies = (_query) => Future.make(resolve => {
-    const xhr = new XMLHttpRequest();
-    xhr.responseType = "json";
-    // const params = new URLSearchParams({
-    //   cibles: "nom_entreprise,denomination,siren",
-    //   q: query,
-    // });
-    // xhr.open("GET", `${__SWAN_ENV_PAPPERS_API_URL__}?${params.toString()}`, true);
-    xhr.addEventListener("load", () => {
-        resolve((xhr.status >= 200 && xhr.status < 300) || xhr.status === 304
-            ? Result.Ok(xhr.response)
-            : Result.Error(new Error(xhr.statusText)));
-    });
-    xhr.addEventListener("error", () => {
-        resolve(Result.Error(new Error("Failed to fetch companies")));
-    });
-    const timeoutId = setTimeout(() => xhr.send(), 250);
-    return () => {
-        xhr.abort();
-        clearTimeout(timeoutId);
-    };
-}).mapOk(({ resultats_siren = [], resultats_nom_entreprise = [], resultats_denomination = [] }) => {
-    return [...resultats_siren, ...resultats_nom_entreprise, ...resultats_denomination]
-        .filter(isNotNullish)
-        .reduce((acc, result) => {
-        const { denomination, nom_entreprise, siege, siren = "" } = result;
-        const name = nom_entreprise ?? denomination ?? "";
-        const city = [siege?.code_postal, siege?.ville].filter(isNotNullish).join(" ");
-        // we don't display result without name, without siren or already displayed
-        return name === "" || siren === "" || acc.some(suggestion => suggestion.siren === siren)
-            ? acc
-            : [...acc, { value: siren, siren, name, city }];
-    }, []);
-}, true);