@tap-payments/auth-jsconnect 2.3.40-test → 2.3.46-test

package/build/features/shared/Address/Address.js

@@ -22,7 +22,7 @@ import InputText from './InputText';
 import { Button } from '../Button';
 export default function Address(_a) {
     var format = _a.format, countryList = _a.countryList, onAddressChange = _a.onAddressChange, defaultValues = _a.defaultValues, disableCountry = _a.disableCountry, loading = _a.loading, error = _a.error, onBack = _a.onBack, showSubmitButton = _a.showSubmitButton, isEditable = _a.isEditable;
-    var _b = useForm({ defaultValues: defaultValues, mode: 'onChange' }), watch = _b.watch, control = _b.control, formState = _b.formState, getValues = _b.getValues, handleSubmit = _b.handleSubmit;
+    var _b = useForm({ defaultValues: defaultValues, mode: 'onChange' }), watch = _b.watch, control = _b.control, formState = _b.formState, getValues = _b.getValues;
     var values = getValues();
     var t = useTranslation().t;
     var isAr = useLanguage().isAr;
@@ -32,49 +32,42 @@ export default function Address(_a) {
     }, [values, formState.isValid]);
     var countryIso2 = useMemo(function () {
         var _a;
-        var index = countryList.findIndex(function (item) { return item.iso2 === watch('country'); });
+        var index = countryList.findIndex(function (item) { return item.countryId === watch('country'); });
         return (_a = countryList[index]) === null || _a === void 0 ? void 0 : _a.iso2;
     }, [watch('country')]);
-    var getName = function (item) {
-        return (isAr ? item.name.ar : item.name.en) || '';
-    };
-    var getRequiredValue = function (item) {
-        return "".concat(getName(item), " ").concat(t('is_required'));
-    };
-    var onSubmit = function (values) {
-        console.log(values);
-        onAddressChange(values, formState.isValid);
-    };
-    return (_jsxs(Box, __assign({ component: 'form', onSubmit: handleSubmit(onSubmit) }, { children: [format.map(function (item) {
+    return (_jsxs(Box, __assign({ component: 'form' }, { children: [format.map(function (item) {
                 var isCountry = item.code === 'country';
                 var isSelect = item.type === 'select';
                 if (isCountry) {
                     return (_jsx(Controller, { render: function (_a) {
                             var _b;
                             var field = _a.field, fieldState = _a.fieldState;
-                            return (_jsx(CountryListComponent, { label: getName(item), placeholder: getName(item), list: countryList, onSelect: function (value) {
+                            return (_jsx(CountryListComponent, { label: "address_".concat(item.code, "_label"), placeholder: "address_".concat(item.code, "_placeholder"), list: countryList, onSelect: function (value) {
                                     console.log('value', value);
                                     field.onChange(value);
                                 }, value: field.value, error: (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message, disabled: isEditable ? !!disableCountry : false, isRequired: item.required }));
                         }, rules: {
-                            required: item.required && getRequiredValue(item)
+                            required: item.required && "address_".concat(item.code, "_required")
                         }, control: control, name: item.code }, item.code));
                 }
                 if (isSelect) {
                     return (_jsx(Controller, { render: function (_a) {
                             var _b;
                             var field = _a.field, fieldState = _a.fieldState;
-                            return (_jsx(InputSelect, { label: getName(item), placeholder: getName(item), countryIso2: countryIso2, fetchURL: item.retrieve_uri, onSelect: function (value) { return field.onChange(value); }, error: (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message, isRequired: item.required, value: field.value || '', disabled: isEditable ? !countryIso2 : false }));
+                            return (_jsx(InputSelect, { label: "address_".concat(item.code, "_label"), placeholder: "address_".concat(item.code, "_placeholder"), countryIso2: countryIso2, fetchURL: item.retrieve_uri, onSelect: function (value) { return field.onChange(value); }, error: (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message, isRequired: item.required, value: field.value || '', disabled: isEditable ? !countryIso2 : false }));
                         }, rules: {
-                            required: item.required && getRequiredValue(item)
+                            required: item.required && "address_".concat(item.code, "_required")
                         }, control: control, name: item.code }, item.code));
                 }
                 return (_jsx(Controller, { render: function (_a) {
                         var _b;
                         var field = _a.field, fieldState = _a.fieldState;
-                        return (_jsx(InputText, { label: getName(item), placeholder: getName(item), onChange: function (value) { return field.onChange(value); }, error: (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message, isRequired: item.required, disabled: !isEditable, value: field.value || '' }));
+                        return (_jsx(InputText, { label: "address_".concat(item.code, "_label"), placeholder: "address_".concat(item.code, "_placeholder"), onChange: function (value) { return field.onChange(value); }, error: (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message, isRequired: item.required, disabled: !isEditable, value: field.value || '' }));
                     }, rules: {
-                        required: item.required && getRequiredValue(item)
+                        required: item.required && "address_".concat(item.code, "_required")
                     }, control: control, name: item.code }, item.code));
-            }), _jsx(Collapse, __assign({ in: showSubmitButton }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack === null || onBack === void 0 ? void 0 : onBack(); }, isAr: isAr, disabled: !formState.isValid, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })));
+            }), _jsx(Collapse, __assign({ in: showSubmitButton }, { children: _jsx(Button, __assign({ onClick: function (e) {
+                        e.preventDefault();
+                        onAddressChange(values, formState.isValid);
+                    }, onBackClicked: function () { return onBack === null || onBack === void 0 ? void 0 : onBack(); }, isAr: isAr, disabled: !formState.isValid, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })));
 }

package/build/features/shared/Address/CountryList.js

@@ -72,17 +72,17 @@ function CountryList(_a) {
     };
     var handleValueChange = function (value) {
         setAnchorEl(null);
-        onSelect(value.iso2);
+        onSelect(value.countryId);
     };
     var nameValue = React.useMemo(function () {
-        var item = list.find(function (item) { return item.iso2 === value; });
+        var item = list.find(function (item) { return item.countryId === value; });
         if (!item)
             return '';
         return isAr ? item.name.arabic : item.name.english;
     }, [isAr, list, value]);
-    return (_jsxs(Box, { children: [_jsx(LabelContainerStyled, { children: _jsxs(InputLabelStyled, { children: [t(label), " ", isRequired && _jsx(MandatoryStyled, { children: "*" })] }) }), _jsxs(Box, { children: [_jsx(InputStyled, { readOnly: true, value: nameValue, placeholder: placeholder, onClick: handleListOpenClose, endAdornment: !disabled && _jsx(ExpandIcon, { anchorEl: !!anchorEl }) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleListStyled, { searchValuePath: ['name.english', 'name.arabic'], searchKeyPath: 'name.english', list: list, onSelectItem: handleValueChange, renderItem: function (item) {
+    return (_jsxs(Box, { children: [_jsx(LabelContainerStyled, { children: _jsxs(InputLabelStyled, { children: [t(label), " ", isRequired && _jsx(MandatoryStyled, { children: "*" })] }) }), _jsxs(Box, { children: [_jsx(InputStyled, { value: nameValue, placeholder: placeholder, onClick: handleListOpenClose, endAdornment: !disabled && _jsx(ExpandIcon, { anchorEl: !!anchorEl }) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleListStyled, { searchValuePath: ['name.english', 'name.arabic'], searchKeyPath: 'name.english', list: list, onSelectItem: handleValueChange, renderItem: function (item) {
                                 var _a, _b;
-                                var isChecked = item.iso2 === value;
+                                var isChecked = item.countryId === value;
                                 return (_jsxs(_Fragment, { children: [_jsx(Box, __assign({ display: 'flex' }, { children: _jsx(NameContainer, __assign({ isSelected: isChecked }, { children: isAr ? (_a = item.name) === null || _a === void 0 ? void 0 : _a.arabic : (_b = item.name) === null || _b === void 0 ? void 0 : _b.english })) })), isChecked && _jsx(CheckIconStyled, {})] }));
                             } }) })), _jsx(Collapse, __assign({ in: !!error && !anchorEl, timeout: 400 }, { children: _jsx(Warning, __assign({ warningType: 'hint' }, { children: t(error || '') })) }))] })] }));
 }

package/build/features/shared/Address/InputSelect.js

@@ -141,7 +141,7 @@ function InputSelect(_a) {
     return React.useMemo(function () {
         if (data.length === 0 && countryIso2)
             return (_jsx(InputText, { label: label, onChange: function (value) { return onSelect(value); }, placeholder: placeholder, isRequired: isRequired, value: value, error: error }, 'input-text'));
-        return (_jsxs(Box, { children: [_jsx(LabelContainerStyled, { children: _jsxs(InputLabelStyled, { children: [t(label), " ", isRequired && _jsx(MandatoryStyled, { children: "*" })] }) }), _jsxs(Box, { children: [_jsx(InputStyled, { readOnly: true, value: nameValue, placeholder: placeholder, onClick: handleListOpenClose, endAdornment: loading ? _jsx(CircularProgress, { size: 25, thickness: 5 }) : _jsx(ExpandIcon, { anchorEl: !!anchorEl }) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleListStyled, { searchValuePath: ['name.en', 'name.ar'], searchKeyPath: 'name.en', list: data, onSelectItem: function (item) {
+        return (_jsxs(Box, { children: [_jsx(LabelContainerStyled, { children: _jsxs(InputLabelStyled, { children: [t(label), " ", isRequired && _jsx(MandatoryStyled, { children: "*" })] }) }), _jsxs(Box, { children: [_jsx(InputStyled, { value: nameValue, placeholder: placeholder, onClick: handleListOpenClose, endAdornment: loading ? _jsx(CircularProgress, { size: 25, thickness: 5 }) : _jsx(ExpandIcon, { anchorEl: !!anchorEl }) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleListStyled, { searchValuePath: ['name.en', 'name.ar'], searchKeyPath: 'name.en', list: data, onSelectItem: function (item) {
                                     onSelect(item.id);
                                     setAnchorEl(null);
                                 }, renderItem: function (item) {

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

@@ -79,36 +79,31 @@ var ButtonBoxStyled = styled(Box)(function (_a) {
         _b);
 });
 var ButtonStyled = styled(Button, {
-    shouldForwardProp: function (prop) { return prop !== 'isCompleted'; }
+    shouldForwardProp: function (prop) { return prop !== 'isCompleted' && prop !== 'hasUrl'; }
 })(function (_a) {
     var _b;
-    var theme = _a.theme, isCompleted = _a.isCompleted;
+    var theme = _a.theme, isCompleted = _a.isCompleted, hasUrl = _a.hasUrl;
     return ({
         '&.MuiButton-outlined': __assign(__assign({}, (isCompleted && {
             paddingInlineEnd: theme.spacing(1.625),
             color: theme.palette.success.main,
             border: "1px solid ".concat(theme.palette.success.main)
-        })), (_b = { '&:hover': __assign({}, (isCompleted && {
-                    backgroundColor: theme.palette.common.white,
-                    border: "1px solid ".concat(theme.palette.success.main),
-                    color: theme.palette.success.main,
-                    cursor: 'initial',
-                    img: {
+        })), (_b = { '&:hover': __assign({}, (isCompleted && __assign({ backgroundColor: hasUrl ? theme.palette.success.main : theme.palette.common.white, border: "1px solid ".concat(theme.palette.success.main), color: hasUrl ? theme.palette.common.white : theme.palette.success.main, cursor: hasUrl ? 'pointer' : 'initial', img: {
                         filter: 'none'
+                    } }, (hasUrl && {
+                    svg: {
+                        filter: 'brightness(3)'
                     }
-                })) }, _b[theme.breakpoints.down('sm')] = {
+                })))) }, _b[theme.breakpoints.down('sm')] = {
             '&:hover': __assign({ backgroundColor: theme.palette.common.white, border: "1px solid ".concat(theme.palette.primary.main), img: {
                     filter: 'none'
-                }, color: theme.palette.primary.main }, (isCompleted && {
-                backgroundColor: theme.palette.common.white,
-                border: "1px solid ".concat(theme.palette.success.main),
-                paddingInlineEnd: theme.spacing(1.625),
-                color: theme.palette.success.main,
-                cursor: 'initial',
-                img: {
+                }, color: theme.palette.primary.main }, (isCompleted && __assign({ backgroundColor: hasUrl ? theme.palette.success.main : theme.palette.common.white, border: "1px solid ".concat(theme.palette.success.main), paddingInlineEnd: theme.spacing(1.625), color: hasUrl ? theme.palette.common.white : theme.palette.success.main, cursor: hasUrl ? 'pointer' : 'initial', img: {
                     filter: 'none'
+                } }, (hasUrl && {
+                svg: {
+                    filter: 'brightness(3)'
                 }
-            }))
+            }))))
         }, _b['&:disabled'] = {
             backgroundColor: theme.palette.common.white,
             color: alpha(theme.palette.primary.main, 0.3)
@@ -153,7 +148,7 @@ export default function FlowsButtons(_a) {
     var _b = useState(false), loading = _b[0], setLoading = _b[1];
     var isAr = useLanguage().isAr;
     var onRedirect = function (item) {
-        if (item.isCompleted)
+        if (!item.href)
             return;
         if (flowName === item.name && item.name !== 'password') {
             dispatch(handleCurrentActiveScreen(getScreenNameBasedOnFlow(item.name, isAuthorizedUser)));
@@ -221,6 +216,6 @@ export default function FlowsButtons(_a) {
                         onResetPassword();
                     else
                         onRedirect({ title: title, href: href, src: src, hoverSrc: hoverSrc, isCompleted: isCompleted, name: name, status: status, token: token });
-                } }, { children: _jsx(ButtonStyled, __assign({ variant: 'outlined', disabled: isResetPassword(name, status) && loading, isCompleted: isCompleted, sx: __assign({ mb: isLast ? 2.5 : 1.8 }, sx), endIcon: isResetPassword(name, status) && loading ? (_jsx(_Fragment, {})) : isCompleted ? (_jsx(CheckIconStyled, {})) : (_jsx(Image, { sx: { height: 15, transform: isAr ? 'scale(-1)' : 'scale(1)' }, src: ICONS_NAMES.Arrow_filled_right_icon })), startIcon: isResetPassword(name, status) && loading ? (_jsx(_Fragment, {})) : isBrand(name) ? (_jsx(_Fragment, { children: _jsx(BrandImage, { children: _jsx(BrandNameStyled, { children: brandName }) }) })) : (_jsx(Image, { src: src, alt: title })), type: 'button' }, { children: title })) }), idx));
+                } }, { children: _jsx(ButtonStyled, __assign({ variant: 'outlined', disabled: isResetPassword(name, status) && loading, isCompleted: isCompleted, hasUrl: !!href, sx: __assign({ mb: isLast ? 2.5 : 1.8 }, sx), endIcon: isResetPassword(name, status) && loading ? (_jsx(_Fragment, {})) : isCompleted ? (_jsx(CheckIconStyled, {})) : (_jsx(Image, { sx: { height: 15, transform: isAr ? 'scale(-1)' : 'scale(1)' }, src: ICONS_NAMES.Arrow_filled_right_icon })), startIcon: isResetPassword(name, status) && loading ? (_jsx(_Fragment, {})) : isBrand(name) ? (_jsx(_Fragment, { children: _jsx(BrandImage, { children: _jsx(BrandNameStyled, { children: brandName }) }) })) : (_jsx(Image, { src: src, alt: title })), type: 'button' }, { children: title })) }), idx));
         }) }));
 }

package/build/features/shared/Input/Input.js

@@ -37,9 +37,8 @@ export var InputStyled = styled(Input)(function (_a) {
         }, '&.MuiInputBase-adornedStart': {
             paddingInlineStart: theme.spacing(2.5)
         } }, (readOnly && {
-        '& .MuiInputBase-input': {
-            cursor: 'pointer'
-        }
+        cursor: 'default',
+        opacity: '0.6'
     })));
 });
 var LabelContainerStyled = styled(Box)(function (_a) {

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

@@ -5,6 +5,7 @@ interface OTPProps extends OTPFieldProps {
     onResetClick?: () => void;
     timeEndLabel?: string;
     loading?: boolean;
+    hasError?: boolean;
 }
-declare const _default: React.MemoExoticComponent<({ timeEndLabel, loading, timerInSeconds, onResetClick, ...props }: OTPProps) => JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ timeEndLabel, loading, timerInSeconds, onResetClick, hasError, ...props }: OTPProps) => JSX.Element>;
 export default _default;

package/build/features/shared/OTP/OTP.js

@@ -80,7 +80,7 @@ var LoaderBoxStyled = styled(OTPBox)(function (_a) {
     });
 });
 var OTPInput = function (_a) {
-    var timeEndLabel = _a.timeEndLabel, loading = _a.loading, timerInSeconds = _a.timerInSeconds, onResetClick = _a.onResetClick, props = __rest(_a, ["timeEndLabel", "loading", "timerInSeconds", "onResetClick"]);
+    var timeEndLabel = _a.timeEndLabel, loading = _a.loading, timerInSeconds = _a.timerInSeconds, onResetClick = _a.onResetClick, hasError = _a.hasError, props = __rest(_a, ["timeEndLabel", "loading", "timerInSeconds", "onResetClick", "hasError"]);
     var otpRef = React.useRef(null);
     var width = useContainerDimensions(otpRef).width;
     React.useEffect(function () {
@@ -88,6 +88,6 @@ var OTPInput = function (_a) {
         if (el)
             el.className = 'middle-input-element';
     }, [props.value]);
-    return (_jsxs(_Fragment, { children: [_jsx(OTPBox, __assign({ id: 'otp-container', ref: otpRef }, { children: _jsx(OTPStyled, __assign({}, props, { parentWidth: width })) })), typeof timerInSeconds != 'undefined' && (_jsx(BoxStyled, { children: loading ? (_jsx(LoaderBoxStyled, { children: _jsx(CircularProgress, { size: 20, thickness: 5 }) })) : (_jsx(OTPTimer, { timeEndLabel: timeEndLabel || '', timeInSeconds: timerInSeconds, onResetClick: onResetClick })) }))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(OTPBox, __assign({ id: 'otp-container', ref: otpRef }, { children: _jsx(OTPStyled, __assign({}, props, { parentWidth: width })) })), typeof timerInSeconds != 'undefined' && (_jsx(BoxStyled, { children: loading ? (_jsx(LoaderBoxStyled, { children: _jsx(CircularProgress, { size: 20, thickness: 5 }) })) : hasError ? (_jsx(_Fragment, {})) : (_jsx(OTPTimer, { timeEndLabel: timeEndLabel || '', timeInSeconds: timerInSeconds, onResetClick: onResetClick })) }))] }));
 };
 export default React.memo(OTPInput);

package/build/features/shared/SalesChannels/SaleChannelIconsInput.js

@@ -31,10 +31,11 @@ var SocialMediaGroupStyled = styled(SocialMediaGroup)(function (_a) {
     });
 });
 var InputStyled = styled(Input)(function (_a) {
-    var theme = _a.theme;
+    var theme = _a.theme, readOnly = _a.readOnly;
     return ({
         padding: theme.spacing(0, 2, 0, 0),
         paddingInlineEnd: theme.spacing(2),
+        opacity: readOnly ? 0.6 : 1,
         input: {
             paddingInlineStart: theme.spacing(0)
         }

package/build/features/shared/SalesChannels/SalesChannel.js

@@ -50,10 +50,11 @@ var TextStyled = styled(Text)(function (_a) {
     return (__assign(__assign({ color: alpha(theme.palette.text.primary, 0.4), fontWeight: theme.typography.fontWeightLight, whiteSpace: 'pre' }, theme.typography.body2), { marginBlockStart: theme.spacing(1.75) }));
 });
 var CheckBoxStyled = styled(CheckBox)(function (_a) {
-    var theme = _a.theme;
+    var theme = _a.theme, disabled = _a.disabled;
     return ({
         paddingInline: '15px',
         marginInlineEnd: theme.spacing(-1),
+        opacity: disabled ? 0.6 : 1,
         '& .MuiSvgIcon-root': {
             fontSize: 30
         },

package/build/features/shared/UploadFile/FileUpload.js

@@ -60,9 +60,9 @@ import { maskFileName } from '../../../utils';
 import API from '../../../api';
 import { DeleteFileStatus, FileStatus, ICONS_NAMES, MAX_FILE_SIZE_FOUR_MB, VALID_FILE_FORMATS, FileRemoveType } from '../../../constants';
 import CheckIcon from '../../shared/CheckIcon';
-var BoxStyled = styled(Box)(function (_a) {
-    var theme = _a.theme;
-    return (__assign(__assign({ direction: theme.direction }, theme.typography.subtitle2), { color: theme.palette.primary.main, fontWeight: theme.typography.fontWeightBold, background: theme.palette.background.default, padding: theme.spacing(0, 2.5, 0), width: '88%', wordBreak: 'break-all', display: 'flex', justifyContent: 'space-between' }));
+var BoxStyled = styled(Box, { shouldForwardProp: function (prop) { return prop !== 'readOnly'; } })(function (_a) {
+    var theme = _a.theme, readOnly = _a.readOnly;
+    return (__assign(__assign(__assign({ direction: theme.direction }, theme.typography.subtitle2), { color: theme.palette.primary.main, fontWeight: theme.typography.fontWeightBold, background: theme.palette.background.default, padding: theme.spacing(0, 2.5, 0), width: '88%', wordBreak: 'break-all', display: 'flex', justifyContent: 'space-between' }), (readOnly && { opacity: '0.6' })));
 });
 var UploadBoxStyled = styled(Box, { shouldForwardProp: function (prop) { return !['uploading', 'readOnly'].includes(prop.toString()); } })(function (_a) {
     var theme = _a.theme, uploading = _a.uploading, readOnly = _a.readOnly;
@@ -253,12 +253,12 @@ var FileUpload = function (_a) {
     }, [name]);
     var canDownloadFile = fileId && status !== FileStatus.DOWNLOADING;
     var canDeleteFile = status !== FileStatus.UPLOADING && status !== FileStatus.DOWNLOADING;
-    return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(Box, __assign({ sx: { pointerEvents: isSubmitting ? 'none' : 'auto' } }, { children: _jsxs(InputContainerStyled, __assign({ sx: __assign({ borderTop: "1px solid ".concat(alpha(theme.palette.divider, 0.8)), borderBottom: "1px solid ".concat(alpha(theme.palette.divider, 0.8)) }, sx) }, { children: [_jsxs(BoxStyled, { children: [_jsxs(Box, __assign({ sx: {
+    return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(Box, __assign({ sx: { pointerEvents: isSubmitting ? 'none' : 'auto' } }, { children: _jsxs(InputContainerStyled, __assign({ sx: __assign({ borderTop: "1px solid ".concat(alpha(theme.palette.divider, 0.8)), borderBottom: "1px solid ".concat(alpha(theme.palette.divider, 0.8)) }, sx) }, { children: [_jsxs(BoxStyled, __assign({ readOnly: readOnly }, { children: [_jsxs(Box, __assign({ sx: {
                                     display: 'flex',
                                     flexDirection: 'column',
                                     padding: theme.spacing(1.5, 0, 1.5),
                                     width: '100%'
-                                } }, { children: [_jsxs(Box, __assign({ sx: { display: 'flex', flexDirection: 'row', cursor: canDownloadFile ? 'pointer' : 'auto' }, onClick: canDownloadFile ? function () { return downloadFile(); } : undefined }, { children: [_jsx(Icon, { src: ICONS_NAMES.DOC_ICON }), _jsx(Text, { children: name && maskFileName(name) })] })), _jsx(Box, __assign({ sx: { display: 'flex', flexDirection: 'row', justifyContent: 'center' } }, { children: _jsx(Collapse, __assign({ in: !!error, timeout: 400 }, { children: _jsxs(WarningContainer, { children: [_jsx(WarningIconStyled, { src: ICONS_NAMES.WARNING_ICON }), _jsx(Text, { children: t(error) })] }) })) }))] })), _jsx(ProgressBoxStyled, { children: getProgressComponent() })] }), _jsx(UploadBoxStyled, __assign({ readOnly: readOnly, uploading: status === FileStatus.UPLOADING || status === FileStatus.DOWNLOADING, onClick: function () {
+                                } }, { children: [_jsxs(Box, __assign({ sx: { display: 'flex', flexDirection: 'row', cursor: canDownloadFile ? 'pointer' : 'auto' }, onClick: canDownloadFile ? function () { return downloadFile(); } : undefined }, { children: [_jsx(Icon, { src: ICONS_NAMES.DOC_ICON }), _jsx(Text, { children: name && maskFileName(name) })] })), _jsx(Box, __assign({ sx: { display: 'flex', flexDirection: 'row', justifyContent: 'center' } }, { children: _jsx(Collapse, __assign({ in: !!error, timeout: 400 }, { children: _jsxs(WarningContainer, { children: [_jsx(WarningIconStyled, { src: ICONS_NAMES.WARNING_ICON }), _jsx(Text, { children: t(error) })] }) })) }))] })), _jsx(ProgressBoxStyled, { children: getProgressComponent() })] })), _jsx(UploadBoxStyled, __assign({ readOnly: readOnly, uploading: status === FileStatus.UPLOADING || status === FileStatus.DOWNLOADING, onClick: function () {
                             if (readOnly)
                                 return;
                             canDeleteFile && handleDeleteFile();

package/build/features/shared/UploadFile/UploadFile.js

@@ -11,7 +11,7 @@ var __assign = (this && this.__assign) || function () {
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
-import { styled } from '@mui/material/styles';
+import { styled, alpha } from '@mui/material/styles';
 import { ScreenContainer } from '../../shared/Containers';
 import Box from '@mui/material/Box';
 import { InputLabelStyled } from '../../shared/Input/Input';
@@ -38,13 +38,13 @@ var LabelContainerStyled = styled(Box)(function (_a) {
         padding: theme.spacing(0, 2.5, 1.25, 2.5)
     });
 });
-var BoxStyled = styled(Box)(function (_a) {
-    var theme = _a.theme;
-    return (__assign(__assign({ direction: theme.direction }, theme.typography.subtitle2), { color: theme.palette.primary.main, fontWeight: theme.typography.fontWeightBold, background: theme.palette.background.default, padding: theme.spacing(1.5, 2.5, 1.5), width: '88%', wordBreak: 'break-all', display: 'flex', justifyContent: 'space-between' }));
+var BoxStyled = styled(Box, { shouldForwardProp: function (prop) { return prop !== 'readOnly'; } })(function (_a) {
+    var theme = _a.theme, readOnly = _a.readOnly;
+    return (__assign(__assign(__assign({ direction: theme.direction }, theme.typography.subtitle2), { color: theme.palette.primary.main, fontWeight: theme.typography.fontWeightBold, background: theme.palette.background.default, padding: theme.spacing(1.5, 2.5, 1.5), width: '88%', wordBreak: 'break-all', display: 'flex', justifyContent: 'space-between' }), (readOnly && { opacity: '0.6' })));
 });
-var UploadBoxStyled = styled(Box)(function (_a) {
-    var theme = _a.theme;
-    return (__assign(__assign({}, theme.typography.caption), { background: theme.palette.primary.main, color: theme.palette.common.white, fontWeight: theme.typography.fontWeightRegular, cursor: 'pointer', width: '12%', display: 'flex', justifyContent: 'center', alignItems: 'center' }));
+var UploadBoxStyled = styled(Box, { shouldForwardProp: function (prop) { return prop !== 'readOnly'; } })(function (_a) {
+    var theme = _a.theme, readOnly = _a.readOnly;
+    return (__assign(__assign(__assign({}, theme.typography.caption), { background: theme.palette.primary.main, color: theme.palette.common.white, fontWeight: theme.typography.fontWeightRegular, cursor: 'pointer', width: '12%', display: 'flex', justifyContent: 'center', alignItems: 'center' }), (readOnly && { background: alpha(theme.palette.primary.main, 0.5), cursor: 'default' })));
 });
 var ClearIconStyled = styled(ClearIcon)(function (_a) {
     var theme = _a.theme;

package/build/features/shared/UploadMultipleFile/UploadFile.js

@@ -60,9 +60,9 @@ import { maskFileName } from '../../../utils';
 import API from '../../../api';
 import { DeleteFileStatus, FileStatus, ICONS_NAMES, MAX_FILE_SIZE_FOUR_MB, VALID_FILE_FORMATS } from '../../../constants';
 import CheckIcon from '../../shared/CheckIcon';
-var BoxStyled = styled(Box)(function (_a) {
-    var theme = _a.theme;
-    return (__assign(__assign({ direction: theme.direction }, theme.typography.subtitle2), { color: theme.palette.primary.main, fontWeight: theme.typography.fontWeightBold, background: theme.palette.background.default, padding: theme.spacing(0, 2.5, 0), width: '88%', wordBreak: 'break-all', display: 'flex', justifyContent: 'space-between' }));
+var BoxStyled = styled(Box, { shouldForwardProp: function (prop) { return prop !== 'readOnly'; } })(function (_a) {
+    var theme = _a.theme, readOnly = _a.readOnly;
+    return (__assign(__assign(__assign({ direction: theme.direction }, theme.typography.subtitle2), { color: theme.palette.primary.main, fontWeight: theme.typography.fontWeightBold, background: theme.palette.background.default, padding: theme.spacing(0, 2.5, 0), width: '88%', wordBreak: 'break-all', display: 'flex', justifyContent: 'space-between' }), (readOnly && { opacity: '0.6' })));
 });
 var UploadBoxStyled = styled(Box, { shouldForwardProp: function (prop) { return !['uploading', 'readOnly'].includes(prop.toString()); } })(function (_a) {
     var theme = _a.theme, uploading = _a.uploading, readOnly = _a.readOnly;
@@ -259,12 +259,12 @@ var UploadFile = function (_a) {
     }, []);
     var canDownloadFile = uploadedFile.fileId && status !== FileStatus.DOWNLOADING;
     var canDeleteFile = !isAnyFileDoingDeleteUploadDownload;
-    return (_jsx(Box, __assign({ sx: { pointerEvents: isSubmitting ? 'none' : 'auto' } }, { children: _jsxs(InputContainerStyled, __assign({ sx: __assign({ borderTop: "1px solid ".concat(alpha(theme.palette.divider, 0.8)) }, sx) }, { children: [_jsxs(BoxStyled, { children: [_jsxs(Box, __assign({ sx: {
+    return (_jsx(Box, __assign({ sx: { pointerEvents: isSubmitting ? 'none' : 'auto' } }, { children: _jsxs(InputContainerStyled, __assign({ sx: __assign({ borderTop: "1px solid ".concat(alpha(theme.palette.divider, 0.8)) }, sx) }, { children: [_jsxs(BoxStyled, __assign({ readOnly: readOnly }, { children: [_jsxs(Box, __assign({ sx: {
                                 display: 'flex',
                                 flexDirection: 'column',
                                 padding: theme.spacing(1.5, 0, 1.5),
                                 width: '100%'
-                            } }, { children: [_jsxs(Box, __assign({ sx: { display: 'flex', flexDirection: 'row', cursor: canDownloadFile ? 'pointer' : 'auto' }, onClick: canDownloadFile ? function () { return downloadFile(); } : undefined }, { children: [_jsx(Icon, { src: ICONS_NAMES.DOC_ICON }), _jsx(Text, { children: maskFileName(name) })] })), _jsx(Box, __assign({ sx: { display: 'flex', flexDirection: 'row', justifyContent: 'center' } }, { children: _jsx(Collapse, __assign({ in: !!error, timeout: 400 }, { children: _jsxs(WarningContainer, { children: [_jsx(WarningIconStyled, { src: ICONS_NAMES.WARNING_ICON }), _jsx(Text, { children: t(error) })] }) })) }))] })), _jsx(ProgressBoxStyled, { children: getProgressComponent() })] }), _jsx(UploadBoxStyled, __assign({ readOnly: readOnly, uploading: status === FileStatus.UPLOADING || (!!isAnyFileDoingDeleteUploadDownload && deleteStatus !== DeleteFileStatus.DELETING), onClick: function () {
+                            } }, { children: [_jsxs(Box, __assign({ sx: { display: 'flex', flexDirection: 'row', cursor: canDownloadFile ? 'pointer' : 'auto' }, onClick: canDownloadFile ? function () { return downloadFile(); } : undefined }, { children: [_jsx(Icon, { src: ICONS_NAMES.DOC_ICON }), _jsx(Text, { children: maskFileName(name) })] })), _jsx(Box, __assign({ sx: { display: 'flex', flexDirection: 'row', justifyContent: 'center' } }, { children: _jsx(Collapse, __assign({ in: !!error, timeout: 400 }, { children: _jsxs(WarningContainer, { children: [_jsx(WarningIconStyled, { src: ICONS_NAMES.WARNING_ICON }), _jsx(Text, { children: t(error) })] }) })) }))] })), _jsx(ProgressBoxStyled, { children: getProgressComponent() })] })), _jsx(UploadBoxStyled, __assign({ readOnly: readOnly, uploading: status === FileStatus.UPLOADING || (!!isAnyFileDoingDeleteUploadDownload && deleteStatus !== DeleteFileStatus.DELETING), onClick: function () {
                         if (readOnly)
                             return;
                         canDeleteFile && handleDeleteFile(index);

package/build/features/tax/screens/TaxDetails/ConfirmPolicy.js

@@ -19,14 +19,11 @@ import CheckBox from '../../../../components/CheckBox';
 import Text from '../../../../components/Text';
 import Warning from '../../../../components/Warning';
 import Collapse from '../../../../components/Collapse';
-var ConfirmContainerStyled = styled(Box)(function (_a) {
-    var theme = _a.theme;
-    return ({
-        display: 'flex',
-        flexDirection: 'row',
-        alignItems: 'center',
-        padding: theme.spacing(0, 2.5, 0, 2.5)
-    });
+var ConfirmContainerStyled = styled(Box, { shouldForwardProp: function (prop) { return prop !== 'readOnly'; } })(function (_a) {
+    var theme = _a.theme, readOnly = _a.readOnly;
+    return (__assign({ display: 'flex', flexDirection: 'row', alignItems: 'center', padding: theme.spacing(0, 2.5, 0, 2.5) }, (readOnly && {
+        opacity: '0.6'
+    })));
 });
 var TextStyled = styled(Text)(function (_a) {
     var theme = _a.theme;
@@ -64,6 +61,6 @@ var ConfirmPolicy = function (_a) {
             return;
         confirmControl.field.onChange(checked);
     };
-    return (_jsxs(ScreenContainer, { children: [_jsxs(ConfirmContainerStyled, { children: [_jsx(CheckboxStyled, { disableRipple: true, disableFocusRipple: true, focusRipple: false, checked: confirmChecked, onChange: handleConfirmCheckedChange }), _jsx(TextStyled, { children: t('tax_confirm_information') })] }), _jsx(CollapseStyled, __assign({ in: !!warningMessage }, { children: _jsx(Warning, __assign({ warningType: 'alert' }, { children: warningMessage && t(warningMessage) })) }))] }));
+    return (_jsxs(ScreenContainer, { children: [_jsxs(ConfirmContainerStyled, __assign({ readOnly: readOnly }, { children: [_jsx(CheckboxStyled, { disableRipple: true, disableFocusRipple: true, focusRipple: false, checked: confirmChecked, onChange: handleConfirmCheckedChange }), _jsx(TextStyled, { children: t('tax_confirm_information') })] })), _jsx(CollapseStyled, __assign({ in: !!warningMessage }, { children: _jsx(Warning, __assign({ warningType: 'alert' }, { children: warningMessage && t(warningMessage) })) }))] }));
 };
 export default ConfirmPolicy;

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

@@ -11,14 +11,15 @@ var __assign = (this && this.__assign) || function () {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
-import { useAppDispatch } from '../../../../hooks';
+import { useAppDispatch, useAppSelector } from '../../../../hooks';
 import Box from '@mui/material/Box/Box';
 import { styled } from '@mui/material/styles';
 import OTPField from '../../../shared/OTP';
 import { useController, useFormContext } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
 import { DEFAULT_TIMER_VALUE } from '../../../../constants';
-import { resendOTP } from '../../../app/tax/taxStore';
+import { isTokenExpired } from '../../../../utils';
+import { resendOTP, taxSelector } from '../../../app/tax/taxStore';
 var BoxStyled = styled(Box)(function (_a) {
     var theme = _a.theme;
     return ({
@@ -33,6 +34,7 @@ var OTPInput = function (_a) {
     var t = useTranslation().t;
     var otpControl = useController({ name: 'otp', control: control });
     var dispatch = useAppDispatch();
+    var error = useAppSelector(taxSelector).error;
     var handleOnOTPChange = function (otp) {
         otpControl.field.onChange(otp);
     };
@@ -42,6 +44,6 @@ var OTPInput = function (_a) {
         dispatch(resendOTP());
     };
     var otpValue = otpControl.field.value;
-    return (_jsx(BoxStyled, __assign({ dir: 'ltr' }, { children: _jsx(OTPField, { loading: loading, timeEndLabel: t('ide_otp_resend_label'), timerInSeconds: DEFAULT_TIMER_VALUE, onResetClick: handleOnResendOTP, value: otpValue, onChange: function (number) { return handleOnOTPChange(number.toString()); } }) })));
+    return (_jsx(BoxStyled, __assign({ dir: 'ltr' }, { children: _jsx(OTPField, { loading: loading, timeEndLabel: t('ide_otp_resend_label'), timerInSeconds: DEFAULT_TIMER_VALUE, onResetClick: handleOnResendOTP, value: otpValue, hasError: isTokenExpired(error), onChange: function (number) { return handleOnOTPChange(number.toString()); } }) })));
 };
 export default React.memo(OTPInput);

package/build/utils/error.d.ts

@@ -1 +1,2 @@
 export declare const isNetworkError: (error: string | null) => boolean;
+export declare const isTokenExpired: (error: string | null) => boolean;

package/build/utils/error.js

@@ -1,3 +1,6 @@
 export var isNetworkError = function (error) {
     return ['network error', 'network request failed'].includes((error || '').trim().toLowerCase());
 };
+export var isTokenExpired = function (error) {
+    return ['token expired'].includes((error || '').trim().toLowerCase());
+};

package/build/utils/string.d.ts

@@ -42,7 +42,7 @@ export declare const getRequestHeaders: (deviceInfo: DeviceInfo) => {
 };
 export declare const removeRequestHeaders: () => void;
 export declare const getBaseUrl: () => string;
-export declare const getScreenNameBasedOnFlow: (flow: string, isAuthorizedUser?: boolean) => "CONNECT_NID_STEP" | "" | "BUSINESS_BUSINESS_TYPE_STEP" | "INDIVIDUAL_PERSONAL_INDIVIDUAL_INFO_STEP" | "INDIVIDUAL_LIST_STEP" | "BANK_BANK_DETAILS_STEP" | "TAX_TAX_DETAILS_STEP";
+export declare const getScreenNameBasedOnFlow: (flow: string, isAuthorizedUser?: boolean) => "CONNECT_NID_STEP" | "" | "BUSINESS_BUSINESS_TYPE_STEP" | "INDIVIDUAL_PERSONAL_INDIVIDUAL_INFO_STEP" | "INDIVIDUAL_LIST_STEP" | "BANK_BANK_DETAILS_STEP" | "TAX_TAX_DETAILS_STEP" | "ENTITY_NAME_STEP" | "BRAND_INFO_STEP";
 export declare const getEighteenYearsAgo: () => string;
 export declare const isKW: (flag: string) => boolean;
 export declare const isSA: (flag: string) => boolean;

package/build/utils/string.js

@@ -188,6 +188,12 @@ export var getScreenNameBasedOnFlow = function (flow, isAuthorizedUser) {
     if (flow === FlowsTypes.TAX) {
         return 'TAX_TAX_DETAILS_STEP';
     }
+    if (flow === FlowsTypes.BRAND) {
+        return 'BRAND_INFO_STEP';
+    }
+    if (flow === FlowsTypes.ENTITY) {
+        return 'ENTITY_NAME_STEP';
+    }
     return '';
 };
 export var getEighteenYearsAgo = function () {

package/package.json

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

package/build/api/address.d.ts

@@ -1,4 +0,0 @@
-declare const addressService: {
-    retrieveAddressFormat: (countryCode: string) => Promise<any>;
-};
-export { addressService };

package/build/api/address.js

@@ -1,12 +0,0 @@
-import { httpClient } from './axios';
-import { ENDPOINT_PATHS } from '../constants';
-var retrieveAddressFormat = function (countryCode) {
-    return httpClient({
-        method: 'get',
-        url: "".concat(ENDPOINT_PATHS.ADDRESS_PATH, "/").concat(countryCode)
-    });
-};
-var addressService = {
-    retrieveAddressFormat: retrieveAddressFormat
-};
-export { addressService };

package/build/features/entity/screens/EntityAddress/EntityAddress.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-export interface EntityAddressProps {
-}
-declare const EntityAddress: ({}: EntityAddressProps) => JSX.Element;
-export default EntityAddress;

package/build/features/entity/screens/EntityAddress/EntityAddress.js

@@ -1,42 +0,0 @@
-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 { useTranslation } from 'react-i18next';
-import { useAppDispatch, useAppSelector } from '../../../../hooks';
-import { entitySelector, updateEntityAddress } from '../../../app/entity/entityStore';
-import { handlePrevScreenStep, settingsSelector } from '../../../../app/settings';
-import { ScreenContainer } from '../../../shared/Containers';
-import Address from '../../../shared/Address';
-var EntityAddress = function (_a) {
-    var settings = useAppSelector(settingsSelector).data;
-    var _b = useAppSelector(entitySelector), data = _b.data, loading = _b.loading, error = _b.error;
-    var t = useTranslation().t;
-    var dispatch = useAppDispatch();
-    var _c = data.verify.responseBody || {}, addressFormat = _c.addressFormat, entity = _c.entity;
-    var billingAddress = data.entityAddressData.billingAddress;
-    var isNonEditable = false;
-    var countries = settings.countries;
-    var onAddressChange = function (_a, isValid) {
-        var country = _a.country, address = __rest(_a, ["country"]);
-        if (isValid) {
-            var data_1 = {
-                billingAddress: address
-            };
-            dispatch(updateEntityAddress(data_1));
-        }
-    };
-    var onBack = function () {
-        dispatch(handlePrevScreenStep());
-    };
-    return (_jsx(ScreenContainer, { children: _jsx(Address, { defaultValues: billingAddress, countryList: countries, format: addressFormat || [], disableCountry: true, onAddressChange: onAddressChange, isEditable: !isNonEditable, showSubmitButton: true, loading: loading, error: t(error || ''), onBack: function () { return onBack(); } }) }));
-};
-export default EntityAddress;

package/build/features/entity/screens/EntityAddress/index.d.ts

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

package/build/features/entity/screens/EntityAddress/index.js

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