@tap-payments/auth-jsconnect 1.0.89 → 1.0.90-test

package/build/features/tax/screens/Verify/OTPInput.js

@@ -13,10 +13,10 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import Box from '@mui/material/Box/Box';
 import { styled } from '@mui/material/styles';
-import OTPField from '../../../shared/OTP';
+import OTPField from '@features/shared/OTP';
 import { useController, useFormContext } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
-import { DEFAULT_TIMER_VALUE } from '../../../../constants';
+import { DEFAULT_TIMER_VALUE } from '@constants';
 var BoxStyled = styled(Box)(function (_a) {
     var theme = _a.theme;
     return ({

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

@@ -11,20 +11,20 @@ var __assign = (this && this.__assign) || function () {
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
-import { useAppDispatch } from '../../../../hooks';
+import { useAppDispatch } from '@hooks';
 import { useTranslation } from 'react-i18next';
 import { useForm, FormProvider } from 'react-hook-form';
 import { yupResolver } from '@hookform/resolvers/yup';
 import Box from '@mui/material/Box/Box';
 import { styled } from '@mui/material/styles';
-import { handlePrevScreenStep } from '../../../../app/settings';
-import { useLanguage, useAppSelector } from '../../../../hooks';
-import { maskPhone } from '../../../../utils';
-import Form from '../../../../components/Form';
-import Text from '../../../../components/Text';
-import { ScreenContainer } from '../../../shared/Containers';
-import { taxSelector, clearError, resetOTPScreen, verifyTaxLeadOTP } from '../../../app/tax/taxStore';
-import Button from '../../../shared/Button';
+import { handlePrevScreenStep } from '@app/settings';
+import { useLanguage, useAppSelector } from '@hooks';
+import { maskPhone } from '@utils';
+import Form from '@components/Form';
+import Text from '@components/Text';
+import { ScreenContainer } from '@features/shared/Containers';
+import { taxSelector, clearError, resetOTPScreen, verifyTaxLeadOTP } from '@features/app/tax/taxStore';
+import Button from '@features/shared/Button';
 import { OTPValidation } from './validation';
 import OTPInput from './OTPInput';
 var OTPTitleContainerStyled = styled(Box)(function (_a) {

package/build/hooks/useAppConfig.d.ts

@@ -1,4 +1,4 @@
-import { LibConfig, ScreenStepNavigation } from '../@types';
+import { LibConfig, ScreenStepNavigation } from '@types';
 interface AppConfigProps extends LibConfig {
     navigation: ScreenStepNavigation[];
 }

package/build/hooks/useAppConfig.js

@@ -57,11 +57,12 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import { useEffect, useState } from 'react';
-import { handleActiveFlowScreens, settingsSelector, getClientIp, getLocale, getBrowserFingerPrint, getOperator, handleSetAppConfig, handleLanguage, handleOpen, handleIsTapOrigin } from '../app/settings';
+import { handleActiveFlowScreens, settingsSelector, getClientIp, getLocale, getBrowserFingerPrint, getOperator, handleSetAppConfig, handleLanguage, handleOpen, handleIsTapOrigin } from '@app/settings';
 import { useAppDispatch } from './useAppDispatch';
 import { useAppSelector } from './useAppSelector';
-import { setAxiosGlobalHeaders } from '../api';
-import { getRequestHeaders, encryptString, isTapDomain } from '../utils';
+import { setAxiosGlobalHeaders, axiosInstance } from '@api';
+import { getRequestHeaders, encryptString, isTapDomain } from '@utils';
+import { ENDPOINT_PATHS } from '@constants';
 export var useAppConfig = function (_a) {
     var appInfo = _a.appInfo, navigation = _a.navigation, publicKey = _a.publicKey, rest = __rest(_a, ["appInfo", "navigation", "publicKey"]);
     var _b = useState(true), loading = _b[0], setLoading = _b[1];
@@ -69,12 +70,21 @@ export var useAppConfig = function (_a) {
     var _c = useAppSelector(settingsSelector), data = _c.data, error = _c.error;
     var deviceInfo = data.deviceInfo, language = data.language, appConfig = data.appConfig;
     var device = deviceInfo.device, browser = deviceInfo.browser, connection = deviceInfo.connection;
+    var setBaseUrl = function () {
+        var isProd = publicKey.includes('pk_live');
+        if (isProd) {
+            axiosInstance.defaults.baseURL = ENDPOINT_PATHS.PRODUCTION_BASE_URL;
+            return;
+        }
+        axiosInstance.defaults.baseURL = ENDPOINT_PATHS.DEV_BASE_URL;
+    };
     var addAxiosHeader = function () {
         setAxiosGlobalHeaders(__assign(__assign({}, getRequestHeaders(deviceInfo)), { authorization: encryptString(publicKey), mdn: encryptString(window.location.origin) }));
     };
     var handleAppConfig = function () { return __awaiter(void 0, void 0, void 0, function () {
         return __generator(this, function (_a) {
             dispatch(handleSetAppConfig(__assign({ appInfo: appInfo, publicKey: publicKey }, rest)));
+            setBaseUrl();
             dispatch(handleActiveFlowScreens(navigation));
             return [2];
         });

package/build/hooks/useAppSelector.d.ts

@@ -1,3 +1,3 @@
 import { TypedUseSelectorHook } from 'react-redux';
-import { RootState } from '../app/store';
+import { RootState } from '@app/store';
 export declare const useAppSelector: TypedUseSelectorHook<RootState>;

package/build/hooks/useAppTheme.d.ts

@@ -1,4 +1,4 @@
-import { ThemContext } from '../@types';
+import { ThemContext } from '@types';
 export declare const useAppTheme: () => {
     theme: ThemContext | undefined;
 };

package/build/hooks/useAppTheme.js

@@ -1,8 +1,8 @@
 import { useEffect, useState } from 'react';
-import { LanguageMode, DirectionMode } from '../@types';
-import { settingsSelector } from '../app/settings';
+import { LanguageMode, DirectionMode } from '@types';
+import { settingsSelector } from '@app/settings';
 import { useAppSelector } from './useAppSelector';
-import { appTheme } from '../theme';
+import { appTheme } from '@theme';
 export var useAppTheme = function () {
     var _a = useState(), theme = _a[0], setTheme = _a[1];
     var data = useAppSelector(settingsSelector).data;

package/build/hooks/useErrorListener.js

@@ -1,7 +1,7 @@
 import { useEffect } from 'react';
-import { settingsSelector } from '../app/settings';
+import { settingsSelector } from '@app/settings';
 import { useAppSelector } from './useAppSelector';
-import { connectSelector } from '../features/app/connect/connectStore';
+import { connectSelector } from '@features/app/connect/connectStore';
 export var useErrorListener = function () {
     var settings = useAppSelector(settingsSelector);
     var connect = useAppSelector(connectSelector);

package/build/hooks/useLanguage.js

@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next';
-import { LanguageMode } from '../@types';
+import { LanguageMode } from '@types';
 export function useLanguage() {
     var i18n = useTranslation().i18n;
     var isAr = i18n.language === LanguageMode.AR;

package/build/hooks/useRedirectionListener.js

@@ -1,4 +1,4 @@
-import { decodeObjectBase64, getParameterByName } from '../utils';
+import { decodeObjectBase64, getParameterByName } from '@utils';
 export var useRedirectionData = function (dataKey) {
     if (dataKey === void 0) { dataKey = 'data'; }
     var dataToken = getParameterByName(dataKey);

package/build/i18n.js

@@ -2,7 +2,7 @@ import i18n from 'i18next';
 import { initReactI18next } from 'react-i18next';
 import Backend from 'i18next-http-backend';
 import LanguageDetector from 'i18next-browser-languagedetector';
-import { LOCAL_STORAGE_KEYS } from './constants';
+import { LOCAL_STORAGE_KEYS } from '@constants';
 import translationEN from './assets/locales/en.json';
 import translationAR from './assets/locales/ar.json';
 var resources = {

package/build/index.d.ts

@@ -1,11 +1,11 @@
 import './index.css';
 import './i18n';
-import { ConnectLib, renderConnectLib, ConnectLibProps, unmountConnectLib } from './features/connect';
-import { BusinessLib, renderBusinessLib, BusinessLibProps, unmountBusinessLib } from './features/business';
-import { PasswordLib, renderPasswordLib, PasswordLibProps, unmountPasswordLib } from './features/password';
-import { IndividualLib, renderIndividualLib, IndividualLibProps, unmountIndividualLib } from './features/individual';
-import { BankLib, renderBankLib, BankLibProps, unmountBankLib } from './features/bank';
-import { TaxLib, renderTaxLib, TaxLibProps, unmountTaxLib } from './features/tax';
-import { LandingLib, LandingProps, renderLandingLib, unmountLandingLib } from './features/Landing';
+import { ConnectLib, renderConnectLib, ConnectLibProps, unmountConnectLib } from '@features/connect';
+import { BusinessLib, renderBusinessLib, BusinessLibProps, unmountBusinessLib } from '@features/business';
+import { PasswordLib, renderPasswordLib, PasswordLibProps, unmountPasswordLib } from '@features/password';
+import { IndividualLib, renderIndividualLib, IndividualLibProps, unmountIndividualLib } from '@features/individual';
+import { BankLib, renderBankLib, BankLibProps, unmountBankLib } from '@features/bank';
+import { TaxLib, renderTaxLib, TaxLibProps, unmountTaxLib } from '@features/tax';
+import { LandingLib, LandingProps, renderLandingLib, unmountLandingLib } from '@features/Landing';
 export type { ConnectLibProps, BusinessLibProps, PasswordLibProps, IndividualLibProps, BankLibProps, TaxLibProps, LandingProps };
 export { ConnectLib, renderConnectLib, unmountConnectLib, BusinessLib, renderBusinessLib, unmountBusinessLib, PasswordLib, renderPasswordLib, unmountPasswordLib, IndividualLib, renderIndividualLib, unmountIndividualLib, BankLib, renderBankLib, unmountBankLib, TaxLib, renderTaxLib, unmountTaxLib, LandingLib, renderLandingLib, unmountLandingLib };

package/build/index.js

@@ -1,12 +1,12 @@
 import './index.css';
 import './i18n';
-import { ConnectLib, renderConnectLib, unmountConnectLib } from './features/connect';
-import { BusinessLib, renderBusinessLib, unmountBusinessLib } from './features/business';
-import { PasswordLib, renderPasswordLib, unmountPasswordLib } from './features/password';
-import { IndividualLib, renderIndividualLib, unmountIndividualLib } from './features/individual';
-import { BankLib, renderBankLib, unmountBankLib } from './features/bank';
-import { TaxLib, renderTaxLib, unmountTaxLib } from './features/tax';
-import { LandingLib, renderLandingLib, unmountLandingLib } from './features/Landing';
+import { ConnectLib, renderConnectLib, unmountConnectLib } from '@features/connect';
+import { BusinessLib, renderBusinessLib, unmountBusinessLib } from '@features/business';
+import { PasswordLib, renderPasswordLib, unmountPasswordLib } from '@features/password';
+import { IndividualLib, renderIndividualLib, unmountIndividualLib } from '@features/individual';
+import { BankLib, renderBankLib, unmountBankLib } from '@features/bank';
+import { TaxLib, renderTaxLib, unmountTaxLib } from '@features/tax';
+import { LandingLib, renderLandingLib, unmountLandingLib } from '@features/Landing';
 export { ConnectLib, renderConnectLib, unmountConnectLib, BusinessLib, renderBusinessLib, unmountBusinessLib, PasswordLib, renderPasswordLib, unmountPasswordLib, IndividualLib, renderIndividualLib, unmountIndividualLib, BankLib, renderBankLib, unmountBankLib, TaxLib, renderTaxLib, unmountTaxLib, LandingLib, renderLandingLib, unmountLandingLib };
 window['TapAuth'] = {
     renderConnectLib: renderConnectLib,

package/build/theme/theme.d.ts

@@ -1,2 +1,2 @@
-import { DirectionMode, ThemeMode } from '../@types';
+import { DirectionMode, ThemeMode } from '@types';
 export declare const appTheme: (mode: ThemeMode, dir: DirectionMode) => import("@mui/material/styles").Theme;

package/build/theme/theme.js

@@ -3,11 +3,21 @@ import { typography } from './typography';
 import { darkPalette, lightPalette } from './palette';
 import { components } from './components';
 import { shadows } from './shadows';
+import { isMobile } from 'react-device-detect';
 export var appTheme = function (mode, dir) {
     return createTheme({
         palette: mode === 'dark' ? darkPalette : lightPalette,
         direction: dir,
         typography: typography,
+        breakpoints: {
+            values: {
+                xs: 0,
+                sm: isMobile ? 1536 : 600,
+                md: 900,
+                lg: 1200,
+                xl: 1536
+            }
+        },
         components: components,
         shape: {
             borderRadius: 5

package/build/utils/locale.d.ts

@@ -1,2 +1,2 @@
-import { LocalProps } from '../@types';
+import { LocalProps } from '@types';
 export declare const updateLocale: (locale: LocalProps, country: string) => void;

package/build/utils/locale.js

@@ -1,7 +1,7 @@
 import { initReactI18next } from 'react-i18next';
-import i18n from '../i18n';
+import i18n from '@src/i18n';
 export var updateLocale = function (locale, country) {
-    var data = locale[country] || locale['default'];
+    var data = locale[country.toUpperCase()] || locale['default'];
     if (i18n.isInitialized) {
         i18n.removeResourceBundle('*', 'translation');
         i18n.addResourceBundle('en', 'translation', data.en.translation);
@@ -9,7 +9,7 @@ export var updateLocale = function (locale, country) {
     }
     else {
         i18n.use(initReactI18next).init({
-            resources: locale,
+            resources: data,
             fallbackLng: 'en',
             initImmediate: false,
             preload: ['ar', 'en'],

package/build/utils/rsa.js

@@ -1,5 +1,5 @@
 import { JSEncrypt } from 'jsencrypt';
-import { RSA_FRONTEND_MW_PUBLIC_KEY } from '../constants';
+import { RSA_FRONTEND_MW_PUBLIC_KEY } from '@constants';
 var rsa = new JSEncrypt();
 rsa.setPublicKey(RSA_FRONTEND_MW_PUBLIC_KEY);
 export var encryptObject = function (data) {

package/build/utils/string.d.ts

@@ -1,4 +1,4 @@
-import { DeviceInfo } from '../@types';
+import { DeviceInfo } from '@types';
 export declare const maskPhone: (str?: string) => string;
 export declare const maskID: (str: string) => string;
 export declare const showLastFour: (str: string) => string;
@@ -10,7 +10,7 @@ export declare const getIndividualName: (name: string) => {
 export declare const convertNumbers2English: (str: string) => string;
 export declare const getParameterByName: (name: string) => string | null;
 export declare const getClientEmailUrl: () => string;
-export declare const getFlowUrl: (path: string) => string;
+export declare const getFlowUrl: (path: string, lang: string) => string;
 export declare const capitalizeTheFirstLetterOfEachWord: (words: string) => string;
 export declare const getRequestHeaders: (deviceInfo: DeviceInfo) => {
     al: string;
@@ -36,3 +36,4 @@ export declare const getRequestHeaders: (deviceInfo: DeviceInfo) => {
     l: string;
 };
 export declare const removeRequestHeaders: () => void;
+export declare const getBaseUrl: () => string;

package/build/utils/string.js

@@ -1,5 +1,6 @@
-import { encryptString } from '.';
-import { removeAxiosGlobalHeaders } from '../api';
+import { encryptString } from '@utils';
+import { removeAxiosGlobalHeaders } from '@api';
+import { ENDPOINT_PATHS } from '@constants';
 export var maskPhone = function (str) {
     if (str === void 0) { str = ''; }
     var lastTwo = str.substring(str.length - 2, str.length);
@@ -56,9 +57,9 @@ export var getClientEmailUrl = function () {
     var origin = window.location.origin;
     return origin + '/?token=';
 };
-export var getFlowUrl = function (path) {
+export var getFlowUrl = function (path, lang) {
     var origin = window.location.origin;
-    return origin + path + '?token=';
+    return origin + path + "?lang=".concat(lang, "&token=");
 };
 export var capitalizeTheFirstLetterOfEachWord = function (words) {
     var separateWord = words.toLowerCase().split(' ');
@@ -120,3 +121,16 @@ export var removeRequestHeaders = function () {
         'authorization'
     ]);
 };
+export var getBaseUrl = function () {
+    var origin = window.location.origin;
+    if (origin.includes('localhost')) {
+        return ENDPOINT_PATHS.DEV_BASE_URL;
+    }
+    if (origin.includes('dev')) {
+        return ENDPOINT_PATHS.DEV_BASE_URL;
+    }
+    if (origin.includes('sandbox')) {
+        return ENDPOINT_PATHS.SANDBOX_BASE_URL;
+    }
+    return ENDPOINT_PATHS.PRODUCTION_BASE_URL;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@tap-payments/auth-jsconnect",
-	"version": "1.0.89",
+	"version": "1.0.90-test",
 	"description": "connect library, auth",
 	"private": false,
 	"main": "build/index.js",
@@ -17,10 +17,10 @@
 		"lint": "eslint src --color --ext .js,.jsx,.ts,.tsx,.json",
 		"lint:fix": "eslint src --ext .js,.jsx,.ts,.tsx --fix",
 		"start": "cross-env NODE_ENV=development webpack serve",
-		"build": "cross-env NODE_ENV=production webpack",
+		"build": "rm -rf build && cross-env NODE_ENV=production webpack",
 		"copy:files": "copyfiles -u 1 src/**/*.css build/",
 		"tsc:alias": "tsc-alias -p tsconfig.json",
-		"ts:build": "tsc -p tsconfig.json && tsc-alias -p tsconfig.json && yarn copy:files",
+		"ts:build": "rm -rf build && tsc -p tsconfig.json && tsc-alias -p tsconfig.json && yarn copy:files",
 		"push": "npm publish --access public"
 	},
 	"keywords": [],
@@ -92,6 +92,7 @@
 		"moment-hijri": "~2.1.2",
 		"react": "^18.2.0",
 		"react-calendar": "~3.7.0",
+		"react-device-detect": "^2.2.2",
 		"react-dom": "^18.2.0",
 		"react-hook-form": "^7.33.1",
 		"react-i18next": "^11.18.1",

package/build/components/DatePicker/customStyle.css

@@ -1,86 +0,0 @@
-.date_picker_input {
-	cursor: pointer;
-}
-
-.react-calendar {
-	width: 100%;
-	border: none;
-	padding: 15px 0px 15px 0px;
-}
-
-.react-calendar__navigation {
-	display: flex;
-	position: relative;
-}
-.react-calendar__navigation__label__labelText {
-	font-family: 'Lato', 'Roboto';
-}
-.react-calendar__navigation button:enabled:hover,
-.react-calendar__navigation button:enabled:focus {
-	background-color: #ffffff;
-}
-.react-calendar__navigation__prev-button {
-	top: 20px;
-	left: 86px;
-}
-
-.react-calendar__navigation__next-button {
-	top: 0px;
-	left: 86px;
-}
-
-.react-calendar__navigation__prev2-button {
-	top: 20px;
-	right: 13px;
-}
-
-.react-calendar__navigation__next2-button {
-	top: 0px;
-	right: 13px;
-}
-
-.react-calendar__navigation__arrow {
-	background-color: transparent !important;
-}
-
-abbr[title] {
-	text-decoration: none;
-	font-weight: 400;
-	color: #abaeb6;
-}
-
-.react-calendar__tile {
-	transition: all 0.5s ease;
-}
-
-.react-calendar__tile:enabled:hover,
-.react-calendar__tile:enabled:focus {
-	background-color: transparent;
-}
-
-.react-calendar__tile:enabled:hover {
-	background: radial-gradient(circle closest-side, #fafafa 0%, #fafafa 98%, rgba(0, 0, 0, 0) 100%);
-}
-
-.react-calendar__month-view__days__day--weekend,
-.react-calendar__tile {
-	color: #3a4154;
-}
-.react-calendar__tile--hasActive {
-	background: radial-gradient(circle closest-side, #fafafa 0%, #fafafa 98%, rgba(0, 0, 0, 0) 100%);
-}
-
-.react-calendar__tile--active,
-.react-calendar__tile--active:enabled:hover,
-.react-calendar__tile--active:enabled:focus {
-	background-color: transparent;
-	background: radial-gradient(circle closest-side, #3a4154 0%, #3a4154 98%, rgba(0, 0, 0, 0) 100%);
-	color: #ffffff;
-}
-.react-calendar__tile--now {
-	background-color: transparent;
-}
-.react-calendar__navigation button:disabled {
-	background-color: #ffffff;
-	color: #3a4154;
-}

package/build/index.css

@@ -1,135 +0,0 @@
-@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
-@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap');
-@import url('https://fonts.googleapis.com/icon?family=Material+Icons');
-@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap');
-@import url('https://fonts.googleapis.com/css?family=Tajawal&display=swap');
-
-/* http://meyerweb.com/eric/tools/css/reset/ 
-   v2.0 | 20110126
-   License: none (public domain)
-*/
-
-html,
-body,
-div,
-span,
-applet,
-object,
-iframe,
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p,
-blockquote,
-pre,
-a,
-abbr,
-acronym,
-address,
-big,
-cite,
-code,
-del,
-dfn,
-em,
-img,
-ins,
-kbd,
-q,
-s,
-samp,
-small,
-strike,
-strong,
-sub,
-sup,
-tt,
-var,
-b,
-u,
-i,
-center,
-dl,
-dt,
-dd,
-ol,
-ul,
-li,
-fieldset,
-form,
-label,
-legend,
-table,
-caption,
-tbody,
-tfoot,
-thead,
-tr,
-th,
-td,
-article,
-aside,
-canvas,
-details,
-embed,
-figure,
-figcaption,
-footer,
-header,
-hgroup,
-menu,
-nav,
-output,
-ruby,
-section,
-summary,
-time,
-mark,
-audio,
-video {
-	margin: 0;
-	padding: 0;
-	border: 0;
-	font-size: 100%;
-	font: inherit;
-	vertical-align: baseline;
-}
-/* HTML5 display-role reset for older browsers */
-article,
-aside,
-details,
-figcaption,
-figure,
-footer,
-header,
-hgroup,
-menu,
-nav,
-section {
-	display: block;
-}
-body {
-	line-height: 1;
-}
-ol,
-ul {
-	list-style: none;
-}
-blockquote,
-q {
-	quotes: none;
-}
-blockquote:before,
-blockquote:after,
-q:before,
-q:after {
-	content: '';
-	content: none;
-}
-table {
-	border-collapse: collapse;
-	border-spacing: 0;
-}