@tap-payments/auth-jsconnect 2.0.36-test → 2.0.38-test

package/build/components/AnimationFlow/AnimationFlow.d.ts

@@ -9,5 +9,6 @@ export interface AnimationFlowProps {
     loading?: boolean;
     error?: string | null;
     screenId?: string;
+    animationType?: 'slide' | 'fade' | 'collapse';
 }
-export default function AnimationFlow({ open, children, breakpoint, type, footer, loading, error, isTapOrigin, screenId }: AnimationFlowProps): JSX.Element;
+export default function AnimationFlow({ open, children, breakpoint, type, footer, loading, error, isTapOrigin, screenId, animationType }: AnimationFlowProps): JSX.Element;

package/build/components/AnimationFlow/AnimationFlow.js

@@ -17,7 +17,7 @@ import BottomSheet from './BottomSheet';
 import Loader from './Loader';
 import Error from './Error';
 export default function AnimationFlow(_a) {
-    var open = _a.open, children = _a.children, breakpoint = _a.breakpoint, type = _a.type, footer = _a.footer, loading = _a.loading, error = _a.error, isTapOrigin = _a.isTapOrigin, screenId = _a.screenId;
+    var open = _a.open, children = _a.children, breakpoint = _a.breakpoint, type = _a.type, footer = _a.footer, loading = _a.loading, error = _a.error, isTapOrigin = _a.isTapOrigin, screenId = _a.screenId, animationType = _a.animationType;
     var theme = useTheme();
     var matches = useMediaQuery(theme.breakpoints.down(breakpoint || 'sm'));
     if (loading) {
@@ -27,10 +27,10 @@ export default function AnimationFlow(_a) {
         return _jsx(Error, { error: error });
     }
     if (type === 'PUPOP') {
-        return (_jsx(Dialog, __assign({ footer: footer, open: open, isTapOrigin: isTapOrigin }, { children: children })));
+        return (_jsx(Dialog, __assign({ footer: footer, open: open, isTapOrigin: isTapOrigin, animationType: animationType }, { children: children })));
     }
     if (type === 'BOTTOMSHEET') {
         return _jsx(BottomSheet, __assign({ open: open }, { children: children }));
     }
-    return matches ? (_jsx(BottomSheet, __assign({ open: open, screenId: screenId }, { children: children }))) : (_jsx(Dialog, __assign({ open: open, footer: footer, isTapOrigin: isTapOrigin }, { children: children })));
+    return matches ? (_jsx(BottomSheet, __assign({ open: open, screenId: screenId }, { children: children }))) : (_jsx(Dialog, __assign({ open: open, footer: footer, isTapOrigin: isTapOrigin, animationType: animationType }, { children: children })));
 }

package/build/components/AnimationFlow/Dialog.d.ts

@@ -6,6 +6,7 @@ export interface DialogProps extends MUIDialogProps {
     children: React.ReactNode;
     footer?: React.ReactNode;
     transitionDuration?: number;
+    animationType?: 'slide' | 'fade' | 'collapse';
 }
-declare const _default: React.MemoExoticComponent<({ open, children, footer, transitionDuration, isTapOrigin, ...rest }: DialogProps) => JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ open, children, footer, transitionDuration, isTapOrigin, animationType, ...rest }: DialogProps) => JSX.Element>;
 export default _default;

package/build/components/AnimationFlow/Dialog.js

@@ -92,14 +92,18 @@ var LogoIconStyled = styled(Icon)(function (_a) {
     });
 });
 var Dialog = function (_a) {
-    var open = _a.open, children = _a.children, footer = _a.footer, transitionDuration = _a.transitionDuration, isTapOrigin = _a.isTapOrigin, rest = __rest(_a, ["open", "children", "footer", "transitionDuration", "isTapOrigin"]);
+    var open = _a.open, children = _a.children, footer = _a.footer, transitionDuration = _a.transitionDuration, isTapOrigin = _a.isTapOrigin, _b = _a.animationType, animationType = _b === void 0 ? 'slide' : _b, rest = __rest(_a, ["open", "children", "footer", "transitionDuration", "isTapOrigin", "animationType"]);
     var isAr = useLanguage().isAr;
+    var animation = {};
+    if (animationType === 'slide') {
+        Object.assign(animation, { TransitionComponent: Transition });
+    }
     return (_jsxs(MuiDialog, __assign({ PaperProps: {
             elevation: 0
         }, sx: {
             '& .MuiDialog-paper': {
                 overflowY: 'visible'
             }
-        }, hideBackdrop: true, PaperComponent: PaperStyled, open: open, TransitionComponent: Transition, transitionDuration: transitionDuration || 500, keepMounted: true, "aria-describedby": 'dialog-slide-description' }, rest, { children: [_jsxs(DialogContentStyled, { children: [_jsxs(Collapse, __assign({ in: !isTapOrigin }, { children: [_jsx(LogoBadge, { src: ICONS_NAMES.LOGO_ICON }), _jsx(LogoIconBoxStyled, { children: _jsx(LogoIconStyled, { src: isAr ? ICONS_NAMES.TAP_AR : ICONS_NAMES.TAP_EN, alt: 'tap logo' }) })] })), children] }), footer] })));
+        }, hideBackdrop: true, PaperComponent: PaperStyled, open: open, transitionDuration: transitionDuration || 500, keepMounted: true, "aria-describedby": 'dialog-slide-description' }, rest, animation, { children: [_jsxs(DialogContentStyled, { children: [_jsxs(Collapse, __assign({ in: !isTapOrigin }, { children: [_jsx(LogoBadge, { src: ICONS_NAMES.LOGO_ICON }), _jsx(LogoIconBoxStyled, { children: _jsx(LogoIconStyled, { src: isAr ? ICONS_NAMES.TAP_AR : ICONS_NAMES.TAP_EN, alt: 'tap logo' }) })] })), children] }), footer] })));
 };
 export default React.memo(Dialog);

package/build/features/app/auth/authStore.js

@@ -36,7 +36,6 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
 };
 var _a;
 import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
-import { handleOpen } from '../../../app/settings';
 export var verifyAuth = createAsyncThunk('verifyAuthOTP', function (params, thunkApi) { return __awaiter(void 0, void 0, void 0, function () {
     var settings;
     var _a, _b, _c, _d;
@@ -53,7 +52,6 @@ export var verifyAuth = createAsyncThunk('verifyAuthOTP', function (params, thun
                 _e.sent();
                 (_b = (_a = settings.data.appConfig).onStepCompleted) === null || _b === void 0 ? void 0 : _b.call(_a, settings.data.activeScreen.name, params);
                 (_d = (_c = settings.data.appConfig).onFlowCompleted) === null || _d === void 0 ? void 0 : _d.call(_c, { id: '' });
-                thunkApi.dispatch(handleOpen(false));
                 return [2, { formData: params }];
         }
     });

package/build/features/auth/Auth.js

@@ -9,7 +9,7 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import { memo, useEffect } from 'react';
 import { FeatureContainer } from '../shared/Containers';
 import { useAppTheme, useAppSelector, useAppConfig, useErrorListener, useStepStartedListener } from '../../hooks';
@@ -23,7 +23,6 @@ import { reactElement } from '../../utils';
 import { AUTH_SCREENS_NAVIGATION } from '../../constants';
 import { authFeatureScreens } from '../featuresScreens';
 import Background from '../shared/Background';
-import CustomFooter from '../shared/Footer';
 var Auth = memo(function (props) {
     var theme = useAppTheme().theme;
     var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, settingLoading = _a.loading;
@@ -36,7 +35,7 @@ var Auth = memo(function (props) {
         if (!props.leadId)
             throw new Error('leadId is required');
     }, []);
-    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading }, { children: _jsx(AnimationFlow, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading, error: error, open: open, footer: _jsx(CustomFooter, {}), screenId: activeScreen.name }, { children: _jsx(FeatureContainer, { children: authFeatureScreens.map(function (_a, index) {
+    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading, sx: { position: 'absolute' } }, { children: _jsx(AnimationFlow, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading, error: error, open: open, footer: _jsx(_Fragment, {}), screenId: activeScreen.name, animationType: 'collapse' }, { children: _jsx(FeatureContainer, { children: authFeatureScreens.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));

package/build/features/shared/Background/Background.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { SxProps, Theme } from '@mui/material/styles';
 declare type TapOrigin = {
     isTapOrigin: boolean;
 };
@@ -6,6 +7,7 @@ interface BackgroundProps extends TapOrigin {
     children: React.ReactNode;
     loading?: boolean;
     hideLogo?: boolean;
+    sx?: SxProps<Theme>;
 }
-declare const _default: React.MemoExoticComponent<({ children, isTapOrigin, loading, hideLogo }: BackgroundProps) => JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ children, isTapOrigin, loading, hideLogo, sx }: BackgroundProps) => JSX.Element>;
 export default _default;

package/build/features/shared/Background/Background.js

@@ -23,8 +23,8 @@ var BackgroundStyled = styled(Box, { shouldForwardProp: function (prop) { return
     });
 });
 var Background = function (_a) {
-    var children = _a.children, isTapOrigin = _a.isTapOrigin, loading = _a.loading, hideLogo = _a.hideLogo;
+    var children = _a.children, isTapOrigin = _a.isTapOrigin, loading = _a.loading, hideLogo = _a.hideLogo, sx = _a.sx;
     var showLogo = !loading && isTapOrigin;
-    return (_jsxs(BackgroundStyled, __assign({ id: 'background', isTapOrigin: isTapOrigin }, { children: [showLogo && !hideLogo && _jsx(LogoBackground, {}), children] })));
+    return (_jsxs(BackgroundStyled, __assign({ id: 'background', isTapOrigin: isTapOrigin, sx: sx }, { children: [showLogo && !hideLogo && _jsx(LogoBackground, {}), children] })));
 };
 export default memo(Background);

package/package.json

@@ -1,128 +1,128 @@
-{
-	"name": "@tap-payments/auth-jsconnect",
-	"version": "2.0.36-test",
-	"description": "connect library, auth",
-	"private": false,
-	"main": "build/index.js",
-	"module": "build/index.js",
-	"types": "build/index.d.ts",
-	"files": [
-		"build",
-		"README.md"
-	],
-	"scripts": {
-		"husky:setup": "npx husky install",
-		"prettier": "prettier --list-different \"src/**/*.{md,mdx,ts,js,tsx,jsx,json}\" *.json *.js",
-		"prettier:fix": "prettier --write \"src/**/*.{ts,tsx,js,jsx,json,md,css,json}\"  *.json *.js",
-		"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": "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": "rm -rf build && tsc -p tsconfig.json && tsc-alias -p tsconfig.json && yarn copy:files",
-		"push": "npm publish --access public"
-	},
-	"keywords": [],
-	"author": {
-		"name": "Ahmed Elsharkawy",
-		"email": "a.elsharkawy@tap.company"
-	},
-	"license": "ISC",
-	"devDependencies": {
-		"@babel/core": "^7.18.6",
-		"@babel/preset-env": "^7.18.6",
-		"@babel/preset-react": "^7.18.6",
-		"@babel/preset-typescript": "^7.18.6",
-		"@types/lodash-es": "^4.17.6",
-		"@types/moment-hijri": "^2.1.0",
-		"@types/react": "^18.0.15",
-		"@types/react-calendar": "~3.5.1",
-		"@types/react-dom": "^18.0.6",
-		"@typescript-eslint/eslint-plugin": "^5.30.5",
-		"@typescript-eslint/parser": "^5.30.5",
-		"babel-loader": "^8.2.5",
-		"copyfiles": "^2.4.1",
-		"cross-env": "^7.0.3",
-		"css-loader": "^6.7.1",
-		"css-minimizer-webpack-plugin": "^4.0.0",
-		"eslint": "^8.19.0",
-		"eslint-config-airbnb": "^19.0.4",
-		"eslint-config-prettier": "^8.5.0",
-		"eslint-plugin-import": "^2.26.0",
-		"eslint-plugin-jsx-a11y": "^6.6.0",
-		"eslint-plugin-node": "^11.1.0",
-		"eslint-plugin-prettier": "^4.2.1",
-		"eslint-plugin-react": "^7.30.1",
-		"eslint-plugin-react-hooks": "^4.6.0",
-		"file-loader": "^6.2.0",
-		"fork-ts-checker-webpack-plugin": "^7.2.12",
-		"html-loader": "^3.1.2",
-		"html-webpack-plugin": "^5.5.0",
-		"husky": "^8.0.1",
-		"lint-staged": "^13.0.3",
-		"mini-css-extract-plugin": "^2.6.1",
-		"prettier": "^2.7.1",
-		"sass": "^1.53.0",
-		"sass-loader": "^13.0.2",
-		"style-loader": "^3.3.1",
-		"terser-webpack-plugin": "^5.3.3",
-		"tsc-alias": "^1.6.11",
-		"typescript": "^4.7.4",
-		"webpack": "^5.73.0",
-		"webpack-cli": "^4.10.0",
-		"webpack-dev-server": "^4.9.3",
-		"webpack-merge": "^5.8.0"
-	},
-	"dependencies": {
-		"@emotion/react": "^11.9.3",
-		"@emotion/styled": "^11.9.3",
-		"@fingerprintjs/fingerprintjs": "~3.3.4",
-		"@hookform/resolvers": "^2.9.6",
-		"@mui/icons-material": "^5.8.4",
-		"@mui/material": "^5.8.7",
-		"@reduxjs/toolkit": "^1.8.3",
-		"axios": "^0.27.2",
-		"device-detector-js": "^3.0.3",
-		"i18next": "^21.8.14",
-		"i18next-browser-languagedetector": "^6.1.4",
-		"i18next-http-backend": "^1.4.1",
-		"jsencrypt": "^3.2.1",
-		"lodash-es": "^4.17.21",
-		"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-dropzone": "^14.2.2",
-		"react-hook-form": "^7.33.1",
-		"react-i18next": "^11.18.1",
-		"react-otp-input": "^2.4.0",
-		"react-redux": "^8.0.2",
-		"react-spring-bottom-sheet": "^3.4.1",
-		"yup": "^0.32.11"
-	},
-	"peerDependencies": {
-		"react": "^18.2.0",
-		"react-dom": "^18.2.0"
-	},
-	"lint-staged": {
-		"src/**/*.{ts,tsx,json,js,jsx}": [
-			"yarn run prettier:fix",
-			"yarn run lint",
-			"git add ."
-		]
-	},
-	"browserslist": {
-		"production": [
-			">0.2%",
-			"not dead",
-			"not op_mini all"
-		],
-		"development": [
-			"last 1 chrome version",
-			"last 1 firefox version",
-			"last 1 safari version"
-		]
-	}
-}
+{
+	"name": "@tap-payments/auth-jsconnect",
+	"version": "2.0.38-test",
+	"description": "connect library, auth",
+	"private": false,
+	"main": "build/index.js",
+	"module": "build/index.js",
+	"types": "build/index.d.ts",
+	"files": [
+		"build",
+		"README.md"
+	],
+	"scripts": {
+		"husky:setup": "npx husky install",
+		"prettier": "prettier --list-different \"src/**/*.{md,mdx,ts,js,tsx,jsx,json}\" *.json *.js",
+		"prettier:fix": "prettier --write \"src/**/*.{ts,tsx,js,jsx,json,md,css,json}\"  *.json *.js",
+		"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": "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": "rm -rf build && tsc -p tsconfig.json && tsc-alias -p tsconfig.json && yarn copy:files",
+		"push": "npm publish --access public"
+	},
+	"keywords": [],
+	"author": {
+		"name": "Ahmed Elsharkawy",
+		"email": "a.elsharkawy@tap.company"
+	},
+	"license": "ISC",
+	"devDependencies": {
+		"@babel/core": "^7.18.6",
+		"@babel/preset-env": "^7.18.6",
+		"@babel/preset-react": "^7.18.6",
+		"@babel/preset-typescript": "^7.18.6",
+		"@types/lodash-es": "^4.17.6",
+		"@types/moment-hijri": "^2.1.0",
+		"@types/react": "^18.0.15",
+		"@types/react-calendar": "~3.5.1",
+		"@types/react-dom": "^18.0.6",
+		"@typescript-eslint/eslint-plugin": "^5.30.5",
+		"@typescript-eslint/parser": "^5.30.5",
+		"babel-loader": "^8.2.5",
+		"copyfiles": "^2.4.1",
+		"cross-env": "^7.0.3",
+		"css-loader": "^6.7.1",
+		"css-minimizer-webpack-plugin": "^4.0.0",
+		"eslint": "^8.19.0",
+		"eslint-config-airbnb": "^19.0.4",
+		"eslint-config-prettier": "^8.5.0",
+		"eslint-plugin-import": "^2.26.0",
+		"eslint-plugin-jsx-a11y": "^6.6.0",
+		"eslint-plugin-node": "^11.1.0",
+		"eslint-plugin-prettier": "^4.2.1",
+		"eslint-plugin-react": "^7.30.1",
+		"eslint-plugin-react-hooks": "^4.6.0",
+		"file-loader": "^6.2.0",
+		"fork-ts-checker-webpack-plugin": "^7.2.12",
+		"html-loader": "^3.1.2",
+		"html-webpack-plugin": "^5.5.0",
+		"husky": "^8.0.1",
+		"lint-staged": "^13.0.3",
+		"mini-css-extract-plugin": "^2.6.1",
+		"prettier": "^2.7.1",
+		"sass": "^1.53.0",
+		"sass-loader": "^13.0.2",
+		"style-loader": "^3.3.1",
+		"terser-webpack-plugin": "^5.3.3",
+		"tsc-alias": "^1.6.11",
+		"typescript": "^4.7.4",
+		"webpack": "^5.73.0",
+		"webpack-cli": "^4.10.0",
+		"webpack-dev-server": "^4.9.3",
+		"webpack-merge": "^5.8.0"
+	},
+	"dependencies": {
+		"@emotion/react": "^11.9.3",
+		"@emotion/styled": "^11.9.3",
+		"@fingerprintjs/fingerprintjs": "~3.3.4",
+		"@hookform/resolvers": "^2.9.6",
+		"@mui/icons-material": "^5.8.4",
+		"@mui/material": "^5.8.7",
+		"@reduxjs/toolkit": "^1.8.3",
+		"axios": "^0.27.2",
+		"device-detector-js": "^3.0.3",
+		"i18next": "^21.8.14",
+		"i18next-browser-languagedetector": "^6.1.4",
+		"i18next-http-backend": "^1.4.1",
+		"jsencrypt": "^3.2.1",
+		"lodash-es": "^4.17.21",
+		"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-dropzone": "^14.2.2",
+		"react-hook-form": "^7.33.1",
+		"react-i18next": "^11.18.1",
+		"react-otp-input": "^2.4.0",
+		"react-redux": "^8.0.2",
+		"react-spring-bottom-sheet": "^3.4.1",
+		"yup": "^0.32.11"
+	},
+	"peerDependencies": {
+		"react": "^18.2.0",
+		"react-dom": "^18.2.0"
+	},
+	"lint-staged": {
+		"src/**/*.{ts,tsx,json,js,jsx}": [
+			"yarn run prettier:fix",
+			"yarn run lint",
+			"git add ."
+		]
+	},
+	"browserslist": {
+		"production": [
+			">0.2%",
+			"not dead",
+			"not op_mini all"
+		],
+		"development": [
+			"last 1 chrome version",
+			"last 1 firefox version",
+			"last 1 safari version"
+		]
+	}
+}