@tap-payments/auth-jsconnect 2.4.14-test → 2.4.16-test
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/@types/app.d.ts +28 -1
- package/build/features/app/individual/individualStore.js +8 -5
- package/build/features/entity/screens/EntityCapital/EntityCapital.js +7 -7
- package/build/features/individual/screens/AdditionalIndividualInfo/AdditionalIndividualInfo.js +28 -21
- package/build/features/individual/screens/AdditionalIndividualInfo/CivilIDFile.js +10 -4
- package/build/features/individual/screens/AdditionalIndividualInfo/InfluencerSwitch.d.ts +2 -1
- package/build/features/individual/screens/AdditionalIndividualInfo/InfluencerSwitch.js +13 -10
- package/build/features/individual/screens/AdditionalIndividualInfo/MonthlyIncome.js +14 -19
- package/build/features/individual/screens/AdditionalIndividualInfo/Occupation.d.ts +1 -0
- package/build/features/individual/screens/AdditionalIndividualInfo/Occupation.js +9 -18
- package/build/features/individual/screens/AdditionalIndividualInfo/PEPSwitch.d.ts +2 -1
- package/build/features/individual/screens/AdditionalIndividualInfo/PEPSwitch.js +12 -9
- package/build/features/individual/screens/AdditionalIndividualInfo/SignatureFile.js +9 -3
- package/build/features/individual/screens/AdditionalIndividualInfo/SourceOfIncome.js +14 -18
- package/build/features/individual/screens/IndividualPersonalInfo/BirthCity.d.ts +1 -0
- package/build/features/individual/screens/IndividualPersonalInfo/BirthCity.js +5 -13
- package/build/features/individual/screens/IndividualPersonalInfo/BirthCountry.d.ts +1 -0
- package/build/features/individual/screens/IndividualPersonalInfo/BirthCountry.js +5 -13
- package/build/features/individual/screens/IndividualPersonalInfo/DOB.d.ts +2 -1
- package/build/features/individual/screens/IndividualPersonalInfo/DOB.js +2 -2
- package/build/features/individual/screens/IndividualPersonalInfo/Email.d.ts +2 -1
- package/build/features/individual/screens/IndividualPersonalInfo/Email.js +3 -8
- package/build/features/individual/screens/IndividualPersonalInfo/ExpiryDate.d.ts +2 -1
- package/build/features/individual/screens/IndividualPersonalInfo/ExpiryDate.js +2 -3
- package/build/features/individual/screens/IndividualPersonalInfo/Gender.d.ts +2 -1
- package/build/features/individual/screens/IndividualPersonalInfo/Gender.js +3 -2
- package/build/features/individual/screens/IndividualPersonalInfo/ID.d.ts +2 -1
- package/build/features/individual/screens/IndividualPersonalInfo/ID.js +3 -5
- package/build/features/individual/screens/IndividualPersonalInfo/IndividualPersonalInfo.js +58 -20
- package/build/features/individual/screens/IndividualPersonalInfo/IssuedCountry.d.ts +1 -0
- package/build/features/individual/screens/IndividualPersonalInfo/IssuedCountry.js +6 -15
- package/build/features/individual/screens/IndividualPersonalInfo/MobileNumber.d.ts +1 -0
- package/build/features/individual/screens/IndividualPersonalInfo/MobileNumber.js +5 -8
- package/build/features/individual/screens/IndividualPersonalInfo/Name.d.ts +2 -1
- package/build/features/individual/screens/IndividualPersonalInfo/Name.js +3 -10
- package/build/features/individual/screens/IndividualPersonalInfo/Nationality.d.ts +1 -0
- package/build/features/individual/screens/IndividualPersonalInfo/Nationality.js +6 -15
- package/package.json +1 -1
|
@@ -20,20 +20,20 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
20
20
|
}
|
|
21
21
|
return t;
|
|
22
22
|
};
|
|
23
|
-
import {
|
|
23
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
24
24
|
import * as React from 'react';
|
|
25
25
|
import Box from '@mui/material/Box';
|
|
26
26
|
import { useTranslation } from 'react-i18next';
|
|
27
27
|
import { useController, useFormContext } from 'react-hook-form';
|
|
28
28
|
import { styled } from '@mui/material/styles';
|
|
29
|
-
import CheckIcon from '@mui/icons-material/Check';
|
|
30
29
|
import { useLanguage } from '../../../../hooks';
|
|
31
30
|
import Collapse from '../../../../components/Collapse';
|
|
32
|
-
import ExpandIcon from '../../../../components/ExpandIcon';
|
|
33
31
|
import Text from '../../../../components/Text';
|
|
34
32
|
import SimpleList from '../../../../components/SimpleList';
|
|
35
33
|
import ScreenContainer from '../../../shared/Containers/ScreenContainer';
|
|
36
34
|
import Input from '../../../shared/Input';
|
|
35
|
+
import { EndAdornmentExpanded } from '../../../shared/EndAdornment';
|
|
36
|
+
import CheckIcon from '../../../shared/CheckIcon';
|
|
37
37
|
var CountryItemContainer = styled(Box)(function () { return ({
|
|
38
38
|
display: 'flex'
|
|
39
39
|
}); });
|
|
@@ -49,24 +49,15 @@ var CountryNameText = styled(Text, { shouldForwardProp: function (prop) { return
|
|
|
49
49
|
var theme = _a.theme, isSelected = _a.isSelected;
|
|
50
50
|
return (__assign(__assign({ color: theme.palette.text.primary }, theme.typography.body2), { fontWeight: isSelected ? theme.typography.fontWeightMedium : theme.typography.fontWeightLight, paddingInlineStart: theme.spacing(1.25) }));
|
|
51
51
|
});
|
|
52
|
-
var CheckIconStyled = styled(CheckIcon)(function (_a) {
|
|
53
|
-
var theme = _a.theme;
|
|
54
|
-
return ({
|
|
55
|
-
color: theme.palette.success.main,
|
|
56
|
-
display: 'flex',
|
|
57
|
-
alignItems: 'flex-end'
|
|
58
|
-
});
|
|
59
|
-
});
|
|
60
52
|
var IssuedCountry = React.forwardRef(function (_a, ref) {
|
|
61
53
|
var _b, _c, _d;
|
|
62
|
-
var countries = _a.countries, readOnly = _a.readOnly, rest = __rest(_a, ["countries", "readOnly"]);
|
|
54
|
+
var countries = _a.countries, readOnly = _a.readOnly, isVerified = _a.isVerified, rest = __rest(_a, ["countries", "readOnly", "isVerified"]);
|
|
63
55
|
var _e = React.useState(countries), locationCountries = _e[0], setCountries = _e[1];
|
|
64
56
|
var _f = React.useState(null), anchorEl = _f[0], setAnchorEl = _f[1];
|
|
65
57
|
var t = useTranslation().t;
|
|
66
58
|
var isAr = useLanguage().isAr;
|
|
67
59
|
var control = useFormContext().control;
|
|
68
60
|
var issuedCountryControl = useController({ control: control, name: 'issuedCountry' });
|
|
69
|
-
var disabled = false;
|
|
70
61
|
var onOpenCountrySelect = function (event) {
|
|
71
62
|
var _a;
|
|
72
63
|
if (readOnly)
|
|
@@ -86,8 +77,8 @@ var IssuedCountry = React.forwardRef(function (_a, ref) {
|
|
|
86
77
|
};
|
|
87
78
|
var location = issuedCountryControl.field.value;
|
|
88
79
|
var error = (_b = issuedCountryControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
|
|
89
|
-
return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { pt: 2.5 } }, { children: [_jsx(InputStyled, { label: t('issued_country_label'), readOnly: readOnly,
|
|
90
|
-
return (_jsxs(_Fragment, { children: [_jsx(CountryItemContainer, { children: _jsx(CountryNameText, __assign({ isSelected: (item === null || item === void 0 ? void 0 : item.idd_prefix) === (location === null || location === void 0 ? void 0 : location.idd_prefix) }, { children: isAr ? item.name.arabic : item.name.english })) }), item.idd_prefix === (location === null || location === void 0 ? void 0 : location.idd_prefix) && _jsx(
|
|
80
|
+
return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { pt: 2.5 } }, { children: [_jsx(InputStyled, { label: t('issued_country_label'), readOnly: readOnly, onClick: !!anchorEl ? function () { return onCloseCountrySelect(); } : onOpenCountrySelect, endAdornment: _jsx(EndAdornmentExpanded, { anchorEl: anchorEl, isVerified: isVerified }), placeholder: t('choose_issued_country'), value: (isAr ? (_c = location === null || location === void 0 ? void 0 : location.name) === null || _c === void 0 ? void 0 : _c.arabic : (_d = location === null || location === void 0 ? void 0 : location.name) === null || _d === void 0 ? void 0 : _d.english) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.english', searchValuePath: ['name.arabic', 'name.english'], list: locationCountries, onSelectItem: onSelectItem, renderItem: function (item) {
|
|
81
|
+
return (_jsxs(_Fragment, { children: [_jsx(CountryItemContainer, { children: _jsx(CountryNameText, __assign({ isSelected: (item === null || item === void 0 ? void 0 : item.idd_prefix) === (location === null || location === void 0 ? void 0 : location.idd_prefix) }, { children: isAr ? item.name.arabic : item.name.english })) }), item.idd_prefix === (location === null || location === void 0 ? void 0 : location.idd_prefix) && _jsx(CheckIcon, { isVerified: isVerified })] }));
|
|
91
82
|
} }) }))] })) })));
|
|
92
83
|
});
|
|
93
84
|
export default React.memo(IssuedCountry);
|
|
@@ -6,6 +6,7 @@ interface MobileNumberProps {
|
|
|
6
6
|
onListOpen?: () => void;
|
|
7
7
|
onListClose?: () => void;
|
|
8
8
|
readOnly?: boolean;
|
|
9
|
+
isVerified?: boolean;
|
|
9
10
|
}
|
|
10
11
|
declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<MobileNumberProps & React.RefAttributes<unknown>>>;
|
|
11
12
|
export default _default;
|
|
@@ -27,16 +27,15 @@ import { useController, useFormContext } from 'react-hook-form';
|
|
|
27
27
|
import Box from '@mui/material/Box';
|
|
28
28
|
import { styled, alpha } from '@mui/material/styles';
|
|
29
29
|
import { removeAllCharsFromNumber } from '../../../../utils';
|
|
30
|
-
import { useLanguage
|
|
30
|
+
import { useLanguage } from '../../../../hooks';
|
|
31
31
|
import Text from '../../../../components/Text';
|
|
32
32
|
import Collapse from '../../../../components/Collapse';
|
|
33
33
|
import ExpandIcon from '../../../../components/ExpandIcon';
|
|
34
34
|
import SimpleList from '../../../../components/SimpleList';
|
|
35
|
-
import ClearIcon from '../../../shared/ClearIcon';
|
|
36
35
|
import CheckIcon from '../../../shared/CheckIcon';
|
|
37
36
|
import ScreenContainer from '../../../shared/Containers/ScreenContainer';
|
|
38
37
|
import Input from '../../../shared/Input';
|
|
39
|
-
import {
|
|
38
|
+
import { EndAdornment } from '../../../shared/EndAdornment';
|
|
40
39
|
var LabelContainerStyled = styled(Box)(function (_a) {
|
|
41
40
|
var theme = _a.theme;
|
|
42
41
|
return ({
|
|
@@ -83,13 +82,12 @@ var InputStyled = styled(Input)(function (_a) {
|
|
|
83
82
|
});
|
|
84
83
|
var MobileNumber = React.forwardRef(function (_a, ref) {
|
|
85
84
|
var _b, _c, _d;
|
|
86
|
-
var countries = _a.countries, readOnly = _a.readOnly, rest = __rest(_a, ["countries", "readOnly"]);
|
|
85
|
+
var countries = _a.countries, readOnly = _a.readOnly, isVerified = _a.isVerified, rest = __rest(_a, ["countries", "readOnly", "isVerified"]);
|
|
87
86
|
var _e = React.useState(countries || []), countriesCode = _e[0], setCountries = _e[1];
|
|
88
87
|
var _f = React.useState(null), anchorEl = _f[0], setAnchorEl = _f[1];
|
|
89
88
|
var t = useTranslation().t;
|
|
90
89
|
var isAr = useLanguage().isAr;
|
|
91
90
|
var _g = useFormContext(), control = _g.control, setValue = _g.setValue;
|
|
92
|
-
var data = useAppSelector(individualSelector).data;
|
|
93
91
|
var phoneControl = useController({ name: 'mobile', control: control });
|
|
94
92
|
var countryCodeControl = useController({ name: 'countryCode', control: control });
|
|
95
93
|
var countryCodeValue = countryCodeControl.field.value;
|
|
@@ -100,7 +98,6 @@ var MobileNumber = React.forwardRef(function (_a, ref) {
|
|
|
100
98
|
var mobileLen = countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.digits;
|
|
101
99
|
var isStartsWith5 = mobileValue.startsWith('5');
|
|
102
100
|
var requiredLen = isSA && isStartsWith5 ? mobileLen - 1 : mobileLen;
|
|
103
|
-
var disabled = false;
|
|
104
101
|
React.useEffect(function () {
|
|
105
102
|
if (mobileValue)
|
|
106
103
|
setValue('mobile', mobileValue, { shouldValidate: true });
|
|
@@ -138,8 +135,8 @@ var MobileNumber = React.forwardRef(function (_a, ref) {
|
|
|
138
135
|
setValue('mobile', '');
|
|
139
136
|
countryCodeControl.field.onChange(country);
|
|
140
137
|
};
|
|
141
|
-
return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { mb: 3 } }, { children: [_jsx(LabelContainerStyled, { children: _jsx(InputLabelStyled, { children: t('signup_enter_mobile') }) }), _jsx(InputStyled, { readOnly: readOnly, inputProps: { maxLength: requiredLen }, type: 'tel', disabled:
|
|
142
|
-
return (_jsxs(_Fragment, { children: [_jsxs(CountryItemContainer, { children: [_jsxs(CountryCodeText, __assign({ isSelected: (item === null || item === void 0 ? void 0 : item.idd_prefix) === (countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.idd_prefix) }, { children: ["+", item.idd_prefix] })), _jsx(CountryNameText, __assign({ isSelected: (item === null || item === void 0 ? void 0 : item.idd_prefix) === (countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.idd_prefix) }, { children: isAr ? item.name.arabic : item.name.english }))] }), item.idd_prefix === (countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.idd_prefix) && _jsx(CheckIcon, {})] }));
|
|
138
|
+
return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { mb: 3 } }, { children: [_jsx(LabelContainerStyled, { children: _jsx(InputLabelStyled, { children: t('signup_enter_mobile') }) }), _jsx(InputStyled, { readOnly: readOnly, inputProps: { maxLength: requiredLen }, type: 'tel', disabled: !!anchorEl, onClick: onCloseCountryList, onChange: onPhoneNumberChange, value: !!anchorEl ? countryName : mobileValue, startAdornment: _jsxs(CountryCodeStyled, __assign({ onClick: readOnly ? undefined : function () { return toggleCountryList(); } }, { children: ["+".concat(countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.idd_prefix), !anchorEl && _jsx(ExpandIconStyled, { anchorEl: !!anchorEl })] })), endAdornment: !!anchorEl ? (_jsx(ExpandIconStyled, { onClick: function () { return toggleCountryList(); }, anchorEl: !!anchorEl })) : (_jsx(EndAdornment, { value: mobileValue, isVerified: isVerified, onClear: clearMobileNumber, error: error })), placeholder: "".concat(isSA ? '5' : '0', "00000000"), warningType: 'alert', warningMessage: error && t(error, { length: requiredLen, number: '05|5' }) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.english', searchValuePath: ['name.arabic', 'name.english'], list: countriesCode, onSelectItem: onSelectItem, renderItem: function (item) {
|
|
139
|
+
return (_jsxs(_Fragment, { children: [_jsxs(CountryItemContainer, { children: [_jsxs(CountryCodeText, __assign({ isSelected: (item === null || item === void 0 ? void 0 : item.idd_prefix) === (countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.idd_prefix) }, { children: ["+", item.idd_prefix] })), _jsx(CountryNameText, __assign({ isSelected: (item === null || item === void 0 ? void 0 : item.idd_prefix) === (countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.idd_prefix) }, { children: isAr ? item.name.arabic : item.name.english }))] }), item.idd_prefix === (countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.idd_prefix) && _jsx(CheckIcon, { isVerified: isVerified })] }));
|
|
143
140
|
} }) }))] })) })));
|
|
144
141
|
});
|
|
145
142
|
export default React.memo(MobileNumber);
|
|
@@ -2,6 +2,7 @@ import * as React from 'react';
|
|
|
2
2
|
export interface NameProps {
|
|
3
3
|
show: boolean;
|
|
4
4
|
readOnly?: boolean;
|
|
5
|
+
isVerified?: boolean;
|
|
5
6
|
}
|
|
6
|
-
declare const _default: React.MemoExoticComponent<({ show, readOnly }: NameProps) => JSX.Element>;
|
|
7
|
+
declare const _default: React.MemoExoticComponent<({ show, readOnly, isVerified }: NameProps) => JSX.Element>;
|
|
7
8
|
export default _default;
|
|
@@ -15,13 +15,10 @@ import { useController, useFormContext } from 'react-hook-form';
|
|
|
15
15
|
import { useTranslation } from 'react-i18next';
|
|
16
16
|
import { styled } from '@mui/material/styles';
|
|
17
17
|
import { removeAllOtherThanAlphabetAndSpace } from '../../../../utils';
|
|
18
|
-
import { useAppSelector } from '../../../../hooks';
|
|
19
18
|
import Collapse from '../../../../components/Collapse';
|
|
20
19
|
import { ScreenContainer } from '../../../shared/Containers';
|
|
21
20
|
import Input from '../../../shared/Input';
|
|
22
|
-
import
|
|
23
|
-
import CheckIcon from '../../../shared/CheckIcon';
|
|
24
|
-
import { individualSelector } from '../../../app/individual/individualStore';
|
|
21
|
+
import { EndAdornment } from '../../../shared/EndAdornment';
|
|
25
22
|
var InputStyled = styled(Input)(function () { return ({
|
|
26
23
|
input: {
|
|
27
24
|
textTransform: 'capitalize'
|
|
@@ -29,23 +26,19 @@ var InputStyled = styled(Input)(function () { return ({
|
|
|
29
26
|
}); });
|
|
30
27
|
var Name = function (_a) {
|
|
31
28
|
var _b;
|
|
32
|
-
var show = _a.show, readOnly = _a.readOnly;
|
|
29
|
+
var show = _a.show, readOnly = _a.readOnly, isVerified = _a.isVerified;
|
|
33
30
|
var t = useTranslation().t;
|
|
34
31
|
var control = useFormContext().control;
|
|
35
32
|
var nameControl = useController({ name: 'name', control: control });
|
|
36
|
-
var data = useAppSelector(individualSelector).data;
|
|
37
|
-
var verify = data.verify;
|
|
38
|
-
var user = (verify.responseBody || {}).user;
|
|
39
33
|
var handleNameChange = function (event) {
|
|
40
34
|
var value = removeAllOtherThanAlphabetAndSpace(event.target.value);
|
|
41
35
|
nameControl.field.onChange(value);
|
|
42
36
|
};
|
|
43
37
|
var nameValue = nameControl.field.value;
|
|
44
38
|
var error = (_b = nameControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
|
|
45
|
-
var disabled = false;
|
|
46
39
|
var clearNumber = function () {
|
|
47
40
|
nameControl.field.onChange('');
|
|
48
41
|
};
|
|
49
|
-
return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(ScreenContainer, __assign({ sx: { mb: 3, mt: 2.5 } }, { children: _jsx(InputStyled, { readOnly: readOnly, label: t('signup_merchant_name_label'), value: nameValue,
|
|
42
|
+
return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(ScreenContainer, __assign({ sx: { mb: 3, mt: 2.5 } }, { children: _jsx(InputStyled, { readOnly: readOnly, label: t('signup_merchant_name_label'), value: nameValue, onChange: handleNameChange, placeholder: t('signup_merchant_name_label'), warningType: 'alert', warningMessage: error && t(error), endAdornment: _jsx(EndAdornment, { value: nameValue, isVerified: isVerified, onClear: clearNumber, error: error }) }) })) })));
|
|
50
43
|
};
|
|
51
44
|
export default React.memo(Name);
|
|
@@ -6,6 +6,7 @@ interface NationalityProps {
|
|
|
6
6
|
onListOpen?: () => void;
|
|
7
7
|
onListClose?: () => void;
|
|
8
8
|
readOnly?: boolean;
|
|
9
|
+
isVerified?: boolean;
|
|
9
10
|
}
|
|
10
11
|
declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<NationalityProps & React.RefAttributes<unknown>>>;
|
|
11
12
|
export default _default;
|
|
@@ -20,20 +20,20 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
20
20
|
}
|
|
21
21
|
return t;
|
|
22
22
|
};
|
|
23
|
-
import {
|
|
23
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
24
24
|
import * as React from 'react';
|
|
25
25
|
import Box from '@mui/material/Box';
|
|
26
26
|
import { useTranslation } from 'react-i18next';
|
|
27
27
|
import { useController, useFormContext } from 'react-hook-form';
|
|
28
28
|
import { styled } from '@mui/material/styles';
|
|
29
|
-
import CheckIcon from '@mui/icons-material/Check';
|
|
30
29
|
import { useLanguage } from '../../../../hooks';
|
|
31
30
|
import Collapse from '../../../../components/Collapse';
|
|
32
|
-
import ExpandIcon from '../../../../components/ExpandIcon';
|
|
33
31
|
import Text from '../../../../components/Text';
|
|
34
32
|
import SimpleList from '../../../../components/SimpleList';
|
|
35
33
|
import ScreenContainer from '../../../shared/Containers/ScreenContainer';
|
|
36
34
|
import Input from '../../../shared/Input';
|
|
35
|
+
import { EndAdornmentExpanded } from '../../../shared/EndAdornment';
|
|
36
|
+
import CheckIcon from '../../../shared/CheckIcon';
|
|
37
37
|
var CountryItemContainer = styled(Box)(function () { return ({
|
|
38
38
|
display: 'flex'
|
|
39
39
|
}); });
|
|
@@ -49,24 +49,15 @@ var CountryNameText = styled(Text, { shouldForwardProp: function (prop) { return
|
|
|
49
49
|
var theme = _a.theme, isSelected = _a.isSelected;
|
|
50
50
|
return (__assign(__assign({ color: theme.palette.text.primary }, theme.typography.body2), { fontWeight: isSelected ? theme.typography.fontWeightMedium : theme.typography.fontWeightLight, paddingInlineStart: theme.spacing(1.25) }));
|
|
51
51
|
});
|
|
52
|
-
var CheckIconStyled = styled(CheckIcon)(function (_a) {
|
|
53
|
-
var theme = _a.theme;
|
|
54
|
-
return ({
|
|
55
|
-
color: theme.palette.success.main,
|
|
56
|
-
display: 'flex',
|
|
57
|
-
alignItems: 'flex-end'
|
|
58
|
-
});
|
|
59
|
-
});
|
|
60
52
|
var Nationality = React.forwardRef(function (_a, ref) {
|
|
61
53
|
var _b, _c, _d;
|
|
62
|
-
var countries = _a.countries, readOnly = _a.readOnly, rest = __rest(_a, ["countries", "readOnly"]);
|
|
54
|
+
var countries = _a.countries, readOnly = _a.readOnly, isVerified = _a.isVerified, rest = __rest(_a, ["countries", "readOnly", "isVerified"]);
|
|
63
55
|
var _e = React.useState(countries), locationCountries = _e[0], setCountries = _e[1];
|
|
64
56
|
var _f = React.useState(null), anchorEl = _f[0], setAnchorEl = _f[1];
|
|
65
57
|
var t = useTranslation().t;
|
|
66
58
|
var isAr = useLanguage().isAr;
|
|
67
59
|
var control = useFormContext().control;
|
|
68
60
|
var nationalityControl = useController({ control: control, name: 'nationality' });
|
|
69
|
-
var disabled = false;
|
|
70
61
|
var onOpenCountrySelect = function (event) {
|
|
71
62
|
var _a;
|
|
72
63
|
if (readOnly)
|
|
@@ -86,8 +77,8 @@ var Nationality = React.forwardRef(function (_a, ref) {
|
|
|
86
77
|
};
|
|
87
78
|
var location = nationalityControl.field.value;
|
|
88
79
|
var error = (_b = nationalityControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
|
|
89
|
-
return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { pt: 2.5 } }, { children: [_jsx(InputStyled, { label: t('nationality_label'), readOnly: readOnly,
|
|
90
|
-
return (_jsxs(_Fragment, { children: [_jsx(CountryItemContainer, { children: _jsx(CountryNameText, __assign({ isSelected: (item === null || item === void 0 ? void 0 : item.idd_prefix) === (location === null || location === void 0 ? void 0 : location.idd_prefix) }, { children: isAr ? item.name.arabic : item.name.english })) }), item.idd_prefix === (location === null || location === void 0 ? void 0 : location.idd_prefix) && _jsx(
|
|
80
|
+
return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { pt: 2.5 } }, { children: [_jsx(InputStyled, { label: t('nationality_label'), readOnly: readOnly, onClick: !!anchorEl ? function () { return onCloseCountrySelect(); } : onOpenCountrySelect, endAdornment: _jsx(EndAdornmentExpanded, { anchorEl: anchorEl, isVerified: isVerified }), placeholder: t('choose_nationality'), value: (isAr ? (_c = location === null || location === void 0 ? void 0 : location.name) === null || _c === void 0 ? void 0 : _c.arabic : (_d = location === null || location === void 0 ? void 0 : location.name) === null || _d === void 0 ? void 0 : _d.english) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.english', searchValuePath: ['name.arabic', 'name.english'], list: locationCountries, onSelectItem: onSelectItem, renderItem: function (item) {
|
|
81
|
+
return (_jsxs(_Fragment, { children: [_jsx(CountryItemContainer, { children: _jsx(CountryNameText, __assign({ isSelected: (item === null || item === void 0 ? void 0 : item.idd_prefix) === (location === null || location === void 0 ? void 0 : location.idd_prefix) }, { children: isAr ? item.name.arabic : item.name.english })) }), item.idd_prefix === (location === null || location === void 0 ? void 0 : location.idd_prefix) && _jsx(CheckIcon, { isVerified: isVerified })] }));
|
|
91
82
|
} }) }))] })) })));
|
|
92
83
|
});
|
|
93
84
|
export default React.memo(Nationality);
|