@tap-payments/auth-jsconnect 2.1.63-test → 2.1.66-test

package/build/@types/app.d.ts

@@ -161,7 +161,10 @@ interface LibCallbacks {
     onStepCompleted?: (name: string, info: any) => void;
     onReady?: () => void;
     onStepStarted?: (name: string) => void;
-    onFlowButtonClick?: (item: any) => void;
+    onFlowButtonClick?: (item: {
+        name: string;
+        token: string;
+    }) => void;
 }
 export interface LibConfig extends LibCallbacks {
     publicKey: string;

package/build/app/rootReducer.d.ts

@@ -8,7 +8,6 @@ declare const rootReducer: {
     password: import("redux").Reducer<import("../features/app/password/passwordStore").PasswordState, import("redux").AnyAction>;
     signIn: import("redux").Reducer<import("../features/app/signIn/signInStore").SignInState, import("redux").AnyAction>;
     entity: import("redux").Reducer<import("../features/app/entity/entityStore").EntityState, import("redux").AnyAction>;
-    auth: import("redux").Reducer<import("../features/app/auth/authStore").AuthState, import("redux").AnyAction>;
     brand: import("redux").Reducer<import("../features/app/brand/brandStore").BrandState, import("redux").AnyAction>;
     connectExpress: import("redux").Reducer<import("../features/app/connectExpress/connectExpressStore").ConnectExpressState, import("redux").AnyAction>;
 };

package/build/app/rootReducer.js

@@ -7,7 +7,6 @@ import individual from '../features/app/individual/individualStore';
 import password from '../features/app/password/passwordStore';
 import signIn from '../features/app/signIn/signInStore';
 import entity from '../features/app/entity/entityStore';
-import auth from '../features/app/auth/authStore';
 import brand from '../features/app/brand/brandStore';
 import connectExpress from '../features/app/connectExpress/connectExpressStore';
 var rootReducer = {
@@ -20,7 +19,6 @@ var rootReducer = {
     password: password,
     signIn: signIn,
     entity: entity,
-    auth: auth,
     brand: brand,
     connectExpress: connectExpress
 };

package/build/app/store.d.ts

@@ -9,7 +9,6 @@ export declare const store: import("@reduxjs/toolkit").EnhancedStore<{
     password: import("../features/app/password/passwordStore").PasswordState;
     signIn: import("../features/app/signIn/signInStore").SignInState;
     entity: import("../features/app/entity/entityStore").EntityState;
-    auth: import("../features/app/auth/authStore").AuthState;
     brand: import("../features/app/brand/brandStore").BrandState;
     connectExpress: import("../features/app/connectExpress/connectExpressStore").ConnectExpressState;
 }, import("redux").AnyAction, import("@reduxjs/toolkit").MiddlewareArray<[import("@reduxjs/toolkit").ThunkMiddleware<{
@@ -22,7 +21,6 @@ export declare const store: import("@reduxjs/toolkit").EnhancedStore<{
     password: import("../features/app/password/passwordStore").PasswordState;
     signIn: import("../features/app/signIn/signInStore").SignInState;
     entity: import("../features/app/entity/entityStore").EntityState;
-    auth: import("../features/app/auth/authStore").AuthState;
     brand: import("../features/app/brand/brandStore").BrandState;
     connectExpress: import("../features/app/connectExpress/connectExpressStore").ConnectExpressState;
 }, import("redux").AnyAction, undefined>]>>;

package/build/constants/app.d.ts

@@ -24,7 +24,6 @@ export declare const BANK_SCREENS_NAVIGATION: Array<ScreenStepNavigation>;
 export declare const TAX_SCREENS_NAVIGATION: Array<ScreenStepNavigation>;
 export declare const SigIn_SCREENS_NAVIGATION: Array<ScreenStepNavigation>;
 export declare const ENTITY_SCREENS_NAVIGATION: Array<ScreenStepNavigation>;
-export declare const AUTH_SCREENS_NAVIGATION: Array<ScreenStepNavigation>;
 export declare const BRAND_SCREENS_NAVIGATION: Array<ScreenStepNavigation>;
 export declare const DefaultDeviceInfo: {
     source: string;

package/build/constants/app.js

@@ -460,20 +460,6 @@ export var ENTITY_SCREENS_NAVIGATION = [
         order: 5
     }
 ];
-export var AUTH_SCREENS_NAVIGATION = [
-    {
-        name: 'AUTH_NID_STEP',
-        next: 'AUTH_VERIFY_STEP',
-        prev: '',
-        order: 1
-    },
-    {
-        name: 'AUTH_VERIFY_STEP',
-        next: '',
-        prev: 'AUTH_NID_STEP',
-        order: 2
-    }
-];
 export var BRAND_SCREENS_NAVIGATION = [
     {
         name: 'BRAND_VERIFY_STEP',

package/build/features/app/connectExpress/connectExpressStore.d.ts

@@ -2,6 +2,11 @@ import { RootState } from '../../../app/store';
 import { MobileFormValues, NIDFormValues, CivilFormValues, OTPFormValues, IndividualFormValues, SharedState, FlowsTypes, ActionState, CountryCode, AuthForType, BusinessDataFormValues } from '../../../@types';
 import { CancelToken } from 'axios';
 export declare const retrieveLeadIdentityByIdAsync: import("@reduxjs/toolkit").AsyncThunk<{
+    data: any;
+    countryCode: CountryCode;
+    boardInfo?: undefined;
+    boardData?: undefined;
+} | {
     data: any;
     countryCode: CountryCode;
     boardInfo: any;

package/build/features/app/connectExpress/connectExpressStore.js

@@ -63,44 +63,42 @@ import { CONNECT_EXPRESS_STEP_NAMES, IDENTIFICATION_TYPE, OTHER_CR_LICENSE, OTHE
 import { defaultCountry } from '../../../constants';
 import { getIndividualName, capitalizeTheFirstLetterOfEachWord, getEighteenYearsAgo, sleep, findCountryByIddPrefix, concatenateObjectValues, isSA } from '../../../utils';
 export var retrieveLeadIdentityByIdAsync = createAsyncThunk('expressConnect/retrieveLeadIdentityByIdAsync', function (leadId, thunkApi) { return __awaiter(void 0, void 0, void 0, function () {
-    var settings, countryCode, boardInfo, boardData, leadData, data, phone, _a, boardInfoRes, boardDataRes, leadDataRes;
-    var _b;
-    return __generator(this, function (_c) {
-        switch (_c.label) {
+    var _a, settings, connectExpress, countryCode, data, phone, status, board_id, board_info_id, _b, boardInfo, boardData, leadData;
+    var _c, _d;
+    return __generator(this, function (_e) {
+        switch (_e.label) {
             case 0:
-                settings = thunkApi.getState().settings;
+                _a = thunkApi.getState(), settings = _a.settings, connectExpress = _a.connectExpress;
                 countryCode = settings.data.businessCountry;
-                leadData = undefined;
                 return [4, API.leadService.retrieveLeadIdentity(leadId)];
             case 1:
-                data = _c.sent();
+                data = _e.sent();
                 phone = (data.contact || {}).phone;
                 if (phone === null || phone === void 0 ? void 0 : phone.country_code)
                     countryCode = findCountryByIddPrefix(settings.data.countries, phone.country_code);
-                if (!(((_b = data === null || data === void 0 ? void 0 : data.status) === null || _b === void 0 ? void 0 : _b.toLowerCase()) === 'registered')) return [3, 5];
-                if (!(data.board_id && data.board_info_id)) return [3, 3];
+                status = data.status, board_id = data.board_id, board_info_id = data.board_info_id;
+                if ((status === null || status === void 0 ? void 0 : status.toLowerCase()) === 'registered' && !connectExpress.data.showBoard) {
+                    (_d = (_c = settings.data.appConfig).onFlowCompleted) === null || _d === void 0 ? void 0 : _d.call(_c, data);
+                    thunkApi.dispatch(handleOpen(false));
+                    return [2, { data: data, countryCode: countryCode }];
+                }
+                if ((status === null || status === void 0 ? void 0 : status.toLowerCase()) !== 'registered') {
+                    thunkApi.dispatch(handleCurrentActiveScreen('CONNECT_EXPRESS_MOBILE_STEP'));
+                    return [2, { data: data, countryCode: countryCode }];
+                }
+                if (!(board_id && board_info_id)) {
+                    thunkApi.dispatch(handleCurrentActiveScreen('CONNECT_EXPRESS_ACCOUNT_ALREADY_CREATED_STEP'));
+                    return [2, { data: data, countryCode: countryCode }];
+                }
                 return [4, Promise.all([
-                        API.boardService.retrieveBoardInfo({ id: data.board_id, infoId: data.board_info_id }),
-                        API.boardService.retrieveBoardDetails(data.board_id),
+                        API.boardService.retrieveBoardInfo({ id: board_id, infoId: board_info_id }),
+                        API.boardService.retrieveBoardDetails(board_id),
                         thunkApi.dispatch(getLeadByIdAsync(leadId)).unwrap()
                     ])];
             case 2:
-                _a = _c.sent(), boardInfoRes = _a[0], boardDataRes = _a[1], leadDataRes = _a[2];
-                boardInfo = boardInfoRes;
-                boardData = boardDataRes;
-                leadData = leadDataRes === null || leadDataRes === void 0 ? void 0 : leadDataRes.data;
+                _b = _e.sent(), boardInfo = _b[0], boardData = _b[1], leadData = _b[2];
                 thunkApi.dispatch(handleCurrentActiveScreen('CONNECT_EXPRESS_SUCCESS_WITH_FLOW_BUTTONS_STEP'));
-                return [3, 4];
-            case 3:
-                thunkApi.dispatch(handleCurrentActiveScreen('CONNECT_EXPRESS_ACCOUNT_ALREADY_CREATED_STEP'));
-                _c.label = 4;
-            case 4: return [3, 6];
-            case 5:
-                if (!(data === null || data === void 0 ? void 0 : data.identification) && (data === null || data === void 0 ? void 0 : data.phone)) {
-                    thunkApi.dispatch(handleCurrentActiveScreen('CONNECT_EXPRESS_MOBILE_STEP'));
-                }
-                _c.label = 6;
-            case 6: return [2, { data: __assign(__assign({}, data), leadData), countryCode: countryCode, boardInfo: boardInfo, boardData: boardData }];
+                return [2, { data: __assign(__assign({}, data), leadData.data), countryCode: countryCode, boardInfo: boardInfo, boardData: boardData }];
         }
     });
 }); });

package/build/features/bank/Bank.d.ts

@@ -3,7 +3,7 @@ import { LibConfig } from '../../@types';
 export interface BankLibProps extends LibConfig {
     verifyToken?: string;
 }
-export declare function BankLib(props: BankLibProps): JSX.Element;
+export declare function BankElement(props: BankLibProps): JSX.Element;
 export declare function renderBankLib(config: BankLibProps, elementId: string): {
     unmount: () => void;
 };

package/build/features/bank/Bank.js

@@ -22,13 +22,14 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { memo } from 'react';
+import { createRoot } from 'react-dom/client';
 import { useAppTheme, useAppSelector, useErrorListener, useAppConfig, useStepStartedListener, useVerifyToken } from '../../hooks';
 import { settingsSelector } from '../../app/settings';
 import AnimationFlow from '../../components/AnimationFlow';
 import { store } from '../../app/store';
 import { ReduxProvider, ThemeProvider } from '../../components/Providers';
 import Collapse from '../../components/Collapse';
-import { reactElement } from '../../utils';
+import { createElementAndInject } from '../../utils';
 import { FeatureContainer } from '../shared/Containers';
 import { BANK_SCREENS_NAVIGATION } from '../../constants';
 import { bankFeatureScreens } from '../featuresScreens';
@@ -59,11 +60,13 @@ var Bank = memo(function (_a) {
                         return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
                     }) }) })) })) })));
 });
-export function BankLib(props) {
+export function BankElement(props) {
     return (_jsx(ReduxProvider, __assign({ store: store }, { children: _jsx(Bank, __assign({}, props)) })));
 }
 export function renderBankLib(config, elementId) {
-    var _a = reactElement(elementId), render = _a.render, unmount = _a.unmount;
-    render(_jsx(BankLib, __assign({}, config)));
+    var element = createElementAndInject(elementId);
+    var root = createRoot(element);
+    root.render(_jsx(BankElement, __assign({}, config)));
+    var unmount = function () { return root.unmount(); };
     return { unmount: unmount };
 }

package/build/features/brand/Brand.d.ts

@@ -3,7 +3,7 @@ import { LibConfig } from '../../@types';
 export interface BrandLibProps extends LibConfig {
     verifyToken?: string;
 }
-export declare function BrandLib(props: BrandLibProps): JSX.Element;
+export declare function BrandElement(props: BrandLibProps): JSX.Element;
 export declare function renderBrandLib(config: BrandLibProps, elementId: string): {
     unmount: () => void;
 };

package/build/features/brand/Brand.js

@@ -22,13 +22,14 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { memo } from 'react';
-import { useAppTheme, useAppDispatch, useAppSelector, useErrorListener, useAppConfig, useStepStartedListener, useVerifyToken } from '../../hooks';
+import { createRoot } from 'react-dom/client';
+import { useAppTheme, useAppSelector, useErrorListener, useAppConfig, useStepStartedListener, useVerifyToken } from '../../hooks';
 import { settingsSelector } from '../../app/settings';
 import AnimationFlow from '../../components/AnimationFlow';
 import { store } from '../../app/store';
 import { ReduxProvider, ThemeProvider } from '../../components/Providers';
 import Collapse from '../../components/Collapse';
-import { reactElement } from '../../utils';
+import { createElementAndInject } from '../../utils';
 import { FeatureContainer } from '../shared/Containers';
 import { BRAND_SCREENS_NAVIGATION } from '../../constants';
 import { brandFeatureScreens } from '../featuresScreens';
@@ -38,7 +39,6 @@ import Background from '../shared/Background';
 var Brand = memo(function (_a) {
     var verifyToken = _a.verifyToken, props = __rest(_a, ["verifyToken"]);
     var theme = useAppTheme().theme;
-    var dispatch = useAppDispatch();
     var _b = useAppSelector(settingsSelector), data = _b.data, error = _b.error, settingLoading = _b.loading;
     var _c = useAppSelector(brandSelector), customLoading = _c.customLoading, loading = _c.loading, brandError = _c.error;
     useAppConfig(__assign(__assign({ navigation: BRAND_SCREENS_NAVIGATION }, props), { disableSettingFetching: !!verifyToken }));
@@ -60,11 +60,13 @@ var Brand = memo(function (_a) {
                         return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
                     }) }) })) })) })));
 });
-export function BrandLib(props) {
+export function BrandElement(props) {
     return (_jsx(ReduxProvider, __assign({ store: store }, { children: _jsx(Brand, __assign({}, props)) })));
 }
 export function renderBrandLib(config, elementId) {
-    var _a = reactElement(elementId), render = _a.render, unmount = _a.unmount;
-    render(_jsx(BrandLib, __assign({}, config)));
+    var element = createElementAndInject(elementId);
+    var root = createRoot(element);
+    root.render(_jsx(BrandElement, __assign({}, config)));
+    var unmount = function () { return root.unmount(); };
     return { unmount: unmount };
 }

package/build/features/business/Business.d.ts

@@ -2,7 +2,7 @@
 import { LibConfig } from '../../@types';
 export interface BusinessLibProps extends LibConfig {
 }
-export declare function BusinessLib(props: BusinessLibProps): JSX.Element;
+export declare function BusinessElement(props: BusinessLibProps): JSX.Element;
 export declare function renderBusinessLib(config: BusinessLibProps, elementId: string): {
     unmount: () => void;
 };

package/build/features/business/Business.js

@@ -11,6 +11,7 @@ var __assign = (this && this.__assign) || function () {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { memo, useEffect } from 'react';
+import { createRoot } from 'react-dom/client';
 import { useAppTheme, useAppDispatch, useAppSelector, useAppConfig, useErrorListener, useStepStartedListener } from '../../hooks';
 import { handleLanguage, settingsSelector } from '../../app/settings';
 import { FeatureContainer } from '../shared/Containers';
@@ -19,7 +20,7 @@ import AnimationFlow from '../../components/AnimationFlow';
 import { store } from '../../app/store';
 import { ReduxProvider, ThemeProvider } from '../../components/Providers';
 import Collapse from '../../components/Collapse';
-import { getParameterByName, reactElement } from '../../utils';
+import { getParameterByName, createElementAndInject } from '../../utils';
 import { BUSINESS_SCREENS_NAVIGATION } from '../../constants';
 import { businessFeatureScreens } from '../featuresScreens';
 import CustomFooter from '../shared/Footer';
@@ -52,11 +53,13 @@ var Business = memo(function (props) {
                         return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
                     }) }) })) })) })));
 });
-export function BusinessLib(props) {
+export function BusinessElement(props) {
     return (_jsx(ReduxProvider, __assign({ store: store }, { children: _jsx(Business, __assign({}, props)) })));
 }
 export function renderBusinessLib(config, elementId) {
-    var _a = reactElement(elementId), render = _a.render, unmount = _a.unmount;
-    render(_jsx(BusinessLib, __assign({}, config)));
+    var element = createElementAndInject(elementId);
+    var root = createRoot(element);
+    root.render(_jsx(BusinessElement, __assign({}, config)));
+    var unmount = function () { return root.unmount(); };
     return { unmount: unmount };
 }

package/build/features/connect/Connect.d.ts

@@ -1,9 +1,8 @@
 /// <reference types="react" />
 import { LibConfig } from '../../@types';
 export interface ConnectLibProps extends LibConfig {
-    onClose?: () => void;
 }
-export declare function ConnectLib(props: ConnectLibProps): JSX.Element;
+export declare function ConnectElement(props: ConnectLibProps): JSX.Element;
 export declare function renderConnectLib(config: ConnectLibProps, elementId: string): {
     unmount: () => void;
 };

package/build/features/connect/Connect.js

@@ -9,19 +9,9 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 import { jsx as _jsx } from "react/jsx-runtime";
 import React, { memo } from 'react';
+import { createRoot } from 'react-dom/client';
 import { FeatureContainer } from '../shared/Containers';
 import { useAppTheme, useAppSelector, useAppConfig, useErrorListener, useStepStartedListener, useAppDispatch } from '../../hooks';
 import { handleCurrentActiveScreen, settingsSelector, handleOpen } from '../../app/settings';
@@ -30,17 +20,16 @@ import { store } from '../../app/store';
 import { connectSelector, setDefaultCountryCode } from '../app/connect/connectStore';
 import { ReduxProvider, ThemeProvider } from '../../components/Providers';
 import Collapse from '../../components/Collapse';
-import { reactElement, isKW } from '../../utils';
+import { isKW, createElementAndInject } from '../../utils';
 import { CONNECT_SCREENS_NAVIGATION } from '../../constants';
 import { connectFeatureScreens } from '../featuresScreens';
 import CustomFooter from '../shared/Footer';
 import Background from '../shared/Background';
-var Connect = memo(function (_a) {
-    var onClose = _a.onClose, props = __rest(_a, ["onClose"]);
+var Connect = memo(function (props) {
     var theme = useAppTheme().theme;
     var dispatch = useAppDispatch();
-    var _b = useAppSelector(settingsSelector), data = _b.data, error = _b.error, settingLoading = _b.loading;
-    var _c = useAppSelector(connectSelector), connectError = _c.error, loading = _c.loading;
+    var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, settingLoading = _a.loading;
+    var _b = useAppSelector(connectSelector), connectError = _b.error, loading = _b.loading;
     useAppConfig(__assign({ navigation: CONNECT_SCREENS_NAVIGATION }, props));
     useErrorListener(connectError || error);
     useStepStartedListener();
@@ -60,17 +49,19 @@ var Connect = memo(function (_a) {
     var handleDialogClose = function () {
         dispatch(handleOpen(false));
     };
-    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ open: open, isTapOrigin: isTapOrigin, loading: settingLoading }, { children: _jsx(AnimationFlow, __assign({ pointerEvents: loading ? 'none' : 'auto', onClose: onClose, onConfirm: handleDialogClose, isTapOrigin: isTapOrigin, loading: settingLoading, error: error, open: open, footer: _jsx(CustomFooter, {}), screenId: activeScreen.name }, { children: _jsx(FeatureContainer, { children: connectFeatureScreens.map(function (_a, index) {
+    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ open: open, isTapOrigin: isTapOrigin, loading: settingLoading }, { children: _jsx(AnimationFlow, __assign({ pointerEvents: loading ? 'none' : 'auto', onConfirm: handleDialogClose, isTapOrigin: isTapOrigin, loading: settingLoading, error: error, open: open, footer: _jsx(CustomFooter, {}), screenId: activeScreen.name }, { children: _jsx(FeatureContainer, { children: connectFeatureScreens.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 ConnectLib(props) {
+export function ConnectElement(props) {
     return (_jsx(ReduxProvider, __assign({ store: store }, { children: _jsx(Connect, __assign({}, props)) })));
 }
 export function renderConnectLib(config, elementId) {
-    var _a = reactElement(elementId), render = _a.render, unmount = _a.unmount;
-    render(_jsx(ConnectLib, __assign({}, config)));
+    var element = createElementAndInject(elementId);
+    var root = createRoot(element);
+    root.render(_jsx(ConnectElement, __assign({}, config)));
+    var unmount = function () { return root.unmount(); };
     return { unmount: unmount };
 }

package/build/features/connectExpress/ConnectExpress.d.ts

@@ -5,7 +5,7 @@ export interface ConnectExpressLibProps extends LibConfig {
     postURL: string;
     showBoard?: boolean;
 }
-export declare function ConnectExpressLib(props: ConnectExpressLibProps): JSX.Element;
+export declare function ConnectExpressElement(props: ConnectExpressLibProps): JSX.Element;
 export declare function renderConnectExpressLib(config: ConnectExpressLibProps, elementId: string): {
     unmount: () => void;
 };

package/build/features/connectExpress/ConnectExpress.js

@@ -22,6 +22,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import React, { memo } from 'react';
+import { createRoot } from 'react-dom/client';
 import { FeatureContainer } from '../shared/Containers';
 import { useAppTheme, useAppSelector, useAppConfig, useErrorListener, useStepStartedListener, useAppDispatch } from '../../hooks';
 import { handleCurrentActiveScreen, settingsSelector } from '../../app/settings';
@@ -30,7 +31,7 @@ import { store } from '../../app/store';
 import { connectExpressSelector, setIsLeadIdPassed, setPostUrl, setLeadId, retrieveLeadIdentityByIdAsync, setShowBoard } from '../app/connectExpress/connectExpressStore';
 import { ReduxProvider, ThemeProvider } from '../../components/Providers';
 import Collapse from '../../components/Collapse';
-import { reactElement, isKW } from '../../utils';
+import { isKW, createElementAndInject } from '../../utils';
 import { CONNECT_EXPRESS_SCREENS_NAVIGATION } from '../../constants';
 import { connectExpressFeatureScreens } from '../featuresScreens';
 import CustomFooter from '../shared/Footer';
@@ -71,11 +72,13 @@ var ConnectExpress = memo(function (_a) {
                         return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
                     }) }) })) })) })));
 });
-export function ConnectExpressLib(props) {
+export function ConnectExpressElement(props) {
     return (_jsx(ReduxProvider, __assign({ store: store }, { children: _jsx(ConnectExpress, __assign({}, props)) })));
 }
 export function renderConnectExpressLib(config, elementId) {
-    var _a = reactElement(elementId), render = _a.render, unmount = _a.unmount;
-    render(_jsx(ConnectExpress, __assign({}, config)));
+    var el = createElementAndInject(elementId);
+    var root = createRoot(el);
+    root.render(_jsx(ConnectExpressElement, __assign({}, config)));
+    var unmount = function () { return root.unmount(); };
     return { unmount: unmount };
 }

package/build/features/entity/Entity.d.ts

@@ -3,7 +3,7 @@ import { LibConfig } from '../../@types';
 export interface EntityLibProps extends LibConfig {
     verifyToken?: string;
 }
-export declare function EntityLib(props: EntityLibProps): JSX.Element;
+export declare function EntityElement(props: EntityLibProps): JSX.Element;
 export declare function renderEntityLib(config: EntityLibProps, elementId: string): {
     unmount: () => void;
 };

package/build/features/entity/Entity.js

@@ -22,13 +22,14 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { memo } from 'react';
+import { createRoot } from 'react-dom/client';
 import { useAppTheme, useAppSelector, useAppConfig, useErrorListener, useStepStartedListener, useVerifyToken } from '../../hooks';
 import { settingsSelector } from '../../app/settings';
 import AnimationFlow from '../../components/AnimationFlow';
 import { store } from '../../app/store';
 import { ReduxProvider, ThemeProvider } from '../../components/Providers';
 import Collapse from '../../components/Collapse';
-import { reactElement } from '../../utils';
+import { createElementAndInject } from '../../utils';
 import { FeatureContainer } from '../shared/Containers';
 import { ENTITY_SCREENS_NAVIGATION } from '../../constants';
 import { entityFeatureScreens } from '../featuresScreens';
@@ -59,11 +60,13 @@ var Entity = memo(function (_a) {
                         return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
                     }) }) })) })) })));
 });
-export function EntityLib(props) {
+export function EntityElement(props) {
     return (_jsx(ReduxProvider, __assign({ store: store }, { children: _jsx(Entity, __assign({}, props)) })));
 }
 export function renderEntityLib(config, elementId) {
-    var _a = reactElement(elementId), render = _a.render, unmount = _a.unmount;
-    render(_jsx(EntityLib, __assign({}, config)));
+    var element = createElementAndInject(elementId);
+    var root = createRoot(element);
+    root.render(_jsx(EntityElement, __assign({}, config)));
+    var unmount = function () { return root.unmount(); };
     return { unmount: unmount };
 }

package/build/features/featuresScreens.d.ts

@@ -8,5 +8,4 @@ export declare const bankFeatureScreens: Array<FeatureScreenStep>;
 export declare const taxFeatureScreens: Array<FeatureScreenStep>;
 export declare const signInFeatureScreens: Array<FeatureScreenStep>;
 export declare const entityFeatureScreens: Array<FeatureScreenStep>;
-export declare const authFeatureScreens: Array<FeatureScreenStep>;
 export declare const brandFeatureScreens: Array<FeatureScreenStep>;

package/build/features/featuresScreens.js

@@ -73,8 +73,6 @@ import BrandSuccessPage from './brand/screens/Success';
 import BrandSuccessWithFlowPage from './brand/screens/SuccessWithFlowButtons';
 import BrandResetPasswordSuccessPage from './brand/screens/ResetPasswordSuccess';
 import BrandDataLoadingPage from './brand/screens/PrepareDataLoading';
-import AuthNIDPage from './auth/screens/NID';
-import AuthVerifyPage from './auth/screens/OTP';
 export var connectFeatureScreens = [
     {
         name: 'CONNECT_NID_STEP',
@@ -341,16 +339,6 @@ export var entityFeatureScreens = [
     },
     { name: 'ENTITY_RESET_PASSWORD_SUCCESS', element: EntityResetPasswordSuccessPage }
 ];
-export var authFeatureScreens = [
-    {
-        name: 'AUTH_NID_STEP',
-        element: AuthNIDPage
-    },
-    {
-        name: 'AUTH_VERIFY_STEP',
-        element: AuthVerifyPage
-    }
-];
 export var brandFeatureScreens = [
     {
         name: 'BRAND_VERIFY_STEP',

package/build/features/individual/Individual.d.ts

@@ -3,7 +3,7 @@ import { LibConfig } from '../../@types';
 export interface IndividualLibProps extends LibConfig {
     verifyToken?: string;
 }
-export declare function IndividualLib(props: IndividualLibProps): JSX.Element;
+export declare function IndividualElement(props: IndividualLibProps): JSX.Element;
 export declare function renderIndividualLib(config: IndividualLibProps, elementId: string): {
     unmount: () => void;
 };

package/build/features/individual/Individual.js

@@ -22,13 +22,14 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { memo } from 'react';
+import { createRoot } from 'react-dom/client';
 import { useAppTheme, useAppSelector, useAppConfig, useErrorListener, useStepStartedListener, useVerifyToken } from '../../hooks';
 import { settingsSelector } from '../../app/settings';
 import AnimationFlow from '../../components/AnimationFlow';
 import { store } from '../../app/store';
 import { ReduxProvider, ThemeProvider } from '../../components/Providers';
 import Collapse from '../../components/Collapse';
-import { reactElement } from '../../utils';
+import { createElementAndInject } from '../../utils';
 import { FeatureContainer } from '../shared/Containers';
 import { INDIVIDUAL_SCREENS_NAVIGATION } from '../../constants';
 import { individualFeatureScreens } from '../featuresScreens';
@@ -59,11 +60,13 @@ var Individual = memo(function (_a) {
                         return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
                     }) }) })) })) })));
 });
-export function IndividualLib(props) {
+export function IndividualElement(props) {
     return (_jsx(ReduxProvider, __assign({ store: store }, { children: _jsx(Individual, __assign({}, props)) })));
 }
 export function renderIndividualLib(config, elementId) {
-    var _a = reactElement(elementId), render = _a.render, unmount = _a.unmount;
-    render(_jsx(IndividualLib, __assign({}, config)));
+    var element = createElementAndInject(elementId);
+    var root = createRoot(element);
+    root.render(_jsx(IndividualElement, __assign({}, config)));
+    var unmount = function () { return root.unmount(); };
     return { unmount: unmount };
 }

package/build/features/password/Password.d.ts

@@ -3,7 +3,7 @@ import { LibConfig } from '../../@types';
 export interface PasswordLibProps extends LibConfig {
     verifyToken?: string;
 }
-export declare function PasswordLib(props: PasswordLibProps): JSX.Element;
+export declare function PasswordElement(props: PasswordLibProps): JSX.Element;
 export declare function renderPasswordLib(config: PasswordLibProps, elementId: string): {
     unmount: () => void;
 };

package/build/features/password/Password.js

@@ -11,6 +11,7 @@ var __assign = (this && this.__assign) || function () {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { memo, useEffect } from 'react';
+import { createRoot } from 'react-dom/client';
 import { useAppTheme, useAppDispatch, useAppSelector, useAppConfig, useErrorListener, useStepStartedListener } from '../../hooks';
 import { handleLanguage, settingsSelector } from '../../app/settings';
 import AnimationFlow from '../../components/AnimationFlow';
@@ -18,7 +19,7 @@ import { store } from '../../app/store';
 import { ReduxProvider, ThemeProvider } from '../../components/Providers';
 import Collapse from '../../components/Collapse';
 import { FeatureContainer } from '../shared/Containers';
-import { getParameterByName, reactElement } from '../../utils';
+import { getParameterByName, createElementAndInject } from '../../utils';
 import { PASSWORD_OPERATION_TYPE, PASSWORD_SCREENS_NAVIGATION } from '../../constants';
 import { passwordFeatureScreens } from '../featuresScreens';
 import { passwordSelector, verifyLeadToken, verifyOperationToken } from '../app/password/passwordStore';
@@ -59,11 +60,13 @@ var Password = memo(function (props) {
                         return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
                     }) }) })) })) })));
 });
-export function PasswordLib(props) {
+export function PasswordElement(props) {
     return (_jsx(ReduxProvider, __assign({ store: store }, { children: _jsx(Password, __assign({}, props)) })));
 }
 export function renderPasswordLib(config, elementId) {
-    var _a = reactElement(elementId), render = _a.render, unmount = _a.unmount;
-    render(_jsx(PasswordLib, __assign({}, config)));
+    var el = createElementAndInject(elementId);
+    var root = createRoot(el);
+    root.render(_jsx(PasswordElement, __assign({}, config)));
+    var unmount = function () { return root.unmount(); };
     return { unmount: unmount };
 }

package/build/features/shared/Button/FlowsButtons.js

@@ -160,7 +160,7 @@ export default function FlowsButtons(_a) {
             return;
         }
         if (typeof settingsData.appConfig.onFlowButtonClick === 'function') {
-            settingsData.appConfig.onFlowButtonClick(item);
+            settingsData.appConfig.onFlowButtonClick({ name: item.name, token: item.token });
             return;
         }
         dispatch(handleOpen(false));

package/build/features/signIn/SignIn.d.ts

@@ -2,7 +2,7 @@
 import { LibConfig } from '../../@types';
 export interface SignInLibProps extends LibConfig {
 }
-export declare function SignInLib(props: SignInLibProps): JSX.Element;
+export declare function SignInElement(props: SignInLibProps): JSX.Element;
 export declare function renderSignInLib(config: SignInLibProps, elementId: string): {
     unmount: () => void;
 };