@tap-payments/auth-jsconnect 2.5.22-test → 3.0.0-test

package/build/constants/index.d.ts

@@ -3,3 +3,4 @@ export * from './app';
 export * from './dummy';
 export * from './validation';
 export * from './api';
+export * from './date';

package/build/constants/index.js

@@ -3,3 +3,4 @@ export * from './app';
 export * from './dummy';
 export * from './validation';
 export * from './api';
+export * from './date';

package/build/features/app/brand/brandStore.d.ts

@@ -1,5 +1,5 @@
 import { RootState } from '../../../app/store';
-import { ActionState, AsyncThunkParams, BrandActivitiesFormValues, BrandFormValues, BrandSegmentFormValues, FlowsTypes, OTPFormValues, ResponseData, SharedState } from '../../../@types';
+import { ActionState, AsyncThunkParams, BrandActivitiesFormValues, BrandFormValues, BrandSegmentFormValues, ExpectedSaleRange, FlowsTypes, OTPFormValues, ResponseData, SharedState } from '../../../@types';
 import { CancelToken } from 'axios';
 interface VerifyLeadTokenProps {
     token: string;
@@ -115,9 +115,10 @@ export declare const brandSlice: import("@reduxjs/toolkit").Slice<BrandState, {
     stopLoader: (state: BrandState) => void;
     resetOTPScreen: (state: BrandState) => void;
     uploadingBrandLogoStatus: (state: BrandState, action: ActionState<boolean>) => void;
+    storeExpectedSale: (state: BrandState, action: ActionState<ExpectedSaleRange>) => void;
     clearBrandLogo: (state: BrandState) => void;
 }, "brand/store">;
-export declare const clearError: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, stopLoader: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, resetOTPScreen: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, uploadingBrandLogoStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, clearBrandLogo: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>;
+export declare const clearError: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, stopLoader: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, resetOTPScreen: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, uploadingBrandLogoStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, clearBrandLogo: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, storeExpectedSale: import("@reduxjs/toolkit").ActionCreatorWithPayload<ExpectedSaleRange, string>;
 declare const _default: import("redux").Reducer<BrandState, import("redux").AnyAction>;
 export default _default;
 export declare const brandSelector: (state: RootState) => BrandState;

package/build/features/app/brand/brandStore.js

@@ -600,6 +600,9 @@ export var brandSlice = createSlice({
         uploadingBrandLogoStatus: function (state, action) {
             state.uploadingBrandLogo = action.payload;
         },
+        storeExpectedSale: function (state, action) {
+            state.data.brandActivities.expectedSale = action.payload;
+        },
         clearBrandLogo: function (state) {
             var brand = (state.data.verify.responseBody || {}).brand;
             state.data.verify.responseBody = __assign(__assign({}, state.data.verify.responseBody), { brand: __assign(__assign({}, brand), { logo_details: undefined, logo: undefined }) });
@@ -847,6 +850,6 @@ export var brandSlice = createSlice({
         });
     }
 });
-export var clearError = (_a = brandSlice.actions, _a.clearError), stopLoader = _a.stopLoader, resetOTPScreen = _a.resetOTPScreen, uploadingBrandLogoStatus = _a.uploadingBrandLogoStatus, clearBrandLogo = _a.clearBrandLogo;
+export var clearError = (_a = brandSlice.actions, _a.clearError), stopLoader = _a.stopLoader, resetOTPScreen = _a.resetOTPScreen, uploadingBrandLogoStatus = _a.uploadingBrandLogoStatus, clearBrandLogo = _a.clearBrandLogo, storeExpectedSale = _a.storeExpectedSale;
 export default brandSlice.reducer;
 export var brandSelector = function (state) { return state.brand; };

package/build/features/app/business/businessStore.d.ts

@@ -1,5 +1,5 @@
 import { RootState } from '../../../app/store';
-import { ActivitiesFormValues, CustomersFormValues, BusinessTypeFormValues, NIDFormValues, OTPFormValues, ResponseData, SharedState, FlowsTypes, Activity, CivilFormValues, ActionState } from '../../../@types';
+import { ActivitiesFormValues, CustomersFormValues, BusinessTypeFormValues, NIDFormValues, OTPFormValues, ResponseData, SharedState, FlowsTypes, Activity, CivilFormValues, ActionState, ExpectedSaleRange } from '../../../@types';
 export declare const verifyLeadToken: import("@reduxjs/toolkit").AsyncThunk<{
     data: any;
     isicActivityList: any;
@@ -124,9 +124,11 @@ export declare const businessSlice: import("@reduxjs/toolkit").Slice<BusinessSta
     resetOTPScreen: (state: BusinessState) => void;
     uploadingStatus: (state: BusinessState, action: ActionState<boolean>) => void;
     uploadingArticleStatus: (state: BusinessState, action: ActionState<boolean>) => void;
+    storeActivities: (state: BusinessState, action: ActionState<Activity[]>) => void;
+    storeExpectedSale: (state: BusinessState, action: ActionState<ExpectedSaleRange>) => void;
     clearAOAFile: (state: BusinessState) => void;
 }, "business/store">;
-export declare const clearError: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, stopLoader: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, resetOTPScreen: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, uploadingStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, uploadingArticleStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, clearAOAFile: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>;
+export declare const clearError: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, stopLoader: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, resetOTPScreen: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, uploadingStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, uploadingArticleStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, clearAOAFile: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, storeActivities: import("@reduxjs/toolkit").ActionCreatorWithPayload<Activity[], string>, storeExpectedSale: import("@reduxjs/toolkit").ActionCreatorWithPayload<ExpectedSaleRange, string>;
 declare const _default: import("redux").Reducer<BusinessState, import("redux").AnyAction>;
 export default _default;
 export declare const businessSelector: (state: RootState) => BusinessState;

package/build/features/app/business/businessStore.js

@@ -150,7 +150,7 @@ export var verifyLeadToken = createAsyncThunk('businessVerifyLeadToken', functio
                 return [4, API.brandService.retrieveBrand(brandID)];
             case 14:
                 brandData = _d.sent();
-                thunkApi.dispatch(handleNextScreenStep('BUSINESS_ACTIVITIES_STEP'));
+                thunkApi.dispatch(handleNextScreenStep('BUSINESS_ACTIVITIES_INFO_STEP'));
                 return [3, 19];
             case 15: return [4, thunkApi.dispatch(retrieveAllEntityList({ businessId: business_id, entityId: entity === null || entity === void 0 ? void 0 : entity.id }))];
             case 16:
@@ -298,7 +298,7 @@ export var verifyLeadOTP = createAsyncThunk('verifyLeadOTP', function (params, t
                 return [4, API.brandService.retrieveBrand(brandID)];
             case 20:
                 brandData = _k.sent();
-                thunkApi.dispatch(handleNextScreenStep('BUSINESS_ACTIVITIES_STEP'));
+                thunkApi.dispatch(handleNextScreenStep('BUSINESS_ACTIVITIES_INFO_STEP'));
                 return [3, 22];
             case 21:
                 thunkApi.dispatch(handleNextScreenStep('BUSINESS_BUSINESS_TYPE_STEP'));
@@ -486,7 +486,7 @@ export var updateLeadBusinessType = createAsyncThunk('updateLeadBusinessType', f
                 selectedLicense = params.selectedLicense, licenseNumber = params.licenseNumber, entityLegalName = params.entityLegalName, certificateId = params.certificateId, articleId = params.articleId, selectedEntityLicense = params.selectedEntityLicense;
                 isFL = (selectedLicense === null || selectedLicense === void 0 ? void 0 : selectedLicense.type) === BusinessType.FL;
                 _b = business.data.verify.responseBody || {}, lead_id = _b.lead_id, brand = _b.brand;
-                stepName = 'BUSINESS_ACTIVITIES_STEP';
+                stepName = 'BUSINESS_ACTIVITIES_INFO_STEP';
                 payload = __assign(__assign(__assign(__assign({ id: lead_id || '', entity: {
                         id: (selectedEntityLicense === null || selectedEntityLicense === void 0 ? void 0 : selectedEntityLicense.id) && (isNonSA ? !isFL : true) ? selectedEntityLicense === null || selectedEntityLicense === void 0 ? void 0 : selectedEntityLicense.id : ''
                     } }, (!(selectedEntityLicense === null || selectedEntityLicense === void 0 ? void 0 : selectedEntityLicense.id) && {
@@ -806,6 +806,12 @@ export var businessSlice = createSlice({
         uploadingArticleStatus: function (state, action) {
             state.uploadingArticle = action.payload;
         },
+        storeActivities: function (state, action) {
+            state.data.activitiesData.activities = action.payload;
+        },
+        storeExpectedSale: function (state, action) {
+            state.data.customersData.expectedSale = action.payload;
+        },
         clearAOAFile: function (state) {
             var entity = (state.data.verify.responseBody || {}).entity;
             state.data.verify.responseBody = __assign(__assign({}, state.data.verify.responseBody), { entity: __assign(__assign({}, entity), { AOA_file: undefined, AOA_file_id: undefined }) });
@@ -1182,7 +1188,7 @@ export var businessSlice = createSlice({
             state.error = action.error.message;
         })
             .addCase(updateLeadSuccess.fulfilled, function (state, action) {
-            var _a, _b;
+            var _a, _b, _c, _d, _e, _f;
             state.loading = false;
             state.data.verify.responseBody = __assign(__assign({}, state.data.verify.responseBody), { updateLeadSuccessLoading: false });
             state.error = null;
@@ -1192,7 +1198,7 @@ export var businessSlice = createSlice({
                 state.error = description;
                 return;
             }
-            state.data.verify.responseBody = __assign(__assign(__assign({}, state.data.verify.responseBody), response), { name: (_b = state.data.verify.responseBody) === null || _b === void 0 ? void 0 : _b.name });
+            state.data.verify.responseBody = __assign(__assign(__assign({}, state.data.verify.responseBody), response), { name: (_b = state.data.verify.responseBody) === null || _b === void 0 ? void 0 : _b.name, merchant: ((_c = state.data.verify.responseBody) === null || _c === void 0 ? void 0 : _c.merchant) || ((_f = (_e = (_d = state.data.verify.responseBody) === null || _d === void 0 ? void 0 : _d.business) === null || _e === void 0 ? void 0 : _e.entity) === null || _f === void 0 ? void 0 : _f.merchant) });
         })
             .addCase(updateLeadSuccess.pending, function (state) {
             state.loading = true;
@@ -1206,6 +1212,6 @@ export var businessSlice = createSlice({
         });
     }
 });
-export var clearError = (_a = businessSlice.actions, _a.clearError), stopLoader = _a.stopLoader, resetOTPScreen = _a.resetOTPScreen, uploadingStatus = _a.uploadingStatus, uploadingArticleStatus = _a.uploadingArticleStatus, clearAOAFile = _a.clearAOAFile;
+export var clearError = (_a = businessSlice.actions, _a.clearError), stopLoader = _a.stopLoader, resetOTPScreen = _a.resetOTPScreen, uploadingStatus = _a.uploadingStatus, uploadingArticleStatus = _a.uploadingArticleStatus, clearAOAFile = _a.clearAOAFile, storeActivities = _a.storeActivities, storeExpectedSale = _a.storeExpectedSale;
 export default businessSlice.reducer;
 export var businessSelector = function (state) { return state.business; };

package/build/features/app/entity/entityStore.d.ts

@@ -1,5 +1,5 @@
 import { RootState } from '../../../app/store';
-import { ActionState, AsyncThunkParams, EntityCapitalFormValues, EntityNameFormValues, FlowsTypes, OTPFormValues, ResponseData, SharedState } from '../../../@types';
+import { ActionState, Activity, AsyncThunkParams, EntityCapitalFormValues, EntityNameFormValues, FlowsTypes, OTPFormValues, ResponseData, SharedState } from '../../../@types';
 interface VerifyLeadTokenProps {
     token: string;
     isInternally?: boolean;
@@ -83,8 +83,9 @@ export declare const entitySlice: import("@reduxjs/toolkit").Slice<EntityState,
     uploadingStatus: (state: EntityState, action: ActionState<boolean>) => void;
     uploadingArticleStatus: (state: EntityState, action: ActionState<boolean>) => void;
     clearAOAFile: (state: EntityState) => void;
+    storeActivities: (state: EntityState, action: ActionState<Activity[]>) => void;
 }, "entity/store">;
-export declare const clearError: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, stopLoader: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, resetOTPScreen: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, uploadingStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, uploadingArticleStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, clearAOAFile: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>;
+export declare const clearError: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, stopLoader: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, resetOTPScreen: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, uploadingStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, uploadingArticleStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, clearAOAFile: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, storeActivities: import("@reduxjs/toolkit").ActionCreatorWithPayload<Activity[], string>;
 declare const _default: import("redux").Reducer<EntityState, import("redux").AnyAction>;
 export default _default;
 export declare const entitySelector: (state: RootState) => EntityState;

package/build/features/app/entity/entityStore.js

@@ -505,6 +505,9 @@ export var entitySlice = createSlice({
         clearAOAFile: function (state) {
             var entity = (state.data.verify.responseBody || {}).entity;
             state.data.verify.responseBody = __assign(__assign({}, state.data.verify.responseBody), { entity: __assign(__assign({}, entity), { AOA_file: undefined, AOA_file_id: undefined }) });
+        },
+        storeActivities: function (state, action) {
+            state.data.entityCapitalData.activities = action.payload;
         }
     },
     extraReducers: function (builder) {
@@ -742,6 +745,6 @@ export var entitySlice = createSlice({
         });
     }
 });
-export var clearError = (_a = entitySlice.actions, _a.clearError), stopLoader = _a.stopLoader, resetOTPScreen = _a.resetOTPScreen, uploadingStatus = _a.uploadingStatus, uploadingArticleStatus = _a.uploadingArticleStatus, clearAOAFile = _a.clearAOAFile;
+export var clearError = (_a = entitySlice.actions, _a.clearError), stopLoader = _a.stopLoader, resetOTPScreen = _a.resetOTPScreen, uploadingStatus = _a.uploadingStatus, uploadingArticleStatus = _a.uploadingArticleStatus, clearAOAFile = _a.clearAOAFile, storeActivities = _a.storeActivities;
 export default entitySlice.reducer;
 export var entitySelector = function (state) { return state.entity; };

package/build/features/app/individual/individualStore.d.ts

@@ -1,5 +1,5 @@
 import { RootState } from '../../../app/store';
-import { FlowsTypes, IndividualExtraFormValues, OTPFormValues, ResponseData, SharedState, ActionState, User, IndividualPersonalInfoFormValues, IndividualEmailMobileFormValues, IndividualMobileFormValues, AsyncThunkParams } from '../../../@types';
+import { FlowsTypes, IndividualExtraFormValues, OTPFormValues, ResponseData, SharedState, ActionState, User, IndividualPersonalInfoFormValues, IndividualEmailMobileFormValues, IndividualMobileFormValues, AsyncThunkParams, Occupation } from '../../../@types';
 import { CancelToken } from 'axios';
 interface VerifyLeadTokenProps {
     token: string;
@@ -142,8 +142,9 @@ export declare const individualSlice: import("@reduxjs/toolkit").Slice<Individua
     resetIndividualData: (state: IndividualState) => void;
     civilIDUploadingStatus: (state: IndividualState, action: ActionState<boolean>) => void;
     signatureFileUploadingStatus: (state: IndividualState, action: ActionState<boolean>) => void;
+    storeOccupation: (state: IndividualState, action: ActionState<Occupation>) => void;
 }, "individual/store">;
-export declare const clearError: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, stopLoader: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, resetOTPScreen: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, civilIDUploadingStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, signatureFileUploadingStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, resetIndividualData: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>;
+export declare const clearError: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, stopLoader: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, resetOTPScreen: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, civilIDUploadingStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, signatureFileUploadingStatus: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>, resetIndividualData: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<string>, storeOccupation: import("@reduxjs/toolkit").ActionCreatorWithPayload<Occupation, string>;
 declare const _default: import("redux").Reducer<IndividualState, import("redux").AnyAction>;
 export default _default;
 export declare const individualSelector: (state: RootState) => IndividualState;

package/build/features/app/individual/individualStore.js

@@ -889,6 +889,9 @@ export var individualSlice = createSlice({
         },
         signatureFileUploadingStatus: function (state, action) {
             state.data.individualData.signatureFileUploading = action.payload;
+        },
+        storeOccupation: function (state, action) {
+            state.data.individualData.occupation = action.payload;
         }
     },
     extraReducers: function (builder) {
@@ -1309,6 +1312,6 @@ export var individualSlice = createSlice({
         });
     }
 });
-export var clearError = (_a = individualSlice.actions, _a.clearError), stopLoader = _a.stopLoader, resetOTPScreen = _a.resetOTPScreen, civilIDUploadingStatus = _a.civilIDUploadingStatus, signatureFileUploadingStatus = _a.signatureFileUploadingStatus, resetIndividualData = _a.resetIndividualData;
+export var clearError = (_a = individualSlice.actions, _a.clearError), stopLoader = _a.stopLoader, resetOTPScreen = _a.resetOTPScreen, civilIDUploadingStatus = _a.civilIDUploadingStatus, signatureFileUploadingStatus = _a.signatureFileUploadingStatus, resetIndividualData = _a.resetIndividualData, storeOccupation = _a.storeOccupation;
 export default individualSlice.reducer;
 export var individualSelector = function (state) { return state.individual; };

package/build/features/bank/Bank.js

@@ -43,7 +43,7 @@ var Bank = memo(function (_a) {
     useAppConfig(__assign(__assign({ navigation: BANK_SCREENS_NAVIGATION }, props), { disableSettingFetching: !!verifyToken }));
     useErrorListener(bankError || error);
     useStepStartedListener();
-    var activeScreen = data.activeScreen, isTapOrigin = data.isTapOrigin, open = data.open, featureScreensNavigation = data.featureScreensNavigation, merchant = data.merchant, isMaturityExpress = data.isMaturityExpress;
+    var activeScreen = data.activeScreen, isTapOrigin = data.isTapOrigin, open = data.open, featureScreensNavigation = data.featureScreensNavigation, isMaturityExpress = data.isMaturityExpress;
     React.useEffect(function () {
         sendPageView({
             title: 'Bank'
@@ -58,11 +58,11 @@ var Bank = memo(function (_a) {
         settingLoading: settingLoading
     });
     var initialLoading = verifyToken ? settingLoading : settingLoading || customLoading;
-    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ open: open, isTapOrigin: isTapOrigin, loading: initialLoading }, { children: _jsx(AnimationFlow, __assign({ pointerEvents: loading ? 'none' : 'auto', isTapOrigin: isTapOrigin, loading: initialLoading, error: error, open: open, breakpoint: 'sm', screenId: activeScreen.name, merchantInfo: merchant, isMaturityExpress: isMaturityExpress }, { children: _jsx(FeatureContainer, __assign({ isMaturityExpress: isMaturityExpress }, { children: bankFeatureScreens.map(function (_a, index) {
+    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ open: open, isTapOrigin: isTapOrigin, loading: initialLoading }, { children: _jsx(AnimationFlow, __assign({ countries: data.tapCountries, pointerEvents: loading ? 'none' : 'auto', isTapOrigin: isTapOrigin, loading: initialLoading, error: error, open: open, breakpoint: 'sm', screenId: activeScreen.name, isMaturityExpress: isMaturityExpress }, { children: _jsx(FeatureContainer, { children: bankFeatureScreens.map(function (_a, index) {
                         var Element = _a.element, name = _a.name;
                         var isActive = activeScreen.name === name;
                         return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
-                    }) })) })) })) })));
+                    }) }) })) })) })));
 });
 export function BankElement(props) {
     return (_jsx(ReduxProvider, __assign({ store: store }, { children: _jsx(Bank, __assign({}, props)) })));

package/build/features/bank/screens/BankDetails/BankDetails.js

@@ -11,7 +11,7 @@ var __assign = (this && this.__assign) || function () {
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
-import { ScreenContainer } from '../../../shared/Containers';
+import { ContainerWithHeader } from '../../../shared/Containers';
 import Beneficiary from './Beneficiary';
 import IBAN from './IBAN';
 import BankName from './BankName';
@@ -35,12 +35,7 @@ var FormStyled = styled(Form)(function () { return ({
     flexDirection: 'column',
     overflow: 'hidden'
 }); });
-var ButtonStyled = styled(Button)(function (_a) {
-    var theme = _a.theme;
-    return ({
-        marginBlockStart: theme.spacing(1)
-    });
-});
+var ButtonStyled = styled(Button)(function () { return ({}); });
 var BankDetails = function () {
     var _a, _b;
     var _c = React.useState(false), ibanChecking = _c[0], setIbanChecking = _c[1];
@@ -105,6 +100,6 @@ var BankDetails = function () {
     var onSubmit = function (data) {
         dispatch(createBankAccount(deepCopy(getFelids(data))));
     };
-    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(Beneficiary, { readOnly: readOnly['beneficiaryName'] || noneEditable['beneficiary_name'], isVerified: isBeneficiaryNameVerified }), _jsx(IBAN, { fetchingIban: function (value) { return setIbanChecking(value); }, ibanChecking: ibanChecking, readOnly: readOnly['iban'] || noneEditable['iban'], isVerified: isIBANVerified }), _jsx(BankName, { readOnly: readOnly['bankName'] || noneEditable['bank_name'], isVerified: isBankNameVerified }), _jsx(BankStatement, { isVerified: dataVerified['document'], required: isKWCountry && isFL && !bankHasDocument, defaultFiles: defaultBankFiles, readOnly: readOnly['bankStatementId'] || noneEditable['bank_statement_file_id'] }), _jsx(ConfirmPolicy, { readOnly: readOnly['confirmPolicy'] || noneEditable['is_acknowledged'] }), _jsx(ButtonStyled, __assign({ onBackClicked: function () { return onBack(); }, disabled: disabled, isAr: isAr, loading: loading, error: t(error || '') }, { children: t('confirm') }))] })) })) }));
+    return (_jsx(ContainerWithHeader, __assign({ onBack: onBack, title: 'bank_info_title', description: 'bank_info_description' }, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(Beneficiary, { readOnly: readOnly['beneficiaryName'] || noneEditable['beneficiary_name'], isVerified: isBeneficiaryNameVerified }), _jsx(IBAN, { fetchingIban: function (value) { return setIbanChecking(value); }, ibanChecking: ibanChecking, readOnly: readOnly['iban'] || noneEditable['iban'], isVerified: isIBANVerified }), _jsx(BankName, { readOnly: readOnly['bankName'] || noneEditable['bank_name'], isVerified: isBankNameVerified }), _jsx(BankStatement, { isVerified: dataVerified['document'], required: isKWCountry && isFL && !bankHasDocument, defaultFiles: defaultBankFiles, readOnly: readOnly['bankStatementId'] || noneEditable['bank_statement_file_id'] }), _jsx(ConfirmPolicy, { readOnly: readOnly['confirmPolicy'] || noneEditable['is_acknowledged'] }), _jsx(ButtonStyled, __assign({ disableBack: true, disabled: disabled, isAr: isAr, loading: loading, error: t(error || '') }, { children: t('confirm') }))] })) })) })));
 };
 export default BankDetails;

package/build/features/bank/screens/BankDetails/BankName.js

@@ -19,13 +19,13 @@ import { removeAllOtherThanAlphabetAndSpace } from '../../../../utils';
 import { FieldType } from '../../../../@types';
 import Collapse from '../../../../components/Collapse';
 import { ScreenContainer } from '../../../shared/Containers';
-import Input from '../../../shared/Input';
+import Input from '../../../shared/TextField';
 import { bankSelector } from '../../../app/bank/bankStore';
 import { EndAdornment } from '../../../shared/EndAdornment';
 var FeatureStyled = styled(ScreenContainer)(function (_a) {
     var theme = _a.theme;
     return ({
-        marginBlockStart: theme.spacing(3)
+        marginBlockStart: theme.spacing(1.5)
     });
 });
 var InputStyled = styled(Input)(function () { return ({
@@ -58,6 +58,10 @@ var BankName = function (_a) {
         var value = removeAllOtherThanAlphabetAndSpace(target.value);
         bankNameControl.field.onChange(value);
     };
-    return (_jsx(Collapse, __assign({ in: !!bankNameValue }, { children: _jsx(FeatureStyled, { children: _jsx(InputStyled, { readOnly: readOnly, label: t('enter_bank_name'), placeholder: t('enter_bank_name_placeholder'), onChange: handleBankChange, value: bankNameValue, required: true, disabled: isNonEditable, endAdornment: _jsx(EndAdornment, { value: bankNameValue, isVerified: isVerified, error: error, onClear: clearValue }) }) }) })));
+    return (_jsx(Collapse, __assign({ in: !!bankNameValue }, { children: _jsx(FeatureStyled, { children: _jsx(InputStyled, { InputProps: {
+                    endAdornment: _jsx(EndAdornment, { value: bankNameValue, isVerified: isVerified, error: error, onClear: clearValue })
+                }, inputProps: {
+                    readOnly: readOnly
+                }, label: t('enter_bank_name'), placeholder: t('enter_bank_name_placeholder'), onChange: handleBankChange, value: bankNameValue, required: true, disabled: isNonEditable }) }) })));
 };
 export default BankName;

package/build/features/bank/screens/BankDetails/BankStatement.js

@@ -11,7 +11,7 @@ import UploadMultipleFile from '../../../shared/UploadMultipleFile';
 var FeatureStyled = styled(ScreenContainer)(function (_a) {
     var theme = _a.theme;
     return ({
-        marginBlockStart: theme.spacing(3)
+        marginBlockStart: theme.spacing(2.5)
     });
 });
 var BankStatement = function (_a) {

package/build/features/bank/screens/BankDetails/Beneficiary.js

@@ -7,12 +7,12 @@ import { useAppSelector } from '../../../../hooks';
 import { FieldType } from '../../../../@types';
 import { ScreenContainer } from '../../../shared/Containers';
 import { bankSelector } from '../../../app/bank/bankStore';
-import Input from '../../../shared/Input';
+import Input from '../../../shared/TextField';
 import { EndAdornment } from '../../../shared/EndAdornment';
 var FeatureStyled = styled(ScreenContainer)(function (_a) {
     var theme = _a.theme;
     return ({
-        marginBlockEnd: theme.spacing(3)
+        marginBlockEnd: theme.spacing(1.5)
     });
 });
 var InputStyled = styled(Input)(function () { return ({
@@ -43,6 +43,10 @@ var Beneficiary = function (_a) {
     var clearValue = function () {
         beneficiaryControl.field.onChange('');
     };
-    return (_jsx(FeatureStyled, { children: _jsx(InputStyled, { readOnly: readOnly, label: t('beneficiary_name'), onChange: handleBeneficiaryChange, disabled: isNonEditable, value: beneficiaryValue, placeholder: t('beneficiary_name'), warningType: 'alert', warningMessage: error && t(error), required: true, endAdornment: _jsx(EndAdornment, { value: beneficiaryValue, isVerified: isVerified, error: error, onClear: clearValue }) }) }));
+    return (_jsx(FeatureStyled, { children: _jsx(InputStyled, { inputProps: {
+                readOnly: readOnly
+            }, InputProps: {
+                endAdornment: _jsx(EndAdornment, { value: beneficiaryValue, isVerified: isVerified, error: error, onClear: clearValue })
+            }, label: t('beneficiary_name'), onChange: handleBeneficiaryChange, disabled: isNonEditable, value: beneficiaryValue, placeholder: t('beneficiary_name'), helperText: error && t(error), required: true }) }));
 };
 export default Beneficiary;

package/build/features/bank/screens/BankDetails/ConfirmPolicy.js

@@ -13,36 +13,27 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useTranslation } from 'react-i18next';
 import { useController, useFormContext } from 'react-hook-form';
 import { ScreenContainer } from '../../../shared/Containers';
-import { styled, alpha } from '@mui/material/styles';
+import { styled } from '@mui/material/styles';
 import Box from '@mui/material/Box';
 import CheckBox from '../../../../components/CheckBox';
 import Text from '../../../../components/Text';
 import Warning from '../../../../components/Warning';
 import Collapse from '../../../../components/Collapse';
+import { ThemeMode } from '../../../../@types';
 var ConfirmContainerStyled = styled(Box, { shouldForwardProp: function (prop) { return prop !== 'readOnly'; } })(function (_a) {
-    var theme = _a.theme, readOnly = _a.readOnly;
-    return (__assign({ display: 'flex', flexDirection: 'row', alignItems: 'center', padding: theme.spacing(0, 2.5, 1.5, 2.5), marginBlockStart: theme.spacing(3) }, (readOnly && {
+    var readOnly = _a.readOnly;
+    return (__assign({ display: 'flex', flexDirection: 'row', alignItems: 'center' }, (readOnly && {
         opacity: '0.6'
     })));
 });
 var TextStyled = styled(Text)(function (_a) {
     var theme = _a.theme;
-    return (__assign({ color: alpha(theme.palette.text.primary, 0.4), fontWeight: theme.typography.fontWeightLight, whiteSpace: 'pre-line', height: 'fit-content' }, theme.typography.body2));
+    return (__assign({ color: theme.palette.mode === ThemeMode.DARK ? theme.palette.text.secondary : theme.palette.secondary.light, fontWeight: theme.typography.fontWeightRegular, whiteSpace: 'pre-line', height: 'fit-content' }, theme.typography.caption));
 });
 var CheckboxStyled = styled(CheckBox)(function (_a) {
     var theme = _a.theme;
     return ({
-        margin: theme.spacing(0),
-        padding: theme.spacing(0),
-        marginInlineEnd: theme.spacing(1.5),
-        color: theme.palette.primary.main,
-        '& .MuiSvgIcon-root': {
-            fontSize: theme.spacing(3.75)
-        },
-        '&.Mui-checked': {
-            color: theme.palette.text.primary,
-            borderRadius: theme.spacing(2.5)
-        }
+        marginInlineStart: theme.spacing(-1.125)
     });
 });
 var CollapseStyled = styled(Collapse)(function () { return ({
@@ -61,6 +52,6 @@ var ConfirmPolicy = function (_a) {
             return;
         confirmControl.field.onChange(checked);
     };
-    return (_jsxs(ScreenContainer, { children: [_jsxs(ConfirmContainerStyled, __assign({ readOnly: readOnly }, { children: [_jsx(CheckboxStyled, { disableRipple: true, disableFocusRipple: true, focusRipple: false, checked: confirmChecked, onChange: handleConfirmCheckedChange }), _jsx(TextStyled, { children: t('bank_confirm_information') })] })), _jsx(CollapseStyled, __assign({ in: !!warningMessage }, { children: _jsx(Warning, __assign({ warningType: 'alert' }, { children: warningMessage && t(warningMessage) })) }))] }));
+    return (_jsxs(ScreenContainer, __assign({ sx: { mt: 3, ml: 3, mr: 3 } }, { children: [_jsxs(ConfirmContainerStyled, __assign({ readOnly: readOnly }, { children: [_jsx(CheckboxStyled, { disableRipple: true, disableFocusRipple: true, focusRipple: false, checked: confirmChecked, onChange: handleConfirmCheckedChange }), _jsx(TextStyled, { children: t('bank_confirm_information') })] })), _jsx(CollapseStyled, __assign({ in: !!warningMessage }, { children: _jsx(Warning, __assign({ warningType: 'alert' }, { children: warningMessage && t(warningMessage) })) }))] })));
 };
 export default ConfirmPolicy;

package/build/features/bank/screens/BankDetails/IBAN.js

@@ -48,7 +48,7 @@ import { FieldType } from '../../../../@types';
 import { MAX_IBAN_VALUE } from '../../../../constants';
 import { ScreenContainer } from '../../../shared/Containers';
 import { checkIbanBank } from '../../../app/bank/bankStore';
-import Input from '../../../shared/Input';
+import Input from '../../../shared/TextField';
 import { bankSelector } from '../../../app/bank/bankStore';
 import { EndAdornment } from '../../../shared/EndAdornment';
 var InputStyled = styled(Input)(function () { return ({
@@ -97,6 +97,11 @@ var IBAN = function (_a) {
     var clearValue = function () {
         ibanControl.field.onChange('');
     };
-    return (_jsx(ScreenContainer, { children: _jsx(InputStyled, { readOnly: readOnly, label: t('enter_iban'), inputProps: { maxLength: MAX_IBAN_VALUE }, onChange: handleIbanChange, value: ibanValue, placeholder: t('iban_input_placeholder', { countrycode: settingsData.businessCountry.iso2.toUpperCase() }), warningType: 'alert', warningMessage: error && t(error), required: true, disabled: isNonEditable, endAdornment: _jsx(EndAdornment, { value: ibanValue, loading: ibanChecking, isVerified: isVerified, error: error, onClear: clearValue }) }) }));
+    return (_jsx(ScreenContainer, { children: _jsx(InputStyled, { label: t('enter_iban'), InputProps: {
+                endAdornment: _jsx(EndAdornment, { value: ibanValue, loading: ibanChecking, isVerified: isVerified, error: error, onClear: clearValue })
+            }, inputProps: {
+                maxLength: MAX_IBAN_VALUE,
+                readOnly: readOnly
+            }, onChange: handleIbanChange, value: ibanValue, placeholder: t('iban_input_placeholder', { countrycode: settingsData.businessCountry.iso2.toUpperCase() }), helperText: error && t(error), required: true, disabled: isNonEditable }) }));
 };
 export default IBAN;

package/build/features/bank/screens/ResetPasswordSuccess/ResetPasswordSuccess.js

@@ -1,8 +1,20 @@
+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 } from "react/jsx-runtime";
 import * as React from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { handlePrevScreenStep } from '../../../../app/settings';
 import SuccessScreen from '../../../shared/SuccessScreen';
+import { ContainerWithHeader } from '../../../shared/Containers';
 import { bankSelector } from '../../../app/bank/bankStore';
 import { maskEmail } from '../../../../utils';
 import { useAppDispatch, useAppSelector } from '../../../../hooks';
@@ -16,6 +28,6 @@ var ResetPasswordSuccess = function (_a) {
     var onBack = function () {
         dispatch(handlePrevScreenStep());
     };
-    return (_jsx(SuccessScreen, { title: t("reset_password_success_title"), description: _jsx(Trans, { i18nKey: 'reset_password_success_description_dev', values: { email: maskedEmail } }), showEmailProviders: true, enableBack: true, onBack: function () { return onBack(); } }));
+    return (_jsx(ContainerWithHeader, __assign({ onBack: function () { return onBack(); }, title: 'reset_password_success_header_title', description: 'reset_password_success_header_description' }, { children: _jsx(SuccessScreen, { title: t("reset_password_success_title"), description: _jsx(Trans, { i18nKey: 'reset_password_success_description_dev', values: { email: maskedEmail } }), showEmailProviders: true, enableBack: true, onBack: function () { return onBack(); } }) })));
 };
 export default React.memo(ResetPasswordSuccess);

package/build/features/bank/screens/Success/Success.js

@@ -1,9 +1,21 @@
+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 } from "react/jsx-runtime";
 import * as React from 'react';
 import { useTranslation } from 'react-i18next';
-import SuccessScreen from '../../../shared/SuccessScreen';
+import { ContainerWithHeader } from '../../../shared/Containers';
 import { useAppDispatch, useAppSelector } from '../../../../hooks';
 import { bankSelector, updateBoardSuccess } from '../../../app/bank/bankStore';
+import SuccessScreen from '../../../shared/SuccessScreen';
 var Success = function (_a) {
     var t = useTranslation().t;
     var dispatch = useAppDispatch();
@@ -15,6 +27,6 @@ var Success = function (_a) {
     var onSuccess = function () {
         setClicked(true);
     };
-    return (_jsx(SuccessScreen, { title: t('bank_success_title'), onSuccess: onSuccess, successTitle: t('continue'), loading: clicked && loading, error: error || '' }));
+    return (_jsx(ContainerWithHeader, __assign({ title: 'bank_success_header_title', description: 'bank_success_header_description' }, { children: _jsx(SuccessScreen, { title: t('bank_success_title'), onSuccess: onSuccess, successTitle: t('continue'), loading: clicked && loading, error: error || '' }) })));
 };
 export default React.memo(Success);

package/build/features/bank/screens/SuccessWithFlowButtons/SuccessWithFlowButtons.js

@@ -14,9 +14,10 @@ import { memo } from 'react';
 import { useAppSelector } from '../../../../hooks';
 import { bankSelector } from '../../../app/bank/bankStore';
 import SuccessFlowButtons from '../../../shared/SuccessFlowButtons';
+import { ContainerWithHeader } from '../../../shared/Containers';
 var SuccessWithFlowButtons = function () {
     var data = useAppSelector(bankSelector).data;
     var _a = data.verify.responseBody || {}, flows = _a.flows, entity = _a.entity, brand = _a.brand, bank = _a.bank_account, merchant = _a.merchant, user = _a.user, business = _a.business, board_id = _a.board_id, board_info_id = _a.board_info_id, name = _a.name, individuals = _a.individuals;
-    return (_jsx(SuccessFlowButtons, { flowName: data.flowName, bank: bank, brand: brand, entity: entity, merchant: merchant, user: __assign({ names: { en: name } }, user), business: business, boardId: board_id, boardInfoId: board_info_id, individuals: individuals, flows: flows || [] }));
+    return (_jsx(ContainerWithHeader, __assign({ title: 'bank_flows_title', description: 'bank_flows_description' }, { children: _jsx(SuccessFlowButtons, { flowName: data.flowName, bank: bank, brand: brand, entity: entity, merchant: merchant, user: __assign({ names: { en: name } }, user), business: business, boardId: board_id, boardInfoId: board_info_id, individuals: individuals, flows: flows || [] }) })));
 };
 export default memo(SuccessWithFlowButtons);

package/build/features/bank/screens/Verify/Verify.js

@@ -21,7 +21,7 @@ import { useLanguage, useAppSelector } from '../../../../hooks';
 import { deepCopy, maskPhone } from '../../../../utils';
 import Form from '../../../../components/Form';
 import Text from '../../../../components/Text';
-import { ScreenContainer } from '../../../shared/Containers';
+import { ContainerWithHeader } from '../../../shared/Containers';
 import { bankSelector, clearError, resetOTPScreen, verifyBankLeadOTP } from '../../../app/bank/bankStore';
 import Button from '../../../shared/Button';
 import { OTPValidation } from './validation';
@@ -29,17 +29,14 @@ import OTPInput from './OTPInput';
 var OTPTitleContainerStyled = styled(Box)(function (_a) {
     var theme = _a.theme;
     return ({
-        background: theme.palette.common.white,
-        border: '1px solid',
-        borderColor: theme.palette.divider,
         direction: theme.direction,
-        borderRadius: theme.spacing(0, 0, 1.25, 1.25),
-        marginBottom: theme.spacing(5.75)
+        paddingInline: theme.spacing(3),
+        paddingBottom: theme.spacing(5)
     });
 });
 var OTPTitleStyled = styled(Text)(function (_a) {
     var theme = _a.theme;
-    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 }));
+    return (__assign(__assign({}, theme.typography.body2), { color: theme.palette.secondary.main, fontWeight: theme.typography.fontWeightRegular, lineHeight: '19px', whiteSpace: 'pre-line' }));
 });
 var FormStyled = styled(Form)(function () { return ({
     display: 'flex',
@@ -69,6 +66,6 @@ var VerifyNumber = function (_a) {
         dispatch(verifyBankLeadOTP(deepCopy(formData)));
     };
     var disabled = !methods.formState.isValid || !!error || !phone || resendLoading;
-    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'), !loading && phone && _jsx("span", __assign({ dir: 'ltr' }, { children: "".concat(maskPhone(phone || '')) }))] }) }), _jsx(OTPInput, { loading: resendLoading, setLoading: setResendLoading }), _jsx(Button, __assign({ disableBack: true, disabled: disabled, isAr: isAr, loading: loading, error: t(error || '') }, { children: t('next') }))] })) })) }));
+    return (_jsx(ContainerWithHeader, __assign({ title: 'otp_authentication', description: 'otp_authentication_description' }, { 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'), !loading && phone && _jsx("span", __assign({ dir: 'ltr' }, { children: "".concat(maskPhone(phone || '')) }))] }) }), _jsx(OTPInput, { loading: resendLoading, setLoading: setResendLoading }), _jsx(Button, __assign({ disableBack: true, disabled: disabled, isAr: isAr, loading: loading, error: t(error || '') }, { children: t('next') }))] })) })) })));
 };
 export default React.memo(VerifyNumber);

package/build/features/brand/Brand.js

@@ -43,7 +43,7 @@ var Brand = memo(function (_a) {
     useAppConfig(__assign(__assign({ navigation: BRAND_SCREENS_NAVIGATION }, props), { disableSettingFetching: !!verifyToken }));
     useErrorListener(brandError || error);
     useStepStartedListener();
-    var activeScreen = data.activeScreen, isTapOrigin = data.isTapOrigin, open = data.open, featureScreensNavigation = data.featureScreensNavigation, merchant = data.merchant, isMaturityExpress = data.isMaturityExpress;
+    var activeScreen = data.activeScreen, isTapOrigin = data.isTapOrigin, open = data.open, featureScreensNavigation = data.featureScreensNavigation, isMaturityExpress = data.isMaturityExpress;
     React.useEffect(function () {
         sendPageView({
             title: 'Brand'
@@ -58,11 +58,11 @@ var Brand = memo(function (_a) {
         settingLoading: settingLoading
     });
     var initialLoading = verifyToken ? settingLoading : settingLoading || customLoading;
-    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ open: open, isTapOrigin: isTapOrigin, loading: initialLoading }, { children: _jsx(AnimationFlow, __assign({ pointerEvents: loading ? 'none' : 'auto', isTapOrigin: isTapOrigin, loading: initialLoading, error: error, open: open, breakpoint: 'sm', screenId: activeScreen.name, merchantInfo: merchant, isMaturityExpress: isMaturityExpress }, { children: _jsx(FeatureContainer, __assign({ isMaturityExpress: isMaturityExpress }, { children: brandFeatureScreens.map(function (_a, index) {
+    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ open: open, isTapOrigin: isTapOrigin, loading: initialLoading }, { children: _jsx(AnimationFlow, __assign({ countries: data.tapCountries, pointerEvents: loading ? 'none' : 'auto', isTapOrigin: isTapOrigin, loading: initialLoading, error: error, open: open, breakpoint: 'sm', screenId: activeScreen.name, isMaturityExpress: isMaturityExpress }, { children: _jsx(FeatureContainer, { children: brandFeatureScreens.map(function (_a, index) {
                         var Element = _a.element, name = _a.name;
                         var isActive = activeScreen.name === name;
                         return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
-                    }) })) })) })) })));
+                    }) }) })) })) })));
 });
 export function BrandElement(props) {
     return (_jsx(ReduxProvider, __assign({ store: store }, { children: _jsx(Brand, __assign({}, props)) })));