@tap-payments/auth-jsconnect 1.1.6-test → 1.1.7-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.
Files changed (103) hide show
  1. package/README.md +2 -2
  2. package/build/@types/app.d.ts +2 -1
  3. package/build/@types/form.d.ts +3 -0
  4. package/build/@types/redux.d.ts +0 -1
  5. package/build/api/account.d.ts +1 -2
  6. package/build/api/account.js +7 -3
  7. package/build/api/axios.d.ts +1 -0
  8. package/build/api/axios.js +3 -0
  9. package/build/api/board.d.ts +25 -0
  10. package/build/api/board.js +49 -0
  11. package/build/api/brand.d.ts +7 -0
  12. package/build/api/brand.js +40 -0
  13. package/build/api/entity.js +2 -2
  14. package/build/api/index.d.ts +21 -7
  15. package/build/api/index.js +9 -3
  16. package/build/api/individual.d.ts +25 -2
  17. package/build/api/individual.js +1 -5
  18. package/build/api/lead.d.ts +1 -5
  19. package/build/api/lead.js +10 -5
  20. package/build/api/user.d.ts +8 -0
  21. package/build/api/user.js +12 -0
  22. package/build/app/rootReducer.d.ts +1 -0
  23. package/build/app/rootReducer.js +3 -1
  24. package/build/app/store.d.ts +2 -0
  25. package/build/assets/locales/ar.json +2 -1
  26. package/build/assets/locales/en.json +2 -1
  27. package/build/components/AnimationFlow/Loader.js +17 -9
  28. package/build/components/FileInput/DragAndDrop.js +1 -1
  29. package/build/constants/api.d.ts +4 -1
  30. package/build/constants/api.js +14 -8
  31. package/build/constants/app.d.ts +10 -1
  32. package/build/constants/app.js +35 -1
  33. package/build/constants/validation.d.ts +1 -0
  34. package/build/constants/validation.js +2 -1
  35. package/build/features/app/bank/bankStore.d.ts +3 -2
  36. package/build/features/app/bank/bankStore.js +45 -36
  37. package/build/features/app/business/businessStore.d.ts +6 -3
  38. package/build/features/app/business/businessStore.js +203 -125
  39. package/build/features/app/connect/connectStore.d.ts +2 -1
  40. package/build/features/app/connect/connectStore.js +84 -62
  41. package/build/features/app/individual/individualStore.d.ts +3 -10
  42. package/build/features/app/individual/individualStore.js +69 -93
  43. package/build/features/app/password/passwordStore.d.ts +7 -5
  44. package/build/features/app/password/passwordStore.js +70 -54
  45. package/build/features/app/signIn/signInStore.d.ts +33 -0
  46. package/build/features/app/signIn/signInStore.js +390 -0
  47. package/build/features/app/tax/taxStore.d.ts +2 -1
  48. package/build/features/app/tax/taxStore.js +44 -39
  49. package/build/features/bank/screens/Success/Success.js +2 -2
  50. package/build/features/business/screens/Activities/ActivitiesList.d.ts +1 -1
  51. package/build/features/business/screens/Customers/CustomerLocations.d.ts +2 -2
  52. package/build/features/connect/screens/Merchant/BrandName.js +2 -6
  53. package/build/features/connect/screens/Merchant/validation.js +1 -1
  54. package/build/features/featuresScreens.d.ts +1 -0
  55. package/build/features/featuresScreens.js +22 -0
  56. package/build/features/individual/screens/Success/Success.js +2 -2
  57. package/build/features/password/Password.js +2 -2
  58. package/build/features/password/screens/Success/Success.js +2 -2
  59. package/build/features/shared/UploadFile/UploadFile.js +8 -7
  60. package/build/features/signIn/SignIn.d.ts +7 -0
  61. package/build/features/signIn/SignIn.js +49 -0
  62. package/build/features/signIn/index.d.ts +1 -0
  63. package/build/features/signIn/index.js +1 -0
  64. package/build/features/signIn/screens/Email/Email.d.ts +5 -0
  65. package/build/features/signIn/screens/Email/Email.js +95 -0
  66. package/build/features/signIn/screens/Email/EmailField.d.ts +5 -0
  67. package/build/features/signIn/screens/Email/EmailField.js +55 -0
  68. package/build/features/signIn/screens/Email/index.d.ts +3 -0
  69. package/build/features/signIn/screens/Email/index.js +2 -0
  70. package/build/features/signIn/screens/Email/validation.d.ts +8 -0
  71. package/build/features/signIn/screens/Email/validation.js +5 -0
  72. package/build/features/signIn/screens/Mobile/Mobile.d.ts +5 -0
  73. package/build/features/signIn/screens/Mobile/Mobile.js +106 -0
  74. package/build/features/signIn/screens/Mobile/MobileNumber.d.ts +11 -0
  75. package/build/features/signIn/screens/Mobile/MobileNumber.js +151 -0
  76. package/build/features/signIn/screens/Mobile/index.d.ts +3 -0
  77. package/build/features/signIn/screens/Mobile/index.js +2 -0
  78. package/build/features/signIn/screens/Mobile/validation.d.ts +8 -0
  79. package/build/features/signIn/screens/Mobile/validation.js +28 -0
  80. package/build/features/signIn/screens/OTP/OTP.d.ts +5 -0
  81. package/build/features/signIn/screens/OTP/OTP.js +80 -0
  82. package/build/features/signIn/screens/OTP/OTPInput.d.ts +5 -0
  83. package/build/features/signIn/screens/OTP/OTPInput.js +53 -0
  84. package/build/features/signIn/screens/OTP/index.d.ts +3 -0
  85. package/build/features/signIn/screens/OTP/index.js +2 -0
  86. package/build/features/signIn/screens/OTP/validation.d.ts +8 -0
  87. package/build/features/signIn/screens/OTP/validation.js +4 -0
  88. package/build/features/signIn/screens/Password/Password.d.ts +5 -0
  89. package/build/features/signIn/screens/Password/Password.js +54 -0
  90. package/build/features/signIn/screens/Password/PasswordInput.d.ts +5 -0
  91. package/build/features/signIn/screens/Password/PasswordInput.js +28 -0
  92. package/build/features/signIn/screens/Password/index.d.ts +3 -0
  93. package/build/features/signIn/screens/Password/index.js +2 -0
  94. package/build/features/signIn/screens/Password/validation.d.ts +8 -0
  95. package/build/features/signIn/screens/Password/validation.js +4 -0
  96. package/build/features/tax/screens/SuccessWithFlowButtons/SuccessWithFlowButtons.js +1 -1
  97. package/build/hooks/useAppDispatch.d.ts +1 -0
  98. package/build/index.css +1 -0
  99. package/build/index.d.ts +3 -2
  100. package/build/index.js +5 -2
  101. package/build/utils/string.d.ts +3 -1
  102. package/build/utils/string.js +11 -2
  103. package/package.json +1 -1
@@ -0,0 +1,151 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ var __rest = (this && this.__rest) || function (s, e) {
13
+ var t = {};
14
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
+ t[p] = s[p];
16
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
+ t[p[i]] = s[p[i]];
20
+ }
21
+ return t;
22
+ };
23
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
24
+ import * as React from 'react';
25
+ import Box from '@mui/material/Box';
26
+ import { useTranslation } from 'react-i18next';
27
+ import { useController, useFormContext } from 'react-hook-form';
28
+ import { styled, alpha } from '@mui/material/styles';
29
+ import Text from '../../../../components/Text';
30
+ import Collapse from '../../../../components/Collapse';
31
+ import ClearIcon from '../../../shared/ClearIcon';
32
+ import CheckIcon from '../../../shared/CheckIcon';
33
+ import ScreenContainer from '../../../shared/Containers/ScreenContainer';
34
+ import { signInSelector } from '../../../app/signIn/signInStore';
35
+ import ExpandIcon from '../../../../components/ExpandIcon';
36
+ import Input from '../../../shared/Input';
37
+ import SimpleList from '../../../../components/SimpleList';
38
+ import { removeAllCharsFromNumber } from '../../../../utils';
39
+ import { useLanguage, useAppSelector } from '../../../../hooks';
40
+ import Search from '../../../shared/Search';
41
+ var LabelContainerStyled = styled(Box)(function (_a) {
42
+ var theme = _a.theme;
43
+ return ({
44
+ display: 'flex',
45
+ justifyContent: 'space-between',
46
+ padding: theme.spacing(0, 2.5, 1.25, 2.5)
47
+ });
48
+ });
49
+ var CountryItemContainer = styled(Box)(function () { return ({
50
+ display: 'flex'
51
+ }); });
52
+ var CountryCodeText = styled(Text, {
53
+ shouldForwardProp: function (prop) { return prop !== 'isSelected'; }
54
+ })(function (_a) {
55
+ var theme = _a.theme, isSelected = _a.isSelected;
56
+ return (__assign(__assign({ color: theme.palette.text.primary }, theme.typography.body2), { width: theme.spacing(10), textAlign: 'start', fontWeight: isSelected ? theme.typography.fontWeightMedium : theme.typography.fontWeightLight }));
57
+ });
58
+ var CountryNameText = styled(Text, { shouldForwardProp: function (prop) { return prop !== 'isSelected'; } })(function (_a) {
59
+ var theme = _a.theme, isSelected = _a.isSelected;
60
+ return (__assign(__assign({ color: theme.palette.text.primary }, theme.typography.body2), { fontWeight: isSelected ? theme.typography.fontWeightMedium : theme.typography.fontWeightLight, paddingInlineStart: theme.spacing(1.25) }));
61
+ });
62
+ var CountryCodeStyled = styled(Text)(function (_a) {
63
+ var theme = _a.theme;
64
+ return (__assign(__assign({ cursor: 'pointer' }, theme.typography.body2), { fontWeight: theme.typography.fontWeightRegular, display: 'flex', alignItems: 'center', minWidth: theme.spacing(8.75) }));
65
+ });
66
+ var InputLabelStyled = styled(Text)(function (_a) {
67
+ var theme = _a.theme;
68
+ return (__assign(__assign({ color: alpha(theme.palette.text.primary, 0.6), fontWeight: theme.typography.fontWeightMedium }, theme.typography.caption), { lineHeight: theme.spacing(2.5) }));
69
+ });
70
+ var ExpandIconStyled = styled(ExpandIcon)(function (_a) {
71
+ var theme = _a.theme;
72
+ return ({
73
+ marginInlineStart: theme.spacing(1)
74
+ });
75
+ });
76
+ var InputStyled = styled(Input)(function () { return ({
77
+ direction: 'ltr',
78
+ '& .MuiInputBase-input': {
79
+ cursor: 'auto'
80
+ }
81
+ }); });
82
+ var MobileNumber = React.forwardRef(function (_a, ref) {
83
+ var _b, _c, _d;
84
+ var countries = _a.countries, rest = __rest(_a, ["countries"]);
85
+ var _e = React.useState(countries || []), countriesCode = _e[0], setCountries = _e[1];
86
+ var _f = React.useState(null), anchorEl = _f[0], setAnchorEl = _f[1];
87
+ var t = useTranslation().t;
88
+ var isAr = useLanguage().isAr;
89
+ var _g = useFormContext(), control = _g.control, setValue = _g.setValue;
90
+ var loading = useAppSelector(signInSelector).loading;
91
+ var phoneControl = useController({ name: 'mobile', control: control });
92
+ var countryCodeControl = useController({ name: 'countryCode', control: control });
93
+ var countryCodeValue = countryCodeControl.field.value;
94
+ var mobileValue = phoneControl.field.value || '';
95
+ var countryName = (isAr ? (_b = countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.name) === null || _b === void 0 ? void 0 : _b.arabic : (_c = countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.name) === null || _c === void 0 ? void 0 : _c.english) || '';
96
+ var error = !!mobileValue ? (_d = phoneControl.fieldState.error) === null || _d === void 0 ? void 0 : _d.message : '';
97
+ var isSA = countryCodeValue.iso2 === 'SA';
98
+ var mobileLen = countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.digits;
99
+ var isStartsWith5 = mobileValue.startsWith('5');
100
+ var requiredLen = isSA && isStartsWith5 ? mobileLen - 1 : mobileLen;
101
+ React.useEffect(function () {
102
+ if (mobileValue)
103
+ setValue('mobile', mobileValue, { shouldValidate: true });
104
+ }, []);
105
+ var onPhoneNumberChange = function (_a) {
106
+ var target = _a.target;
107
+ var value = removeAllCharsFromNumber(target.value);
108
+ phoneControl.field.onChange(value);
109
+ };
110
+ var clearMobileNumber = function () {
111
+ phoneControl.field.onChange('');
112
+ };
113
+ var onCloseCountryList = function () {
114
+ var _a;
115
+ if (anchorEl) {
116
+ setAnchorEl(null);
117
+ (_a = rest.onListClose) === null || _a === void 0 ? void 0 : _a.call(rest);
118
+ }
119
+ setCountries(countries);
120
+ };
121
+ var toggleCountryList = function () {
122
+ var _a, _b;
123
+ if (anchorEl) {
124
+ setAnchorEl(null);
125
+ (_a = rest.onListClose) === null || _a === void 0 ? void 0 : _a.call(rest);
126
+ setCountries(countries);
127
+ }
128
+ else {
129
+ (_b = rest.onListOpen) === null || _b === void 0 ? void 0 : _b.call(rest);
130
+ setAnchorEl(true);
131
+ }
132
+ };
133
+ var onSelectItem = function (country) {
134
+ onCloseCountryList();
135
+ setValue('mobile', '');
136
+ countryCodeControl.field.onChange(country);
137
+ };
138
+ var handleSearch = function (value) {
139
+ var filteredCountries = countries.filter(function (country) {
140
+ return country.idd_prefix.toString().toLowerCase().startsWith(value.replace('+', '').toLowerCase()) ||
141
+ country.capital.toLowerCase().startsWith(value.toLowerCase()) ||
142
+ country.name.arabic.toLowerCase().startsWith(value.toLowerCase()) ||
143
+ country.name.english.toLowerCase().startsWith(value.toLowerCase());
144
+ });
145
+ setCountries(filteredCountries);
146
+ };
147
+ return (_jsxs(ScreenContainer, __assign({ ref: ref, sx: { minHeight: mobileValue ? '133px' : '0px' } }, { children: [_jsx(LabelContainerStyled, { children: _jsx(InputLabelStyled, { children: t('signup_enter_mobile') }) }), _jsx(InputStyled, { inputProps: { maxLength: requiredLen }, type: 'tel', readOnly: !!anchorEl, required: true, onClick: onCloseCountryList, onChange: onPhoneNumberChange, onEnterPressed: function (e) { return loading && e.preventDefault(); }, value: !!anchorEl ? countryName : mobileValue, startAdornment: _jsxs(CountryCodeStyled, __assign({ onClick: 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 })) : !error && mobileValue ? (_jsx(CheckIcon, {})) : (mobileValue && _jsx(ClearIcon, { onClick: clearMobileNumber })), placeholder: "".concat(isSA ? '5' : '0', "00000000"), warningType: 'alert', warningMessage: !anchorEl ? error && t(error, { length: requiredLen, number: '05|5' }) : undefined }), _jsxs(Collapse, __assign({ in: !!anchorEl }, { children: [_jsx(Search, { onSearchValue: handleSearch }), _jsx(SimpleList, { searchKeyPath: 'name.english', list: countriesCode, onSelectItem: onSelectItem, renderItem: function (item) {
148
+ 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, {})] }));
149
+ } })] }))] })));
150
+ });
151
+ export default React.memo(MobileNumber);
@@ -0,0 +1,3 @@
1
+ import Mobile, { MobileProps } from './Mobile';
2
+ export type { MobileProps };
3
+ export default Mobile;
@@ -0,0 +1,2 @@
1
+ import Mobile from './Mobile';
2
+ export default Mobile;
@@ -0,0 +1,8 @@
1
+ import * as yup from 'yup';
2
+ export declare const PhoneValidationSchema: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
3
+ mobile: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
4
+ }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
5
+ mobile: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
6
+ }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
7
+ mobile: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
8
+ }>>>;
@@ -0,0 +1,28 @@
1
+ import * as yup from 'yup';
2
+ export var PhoneValidationSchema = yup.object().shape({
3
+ mobile: yup
4
+ .string()
5
+ .test({
6
+ test: function (value) {
7
+ var countryCode = this.parent.countryCode;
8
+ var isSA = countryCode.iso2 === 'SA';
9
+ var digits = countryCode.digits;
10
+ var mobileValue = value || '';
11
+ var valueLen = mobileValue.length;
12
+ var isNumber = mobileValue.match(/^[0-9]/g);
13
+ if (!isNumber)
14
+ return this.createError({ message: 'enter_valid_mobile_number' });
15
+ var isStartWithZero = mobileValue.startsWith('05');
16
+ var isStartWith5 = mobileValue.startsWith('5');
17
+ var isSaudiNumber = isStartWith5 || isStartWithZero;
18
+ if (isSA) {
19
+ if (!isSaudiNumber)
20
+ return this.createError({ message: 'start_with_number' });
21
+ var requiredLen = isStartWith5 ? digits - 1 : digits;
22
+ return valueLen === requiredLen ? true : this.createError({ message: 'enter_valid_mobile_number' });
23
+ }
24
+ return valueLen === digits ? true : this.createError({ message: 'enter_valid_mobile_number' });
25
+ }
26
+ })
27
+ .required('mobile_number_error')
28
+ });
@@ -0,0 +1,5 @@
1
+ import * as React from 'react';
2
+ export interface OTPProps {
3
+ }
4
+ declare const _default: React.MemoExoticComponent<() => JSX.Element>;
5
+ export default _default;
@@ -0,0 +1,80 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
+ import Box from '@mui/material/Box/Box';
14
+ import { styled } from '@mui/material/styles';
15
+ import * as React from 'react';
16
+ import { useTranslation } from 'react-i18next';
17
+ import Text from '../../../../components/Text';
18
+ import { clearError, signInSelector, resetOTPScreen, verifyAuthOTP } from '../../../app/signIn/signInStore';
19
+ import Button from '../../../shared/Button';
20
+ import { ScreenContainer } from '../../../shared/Containers';
21
+ import { useAppDispatch, useAppSelector } from '../../../../hooks';
22
+ import { handlePrevScreenStep } from '../../../../app/settings';
23
+ import { useLanguage } from '../../../../hooks';
24
+ import { useForm, FormProvider } from 'react-hook-form';
25
+ import { yupResolver } from '@hookform/resolvers/yup';
26
+ import Form from '../../../../components/Form';
27
+ import { maskPhone, maskEmail } from '../../../../utils';
28
+ import { OTPValidation } from './validation';
29
+ import OTPInput from './OTPInput';
30
+ var OTPTitleContainerStyled = styled(Box)(function (_a) {
31
+ var theme = _a.theme;
32
+ return ({
33
+ background: theme.palette.common.white,
34
+ border: '1px solid',
35
+ borderColor: theme.palette.divider,
36
+ direction: theme.direction,
37
+ borderRadius: theme.spacing(0, 0, 1.25, 1.25),
38
+ marginBottom: theme.spacing(5.75)
39
+ });
40
+ });
41
+ var OTPTitleStyled = styled(Text)(function (_a) {
42
+ var theme = _a.theme;
43
+ return (__assign(__assign({}, theme.typography.body1), { color: theme.palette.text.primary, fontWeight: theme.typography.fontWeightLight, marginBlock: theme.spacing(1.75), marginInline: theme.spacing(2.5), lineHeight: 1.75, whiteSpace: 'pre-line' }));
44
+ });
45
+ var FormStyled = styled(Form)(function () { return ({
46
+ display: 'flex',
47
+ flexDirection: 'column'
48
+ }); });
49
+ var OTP = function () {
50
+ var _a;
51
+ var dispatch = useAppDispatch();
52
+ var _b = useAppSelector(signInSelector), data = _b.data, loading = _b.loading, error = _b.error;
53
+ var methods = useForm({
54
+ resolver: yupResolver(OTPValidation),
55
+ defaultValues: data.otpData,
56
+ mode: 'onChange'
57
+ });
58
+ var t = useTranslation().t;
59
+ var isAr = useLanguage().isAr;
60
+ var isEmail = !!data.auth.email;
61
+ React.useEffect(function () {
62
+ if (error)
63
+ dispatch(clearError());
64
+ return function () {
65
+ dispatch(resetOTPScreen());
66
+ };
67
+ }, [methods.formState.isValid]);
68
+ var onSubmit = function (formData) {
69
+ dispatch(verifyAuthOTP(formData));
70
+ };
71
+ var onBack = function () {
72
+ dispatch(handlePrevScreenStep(isEmail ? 'SIGIN_EMAIL_STEP' : 'SIGIN_MOBILE_STEP'));
73
+ };
74
+ var disabled = !methods.formState.isValid || !!error;
75
+ var phone = ((_a = data.auth.countryCode) === null || _a === void 0 ? void 0 : _a.idd_prefix) + (data.auth.mobile || '');
76
+ var email = data.auth.email || '';
77
+ var title = t('ide_opt_sent_title');
78
+ 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') : title, !loading && _jsx("span", __assign({ dir: 'ltr' }, { children: isEmail ? maskEmail(email) : maskPhone(phone) }))] }) }), _jsx(OTPInput, {}), _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, disabled: disabled, isAr: isAr, loading: loading, error: t(error || '') }, { children: t('next') }))] })) })) }));
79
+ };
80
+ export default React.memo(OTP);
@@ -0,0 +1,5 @@
1
+ import * as React from 'react';
2
+ export interface OTPProps {
3
+ }
4
+ declare const _default: React.MemoExoticComponent<({}: OTPProps) => JSX.Element>;
5
+ export default _default;
@@ -0,0 +1,53 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ import { jsx as _jsx } from "react/jsx-runtime";
13
+ import * as React from 'react';
14
+ import { useController, useFormContext } from 'react-hook-form';
15
+ import { useTranslation } from 'react-i18next';
16
+ import Box from '@mui/material/Box/Box';
17
+ import { styled } from '@mui/material/styles';
18
+ import OTPField from '../../../shared/OTP';
19
+ import { DEFAULT_TIMER_VALUE } from '../../../../constants';
20
+ import { signInSelector, resendOTPMobile, resendOTPEmail } from '../../../app/signIn/signInStore';
21
+ import { useAppDispatch, useAppSelector } from '../../../../hooks';
22
+ var BoxStyled = styled(Box)(function (_a) {
23
+ var theme = _a.theme;
24
+ return ({
25
+ display: 'flex',
26
+ flexDirection: 'column',
27
+ fontFamily: theme.typography.fontFamily
28
+ });
29
+ });
30
+ var OTPInput = function (_a) {
31
+ var _b = useFormContext(), control = _b.control, setValue = _b.setValue;
32
+ var t = useTranslation().t;
33
+ var dispatch = useAppDispatch();
34
+ var otpControl = useController({ name: 'otp', control: control });
35
+ var data = useAppSelector(signInSelector).data;
36
+ var isEmail = !!data.auth.email;
37
+ var handleOnOTPChange = function (otp) {
38
+ otpControl.field.onChange(otp);
39
+ };
40
+ var handleOnResendOTP = function () {
41
+ if (otpControl.field.value)
42
+ setValue('otp', '', { shouldValidate: true });
43
+ dispatch(resendOTPMobile());
44
+ };
45
+ var handleOnResendEmailOTP = function () {
46
+ if (otpControl.field.value)
47
+ setValue('otp', '', { shouldValidate: true });
48
+ dispatch(resendOTPEmail());
49
+ };
50
+ var otpValue = otpControl.field.value;
51
+ return (_jsx(BoxStyled, __assign({ dir: 'ltr' }, { children: _jsx(OTPField, { timeEndLabel: t('ide_otp_resend_label'), timerInSeconds: DEFAULT_TIMER_VALUE, onResetClick: isEmail ? handleOnResendEmailOTP : handleOnResendOTP, value: otpValue, onChange: function (number) { return handleOnOTPChange(number.toString()); } }) })));
52
+ };
53
+ export default React.memo(OTPInput);
@@ -0,0 +1,3 @@
1
+ import OTP, { OTPProps } from './OTP';
2
+ export type { OTPProps };
3
+ export default OTP;
@@ -0,0 +1,2 @@
1
+ import OTP from './OTP';
2
+ export default OTP;
@@ -0,0 +1,8 @@
1
+ import * as yup from 'yup';
2
+ export declare const OTPValidation: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
3
+ otp: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
4
+ }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
5
+ otp: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
6
+ }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
7
+ otp: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
8
+ }>>>;
@@ -0,0 +1,4 @@
1
+ import * as yup from 'yup';
2
+ export var OTPValidation = yup.object().shape({
3
+ otp: yup.string().min(6, 'otp_min_length').required('otp_required')
4
+ });
@@ -0,0 +1,5 @@
1
+ import * as React from 'react';
2
+ export interface PasswordProps {
3
+ }
4
+ declare const _default: React.MemoExoticComponent<({}: PasswordProps) => JSX.Element>;
5
+ export default _default;
@@ -0,0 +1,54 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
+ import * as React from 'react';
14
+ import { useForm, FormProvider } from 'react-hook-form';
15
+ import { useTranslation } from 'react-i18next';
16
+ import { useSelector } from 'react-redux';
17
+ import { yupResolver } from '@hookform/resolvers/yup';
18
+ import Box from '@mui/material/Box';
19
+ import { styled } from '@mui/material/styles';
20
+ import { useAppDispatch } from '../../../../hooks';
21
+ import { handlePrevScreenStep } from '../../../../app/settings';
22
+ import Form from '../../../../components/Form';
23
+ import { useLanguage } from '../../../../hooks';
24
+ import ScreenContainer from '../../../shared/Containers/ScreenContainer';
25
+ import Button from '../../../shared/Button';
26
+ import { signInSelector, verifyAuthPassword } from '../../../app/signIn/signInStore';
27
+ import PasswordInput from './PasswordInput';
28
+ import { PasswordValidation } from './validation';
29
+ var InputsContainerStyled = styled(Box)(function (_a) {
30
+ var theme = _a.theme;
31
+ return ({
32
+ paddingBottom: theme.spacing(7.5)
33
+ });
34
+ });
35
+ var Password = function (_a) {
36
+ var t = useTranslation().t;
37
+ var isAr = useLanguage().isAr;
38
+ var dispatch = useAppDispatch();
39
+ var _b = useSelector(signInSelector), data = _b.data, loading = _b.loading, error = _b.error;
40
+ var isEmail = !!data.auth.email;
41
+ var methods = useForm({
42
+ resolver: yupResolver(PasswordValidation),
43
+ defaultValues: data.passwordData,
44
+ mode: 'onChange'
45
+ });
46
+ var onSubmit = function (data) {
47
+ dispatch(verifyAuthPassword(data));
48
+ };
49
+ var onBack = function () {
50
+ dispatch(handlePrevScreenStep(isEmail ? 'SIGIN_EMAIL_STEP' : 'SIGIN_MOBILE_STEP'));
51
+ };
52
+ return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(InputsContainerStyled, { children: _jsx(PasswordInput, {}) }), _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, isAr: isAr, disabled: !methods.formState.isValid, loading: loading, error: t(error || '') }, { children: t('next') }))] })) })) }));
53
+ };
54
+ export default React.memo(Password);
@@ -0,0 +1,5 @@
1
+ import * as React from 'react';
2
+ interface PasswordInputProps {
3
+ }
4
+ declare const _default: React.MemoExoticComponent<({}: PasswordInputProps) => JSX.Element>;
5
+ export default _default;
@@ -0,0 +1,28 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import * as React from 'react';
3
+ import { useTranslation } from 'react-i18next';
4
+ import { useController, useFormContext } from 'react-hook-form';
5
+ import ScreenContainer from '../../../shared/Containers/ScreenContainer';
6
+ import PasswordIcon from '../../../shared/PasswordIcon';
7
+ import Input from '../../../shared/Input';
8
+ var PasswordInput = function (_a) {
9
+ var _b;
10
+ var t = useTranslation().t;
11
+ var control = useFormContext().control;
12
+ var passwordControl = useController({ control: control, name: 'password' });
13
+ var _c = React.useState(false), showPassword = _c[0], setShowPassword = _c[1];
14
+ var handleShowPassword = function () {
15
+ setShowPassword(true);
16
+ };
17
+ var handleHidePassword = function () {
18
+ setShowPassword(false);
19
+ };
20
+ var handlePasswordChange = function (_a) {
21
+ var target = _a.target;
22
+ passwordControl.field.onChange(target.value);
23
+ };
24
+ var passwordValue = passwordControl.field.value;
25
+ var error = (_b = passwordControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
26
+ return (_jsx(ScreenContainer, { children: _jsx(Input, { label: t('tap_js_password_description'), onChange: handlePasswordChange, value: passwordValue, endAdornment: _jsx(PasswordIcon, { show: showPassword, onShow: handleShowPassword, onHide: handleHidePassword }), placeholder: t('tap_js_password_placeholder'), warningType: 'alert', type: showPassword ? 'text' : 'password', warningMessage: error && t(error) }) }));
27
+ };
28
+ export default React.memo(PasswordInput);
@@ -0,0 +1,3 @@
1
+ import Password, { PasswordProps } from './Password';
2
+ export type { PasswordProps };
3
+ export default Password;
@@ -0,0 +1,2 @@
1
+ import Password from './Password';
2
+ export default Password;
@@ -0,0 +1,8 @@
1
+ import * as yup from 'yup';
2
+ export declare const PasswordValidation: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
3
+ password: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
4
+ }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
5
+ password: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
6
+ }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
7
+ password: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
8
+ }>>>;
@@ -0,0 +1,4 @@
1
+ import * as yup from 'yup';
2
+ export var PasswordValidation = yup.object().shape({
3
+ password: yup.string().min(6, 'password_required').required('password_required')
4
+ });
@@ -70,7 +70,7 @@ var SuccessWithFlowButtons = function () {
70
70
  .filter(function (item) { return item.name; })
71
71
  .map(function (_a) {
72
72
  var name = _a.name, url = _a.url, status = _a.status;
73
- var type = status === 'initiated' ? 'pending' : 'completed';
73
+ var type = status === 'initiated' || status === 'in_progress' ? 'pending' : 'completed';
74
74
  var title = t("".concat(name, "_flow_").concat(type), {
75
75
  individual_name: username.toLowerCase() + maskedId,
76
76
  business_type: brandName,
@@ -6,4 +6,5 @@ export declare const useAppDispatch: () => import("redux-thunk").ThunkDispatch<{
6
6
  tax: import("../features/app/tax/taxStore").TaxState;
7
7
  individual: import("../features/app/individual/individualStore").IndividualState;
8
8
  password: import("../features/app/password/passwordStore").PasswordState;
9
+ signIn: import("../features/app/signIn/signInStore").SignInState;
9
10
  }, undefined, import("redux").AnyAction> & import("redux").Dispatch<import("redux").AnyAction>;
package/build/index.css CHANGED
@@ -113,6 +113,7 @@ section {
113
113
  }
114
114
  body {
115
115
  line-height: 1;
116
+ overflow-y: hidden;
116
117
  }
117
118
  ol,
118
119
  ul {
package/build/index.d.ts CHANGED
@@ -6,5 +6,6 @@ import { PasswordLib, renderPasswordLib, PasswordLibProps, unmountPasswordLib }
6
6
  import { IndividualLib, renderIndividualLib, IndividualLibProps, unmountIndividualLib } from './features/individual';
7
7
  import { BankLib, renderBankLib, BankLibProps, unmountBankLib } from './features/bank';
8
8
  import { TaxLib, renderTaxLib, TaxLibProps, unmountTaxLib } from './features/tax';
9
- export type { ConnectLibProps, BusinessLibProps, PasswordLibProps, IndividualLibProps, BankLibProps, TaxLibProps };
10
- export { ConnectLib, renderConnectLib, unmountConnectLib, BusinessLib, renderBusinessLib, unmountBusinessLib, PasswordLib, renderPasswordLib, unmountPasswordLib, IndividualLib, renderIndividualLib, unmountIndividualLib, BankLib, renderBankLib, unmountBankLib, TaxLib, renderTaxLib, unmountTaxLib };
9
+ import { SignInLib, renderSignInLib, SignInLibProps, unmountSignInLib } from './features/signIn';
10
+ export type { ConnectLibProps, BusinessLibProps, PasswordLibProps, IndividualLibProps, BankLibProps, TaxLibProps, SignInLibProps };
11
+ export { ConnectLib, renderConnectLib, unmountConnectLib, BusinessLib, renderBusinessLib, unmountBusinessLib, PasswordLib, renderPasswordLib, unmountPasswordLib, IndividualLib, renderIndividualLib, unmountIndividualLib, BankLib, renderBankLib, unmountBankLib, TaxLib, renderTaxLib, unmountTaxLib, SignInLib, renderSignInLib, unmountSignInLib };
package/build/index.js CHANGED
@@ -6,7 +6,8 @@ import { PasswordLib, renderPasswordLib, unmountPasswordLib } from './features/p
6
6
  import { IndividualLib, renderIndividualLib, unmountIndividualLib } from './features/individual';
7
7
  import { BankLib, renderBankLib, unmountBankLib } from './features/bank';
8
8
  import { TaxLib, renderTaxLib, unmountTaxLib } from './features/tax';
9
- export { ConnectLib, renderConnectLib, unmountConnectLib, BusinessLib, renderBusinessLib, unmountBusinessLib, PasswordLib, renderPasswordLib, unmountPasswordLib, IndividualLib, renderIndividualLib, unmountIndividualLib, BankLib, renderBankLib, unmountBankLib, TaxLib, renderTaxLib, unmountTaxLib };
9
+ import { SignInLib, renderSignInLib, unmountSignInLib } from './features/signIn';
10
+ export { ConnectLib, renderConnectLib, unmountConnectLib, BusinessLib, renderBusinessLib, unmountBusinessLib, PasswordLib, renderPasswordLib, unmountPasswordLib, IndividualLib, renderIndividualLib, unmountIndividualLib, BankLib, renderBankLib, unmountBankLib, TaxLib, renderTaxLib, unmountTaxLib, SignInLib, renderSignInLib, unmountSignInLib };
10
11
  window['TapAuth'] = {
11
12
  renderConnectLib: renderConnectLib,
12
13
  unmountConnectLib: unmountConnectLib,
@@ -19,5 +20,7 @@ window['TapAuth'] = {
19
20
  renderBankLib: renderBankLib,
20
21
  unmountBankLib: unmountBankLib,
21
22
  renderTaxLib: renderTaxLib,
22
- unmountTaxLib: unmountTaxLib
23
+ unmountTaxLib: unmountTaxLib,
24
+ renderSignInLib: renderSignInLib,
25
+ unmountSignInLib: unmountSignInLib
23
26
  };
@@ -1,6 +1,7 @@
1
1
  import { DeviceInfo } from '../@types';
2
2
  export declare const maskPhone: (str?: string) => string;
3
3
  export declare const maskID: (str: string) => string;
4
+ export declare const maskEmail: (str: string) => string;
4
5
  export declare const showLastFour: (str: string) => string;
5
6
  export declare const getIndividualName: (name: string) => {
6
7
  first: string;
@@ -11,7 +12,7 @@ export declare const convertNumbers2English: (str: string) => string;
11
12
  export declare const getParameterByName: (name: string) => string | null;
12
13
  export declare const getClientEmailUrl: () => string;
13
14
  export declare const getFlowUrl: (path: string, lang: string) => string;
14
- export declare const getResetFlowUrl: (path: string, lang: string, operationType: string, leadId: string) => string;
15
+ export declare const getResetFlowUrl: (path: string, lang: string, operationType: string, id: string) => string;
15
16
  export declare const capitalizeTheFirstLetterOfEachWord: (words: string) => string;
16
17
  export declare const getRequestHeaders: (deviceInfo: DeviceInfo) => {
17
18
  al: string;
@@ -39,3 +40,4 @@ export declare const getRequestHeaders: (deviceInfo: DeviceInfo) => {
39
40
  export declare const removeRequestHeaders: () => void;
40
41
  export declare const getBaseUrl: () => string;
41
42
  export declare const getScreenNameBasedOnFlow: (flow: string) => "CONNECT_NID_STEP" | "" | "BUSINESS_BUSINESS_TYPE_STEP" | "INDIVIDUAL_ADDITIONAL_INDIVIDUAL_INFO_STEP" | "BANK_BANK_DETAILS_STEP" | "TAX_TAX_DETAILS_STEP";
43
+ export declare const getEighteenYearsAgo: () => string;
@@ -2,6 +2,7 @@ import { FlowsTypes } from '../@types';
2
2
  import { encryptString } from '.';
3
3
  import { removeAxiosGlobalHeaders } from '../api';
4
4
  import { ENDPOINT_PATHS } from '../constants';
5
+ import moment from 'moment';
5
6
  export var maskPhone = function (str) {
6
7
  if (str === void 0) { str = ''; }
7
8
  var lastTwo = str.substring(str.length - 2, str.length);
@@ -11,6 +12,10 @@ export var maskID = function (str) {
11
12
  var lastTwo = str.substring(str.length - 2, str.length);
12
13
  return ' ••••' + lastTwo;
13
14
  };
15
+ export var maskEmail = function (str) {
16
+ var lastTwo = str.substring(str.length - 2, str.length);
17
+ return ' ••••' + lastTwo;
18
+ };
14
19
  export var showLastFour = function (str) {
15
20
  if (str && str.length >= 4) {
16
21
  var lastFour = str.substring(str.length - 4, str.length);
@@ -62,9 +67,9 @@ export var getFlowUrl = function (path, lang) {
62
67
  var origin = window.location.origin;
63
68
  return origin + path + "?lang=".concat(lang, "&token=");
64
69
  };
65
- export var getResetFlowUrl = function (path, lang, operationType, leadId) {
70
+ export var getResetFlowUrl = function (path, lang, operationType, id) {
66
71
  var origin = window.location.origin;
67
- return origin + path + "?lang=".concat(lang, "&operation_type=").concat(operationType, "&lead_id=").concat(leadId, "&token=");
72
+ return origin + path + "?lang=".concat(lang, "&operation_type=").concat(operationType, "&board_id=").concat(id, "&token=");
68
73
  };
69
74
  export var capitalizeTheFirstLetterOfEachWord = function (words) {
70
75
  var separateWord = words.toLowerCase().split(' ');
@@ -158,3 +163,7 @@ export var getScreenNameBasedOnFlow = function (flow) {
158
163
  }
159
164
  return '';
160
165
  };
166
+ export var getEighteenYearsAgo = function () {
167
+ var eighteenYearsAgo = new Date();
168
+ return moment(eighteenYearsAgo.setFullYear(eighteenYearsAgo.getFullYear() - 18)).format('YYYY-MM-DD');
169
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tap-payments/auth-jsconnect",
3
- "version": "1.1.6-test",
3
+ "version": "1.1.7-test",
4
4
  "description": "connect library, auth",
5
5
  "private": false,
6
6
  "main": "build/index.js",