@tap-payments/auth-jsconnect 1.0.10 → 1.0.14

package/build/features/connect/screens/MID/MobileNumber.js

@@ -29,12 +29,12 @@ import { styled, alpha } from '@mui/material/styles';
 import Text from '../../../../components/Text';
 import Collapse from '../../../../components/Collapse';
 import Tooltip from '@mui/material/Tooltip';
-import CheckIcon from '@mui/icons-material/Check';
-import ExpandIcon from '../../../../features/shared/ExpandIcon';
-import ClearIcon from '../../../../features/shared/ClearIcon';
-import ScreenContainer from '../../../../features/shared/Containers/ScreenContainer';
+import ExpandIcon from '../../../shared/ExpandIcon';
+import ClearIcon from '../../../shared/ClearIcon';
+import CheckIcon from '../../../shared/CheckIcon';
+import ScreenContainer from '../../../shared/Containers/ScreenContainer';
 import Icon from '../../../../components/Icon';
-import Input from '../../../../features/shared/Input';
+import Input from '../../../shared/Input';
 import SimpleList from '../../../../components/SimpleList';
 import { ICONS_NAMES } from '../../../../constants';
 import { removeAllCharsFromNumber } from '../../../../utils';
@@ -66,14 +66,6 @@ var CountryNameText = styled(Text, { shouldForwardProp: function (prop) { return
     var theme = _a.theme, isSelected = _a.isSelected;
     return (__assign(__assign({ color: theme.palette.text.primary }, theme.typography.body2), { fontWeight: isSelected ? theme.typography.fontWeightMedium : theme.typography.fontWeightLight, paddingInlineStart: theme.spacing(1.25) }));
 });
-var CheckIconStyled = styled(CheckIcon)(function (_a) {
-    var theme = _a.theme;
-    return ({
-        color: theme.palette.success.main,
-        display: 'flex',
-        alignItems: 'flex-end'
-    });
-});
 var CountryCodeStyled = styled(Text)(function (_a) {
     var theme = _a.theme;
     return (__assign(__assign({ cursor: 'pointer' }, theme.typography.body2), { fontWeight: theme.typography.fontWeightRegular, display: 'flex', alignItems: 'center', minWidth: theme.spacing(8.75) }));
@@ -82,6 +74,12 @@ var InputLabelStyled = styled(Text)(function (_a) {
     var theme = _a.theme;
     return (__assign(__assign({ color: alpha(theme.palette.text.primary, 0.6), fontWeight: theme.typography.fontWeightMedium }, theme.typography.caption), { lineHeight: theme.spacing(2.5) }));
 });
+var ExpandIconStyled = styled(ExpandIcon)(function (_a) {
+    var theme = _a.theme;
+    return ({
+        marginInlineStart: theme.spacing(1)
+    });
+});
 var MobileNumber = React.forwardRef(function (_a, ref) {
     var _b;
     var countries = _a.countries, rest = __rest(_a, ["countries"]);
@@ -125,8 +123,8 @@ var MobileNumber = React.forwardRef(function (_a, ref) {
     var mobileValue = phoneControl.field.value;
     var countryCodeValue = countryCodeControl.field.value;
     var error = (_b = phoneControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
-    return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref }, { children: [_jsxs(LabelContainerStyled, { children: [_jsx(InputLabelStyled, { children: t('mobile_number_label') }), _jsx(Collapse, __assign({ in: !anchorEl }, { children: _jsx(Tooltip, __assign({ title: t('switch_to_id') }, { children: _jsx(IconStyled, { onClick: rest.onSwitchToIdNumber, alt: 'switcher icon', src: ICONS_NAMES.ID_IMAGE }) })) }))] }), _jsx(Input, { sx: { direction: 'ltr' }, inputProps: { maxLength: (countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.digits) || 10 }, onChange: onPhoneNumberChange, value: mobileValue, startAdornment: _jsxs(CountryCodeStyled, __assign({ onClick: onOpenCountryList }, { children: ["+".concat(countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.idd_prefix), _jsx(ExpandIcon, { anchorEl: !!anchorEl })] })), endAdornment: mobileValue && _jsx(ClearIcon, { onClick: clearMobileNumber }), placeholder: "".concat((countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.iso2) === 'SA' ? '5' : '0', "00000000"), warningType: 'alert', warningMessage: (!anchorEl && error) || '' }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.english', list: countriesCode, onSelectItem: onSelectItem, renderItem: function (item) {
-                            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(CheckIconStyled, {})] }));
+    return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref }, { children: [_jsxs(LabelContainerStyled, { children: [_jsx(InputLabelStyled, { children: t('signup_enter_mobile') }), _jsx(Collapse, __assign({ in: !anchorEl }, { children: _jsx(Tooltip, __assign({ title: t('switch_to_id') }, { children: _jsx(IconStyled, { onClick: rest.onSwitchToIdNumber, alt: 'switcher icon', src: ICONS_NAMES.ID_IMAGE }) })) }))] }), _jsx(Input, { sx: { direction: 'ltr' }, inputProps: { maxLength: (countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.digits) || 10 }, onChange: onPhoneNumberChange, value: mobileValue, startAdornment: _jsxs(CountryCodeStyled, __assign({ onClick: onOpenCountryList }, { children: ["+".concat(countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.idd_prefix), _jsx(ExpandIconStyled, { anchorEl: !!anchorEl })] })), endAdornment: !error && mobileValue ? _jsx(CheckIcon, {}) : mobileValue && _jsx(ClearIcon, { onClick: clearMobileNumber }), placeholder: "".concat((countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.iso2) === 'SA' ? '5' : '0', "00000000"), warningType: 'alert', warningMessage: error && t(error, { length: countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.digits }) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.english', list: countriesCode, onSelectItem: onSelectItem, renderItem: function (item) {
+                            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, {})] }));
                         } }) }))] })) })));
 });
 export default React.memo(MobileNumber);

package/build/features/connect/screens/MID/validation.d.ts

@@ -9,7 +9,7 @@ export declare const NIDValidationSchema: yup.ObjectSchema<import("yup/lib/objec
     dob: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
     nid: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
 }>>>;
-export declare const PhoneValidationSchema: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+export declare const PhoneValidationSchema: (min: number) => yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
     mobile: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
 }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
     mobile: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;

package/build/features/connect/screens/MID/validation.js

@@ -1,8 +1,14 @@
 import * as yup from 'yup';
 export var NIDValidationSchema = yup.object().shape({
-    dob: yup.string().min(5).required('DOB is required'),
-    nid: yup.string().min(8).max(10).required('NID is required')
-});
-export var PhoneValidationSchema = yup.object().shape({
-    mobile: yup.string().min(5).required('Phone number is required')
+    dob: yup.string().min(5).required('enter_valid_birth_date'),
+    nid: yup
+        .string()
+        .min(8, 'signup_invalid_national_id_format')
+        .max(10, 'signup_invalid_national_id_format')
+        .required('signup_invalid_national_id')
 });
+export var PhoneValidationSchema = function (min) {
+    return yup.object().shape({
+        mobile: yup.string().min(min, 'enter_valid_mobile_number').required('mobile_number_error')
+    });
+};

package/build/features/connect/screens/Merchant/BrandName.js

@@ -22,7 +22,8 @@ import Text from '../../../../components/Text';
 import Input from '../../../shared/Input';
 import ClearIcon from '../../../shared/ClearIcon';
 import Tooltip from '../../../../components/Tooltip';
-import { removeAllOtherThanAlphabet } from '../../../../utils';
+import { removeAllOtherThanCharsNumbersAndSpace } from '../../../../utils';
+import CheckIcon from '../../../shared/CheckIcon';
 var LabelContainerStyled = styled(Box)(function (_a) {
     var theme = _a.theme;
     return ({
@@ -61,13 +62,14 @@ var BrandName = function (_a) {
     var brandControl = useController({ control: control, name: 'brandName' });
     var handleBrandNameChange = function (_a) {
         var target = _a.target;
-        var value = removeAllOtherThanAlphabet(target.value);
+        var value = removeAllOtherThanCharsNumbersAndSpace(target.value);
         brandControl.field.onChange(value);
     };
     var clearBrandName = function () {
         brandControl.field.onChange('');
     };
     var brandNameValue = brandControl.field.value;
-    return (_jsxs(ScreenContainer, __assign({ sx: { mt: 2.5, mb: 3 } }, { children: [_jsxs(LabelContainerStyled, { children: [_jsx(InputLabelStyled, { children: t('brand_name_label') }), _jsx(Tooltip, __assign({ title: t('brand_name_description'), onMouseOver: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); } }, { children: isHovered ? _jsx(InfoIconStyled, {}) : _jsx(InfoOutlinedIconStyled, {}) }))] }), _jsx(Input, { onChange: handleBrandNameChange, value: brandNameValue, endAdornment: brandNameValue && _jsx(ClearIcon, { onClick: clearBrandName }), placeholder: t('brand_name_placeholder'), warningType: 'alert', warningMessage: (_b = brandControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message })] })));
+    var error = (_b = brandControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
+    return (_jsxs(ScreenContainer, __assign({ sx: { mt: 2.5, mb: 3 } }, { children: [_jsxs(LabelContainerStyled, { children: [_jsx(InputLabelStyled, { children: t('signup_brand_name_label') }), _jsx(Tooltip, __assign({ title: t('brand_name_hint'), onMouseOver: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); } }, { children: isHovered ? _jsx(InfoIconStyled, {}) : _jsx(InfoOutlinedIconStyled, {}) }))] }), _jsx(Input, { onChange: handleBrandNameChange, value: brandNameValue, placeholder: t('signup_brand_name_placeholder'), warningType: 'alert', warningMessage: error && t(error), endAdornment: !error && brandNameValue ? _jsx(CheckIcon, {}) : brandNameValue && _jsx(ClearIcon, { onClick: clearBrandName }) })] })));
 };
 export default React.memo(BrandName);

package/build/features/connect/screens/Merchant/SocialMedia.js

@@ -21,6 +21,7 @@ import Text from '../../../../components/Text';
 import Collapse from '../../../../components/Collapse';
 import SocialMediaGroup from '../../../../components/SocialMediaGroup';
 import { ScreenContainer } from '../../../shared/Containers';
+import CheckIcon from '../../../shared/CheckIcon';
 var SocialMediaGroupStyled = styled(SocialMediaGroup)(function (_a) {
     var theme = _a.theme, defaultValue = _a.defaultValue;
     return ({
@@ -32,6 +33,7 @@ var InputStyled = styled(Input)(function (_a) {
     var theme = _a.theme;
     return ({
         padding: theme.spacing(0, 2, 0, 0),
+        paddingInlineEnd: theme.spacing(2),
         input: {
             paddingInlineStart: theme.spacing(0)
         }
@@ -72,8 +74,11 @@ var SocialMedia = function (_a) {
     var twitterValue = links.twitter || '';
     var instagramValue = links.instagram || '';
     var errors = linksControl.fieldState.error;
+    var websiteError = (_b = errors === null || errors === void 0 ? void 0 : errors.website) === null || _b === void 0 ? void 0 : _b.message;
+    var twitterError = (_c = errors === null || errors === void 0 ? void 0 : errors.twitter) === null || _c === void 0 ? void 0 : _c.message;
+    var instagramError = (_d = errors === null || errors === void 0 ? void 0 : errors.instagram) === null || _d === void 0 ? void 0 : _d.message;
     return (_jsxs(ScreenContainer, __assign({ sx: { mb: 3 } }, { children: [_jsx(SocialMediaGroupStyled, { defaultValue: socialMediaType, exclusive: true, onChange: function (e, value) {
                     setSocialMediaType(value);
-                } }), _jsx(Collapse, __assign({ in: socialMediaType === SocialMediaTypes.WEB, timeout: 300 }, { children: _jsx(InputStyled, { onChange: handleChange, value: websiteValue, startAdornment: _jsx(TextStyled, { children: "https://" }), endAdornment: websiteValue && _jsx(ClearIconStyled, { onClick: handleClear }), placeholder: t('website_placeholder'), warningType: 'alert', warningMessage: (_b = errors === null || errors === void 0 ? void 0 : errors.website) === null || _b === void 0 ? void 0 : _b.message }) })), _jsx(Collapse, __assign({ in: socialMediaType === SocialMediaTypes.TWITTER, timeout: 300 }, { children: _jsx(InputStyled, { onChange: handleChange, value: twitterValue, startAdornment: _jsx(TextStyled, { children: "@" }), endAdornment: twitterValue && _jsx(ClearIconStyled, { onClick: handleClear }), placeholder: t('twitter_placeholder'), warningType: 'alert', warningMessage: (_c = errors === null || errors === void 0 ? void 0 : errors.twitter) === null || _c === void 0 ? void 0 : _c.message }) })), _jsx(Collapse, __assign({ in: socialMediaType === SocialMediaTypes.INSTAGRAM, timeout: 300 }, { children: _jsx(InputStyled, { onChange: handleChange, value: instagramValue, startAdornment: _jsx(TextStyled, { children: "@" }), endAdornment: instagramValue && _jsx(ClearIconStyled, { onClick: handleClear }), placeholder: t('instagram_placeholder'), warningType: 'alert', warningMessage: (_d = errors === null || errors === void 0 ? void 0 : errors.instagram) === null || _d === void 0 ? void 0 : _d.message }) }))] })));
+                } }), _jsx(Collapse, __assign({ in: socialMediaType === SocialMediaTypes.WEB, timeout: 300 }, { children: _jsx(InputStyled, { onChange: handleChange, value: websiteValue, startAdornment: _jsx(TextStyled, { children: "https://" }), placeholder: t('signup_website_placeholder'), warningType: 'alert', warningMessage: websiteError && t(websiteError), endAdornment: !websiteError && websiteValue ? _jsx(CheckIcon, {}) : websiteValue && _jsx(ClearIconStyled, { onClick: handleClear }) }) })), _jsx(Collapse, __assign({ in: socialMediaType === SocialMediaTypes.TWITTER, timeout: 300 }, { children: _jsx(InputStyled, { onChange: handleChange, value: twitterValue, startAdornment: _jsx(TextStyled, { children: "@" }), placeholder: t('signup_twitter_placeholder'), warningType: 'alert', warningMessage: twitterError && t(twitterError), endAdornment: !twitterError && twitterValue ? _jsx(CheckIcon, {}) : twitterValue && _jsx(ClearIconStyled, { onClick: handleClear }) }) })), _jsx(Collapse, __assign({ in: socialMediaType === SocialMediaTypes.INSTAGRAM, timeout: 300 }, { children: _jsx(InputStyled, { onChange: handleChange, value: instagramValue, startAdornment: _jsx(TextStyled, { children: "@" }), placeholder: t('signup_instagram_placeholder'), warningType: 'alert', warningMessage: instagramError && t(instagramError), endAdornment: !instagramError && instagramValue ? (_jsx(CheckIcon, {})) : (instagramValue && _jsx(ClearIconStyled, { onClick: handleClear })) }) }))] })));
 };
 export default React.memo(SocialMedia);

package/build/features/connect/screens/Merchant/TAC.js

@@ -52,7 +52,7 @@ var CheckboxStyled = styled(CheckBox)(function (_a) {
         marginInlineEnd: theme.spacing(1.5),
         color: theme.palette.primary.main,
         '& .MuiSvgIcon-root': {
-            fontSize: 30
+            fontSize: theme.spacing(3.75)
         },
         '&.Mui-checked': {
             color: theme.palette.text.primary,
@@ -74,6 +74,6 @@ var TAC = function (_a) {
     var handleTACCheckedChange = function (event, checked) {
         tacControl.field.onChange(checked);
     };
-    return (_jsxs(ScreenContainer, __assign({ sx: { mb: 5 } }, { children: [_jsxs(TACContainerStyled, { children: [_jsx(CheckboxStyled, { disableRipple: true, disableFocusRipple: true, focusRipple: false, checked: tacChecked, onChange: handleTACCheckedChange }), _jsxs(TextStyled, { children: [t('read_agree_terms_and_conditions_message'), _jsx(LinkStyled, __assign({ href: isAr ? EXTERNAL_LINKS.TOS_AR : EXTERNAL_LINKS.TOS_EN, target: '_blank', underline: 'always' }, { children: t('terms_and_conditions_link_title') }))] })] }), _jsx(CollapseStyled, __assign({ in: !!warningMessage }, { children: _jsx(Warning, __assign({ warningType: 'alert' }, { children: warningMessage })) }))] })));
+    return (_jsxs(ScreenContainer, __assign({ sx: { mb: 5 } }, { children: [_jsxs(TACContainerStyled, { children: [_jsx(CheckboxStyled, { disableRipple: true, disableFocusRipple: true, focusRipple: false, checked: tacChecked, onChange: handleTACCheckedChange }), _jsxs(TextStyled, { children: [t('read_agree_terms_and_conditions_message'), _jsx(LinkStyled, __assign({ href: isAr ? EXTERNAL_LINKS.TOS_AR : EXTERNAL_LINKS.TOS_EN, target: '_blank', underline: 'always' }, { children: t('terms_and_conditions_link_title') }))] })] }), _jsx(CollapseStyled, __assign({ in: !!warningMessage }, { children: _jsx(Warning, __assign({ warningType: 'alert' }, { children: warningMessage && t(warningMessage) })) }))] })));
 };
 export default React.memo(TAC);

package/build/features/connect/screens/Merchant/validation.d.ts

@@ -3,15 +3,15 @@ export declare const MerchantValidationSchema: yup.ObjectSchema<import("yup/lib/
     brandName: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
     termAndConditionChecked: yup.BooleanSchema<boolean | undefined, import("yup/lib/types").AnyObject, true>;
     links: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        website: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+        website: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
         instagram: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
         twitter: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
     }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        website: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+        website: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
         instagram: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
         twitter: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
     }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        website: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+        website: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
         instagram: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
         twitter: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
     }>>>;
@@ -19,15 +19,15 @@ export declare const MerchantValidationSchema: yup.ObjectSchema<import("yup/lib/
     brandName: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
     termAndConditionChecked: yup.BooleanSchema<boolean | undefined, import("yup/lib/types").AnyObject, true>;
     links: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        website: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+        website: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
         instagram: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
         twitter: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
     }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        website: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+        website: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
         instagram: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
         twitter: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
     }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        website: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+        website: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
         instagram: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
         twitter: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
     }>>>;
@@ -35,15 +35,15 @@ export declare const MerchantValidationSchema: yup.ObjectSchema<import("yup/lib/
     brandName: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
     termAndConditionChecked: yup.BooleanSchema<boolean | undefined, import("yup/lib/types").AnyObject, true>;
     links: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        website: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+        website: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
         instagram: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
         twitter: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
     }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        website: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+        website: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
         instagram: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
         twitter: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
     }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        website: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+        website: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
         instagram: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
         twitter: yup.StringSchema<string | null | undefined, import("yup/lib/types").AnyObject, string | null | undefined>;
     }>>>;

package/build/features/connect/screens/Merchant/validation.js

@@ -1,23 +1,54 @@
 import * as yup from 'yup';
 export var MerchantValidationSchema = yup.object().shape({
-    brandName: yup.string().min(3, 'Please enter valid brand name').required('Brand Name is required'),
-    termAndConditionChecked: yup.boolean().required().isTrue('Please accept the terms and conditions'),
+    brandName: yup.string().min(3, 'enter_brand_name_english_chars_numbers_space').required('enter_valid_brand_name'),
+    termAndConditionChecked: yup.boolean().required().isTrue('check_terms_cond'),
     links: yup.object().shape({
-        website: yup
-            .string()
-            .matches(/(?:[a-z0-9](?:[a-z0-9-]{0,61}[a-z0-9])?\.)+[a-z0-9][a-z0-9-]{0,61}[a-z0-9]/, 'Please enter valid url')
-            .required('Website is required'),
+        website: yup.string().when(['instagram', 'twitter'], function (instagram, twitter) {
+            if (!instagram && !twitter) {
+                return yup
+                    .string()
+                    .matches(/(?:[a-z0-9](?:[a-z0-9-]{0,61}[a-z0-9])?\.)+[a-z0-9][a-z0-9-]{0,61}[a-z0-9]/, 'ide_not_valid_url')
+                    .transform(function (value) { return (!!value ? value : null); })
+                    .nullable()
+                    .required('enter_at_least_one');
+            }
+            else {
+                return yup
+                    .string()
+                    .matches(/(?:[a-z0-9](?:[a-z0-9-]{0,61}[a-z0-9])?\.)+[a-z0-9][a-z0-9-]{0,61}[a-z0-9]/, 'ide_not_valid_url')
+                    .transform(function (value) { return (!!value ? value : null); })
+                    .nullable()
+                    .optional();
+            }
+        }),
         instagram: yup
             .string()
-            .notRequired()
             .nullable()
             .transform(function (value) { return (!!value ? value : null); })
-            .min(2, 'Invalid instagram username'),
+            .when(['twitter', 'website'], function (twitter, website) {
+            if (!website && !twitter) {
+                return yup.string().min(2, 'enter_at_least_one').required('enter_at_least_one');
+            }
+            else {
+                return yup.string().optional();
+            }
+        }),
         twitter: yup
             .string()
-            .notRequired()
             .nullable()
             .transform(function (value) { return (!!value ? value : null); })
-            .min(2, 'Invalid instagram username')
-    })
+            .min(2, 'enter_at_least_one')
+            .when(['website', 'instagram'], function (website, instagram) {
+            if (!website && !instagram) {
+                return yup.string().min(2, 'enter_at_least_one').required('enter_at_least_one');
+            }
+            else {
+                return yup.string().optional();
+            }
+        })
+    }, [
+        ['instagram', 'website'],
+        ['twitter', 'website'],
+        ['instagram', 'twitter']
+    ])
 });

package/build/features/connect/screens/OTP/OTP.js

@@ -34,12 +34,12 @@ var OTPTitleContainerStyled = styled(Box)(function (_a) {
         borderColor: theme.palette.divider,
         direction: theme.direction,
         borderRadius: theme.spacing(0, 0, 1.25, 1.25),
-        marginBottom: theme.spacing(4)
+        marginBottom: theme.spacing(5.75)
     });
 });
 var OTPTitleStyled = styled(Text)(function (_a) {
     var theme = _a.theme;
-    return (__assign(__assign({}, theme.typography.subtitle1), { color: theme.palette.text.primary, fontWeight: theme.typography.fontWeightLight, marginBlock: theme.spacing(1.75), marginInlineStart: theme.spacing(2.5) }));
+    return (__assign(__assign({}, theme.typography.body1), { color: theme.palette.text.primary, fontWeight: theme.typography.fontWeightLight, marginBlock: theme.spacing(1.75), marginInlineStart: theme.spacing(2.5), lineHeight: 1.75 }));
 });
 var FormStyled = styled(Form)(function () { return ({
     display: 'flex',
@@ -63,7 +63,8 @@ var OTP = function (_a) {
             return dispatch(handleNextScreenStep('CONNECT_PASSWORD_STEP'));
         dispatch(handleNextScreenStep('CONNECT_INDIVIDUAL_STEP'));
     };
-    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(OTPTitleContainerStyled, { children: _jsxs(OTPTitleStyled, { children: [t('ide_opt_sent_title'), " ", _jsx("span", __assign({ dir: 'ltr' }, { children: maskPhone(phone) }))] }) }), _jsx(OTPInput, {}), _jsx(Button, __assign({ disabled: !methods.formState.isValid, type: 'submit', isAr: isAr, loading: false }, { children: t('next') }))] })) })) }));
+    var loading = false;
+    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(OTPTitleContainerStyled, { children: _jsxs(OTPTitleStyled, { children: [loading ? t('ide_otp_waiting_title') : t('ide_opt_sent_title'), ' ', _jsx("span", __assign({ dir: 'ltr' }, { children: maskPhone(phone) }))] }) }), _jsx(OTPInput, {}), _jsx(Button, __assign({ disabled: !methods.formState.isValid, type: 'submit', isAr: isAr, loading: loading }, { children: t('next') }))] })) })) }));
 };
 OTP.defaultProps = {
     phone: '+996564656085'

package/build/features/connect/screens/OTP/OTPInput.js

@@ -33,6 +33,6 @@ var OTPInput = function (_a) {
         otpControl.field.onChange(otp);
     };
     var otpValue = otpControl.field.value;
-    return (_jsx(BoxStyled, __assign({ dir: 'ltr' }, { children: _jsx(OTPField, { timeEndLabel: t('resend_otp'), timerInSeconds: DEFAULT_TIMER_VALUE, onResetClick: function () { }, value: otpValue, onChange: function (number) { return handleOnOTPChange(number.toString()); } }) })));
+    return (_jsx(BoxStyled, __assign({ dir: 'ltr' }, { children: _jsx(OTPField, { timeEndLabel: t('ide_otp_resend_label'), timerInSeconds: DEFAULT_TIMER_VALUE, onResetClick: function () { }, value: otpValue, onChange: function (number) { return handleOnOTPChange(number.toString()); } }) })));
 };
 export default React.memo(OTPInput);

package/build/features/connect/screens/OTP/validation.js

@@ -1,4 +1,4 @@
 import * as yup from 'yup';
 export var OTPValidation = yup.object().shape({
-    otp: yup.string().min(6).required('OTP is required')
+    otp: yup.string().min(6).required('')
 });

package/build/features/connect/screens/Password/PasswordInput.js

@@ -33,6 +33,7 @@ var PasswordInput = function (_a) {
         setShowPassword(false);
     };
     var passwordValue = passwordControl.field.value;
-    return (_jsx(ScreenContainer, __assign({ sx: { mt: 2.5, mb: 5 } }, { children: _jsx(Input, { label: t('password_label'), inputProps: { autoComplete: 'off' }, onChange: handlePasswordChange, value: passwordValue, endAdornment: _jsx(PasswordIcon, { show: showPassword, onShow: handleShowPassword, onHide: handleHidePassword }), placeholder: t('password_placeholder'), type: showPassword ? 'text' : 'password', warningType: 'alert', warningMessage: (_b = passwordControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message }) })));
+    var error = (_b = passwordControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
+    return (_jsx(ScreenContainer, __assign({ sx: { mt: 2.5, mb: 5 } }, { children: _jsx(Input, { label: t('tap_js_password_description'), inputProps: { autoComplete: 'off' }, onChange: handlePasswordChange, value: passwordValue, endAdornment: _jsx(PasswordIcon, { show: showPassword, onShow: handleShowPassword, onHide: handleHidePassword }), placeholder: t('tap_js_password_placeholder'), type: showPassword ? 'text' : 'password', warningType: 'alert', warningMessage: error && t(error, { length: 5 }) }) })));
 };
 export default React.memo(PasswordInput);

package/build/features/connect/screens/Password/validation.js

@@ -1,4 +1,4 @@
 import * as yup from 'yup';
 export var PasswordValidationSchema = yup.object().shape({
-    password: yup.string().min(5).required('Password is required')
+    password: yup.string().min(5, 'enter_valid_password').required('password_required')
 });

package/build/features/connect/screens/ThankYou/ThankYou.js

@@ -8,8 +8,7 @@ var ThankYou = function (_a) {
         console.log('success');
         alert('Account created successfully, please check your email');
         alert("It's a fake message, plz wait us to integrate with the backend. <A.Sharkawy>");
-        window.location.href = '/new/business';
     };
-    return _jsx(SuccessScreen, { title: t('thankyou_message'), onSuccess: onSuccess });
+    return _jsx(SuccessScreen, { title: t('ide_successfully_verified_message'), onSuccess: onSuccess });
 };
 export default React.memo(ThankYou);

package/build/features/featuresScreens.d.ts

@@ -1,7 +1,7 @@
 import { FeatureScreenStep } from '../@types';
 export declare const connectFeatureScreens: Array<FeatureScreenStep>;
 export declare const businessFeatureScreens: Array<FeatureScreenStep>;
-export declare const ownerFeatureScreens: Array<FeatureScreenStep>;
 export declare const passwordFeatureScreens: Array<FeatureScreenStep>;
+export declare const ownerFeatureScreens: Array<FeatureScreenStep>;
 export declare const bankFeatureScreens: Array<FeatureScreenStep>;
 export declare const taxFeatureScreens: Array<FeatureScreenStep>;

package/build/features/featuresScreens.js

@@ -13,9 +13,14 @@ import ActivitiesPage from './business/screens/Activities';
 import SuccessPage from './business/screens/Success';
 import ConfirmPage from './business/screens/Confirm';
 import CreatePasswordPage from './password/screens/CreatePassword';
+import SuccessPasswordPage from './password/screens/Success';
 import ShowOwnerInfoPage from './owner/screens/ShowOwnerInfo';
+import AdditionalOwnerInfoPage from './owner/screens/AdditionalOwnerInfo';
+import SuccessOwnerPage from './owner/screens/Success';
 import BankDetailsPage from './bank/screens/BankDetails';
+import BankSuccessPage from './bank/screens/Success';
 import TaxDetailsPage from './tax/screens/TaxDetails';
+import TaxSuccessPage from './tax/screens/Success';
 export var connectFeatureScreens = [
     {
         name: 'CONNECT_MID_STEP',
@@ -73,27 +78,47 @@ export var businessFeatureScreens = [
     },
     { name: 'BUSINESS_SUCCESS_STEP', element: SuccessPage }
 ];
+export var passwordFeatureScreens = [
+    {
+        name: 'PASSWORD_CREATE_PASSWORD_STEP',
+        element: CreatePasswordPage
+    },
+    {
+        name: 'PASSWORD_SUCCESS_STEP',
+        element: SuccessPasswordPage
+    }
+];
 export var ownerFeatureScreens = [
     {
         name: 'OWNER_SHOW_OWNER_INFO_STEP',
         element: ShowOwnerInfoPage
-    }
-];
-export var passwordFeatureScreens = [
+    },
     {
-        name: 'PASSWORD_CREATE_PASSWORD_STEP',
-        element: CreatePasswordPage
+        name: 'OWNER_ADDITIONAL_OWNER_INFO_STEP',
+        element: AdditionalOwnerInfoPage
+    },
+    {
+        name: 'OWNER_SUCCESS_STEP',
+        element: SuccessOwnerPage
     }
 ];
 export var bankFeatureScreens = [
     {
-        name: 'BANK_DETAILS_STEP',
+        name: 'BANK_BANK_DETAILS_STEP',
         element: BankDetailsPage
+    },
+    {
+        name: 'BANK_DETAILS_SUCCESS_STEP',
+        element: BankSuccessPage
     }
 ];
 export var taxFeatureScreens = [
     {
-        name: 'TAX_DETAILS_STEP',
+        name: 'TAX_TAX_DETAILS_STEP',
         element: TaxDetailsPage
+    },
+    {
+        name: 'TAX_DETAILS_SUCCESS_STEP',
+        element: TaxSuccessPage
     }
 ];

package/build/features/owner/Owner.js

@@ -36,7 +36,7 @@ var Owner = memo(function (props) {
     return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(AnimationFlow, __assign({ open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: ownerFeatureScreens.map(function (_a, index) {
                     var Element = _a.element, name = _a.name;
                     var isActive = activeScreen.name === name;
-                    return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 600, exit: 400, appear: 600 } }, { children: _jsx(Element, {}) }), index));
+                    return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
                 }) }) })) })));
 });
 export function OwnerLib(props) {

package/build/features/owner/screens/AdditionalOwnerInfo/AdditionalOwnerInfo.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+export interface AdditionalOwnerInfoProps {
+}
+declare const _default: React.MemoExoticComponent<{
+    ({}: AdditionalOwnerInfoProps): JSX.Element;
+    defaultProps: {};
+}>;
+export default _default;

package/build/features/owner/screens/AdditionalOwnerInfo/AdditionalOwnerInfo.js

@@ -0,0 +1,77 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { yupResolver } from '@hookform/resolvers/yup';
+import { useForm, FormProvider } from 'react-hook-form';
+import Box from '@mui/material/Box';
+import { useTranslation } from 'react-i18next';
+import { useAppDispatch } from '../../../../hooks';
+import { handleNextScreenStep } from '../../../../app/settings';
+import { styled } from '@mui/material/styles';
+import Form from '../../../../components/Form';
+import Collapse from '../../../../components/Collapse';
+import Button from '../../../shared/Button';
+import ScreenContainer from '../../../shared/Containers/ScreenContainer';
+import { useLanguage } from '../../../../hooks';
+import PEPSwitch from './PEPSwitch';
+import { OwnerInfoValidationSchema } from './validation';
+import InfluencerSwitch from './InfluencerSwitch';
+import MonthlyIncome from './MonthlyIncome';
+import EmployerName from './EmployerName';
+import EmployerLocation from './EmployerLocation';
+import SourceOfIncome from './SourceOfIncome';
+import { countriesCode, SOURCE_OF_INCOME } from '../../../../constants';
+var InputsContainerStyled = styled(Box)(function (_a) {
+    var _b;
+    var theme = _a.theme, listActive = _a.listActive;
+    return (_b = {
+            paddingBottom: theme.spacing(listActive ? 0 : 5),
+            overflow: 'hidden',
+            maxHeight: 'calc(100vh - 250px)'
+        },
+        _b[theme.transitions.create(['padding-bottom'])] = {
+            duration: theme.transitions.duration.standard
+        },
+        _b);
+});
+var AdditionalOwnerInfo = function (_a) {
+    var methods = useForm({
+        resolver: yupResolver(OwnerInfoValidationSchema),
+        defaultValues: {
+            monthlyIncome: '',
+            employerName: '',
+            isPEP: null,
+            isInfluencer: null
+        },
+        mode: 'onChange'
+    });
+    var t = useTranslation().t;
+    var isAr = useLanguage().isAr;
+    var dispatch = useAppDispatch();
+    var _b = React.useState(false), listActive = _b[0], setListActive = _b[1];
+    var _c = React.useState(false), employerFieldsActive = _c[0], setEmployerFieldsActive = _c[1];
+    var onSubmit = function (data) {
+        console.log('data', data);
+        dispatch(handleNextScreenStep());
+    };
+    var handleSelectSource = function (country) {
+        var _a;
+        if (((_a = country.nameEn) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === 'salary')
+            setEmployerFieldsActive(true);
+        else
+            setEmployerFieldsActive(false);
+    };
+    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsxs(InputsContainerStyled, __assign({ listActive: listActive }, { children: [_jsx(SourceOfIncome, { show: !listActive, list: SOURCE_OF_INCOME, onSelectSource: handleSelectSource }), _jsx(MonthlyIncome, { show: !listActive }), _jsx(EmployerName, { show: !listActive && employerFieldsActive }), _jsx(EmployerLocation, { show: employerFieldsActive, countries: countriesCode, onListOpen: function () { return setListActive(true); }, onListClose: function () { return setListActive(false); } }), _jsx(PEPSwitch, { show: !listActive }), _jsx(InfluencerSwitch, { show: !listActive })] })), _jsx(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: _jsx(Button, __assign({ isAr: isAr, disabled: !methods.formState.isValid, loading: false }, { children: t('next') })) }))] })) })) }));
+};
+export default React.memo(AdditionalOwnerInfo);
+AdditionalOwnerInfo.defaultProps = {};

package/build/features/owner/screens/AdditionalOwnerInfo/EmployerLocation.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import { CountryCode } from '../../../../@types';
+interface EmployerLocationProps {
+    countries: Array<CountryCode>;
+    show: boolean;
+    onListOpen?: () => void;
+    onListClose?: () => void;
+}
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<EmployerLocationProps & React.RefAttributes<unknown>>>;
+export default _default;