@tap-payments/auth-jsconnect 1.0.84 → 1.0.85

package/build/features/individual/screens/AdditionalIndividualInfo/EmployerLocation.js

@@ -34,6 +34,7 @@ import ScreenContainer from '../../../shared/Containers/ScreenContainer';
 import Input from '../../../shared/Input';
 import SimpleList from '../../../../components/SimpleList';
 import { useLanguage } from '../../../../hooks';
+import Search from '../../../shared/Search';
 var CountryItemContainer = styled(Box)(function () { return ({
     display: 'flex'
 }); });
@@ -52,8 +53,8 @@ var CheckIconStyled = styled(CheckIcon)(function (_a) {
 var EmployerLocation = React.forwardRef(function (_a, ref) {
     var _b, _c, _d;
     var countries = _a.countries, rest = __rest(_a, ["countries"]);
-    var locationCountries = React.useState(countries)[0];
-    var _e = React.useState(null), anchorEl = _e[0], setAnchorEl = _e[1];
+    var _e = React.useState(countries), locationCountries = _e[0], setCountries = _e[1];
+    var _f = React.useState(null), anchorEl = _f[0], setAnchorEl = _f[1];
     var t = useTranslation().t;
     var isAr = useLanguage().isAr;
     var control = useFormContext().control;
@@ -67,15 +68,25 @@ var EmployerLocation = React.forwardRef(function (_a, ref) {
         var _a;
         setAnchorEl(null);
         (_a = rest.onListClose) === null || _a === void 0 ? void 0 : _a.call(rest);
+        setCountries(countries);
     };
     var onSelectItem = function (country) {
         onCloseCountrySelect();
         employerLocationControl.field.onChange(country);
     };
+    var handleSearch = function (value) {
+        var filteredCountries = countries.filter(function (country) {
+            return country.idd_prefix.toString().toLowerCase().startsWith(value.replace('+', '').toLowerCase()) ||
+                country.capital.toLowerCase().startsWith(value.toLowerCase()) ||
+                country.name.arabic.toLowerCase().startsWith(value.toLowerCase()) ||
+                country.name.english.toLowerCase().startsWith(value.toLowerCase());
+        });
+        setCountries(filteredCountries);
+    };
     var location = employerLocationControl.field.value;
     var error = (_b = employerLocationControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
-    return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { pt: 2.5 } }, { children: [_jsx(Input, { required: true, label: t('tap_js_employer_address_city'), readOnly: true, onClick: !!anchorEl ? function () { return onCloseCountrySelect(); } : onOpenCountrySelect, endAdornment: _jsx(ExpandIcon, { anchorEl: !!anchorEl }), placeholder: t('choose_employee_location'), value: (isAr ? (_c = location === null || location === void 0 ? void 0 : location.name) === null || _c === void 0 ? void 0 : _c.arabic : (_d = location === null || location === void 0 ? void 0 : location.name) === null || _d === void 0 ? void 0 : _d.english) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.english', list: locationCountries, onSelectItem: onSelectItem, renderItem: function (item) {
-                            return (_jsxs(_Fragment, { children: [_jsx(CountryItemContainer, { children: _jsx(CountryNameText, __assign({ isSelected: (item === null || item === void 0 ? void 0 : item.idd_prefix) === (location === null || location === void 0 ? void 0 : location.idd_prefix) }, { children: isAr ? item.name.arabic : item.name.english })) }), item.idd_prefix === (location === null || location === void 0 ? void 0 : location.idd_prefix) && _jsx(CheckIconStyled, {})] }));
-                        } }) }))] })) })));
+    return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { pt: 2.5 } }, { children: [_jsx(Input, { required: true, label: t('tap_js_employer_address_city'), readOnly: true, onClick: !!anchorEl ? function () { return onCloseCountrySelect(); } : onOpenCountrySelect, endAdornment: _jsx(ExpandIcon, { anchorEl: !!anchorEl }), placeholder: t('choose_employee_location'), value: (isAr ? (_c = location === null || location === void 0 ? void 0 : location.name) === null || _c === void 0 ? void 0 : _c.arabic : (_d = location === null || location === void 0 ? void 0 : location.name) === null || _d === void 0 ? void 0 : _d.english) || '', warningMessage: error && t(error) }), _jsxs(Collapse, __assign({ in: !!anchorEl }, { children: [_jsx(Search, { onSearchValue: handleSearch }), _jsx(SimpleList, { searchKeyPath: 'name.english', list: locationCountries, onSelectItem: onSelectItem, renderItem: function (item) {
+                                return (_jsxs(_Fragment, { children: [_jsx(CountryItemContainer, { children: _jsx(CountryNameText, __assign({ isSelected: (item === null || item === void 0 ? void 0 : item.idd_prefix) === (location === null || location === void 0 ? void 0 : location.idd_prefix) }, { children: isAr ? item.name.arabic : item.name.english })) }), item.idd_prefix === (location === null || location === void 0 ? void 0 : location.idd_prefix) && _jsx(CheckIconStyled, {})] }));
+                            } })] }))] })) })));
 });
 export default React.memo(EmployerLocation);

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

@@ -16,7 +16,7 @@ import { styled } from '@mui/material/styles';
 import { FlowsButtons } from '../../../shared/Button';
 import { ICONS_NAMES } from '../../../../constants';
 import { useAppSelector, useLanguage } from '../../../../hooks';
-import { showLastFour } from '../../../../utils';
+import { allAreTruthy, showLastFour } from '../../../../utils';
 import { individualSelector } from '../../../app/individual/individualStore';
 import Box from '@mui/material/Box';
 import Text from '../../../../components/Text';
@@ -76,8 +76,6 @@ var SuccessWithFlowButtons = function () {
                 setIsAcceptance(true);
             var isCompleted = status === 'completed' && name !== 'password';
             var isIndividual = name === 'individual';
-            if (name !== 'password')
-                statuses.push(isCompleted);
             var src = isCompleted ? "".concat(name, "_green_icon") : "".concat(name, "_filled_icon");
             var hoverSrc = "".concat(name, "_white_icon");
             return {
@@ -90,7 +88,7 @@ var SuccessWithFlowButtons = function () {
             };
         });
         setButtons(mappedFlows);
-        var isAllCompleted = statuses.filter(function (status) { return status; }).length === flows.length;
+        var isAllCompleted = allAreTruthy(flows, 'completed', 'status', 'password');
         if (isAllCompleted)
             setIsPayout(true);
     };

package/build/features/password/Password.js

@@ -10,7 +10,7 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import { jsx as _jsx } from "react/jsx-runtime";
-import React, { memo, useEffect } from 'react';
+import { memo, useEffect } from 'react';
 import { useAppTheme, useAppDispatch, useAppSelector, useAppConfig, useErrorListener } from '../../hooks';
 import { settingsSelector } from '../../app/settings';
 import AnimationFlow from '../../components/AnimationFlow';
@@ -23,15 +23,15 @@ import { PASSWORD_SCREENS_NAVIGATION } from '../../constants';
 import { passwordFeatureScreens } from '../featuresScreens';
 import { passwordSelector, verifyLeadToken } from '../app/password/passwordStore';
 import CustomFooter from '../shared/Footer';
+import Background from '../shared/Background';
 var Password = memo(function (props) {
-    var open = React.useState(true)[0];
     var theme = useAppTheme().theme;
     var dispatch = useAppDispatch();
     var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, settingLoading = _a.loading;
     var customLoading = useAppSelector(passwordSelector).customLoading;
     var loading = useAppConfig(__assign({ navigation: PASSWORD_SCREENS_NAVIGATION }, props)).loading;
     useErrorListener();
-    var activeScreen = data.activeScreen;
+    var activeScreen = data.activeScreen, isTapOrigin = data.isTapOrigin, open = data.open;
     var verifyToken = function () {
         var token = getParameterByName('token');
         if (!token)
@@ -42,11 +42,11 @@ var Password = memo(function (props) {
         if (!loading)
             verifyToken();
     }, [loading]);
-    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(AnimationFlow, __assign({ loading: settingLoading || customLoading, error: error, open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: passwordFeatureScreens.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));
-                }) }) })) })));
+    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading || customLoading }, { children: _jsx(AnimationFlow, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading || customLoading, error: error, open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: passwordFeatureScreens.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 PasswordLib(props) {
     return (_jsx(ReduxProvider, __assign({ store: store }, { children: _jsx(Password, __assign({}, props)) })));

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

@@ -16,7 +16,7 @@ import { styled } from '@mui/material/styles';
 import { FlowsButtons } from '../../../shared/Button';
 import { ICONS_NAMES } from '../../../../constants';
 import { useAppSelector, useLanguage } from '../../../../hooks';
-import { showLastFour } from '../../../../utils';
+import { allAreTruthy, showLastFour } from '../../../../utils';
 import { passwordSelector } from '../../../app/password/passwordStore';
 import Box from '@mui/material/Box';
 import Text from '../../../../components/Text';
@@ -76,8 +76,6 @@ var SuccessWithFlowButtons = function () {
                 setIsAcceptance(true);
             var isCompleted = status === 'completed' && name !== 'password';
             var isIndividual = name === 'individual';
-            if (name !== 'password')
-                statuses.push(isCompleted);
             var src = isCompleted ? "".concat(name, "_green_icon") : "".concat(name, "_filled_icon");
             var hoverSrc = "".concat(name, "_white_icon");
             return {
@@ -90,7 +88,7 @@ var SuccessWithFlowButtons = function () {
             };
         });
         setButtons(mappedFlows);
-        var isAllCompleted = statuses.filter(function (status) { return status; }).length === flows.length;
+        var isAllCompleted = allAreTruthy(flows, 'completed', 'status', 'password');
         if (isAllCompleted)
             setIsPayout(true);
     };

package/build/features/shared/AcceptancePayouts/AcceptancePayouts.js

@@ -24,7 +24,7 @@ var BoxStyled = styled(Box, { shouldForwardProp: function (prop) { return prop !
             backgroundColor: enabled ? alpha(theme.palette.success.main, 0.1) : alpha(theme.palette.text.primary, 0.1),
             color: enabled ? theme.palette.success.main : alpha(theme.palette.text.primary, 0.6),
             borderRadius: theme.spacing(12.625),
-            padding: theme.spacing(0.6, 1, 0.6, 1),
+            padding: theme.spacing(0.6, 1, 0.7, 1),
             display: 'flex',
             minHeight: theme.spacing(3.125),
             minWidth: isAr ? theme.spacing(19.3) : theme.spacing(14.5),

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

@@ -0,0 +1,10 @@
+import React from 'react';
+declare type TapOrigin = {
+    isTapOrigin: boolean;
+};
+interface BackgroundProps extends TapOrigin {
+    children: React.ReactNode;
+    loading?: boolean;
+}
+declare const _default: React.MemoExoticComponent<({ children, isTapOrigin, loading }: BackgroundProps) => JSX.Element>;
+export default _default;

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

@@ -0,0 +1,29 @@
+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, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo } from 'react';
+import { styled } from '@mui/material/styles';
+import Box from '@mui/material/Box';
+import LogoBackground from './LogoBackground';
+var BackgroundStyled = styled(Box)(function (_a) {
+    var isTapOrigin = _a.isTapOrigin;
+    return ({
+        width: '100%',
+        height: '100%',
+        background: isTapOrigin ? 'linear-gradient(180deg, #98ABAF 0%, #D9D6CC 100%)' : 'rgba(0, 0, 0, 0.5)'
+    });
+});
+var Background = function (_a) {
+    var children = _a.children, isTapOrigin = _a.isTapOrigin, loading = _a.loading;
+    return (_jsxs(BackgroundStyled, __assign({ isTapOrigin: isTapOrigin }, { children: [_jsx(LogoBackground, { isTapOrigin: !loading && isTapOrigin }), children] })));
+};
+export default memo(Background);

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

@@ -0,0 +1,6 @@
+import React from 'react';
+declare type LogoBackgroundProps = {
+    isTapOrigin: boolean;
+};
+declare const _default: React.MemoExoticComponent<({ isTapOrigin }: LogoBackgroundProps) => JSX.Element>;
+export default _default;

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

@@ -0,0 +1,47 @@
+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 { memo } from 'react';
+import { styled } from '@mui/material/styles';
+import Collapse from '@mui/material/Collapse';
+import Box from '@mui/material/Box';
+import Icon from '../../../components/Icon';
+import { ICONS_NAMES } from '../../../constants';
+import { useLanguage } from '../../../hooks';
+import Fade from '@mui/material/Fade';
+var BoxStyled = styled(Box)(function (_a) {
+    var theme = _a.theme;
+    return ({
+        display: 'flex',
+        flexDirection: 'column',
+        justifyContent: 'center',
+        alignItems: 'center',
+        marginTop: theme.spacing(5)
+    });
+});
+var LogoBadgeStyled = styled(Icon)(function () { return ({
+    height: '100%',
+    width: '100%'
+}); });
+var LogoIconBoxStyled = styled(Box)(function (_a) {
+    var theme = _a.theme;
+    return ({
+        height: theme.spacing(14.625),
+        width: theme.spacing(8.875)
+    });
+});
+var LogoBackground = function (_a) {
+    var isTapOrigin = _a.isTapOrigin;
+    var isAr = useLanguage().isAr;
+    return (_jsx(Collapse, __assign({ in: isTapOrigin }, { children: _jsx(Fade, __assign({ in: isTapOrigin }, { children: _jsx(BoxStyled, { children: _jsx(LogoIconBoxStyled, { children: _jsx(LogoBadgeStyled, { src: ICONS_NAMES.TAP_LOGO_EN_ICON }) }) }) })) })));
+};
+export default memo(LogoBackground);

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

@@ -0,0 +1,2 @@
+import Background from './Background';
+export default Background;

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

@@ -0,0 +1,2 @@
+import Background from './Background';
+export default Background;

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { ButtonProps } from '../../../components/Button';
-interface CustomButtonProps extends ButtonProps {
+export interface CustomButtonProps extends ButtonProps {
     isAr: boolean;
     loading?: boolean;
     disableBack?: boolean;
@@ -9,4 +9,3 @@ interface CustomButtonProps extends ButtonProps {
     error?: string;
 }
 export default function CustomButton({ children, disabled, isAr, loading, disableBack, onBackClicked, error, disableNextIcon, ...props }: CustomButtonProps): JSX.Element;
-export {};

package/build/features/shared/Button/SuccessButton.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-import { ButtonProps } from '../../../components/Button';
-interface SuccessButtonProps extends ButtonProps {
+import { CustomButtonProps } from './Button';
+interface SuccessButtonProps extends CustomButtonProps {
     isAr: boolean;
     loading?: boolean;
     hideIcon?: boolean;
 }
-export default function SuccessButton({ children, isAr, hideIcon, disabled, ...props }: SuccessButtonProps): JSX.Element;
+export default function SuccessButton({ children, isAr, disabled, loading, error, ...props }: SuccessButtonProps): JSX.Element;
 export {};

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

@@ -21,15 +21,27 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import { jsx as _jsx } from "react/jsx-runtime";
-import Button from '../../../components/Button';
-import Icon from '../../../components/Icon';
-import { alpha, styled } from '@mui/material/styles';
+import React from 'react';
+import Button from './Button';
+import { styled } from '@mui/material/styles';
 import Box from '@mui/material/Box';
-import { ICONS_NAMES } from '../../../constants';
-var IconStyled = styled(Icon, { shouldForwardProp: function (prop) { return prop !== 'disabled'; } })(function (_a) {
-    var theme = _a.theme, disabled = _a.disabled;
-    return (__assign({ width: theme.spacing(3), height: theme.spacing(3), marginInlineStart: theme.spacing(0.75) }, (disabled && {
-        opacity: 0.3
+var ButtonStyled = styled(Button, {
+    shouldForwardProp: function (prop) { return prop !== 'isLoading'; }
+})(function (_a) {
+    var theme = _a.theme, isLoading = _a.isLoading;
+    return (__assign({ width: '100%', textTransform: 'none', paddingInlineStart: theme.spacing(0.75), backgroundColor: theme.palette.common.white, color: theme.palette.primary.main, border: "1px solid ".concat(theme.palette.primary.main), '&:hover': {
+            backgroundColor: theme.palette.common.white,
+            color: theme.palette.primary.main
+        }, '&:disabled': {
+            backgroundColor: theme.palette.primary.main,
+            color: theme.palette.common.white
+        }, transition: theme.transitions.create(['width', 'padding'], {
+            easing: theme.transitions.easing.easeInOut,
+            duration: theme.transitions.duration.complex * 2
+        }) }, (isLoading && {
+        minWidth: 0,
+        width: theme.spacing(6),
+        borderRadius: 30
     })));
 });
 var ButtonBoxStyled = styled(Box)(function (_a) {
@@ -38,34 +50,17 @@ var ButtonBoxStyled = styled(Box)(function (_a) {
         margin: theme.spacing(0, 2.5, 2.5, 2.5)
     });
 });
-var ButtonStyled = styled(Button)(function (_a) {
-    var _b;
-    var theme = _a.theme;
-    return (_b = {
-            paddingInlineStart: theme.spacing(0.75),
-            textTransform: 'none',
-            backgroundColor: theme.palette.common.white,
-            border: "1px solid ".concat(theme.palette.primary.main),
-            color: theme.palette.primary.main,
-            '&:hover': {
-                backgroundColor: theme.palette.common.white,
-                color: theme.palette.primary.main
-            },
-            '&:disabled': {
-                backgroundColor: theme.palette.common.white,
-                color: alpha(theme.palette.primary.main, 0.3)
-            }
-        },
-        _b[theme.breakpoints.down('sm')] = {
-            '&:hover': {
-                backgroundColor: theme.palette.common.white,
-                border: "1px solid ".concat(theme.palette.primary.main),
-                color: theme.palette.primary.main
-            }
-        },
-        _b);
-});
 export default function SuccessButton(_a) {
-    var children = _a.children, isAr = _a.isAr, hideIcon = _a.hideIcon, disabled = _a.disabled, props = __rest(_a, ["children", "isAr", "hideIcon", "disabled"]);
-    return (_jsx(ButtonBoxStyled, { children: _jsx(ButtonStyled, __assign({ disabled: disabled, type: 'button', startIcon: !hideIcon && _jsx(IconStyled, { disabled: disabled, src: ICONS_NAMES.MOBILE_ICON }) }, props, { children: children })) }));
+    var children = _a.children, isAr = _a.isAr, disabled = _a.disabled, loading = _a.loading, error = _a.error, props = __rest(_a, ["children", "isAr", "disabled", "loading", "error"]);
+    var _b = React.useState(false), btnLoading = _b[0], setBtnLoading = _b[1];
+    React.useEffect(function () {
+        if (loading)
+            setBtnLoading(true);
+        if (error)
+            setBtnLoading(false);
+    }, [loading, error]);
+    React.useEffect(function () {
+        setBtnLoading(false);
+    }, []);
+    return (_jsx(ButtonBoxStyled, { children: _jsx(ButtonStyled, __assign({ isAr: isAr, isLoading: btnLoading, loading: btnLoading, disabled: disabled, type: 'button' }, props, { children: children })) }));
 }

package/build/features/shared/SuccessScreen/SuccessScreen.js

@@ -16,7 +16,7 @@ import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import Text from '../../../components/Text';
 import Container from '../Containers/ScreenContainer';
-import { EmailProvidersButton, Button } from '../../shared/Button';
+import { EmailProvidersButton, SuccessButton } from '../../shared/Button';
 import Icon from '../../../components/Icon';
 import { ICONS_NAMES } from '../../../constants';
 import { useLanguage } from '../../../hooks';
@@ -56,6 +56,6 @@ var ThankYou = function (_a) {
     var title = _a.title, description = _a.description, showEmailProviders = _a.showEmailProviders, onSuccess = _a.onSuccess, successTitle = _a.successTitle, loading = _a.loading, error = _a.error;
     var t = useTranslation().t;
     var isAr = useLanguage().isAr;
-    return (_jsxs(ContainerStyled, { children: [_jsx(IconStyled, { src: ICONS_NAMES.SUCCESS_GIF, alt: 'loading...' }), _jsxs(TitleStyled, { children: [title, " "] }), _jsx(DescriptionStyled, { children: description }), showEmailProviders && (_jsx(MailBoxStyled, { children: _jsx(EmailProvidersButton, { gmail: { title: t('gmail_btn_open_title'), href: 'https://mail.google.com/mail/u/0/#inbox' }, outlook: { title: t('outlook_btn_open_title'), href: 'https://outlook.live.com/mail/0/' }, apple: { title: t('apple_btn_open_title'), href: 'https://www.icloud.com/mail/' } }) })), onSuccess && !showEmailProviders && (_jsx(MailBoxStyled, { children: _jsx(Button, __assign({ onClick: onSuccess, disableBack: true, disableNextIcon: true, disabled: loading, isAr: isAr, loading: loading, error: t(error || '') }, { children: t(successTitle || '') })) }))] }));
+    return (_jsxs(ContainerStyled, { children: [_jsx(IconStyled, { src: ICONS_NAMES.SUCCESS_GIF, alt: 'loading...' }), _jsxs(TitleStyled, { children: [title, " "] }), _jsx(DescriptionStyled, { children: description }), showEmailProviders && (_jsx(MailBoxStyled, { children: _jsx(EmailProvidersButton, { gmail: { title: t('gmail_btn_open_title'), href: 'https://mail.google.com/mail/u/0/#inbox' }, outlook: { title: t('outlook_btn_open_title'), href: 'https://outlook.live.com/mail/0/' }, apple: { title: t('apple_btn_open_title'), href: 'https://www.icloud.com/mail/' } }) })), onSuccess && !showEmailProviders && (_jsx(MailBoxStyled, { children: _jsx(SuccessButton, __assign({ onClick: onSuccess, disableBack: true, disableNextIcon: true, disabled: loading, isAr: isAr, loading: loading, error: t(error || '') }, { children: t(successTitle || '') })) }))] }));
 };
 export default React.memo(ThankYou);

package/build/features/tax/Tax.js

@@ -10,7 +10,7 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import { jsx as _jsx } from "react/jsx-runtime";
-import React, { memo, useEffect } from 'react';
+import { memo, useEffect } from 'react';
 import { useAppTheme, useAppDispatch, useAppSelector, useAppConfig, useErrorListener } from '../../hooks';
 import { settingsSelector } from '../../app/settings';
 import AnimationFlow from '../../components/AnimationFlow';
@@ -23,15 +23,15 @@ import { TAX_SCREENS_NAVIGATION } from '../../constants';
 import { taxFeatureScreens } from '../featuresScreens';
 import CustomFooter from '../shared/Footer';
 import { taxSelector, verifyLeadToken } from '../app/tax/taxStore';
+import Background from '../shared/Background';
 var Tax = memo(function (props) {
-    var open = React.useState(true)[0];
     var theme = useAppTheme().theme;
     var dispatch = useAppDispatch();
     var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, settingLoading = _a.loading;
     var customLoading = useAppSelector(taxSelector).customLoading;
     var loading = useAppConfig(__assign({ navigation: TAX_SCREENS_NAVIGATION }, props)).loading;
     useErrorListener();
-    var activeScreen = data.activeScreen;
+    var activeScreen = data.activeScreen, isTapOrigin = data.isTapOrigin, open = data.open;
     var verifyToken = function () {
         var token = getParameterByName('token');
         if (!token)
@@ -42,11 +42,11 @@ var Tax = memo(function (props) {
         if (!loading)
             verifyToken();
     }, [loading]);
-    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(AnimationFlow, __assign({ open: open, error: error, loading: settingLoading || customLoading, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: taxFeatureScreens.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));
-                }) }) })) })));
+    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading || customLoading }, { children: _jsx(AnimationFlow, __assign({ isTapOrigin: isTapOrigin, open: open, error: error, loading: settingLoading || customLoading, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: taxFeatureScreens.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 TaxLib(props) {
     return (_jsx(ReduxProvider, __assign({ store: store }, { children: _jsx(Tax, __assign({}, props)) })));

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

@@ -16,7 +16,7 @@ import { styled } from '@mui/material/styles';
 import { FlowsButtons } from '../../../shared/Button';
 import { ICONS_NAMES } from '../../../../constants';
 import { useAppSelector, useLanguage } from '../../../../hooks';
-import { showLastFour } from '../../../../utils';
+import { allAreTruthy, showLastFour } from '../../../../utils';
 import { taxSelector } from '../../../app/tax/taxStore';
 import Box from '@mui/material/Box';
 import Text from '../../../../components/Text';
@@ -76,9 +76,6 @@ var SuccessWithFlowButtons = function () {
                 setIsAcceptance(true);
             var isCompleted = status === 'completed' && name !== 'password';
             var isIndividual = name === 'individual';
-            if (name !== 'password')
-                if (name !== 'password')
-                    statuses.push(isCompleted);
             var src = isCompleted ? "".concat(name, "_green_icon") : "".concat(name, "_filled_icon");
             var hoverSrc = "".concat(name, "_white_icon");
             return {
@@ -91,7 +88,7 @@ var SuccessWithFlowButtons = function () {
             };
         });
         setButtons(mappedFlows);
-        var isAllCompleted = statuses.filter(function (status) { return status; }).length === flows.length;
+        var isAllCompleted = allAreTruthy(flows, 'completed', 'status', 'password');
         if (isAllCompleted)
             setIsPayout(true);
     };

package/build/hooks/useAppConfig.js

@@ -57,11 +57,11 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import { useEffect, useState } from 'react';
-import { handleActiveFlowScreens, settingsSelector, getClientIp, getLocale, getBrowserFingerPrint, getOperator, handleSetAppConfig, handleLanguage } 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 } from '../utils';
+import { getRequestHeaders, encryptString, isTapDomain } from '../utils';
 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];
@@ -79,10 +79,16 @@ export var useAppConfig = function (_a) {
             return [2];
         });
     }); };
+    var checkDomain = function () {
+        var isTap = isTapDomain(rest.merchantDomain);
+        dispatch(handleIsTapOrigin(isTap));
+    };
     var handleAppApiConfig = function () { return __awaiter(void 0, void 0, void 0, function () {
         return __generator(this, function (_a) {
             switch (_a.label) {
-                case 0: return [4, dispatch(getLocale())];
+                case 0:
+                    checkDomain();
+                    return [4, dispatch(getLocale())];
                 case 1:
                     _a.sent();
                     return [4, dispatch(getClientIp())];
@@ -116,6 +122,9 @@ export var useAppConfig = function (_a) {
             }
         });
     }); };
+    useEffect(function () {
+        dispatch(handleOpen(rest.open));
+    }, [rest.open]);
     useEffect(function () {
         if (data.appConfig.language)
             dispatch(handleLanguage(data.appConfig.language));

package/build/theme/components.js

@@ -6,5 +6,14 @@ export var components = {
                 height: '0.8em'
             }
         }
+    },
+    MuiBackdrop: {
+        styleOverrides: {
+            root: {
+                '&.MuiDialog-backdrop': {
+                    backgroundColor: 'transparent'
+                }
+            }
+        }
     }
 };

package/build/utils/array.d.ts

@@ -7,3 +7,4 @@ export declare const splitString: (string: string, splitter?: string) => string[
 export declare const isInclude: (items: Array<string | number>, item: any) => boolean;
 export declare const findItem: (items: Array<string | number>, key: any) => string | number | undefined;
 export declare const isExist: (items: Array<any>, id: string) => any;
+export declare const allAreTruthy: (items: Array<any>, condition: boolean | string, key: string, exclude?: string) => boolean;

package/build/utils/array.js

@@ -42,3 +42,10 @@ export var isExist = function (items, id) {
         return sub === null || sub === void 0 ? void 0 : sub.some(function (item) { return item.id === id; });
     });
 };
+export var allAreTruthy = function (items, condition, key, exclude) {
+    return items.every(function (item) {
+        if (exclude && item['name'] === exclude)
+            return true;
+        return item[key] === condition;
+    });
+};

package/build/utils/validation.d.ts

@@ -12,3 +12,4 @@ export declare function isPasswordHasUpperLetter(password: string): boolean;
 export declare function isPasswordHasLowerLetter(password: string): boolean;
 export declare function isPasswordHasSpecialLetter(password: string): boolean;
 export declare const keepLettersAndSpace: (str: string) => string;
+export declare const isTapDomain: (domain: string) => boolean;

package/build/utils/validation.js

@@ -40,3 +40,6 @@ export function isPasswordHasSpecialLetter(password) {
 export var keepLettersAndSpace = function (str) {
     return str.replace(/[^a-zA-Z] /g, '');
 };
+export var isTapDomain = function (domain) {
+    return domain.includes('tap.company');
+};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@tap-payments/auth-jsconnect",
-	"version": "1.0.84",
+	"version": "1.0.85",
 	"description": "connect library, auth",
 	"private": false,
 	"main": "build/index.js",