@tap-payments/auth-jsconnect 2.0.43-test → 2.0.43

package/build/features/bank/Bank.js

@@ -28,7 +28,7 @@ var Bank = memo(function (props) {
     var theme = useAppTheme().theme;
     var dispatch = useAppDispatch();
     var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, settingLoading = _a.loading;
-    var _b = useAppSelector(bankSelector), customLoading = _b.customLoading, bankError = _b.error;
+    var _b = useAppSelector(bankSelector), customLoading = _b.customLoading, loading = _b.loading, bankError = _b.error;
     useAppConfig(__assign({ navigation: BANK_SCREENS_NAVIGATION }, props));
     useErrorListener(bankError || error);
     useStepStartedListener();
@@ -43,10 +43,10 @@ var Bank = memo(function (props) {
         dispatch(verifyLeadToken(token));
     };
     useEffect(function () {
-        if (!settingLoading)
+        if (!settingLoading && open)
             verifyToken();
     }, [settingLoading]);
-    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ open: open, isTapOrigin: isTapOrigin, loading: settingLoading || customLoading }, { children: _jsx(AnimationFlow, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading || customLoading, error: error, open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}), screenId: activeScreen.name }, { children: _jsx(FeatureContainer, { children: bankFeatureScreens.map(function (_a, index) {
+    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ open: open, isTapOrigin: isTapOrigin, loading: settingLoading || customLoading }, { children: _jsx(AnimationFlow, __assign({ pointerEvents: loading ? 'none' : 'auto', isTapOrigin: isTapOrigin, loading: settingLoading || customLoading, error: error, open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}), screenId: activeScreen.name }, { children: _jsx(FeatureContainer, { children: bankFeatureScreens.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));
@@ -64,6 +64,6 @@ export function unmountBankLib(elementId) {
         var _a;
         ((_a = element === null || element === void 0 ? void 0 : element.children) === null || _a === void 0 ? void 0 : _a.length) && element.removeChild(element.children[0]);
         removeElement(DIALOG_ID);
-        reactElement(elementId).unmount();
+        elementId && reactElement(elementId).unmount();
     }, 1000);
 }

package/build/features/bank/screens/BankDetails/BankDetails.js

@@ -9,6 +9,17 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { ScreenContainer } from '../../../shared/Containers';
@@ -16,7 +27,7 @@ import Beneficiary from './Beneficiary';
 import IBAN from './IBAN';
 import BankName from './BankName';
 import Button from '../../../shared/Button';
-import { useAppDispatch, useAppSelector } from '../../../../hooks';
+import { useAppDispatch, useAppSelector, useSetFromDefaultValues } from '../../../../hooks';
 import { BankValidation } from './validation';
 import { useTranslation } from 'react-i18next';
 import { useForm, FormProvider } from 'react-hook-form';
@@ -42,12 +53,14 @@ var ButtonStyled = styled(Button)(function (_a) {
 var BankDetails = function () {
     var _a = React.useState(false), ibanChecking = _a[0], setIbanChecking = _a[1];
     var dispatch = useAppDispatch();
-    var _b = useAppSelector(bankSelector), data = _b.data, loading = _b.loading, error = _b.error;
+    var _b = useAppSelector(bankSelector), data = _b.data, loading = _b.loading, error = _b.error, uploading = _b.uploading;
+    var _c = data.bankData, responseBody = _c.responseBody, defaultValues = __rest(_c, ["responseBody"]);
     var methods = useForm({
         resolver: yupResolver(BankValidation),
-        defaultValues: data.bankData,
+        defaultValues: defaultValues,
         mode: 'onChange'
     });
+    useSetFromDefaultValues(methods, defaultValues);
     var onSubmit = function (data) {
         dispatch(createBankAccount(data));
     };
@@ -56,11 +69,11 @@ var BankDetails = function () {
     var onBack = function () {
         dispatch(handleCurrentActiveScreen('BANK_SUCCESS_FOUR_FLOWS_BUTTONS_STEP'));
     };
-    var disabled = ibanChecking || !methods.formState.isValid || !!error;
+    var disabled = ibanChecking || !methods.formState.isValid || !!error || uploading;
     React.useEffect(function () {
         if (error)
             dispatch(clearError());
     }, [methods.formState.isValid, methods.watch('bankStatementFile')]);
-    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(Beneficiary, {}), _jsx(IBAN, { fetchingIban: function (value) { return setIbanChecking(value); }, ibanChecking: ibanChecking }), _jsx(BankName, {}), _jsx(BankStatement, {}), _jsx(ConfirmPolicy, {}), _jsx(ButtonStyled, __assign({ onBackClicked: function () { return onBack(); }, disabled: disabled, isAr: isAr, loading: loading, error: t(error || '') }, { children: t('confirm') }))] })) })) }));
+    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(Beneficiary, {}), _jsx(IBAN, { fetchingIban: function (value) { return setIbanChecking(value); }, ibanChecking: ibanChecking }), _jsx(BankName, {}), _jsx(BankStatement, {}), _jsx(ConfirmPolicy, {}), _jsx(ButtonStyled, __assign({ onBackClicked: function () { return onBack(); }, disabled: disabled, disableBack: true, isAr: isAr, loading: loading, error: t(error || '') }, { children: t('confirm') }))] })) })) }));
 };
 export default BankDetails;

package/build/features/bank/screens/BankDetails/BankName.js

@@ -47,7 +47,8 @@ var BankName = function () {
     React.useEffect(function () {
         var _a;
         var bankName = (_a = data.bankData.responseBody) === null || _a === void 0 ? void 0 : _a.bank_name;
-        setValue('bankName', bankName);
+        if (bankName && !bankNameValue)
+            setValue('bankName', bankName);
     }, [(_b = data.bankData.responseBody) === null || _b === void 0 ? void 0 : _b.bank_name]);
     var handleBankChange = function (_a) {
         var target = _a.target;

package/build/features/bank/screens/BankDetails/BankStatement.js

@@ -1,11 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
 import { styled } from '@mui/material/styles';
 import { ScreenContainer } from '../../../shared/Containers';
 import { useTranslation } from 'react-i18next';
 import { useController, useFormContext } from 'react-hook-form';
-import { useAppSelector } from '../../../../hooks';
-import { bankSelector } from '../../../app/bank/bankStore';
+import { useAppDispatch, useAppSelector } from '../../../../hooks';
+import { bankSelector, uploadBankStatement } from '../../../app/bank/bankStore';
 import UploadFile from '../../../shared/UploadFile';
+import { MAX_FILE_SIZE, VALID_FILE_FORMATS } from '../../../../constants';
 var FeatureStyled = styled(ScreenContainer)(function (_a) {
     var theme = _a.theme;
     return ({
@@ -13,18 +15,49 @@ var FeatureStyled = styled(ScreenContainer)(function (_a) {
     });
 });
 var BankStatement = function () {
-    var _a;
+    var _a, _b;
+    var _c = React.useState(0), progress = _c[0], setProgress = _c[1];
     var t = useTranslation().t;
-    var control = useFormContext().control;
+    var _d = useFormContext(), control = _d.control, setError = _d.setError, clearErrors = _d.clearErrors;
     var bankStatementFileControl = useController({ name: 'bankStatementFile', control: control });
-    var loading = useAppSelector(bankSelector).loading;
-    var error = (_a = bankStatementFileControl.fieldState.error) === null || _a === void 0 ? void 0 : _a.message;
+    var bankStatementIdControl = useController({ name: 'bankStatementId', control: control });
+    var _e = useAppSelector(bankSelector), loading = _e.loading, uploading = _e.uploading, sysError = _e.error;
+    var dispatch = useAppDispatch();
+    var bankStatementValue = bankStatementFileControl.field.value;
+    var error = ((_a = bankStatementFileControl.fieldState.error) === null || _a === void 0 ? void 0 : _a.message) || ((_b = bankStatementIdControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message);
     var handleBankStatementChange = function (file) {
-        bankStatementFileControl.field.onChange(file);
+        if (!VALID_FILE_FORMATS.includes(file === null || file === void 0 ? void 0 : file.type)) {
+            setError('bankStatementFile', { message: 'file_not_supported_alert' });
+        }
+        else if ((file === null || file === void 0 ? void 0 : file.size) > MAX_FILE_SIZE) {
+            setError('bankStatementFile', { message: 'file_size_alert' });
+        }
+        else {
+            bankStatementFileControl.field.onChange(file);
+            dispatch(uploadBankStatement({
+                file: file,
+                onProgress: function (value) {
+                    setProgress(value);
+                }
+            }));
+        }
     };
     var handleReset = function () {
         bankStatementFileControl.field.onChange(null);
+        bankStatementIdControl.field.onChange('');
+        setProgress(0);
     };
-    return (_jsx(FeatureStyled, { children: _jsx(UploadFile, { label: t('title_bank_statement'), dragTitle: t('drag_and_drop'), uploadTitle: t('title_upload_file'), onFileUploaded: handleBankStatementChange, isSubmitting: loading, onReset: handleReset, error: error && t(error) }) }));
+    React.useEffect(function () {
+        if (sysError === 'file_upload_error') {
+            setError('bankStatementId', { message: sysError });
+            bankStatementFileControl.field.onChange(null);
+            setProgress(0);
+        }
+    }, [sysError]);
+    React.useEffect(function () {
+        if ((bankStatementFileControl.formState.isValid || !!bankStatementValue) && error != 'file_upload_error')
+            clearErrors();
+    }, [bankStatementFileControl.formState.isValid, bankStatementValue]);
+    return (_jsx(FeatureStyled, { children: _jsx(UploadFile, { label: t('title_bank_statement'), title: t('drag_and_drop'), subTitle: t('subtitle_drop'), dragDescription: t('desc_drag_and_drop'), uploadingTitle: t('file_uploading_title'), successTitle: t('success_upload_bank_statement'), onFileUploaded: handleBankStatementChange, isFileUploaded: !uploading && !!bankStatementValue, isSubmitting: loading, isUploading: uploading, progress: progress, onReset: handleReset, error: error && t(error) }) }));
 };
 export default BankStatement;

package/build/features/bank/screens/BankDetails/Beneficiary.js

@@ -3,11 +3,10 @@ import * as React from 'react';
 import Input from '../../../shared/Input';
 import { useTranslation } from 'react-i18next';
 import { useController, useFormContext } from 'react-hook-form';
-import { styled } from '@mui/material';
-import { removeOnlyNumbers } from '../../../../utils';
+import { styled } from '@mui/material/styles';
 import { ScreenContainer } from '../../../shared/Containers';
 import { bankSelector } from '../../../app/bank/bankStore';
-import { useAppSelector, useLanguage } from '../../../../hooks';
+import { useAppSelector } from '../../../../hooks';
 import ClearIcon from '../../../shared/ClearIcon';
 import CheckIcon from '../../../shared/CheckIcon';
 var FeatureStyled = styled(ScreenContainer)(function (_a) {
@@ -25,27 +24,27 @@ var InputStyled = styled(Input)(function (_a) {
     });
 });
 var Beneficiary = function () {
-    var _a, _b, _c, _d;
+    var _a, _b;
     var t = useTranslation().t;
-    var _e = useFormContext(), setValue = _e.setValue, control = _e.control;
-    var isAr = useLanguage().isAr;
+    var _c = useFormContext(), setValue = _c.setValue, control = _c.control;
     var data = useAppSelector(bankSelector).data;
     var beneficiaryControl = useController({ name: 'beneficiaryName', control: control });
     var beneficiaryValue = beneficiaryControl.field.value;
     var hasError = (_a = beneficiaryControl.fieldState.error) === null || _a === void 0 ? void 0 : _a.message;
     var error = (_b = beneficiaryControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
-    var legalName = (_d = (_c = data.verify.responseBody) === null || _c === void 0 ? void 0 : _c.entity) === null || _d === void 0 ? void 0 : _d.legal_name;
+    var bank_account = (data.verify.responseBody || {}).bank_account;
     React.useEffect(function () {
-        setValue('beneficiaryName', isAr ? legalName === null || legalName === void 0 ? void 0 : legalName.ar : legalName === null || legalName === void 0 ? void 0 : legalName.en);
+        var beneficiary_name = (bank_account || {}).beneficiary_name;
+        if (beneficiary_name)
+            setValue('beneficiaryName', beneficiary_name);
     }, []);
     var handleBeneficiaryChange = function (_a) {
         var target = _a.target;
-        var value = removeOnlyNumbers(target.value);
-        beneficiaryControl.field.onChange(value);
+        beneficiaryControl.field.onChange(target.value);
     };
     var clearValue = function () {
         beneficiaryControl.field.onChange('');
     };
-    return (_jsx(FeatureStyled, { children: _jsx(InputStyled, { label: t('beneficiary_name'), onChange: handleBeneficiaryChange, disabled: !!legalName, value: beneficiaryValue, placeholder: t('beneficiary_name'), warningType: 'alert', warningMessage: error && t(error), required: true, endAdornment: !hasError && beneficiaryValue ? _jsx(CheckIcon, {}) : beneficiaryValue && _jsx(ClearIcon, { onClick: clearValue }) }) }));
+    return (_jsx(FeatureStyled, { children: _jsx(InputStyled, { label: t('beneficiary_name'), onChange: handleBeneficiaryChange, value: beneficiaryValue, placeholder: t('beneficiary_name'), warningType: 'alert', warningMessage: error && t(error), required: true, endAdornment: !hasError && beneficiaryValue ? _jsx(CheckIcon, {}) : beneficiaryValue && _jsx(ClearIcon, { onClick: clearValue }) }) }));
 };
 export default Beneficiary;

package/build/features/bank/screens/BankDetails/IBAN.js

@@ -50,6 +50,8 @@ import axios from 'axios';
 import ClearIcon from '../../../shared/ClearIcon';
 import CheckIcon from '../../../shared/CheckIcon';
 import CircularProgress from '@mui/material/CircularProgress';
+import { settingsSelector } from '../../../../app/settings';
+import { useAppSelector } from '../../../../hooks';
 var InputStyled = styled(Input)(function () { return ({
     input: {
         textTransform: 'uppercase'
@@ -60,6 +62,7 @@ var IBAN = function (_a) {
     var _b;
     var fetchingIban = _a.fetchingIban, ibanChecking = _a.ibanChecking;
     var dispatch = useAppDispatch();
+    var settingsData = useAppSelector(settingsSelector).data;
     var t = useTranslation().t;
     var control = useFormContext().control;
     var ibanControl = useController({ name: 'iban', control: control });
@@ -92,6 +95,6 @@ var IBAN = function (_a) {
     var clearValue = function () {
         ibanControl.field.onChange('');
     };
-    return (_jsx(ScreenContainer, { children: _jsx(InputStyled, { label: t('enter_iban'), inputProps: { maxLength: MAX_IBAN_VALUE }, onChange: handleIbanChange, value: ibanValue, placeholder: t('enter_iban_placeholder'), warningType: 'alert', warningMessage: error && t(error), required: true, endAdornment: ibanChecking ? (_jsx(CircularProgress, { size: 25, thickness: 5, sx: { height: 'auto !important' } })) : !error && ibanValue ? (_jsx(CheckIcon, {})) : (ibanValue && _jsx(ClearIcon, { onClick: clearValue })) }) }));
+    return (_jsx(ScreenContainer, { children: _jsx(InputStyled, { label: t('enter_iban'), inputProps: { maxLength: MAX_IBAN_VALUE }, onChange: handleIbanChange, value: ibanValue, placeholder: t('iban_input_placeholder', { countrycode: settingsData.businessCountry.iso2.toUpperCase() }), warningType: 'alert', warningMessage: error && t(error), required: true, endAdornment: ibanChecking ? (_jsx(CircularProgress, { size: 25, thickness: 5, sx: { height: 'auto !important' } })) : !error && ibanValue ? (_jsx(CheckIcon, {})) : (ibanValue && _jsx(ClearIcon, { onClick: clearValue })) }) }));
 };
 export default IBAN;

package/build/features/bank/screens/BankDetails/validation.js

@@ -1,4 +1,4 @@
-import { REGEX_BENEFICIARY_NAME, MAX_FILE_SIZE, VALID_FILE_FORMATS } from '../../../../constants';
+import { MAX_FILE_SIZE, VALID_FILE_FORMATS, REGEX_ALPHANUMERIC } from '../../../../constants';
 import * as yup from 'yup';
 export var BankValidation = yup.object().shape({
     iban: yup
@@ -10,7 +10,7 @@ export var BankValidation = yup.object().shape({
     bankName: yup.string().optional(),
     beneficiaryName: yup
         .string()
-        .matches(REGEX_BENEFICIARY_NAME, 'beneficiary_name_invalid')
+        .matches(REGEX_ALPHANUMERIC, 'beneficiary_name_invalid')
         .required('beneficiary_name_required'),
     bankStatementId: yup.string().optional(),
     bankStatementFile: yup

package/build/features/bank/screens/Success/Success.js

@@ -7,10 +7,14 @@ import { bankSelector, updateBoardSuccess } from '../../../app/bank/bankStore';
 var Success = function (_a) {
     var t = useTranslation().t;
     var dispatch = useAppDispatch();
-    var _b = useAppSelector(bankSelector), loading = _b.loading, error = _b.error;
-    var onSuccess = function () {
+    var _b = useAppSelector(bankSelector), error = _b.error, loading = _b.loading;
+    var _c = React.useState(false), clicked = _c[0], setClicked = _c[1];
+    React.useEffect(function () {
         dispatch(updateBoardSuccess());
+    }, []);
+    var onSuccess = function () {
+        setClicked(true);
     };
-    return (_jsx(SuccessScreen, { title: t('bank_success_title'), onSuccess: onSuccess, successTitle: t('continue'), loading: loading, error: error || '' }));
+    return (_jsx(SuccessScreen, { title: t('bank_success_title'), onSuccess: onSuccess, successTitle: t('continue'), loading: clicked && loading, error: error || '' }));
 };
 export default React.memo(Success);

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

@@ -16,7 +16,7 @@ import { styled } from '@mui/material/styles';
 import { FlowsButtons } from '../../../shared/Button';
 import { ICONS_NAMES, PASSWORD_OPERATION_TYPE } from '../../../../constants';
 import { useAppSelector, useLanguage } from '../../../../hooks';
-import { getResetFlowUrl, showLastFour } from '../../../../utils';
+import { getResetFlowUrl, showLastFour, concatenateObjectValues, shortenBankName } from '../../../../utils';
 import { bankSelector } from '../../../app/bank/bankStore';
 import Box from '@mui/material/Box';
 import Text from '../../../../components/Text';
@@ -44,23 +44,27 @@ var ButtonGroupStyled = styled(Box)(function (_a) {
     });
 });
 var SuccessWithFlowButtons = function () {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     var t = useTranslation().t;
     var isAr = useLanguage().isAr;
     var data = useAppSelector(bankSelector).data;
-    var _d = data.verify.responseBody || {}, flows = _d.flows, nameObj = _d.name, entity = _d.entity, brand = _d.brand, bank = _d.bank_account, merchant = _d.merchant, identification_id = _d.identification_id;
-    var _e = useState([]), buttons = _e[0], setButtons = _e[1];
-    var username = ((nameObj === null || nameObj === void 0 ? void 0 : nameObj.first) || '') + ' ' + ((nameObj === null || nameObj === void 0 ? void 0 : nameObj.last) || '');
+    var _e = data.verify.responseBody || {}, flows = _e.flows, nameObj = _e.name, entity = _e.entity, brand = _e.brand, bank = _e.bank_account, merchant = _e.merchant, user = _e.user;
+    var _f = useState([]), buttons = _f[0], setButtons = _f[1];
+    var _g = nameObj || {}, en = _g.en, ar = _g.ar;
+    var username = isAr
+        ? concatenateObjectValues(ar || en, ['first', 'last'])
+        : concatenateObjectValues(en, ['first', 'last']);
     var licenseNumber = ((_a = entity === null || entity === void 0 ? void 0 : entity.license) === null || _a === void 0 ? void 0 : _a.number) || '';
-    var bankName = (bank === null || bank === void 0 ? void 0 : bank.name) || t('bank');
+    var bankName = shortenBankName(bank === null || bank === void 0 ? void 0 : bank.name) || t('bank');
     var iban = showLastFour((bank === null || bank === void 0 ? void 0 : bank.iban) || '');
-    var taxID = (entity === null || entity === void 0 ? void 0 : entity.tax_number) || '';
+    var taxID = (entity === null || entity === void 0 ? void 0 : entity.vat_id) || '';
     var brandName = (isAr ? (_b = brand === null || brand === void 0 ? void 0 : brand.name) === null || _b === void 0 ? void 0 : _b.ar : (_c = brand === null || brand === void 0 ? void 0 : brand.name) === null || _c === void 0 ? void 0 : _c.en) || '';
     var isAcceptance = merchant === null || merchant === void 0 ? void 0 : merchant.is_acceptance_allowed;
     var isPayout = merchant === null || merchant === void 0 ? void 0 : merchant.is_payout_allowed;
-    var maskedId = !!identification_id ? " ".concat(t('masking_symbols')).concat(identification_id) : '';
+    var identification = user.identification;
+    var maskedId = (identification === null || identification === void 0 ? void 0 : identification.id) ? " ".concat(t('masking_symbols')).concat((_d = identification === null || identification === void 0 ? void 0 : identification.id) === null || _d === void 0 ? void 0 : _d.slice(-2)) : '';
     var settings = useAppSelector(settingsSelector);
-    var _f = data.verify.responseBody || { contact: {}, board_id: '' }, contact = _f.contact, board_id = _f.board_id, board_info_id = _f.board_info_id;
+    var _h = data.verify.responseBody || { contact: {}, board_id: '' }, contact = _h.contact, board_id = _h.board_id, board_info_id = _h.board_info_id;
     var email = (contact || { email: '' }).email;
     var url = getResetFlowUrl('/password', settings.data.language, PASSWORD_OPERATION_TYPE.RESET_PASSWORD, board_id, board_info_id);
     var reMapFlowData = function (flows) {
@@ -74,10 +78,10 @@ var SuccessWithFlowButtons = function () {
             var title = t("".concat(name, "_flow_").concat(type), {
                 individual_name: username.toLowerCase() + maskedId,
                 business_type: brandName,
-                license_number: t('masking_symbols') + showLastFour(licenseNumber),
+                license_number: licenseNumber ? t('masking_symbols') + showLastFour(licenseNumber) : '',
                 bank_name: bankName,
-                iban: t('masking_symbols') + iban,
-                tax_id: t('masking_symbols') + showLastFour(taxID)
+                iban: iban ? t('masking_symbols') + iban : '',
+                tax_id: taxID ? t('masking_symbols') + showLastFour(taxID) : ''
             });
             var isCompleted = status === 'completed' && name !== 'password';
             var isIndividual = name === 'individual';

package/build/features/business/Business.js

@@ -28,7 +28,7 @@ var Business = memo(function (props) {
     var theme = useAppTheme().theme;
     var dispatch = useAppDispatch();
     var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, settingLoading = _a.loading;
-    var _b = useAppSelector(businessSelector), customLoading = _b.customLoading, businessError = _b.error;
+    var _b = useAppSelector(businessSelector), customLoading = _b.customLoading, businessError = _b.error, loading = _b.loading;
     useAppConfig(__assign({ navigation: BUSINESS_SCREENS_NAVIGATION }, props));
     useErrorListener(businessError || error);
     useStepStartedListener();
@@ -43,10 +43,10 @@ var Business = memo(function (props) {
         dispatch(verifyLeadToken(token));
     };
     useEffect(function () {
-        if (!settingLoading)
+        if (!settingLoading && open)
             verifyToken();
     }, [settingLoading]);
-    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ open: open, isTapOrigin: isTapOrigin, loading: settingLoading || customLoading }, { children: _jsx(AnimationFlow, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading || customLoading, error: error, open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}), screenId: activeScreen.name }, { children: _jsx(FeatureContainer, { children: businessFeatureScreens.map(function (_a, index) {
+    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ open: open, isTapOrigin: isTapOrigin, loading: settingLoading || customLoading }, { children: _jsx(AnimationFlow, __assign({ pointerEvents: loading ? 'none' : 'auto', isTapOrigin: isTapOrigin, loading: settingLoading || customLoading, error: error, open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}), screenId: activeScreen.name }, { children: _jsx(FeatureContainer, { children: businessFeatureScreens.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));
@@ -65,6 +65,6 @@ export function unmountBusinessLib(elementId, unmountTimeout) {
         var _a;
         ((_a = element === null || element === void 0 ? void 0 : element.children) === null || _a === void 0 ? void 0 : _a.length) && element.removeChild(element.children[0]);
         removeElement(DIALOG_ID);
-        reactElement(elementId).unmount();
+        elementId && reactElement(elementId).unmount();
     }, unmountTimeout);
 }

package/build/features/business/screens/Activities/Activities.js

@@ -9,18 +9,28 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { styled } from '@mui/material/styles';
 import ActivitiesList from './ActivitiesList';
 import { useForm, FormProvider } from 'react-hook-form';
-import { useAppDispatch, useLanguage, useAppSelector } from '../../../../hooks';
+import { useAppDispatch, useLanguage, useAppSelector, useSetFromDefaultValues } from '../../../../hooks';
 import Form from '../../../../components/Form';
 import { yupResolver } from '@hookform/resolvers/yup';
 import { useTranslation } from 'react-i18next';
 import { handlePrevScreenStep } from '../../../../app/settings';
 import Button from '../../../shared/Button';
-import SalesChannels from './SalesChannels';
 import { ScreenContainer } from '../../../shared/Containers';
 import Collapse from '../../../../components/Collapse';
 import OperationStartDate from './OperationStartDate';
@@ -38,12 +48,13 @@ var Activities = function () {
     var isAr = useLanguage().isAr;
     var t = useTranslation().t;
     var _c = useAppSelector(businessSelector), data = _c.data, loading = _c.loading, error = _c.error;
-    var activitiesData = data.activitiesData;
+    var _d = data.activitiesData, responseBody = _d.responseBody, defaultValues = __rest(_d, ["responseBody"]);
     var methods = useForm({
         resolver: yupResolver(ActivitiesValidationSchema),
-        defaultValues: activitiesData,
+        defaultValues: defaultValues,
         mode: 'onChange'
     });
+    useSetFromDefaultValues(methods, defaultValues, true);
     var onSubmit = function (data) {
         dispatch(updateActivitiesInfo(__assign({}, data)));
     };
@@ -53,18 +64,6 @@ var Activities = function () {
     var onBack = function () {
         dispatch(handlePrevScreenStep());
     };
-    React.useEffect(function () {
-        var salesChannels = activitiesData.salesChannels;
-        methods.setValue('salesChannels', salesChannels);
-    }, [activitiesData.salesChannels]);
-    React.useEffect(function () {
-        var activities = activitiesData.activities;
-        methods.setValue('activities', activities);
-    }, [activitiesData === null || activitiesData === void 0 ? void 0 : activitiesData.activities]);
-    React.useEffect(function () {
-        if (activitiesData.operationStartDate)
-            methods.setValue('operationStartDate', activitiesData.operationStartDate, { shouldValidate: true });
-    }, [activitiesData.operationStartDate]);
     React.useEffect(function () {
         if (error)
             dispatch(clearError());
@@ -73,6 +72,6 @@ var Activities = function () {
         anchorEl ? setAnchorEl(false) : setAnchorEl(true);
     };
     var disabled = !methods.formState.isValid || !!error;
-    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(Collapse, __assign({ in: !collapse && !anchorEl }, { children: _jsx(LicenseName, {}) })), _jsxs(Collapse, __assign({ in: !collapse }, { children: [_jsx(ActivitiesList, { onListOpen: function () { return handleMenuClick(); }, onListClose: function () { return handleMenuClick(); } }), _jsx(Collapse, __assign({ in: !anchorEl }, { children: _jsx(SalesChannels, {}) }))] })), _jsx(Collapse, __assign({ in: !anchorEl }, { children: _jsx(OperationStartDate, { onDateClicked: handleCollapseOpenClose }) })), _jsx(Collapse, __assign({ in: !collapse && !anchorEl }, { children: _jsx(Button, __assign({ disableBack: true, onBackClicked: function () { return onBack(); }, isAr: isAr, disabled: disabled, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })) })) }));
+    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(Collapse, __assign({ in: !collapse && !anchorEl }, { children: _jsx(LicenseName, {}) })), _jsx(Collapse, __assign({ in: !collapse }, { children: _jsx(ActivitiesList, { onListOpen: function () { return handleMenuClick(); }, onListClose: function () { return handleMenuClick(); } }) })), _jsx(Collapse, __assign({ in: !anchorEl }, { children: _jsx(OperationStartDate, { onDateClicked: handleCollapseOpenClose }) })), _jsx(Collapse, __assign({ in: !collapse && !anchorEl }, { children: _jsx(Button, __assign({ disableBack: true, onBackClicked: function () { return onBack(); }, isAr: isAr, disabled: disabled, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })) })) }));
 };
 export default Activities;

package/build/features/business/screens/Activities/ActivitiesList.d.ts

@@ -17,10 +17,46 @@ export declare const InputStyled: import("@emotion/styled").StyledComponent<Pick
     hide?: boolean | undefined;
     warningType?: "alert" | "error" | "hint" | undefined;
 } & {} & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const InfoOutlinedIconStyled: import("@emotion/styled").StyledComponent<{
+    children?: React.ReactNode;
+    classes?: Partial<import("@mui/material").SvgIconClasses> | undefined;
+    color?: "inherit" | "disabled" | "error" | "success" | "info" | "primary" | "secondary" | "action" | "warning" | undefined;
+    fontSize?: "small" | "inherit" | "medium" | "large" | undefined;
+    htmlColor?: string | undefined;
+    inheritViewBox?: boolean | undefined;
+    shapeRendering?: string | undefined;
+    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
+    titleAccess?: string | undefined;
+    viewBox?: string | undefined;
+} & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<React.SVGProps<SVGSVGElement>, "string" | "name" | "type" | "version" | "className" | "style" | "display" | "overflow" | "visibility" | "order" | "color" | "width" | "height" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "clipPath" | "cursor" | "direction" | "filter" | "fontSizeAdjust" | "fontStretch" | "fontVariant" | "imageRendering" | "opacity" | "paintOrder" | "pointerEvents" | "rotate" | "scale" | "textRendering" | "transform" | "unicodeBidi" | "wordSpacing" | "writingMode" | "mask" | "offset" | "textDecoration" | "azimuth" | "clip" | "alignmentBaseline" | "baselineShift" | "clipRule" | "colorInterpolation" | "colorRendering" | "dominantBaseline" | "fill" | "fillOpacity" | "fillRule" | "floodColor" | "floodOpacity" | "glyphOrientationVertical" | "lightingColor" | "markerEnd" | "markerMid" | "markerStart" | "shapeRendering" | "stopColor" | "stopOpacity" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "textAnchor" | "vectorEffect" | "path" | "key" | "id" | "lang" | "tabIndex" | "role" | "children" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "end" | "values" | "local" | "x" | "y" | "alphabetic" | "hanging" | "ideographic" | "mathematical" | "origin" | "method" | "spacing" | "elevation" | "in" | "max" | "href" | "orientation" | "media" | "target" | "min" | "viewBox" | "crossOrigin" | "accentHeight" | "accumulate" | "additive" | "allowReorder" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "baseFrequency" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clipPathUnits" | "colorInterpolationFilters" | "colorProfile" | "contentScriptType" | "contentStyleType" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "divisor" | "dur" | "dx" | "dy" | "edgeMode" | "enableBackground" | "exponent" | "externalResourcesRequired" | "filterRes" | "filterUnits" | "focusable" | "format" | "fr" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphRef" | "gradientTransform" | "gradientUnits" | "horizAdvX" | "horizOriginX" | "in2" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "limitingConeAngle" | "markerHeight" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mode" | "numOctaves" | "operator" | "orient" | "overlinePosition" | "overlineThickness" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rx" | "ry" | "seed" | "slope" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "strikethroughPosition" | "strikethroughThickness" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textLength" | "to" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewTarget" | "vMathematical" | "widths" | "x1" | "x2" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "yChannelSelector" | "z" | "zoomAndPan"> & {
+    ref?: ((instance: SVGSVGElement | null) => void) | React.RefObject<SVGSVGElement> | null | undefined;
+}, keyof import("@mui/material/OverridableComponent").CommonProps | "color" | "fontSize" | "shapeRendering" | "children" | "sx" | "htmlColor" | "inheritViewBox" | "titleAccess" | "viewBox"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const InfoIconStyled: import("@emotion/styled").StyledComponent<{
+    children?: React.ReactNode;
+    classes?: Partial<import("@mui/material").SvgIconClasses> | undefined;
+    color?: "inherit" | "disabled" | "error" | "success" | "info" | "primary" | "secondary" | "action" | "warning" | undefined;
+    fontSize?: "small" | "inherit" | "medium" | "large" | undefined;
+    htmlColor?: string | undefined;
+    inheritViewBox?: boolean | undefined;
+    shapeRendering?: string | undefined;
+    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
+    titleAccess?: string | undefined;
+    viewBox?: string | undefined;
+} & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<React.SVGProps<SVGSVGElement>, "string" | "name" | "type" | "version" | "className" | "style" | "display" | "overflow" | "visibility" | "order" | "color" | "width" | "height" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "clipPath" | "cursor" | "direction" | "filter" | "fontSizeAdjust" | "fontStretch" | "fontVariant" | "imageRendering" | "opacity" | "paintOrder" | "pointerEvents" | "rotate" | "scale" | "textRendering" | "transform" | "unicodeBidi" | "wordSpacing" | "writingMode" | "mask" | "offset" | "textDecoration" | "azimuth" | "clip" | "alignmentBaseline" | "baselineShift" | "clipRule" | "colorInterpolation" | "colorRendering" | "dominantBaseline" | "fill" | "fillOpacity" | "fillRule" | "floodColor" | "floodOpacity" | "glyphOrientationVertical" | "lightingColor" | "markerEnd" | "markerMid" | "markerStart" | "shapeRendering" | "stopColor" | "stopOpacity" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "textAnchor" | "vectorEffect" | "path" | "key" | "id" | "lang" | "tabIndex" | "role" | "children" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "end" | "values" | "local" | "x" | "y" | "alphabetic" | "hanging" | "ideographic" | "mathematical" | "origin" | "method" | "spacing" | "elevation" | "in" | "max" | "href" | "orientation" | "media" | "target" | "min" | "viewBox" | "crossOrigin" | "accentHeight" | "accumulate" | "additive" | "allowReorder" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "baseFrequency" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clipPathUnits" | "colorInterpolationFilters" | "colorProfile" | "contentScriptType" | "contentStyleType" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "divisor" | "dur" | "dx" | "dy" | "edgeMode" | "enableBackground" | "exponent" | "externalResourcesRequired" | "filterRes" | "filterUnits" | "focusable" | "format" | "fr" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphRef" | "gradientTransform" | "gradientUnits" | "horizAdvX" | "horizOriginX" | "in2" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "limitingConeAngle" | "markerHeight" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mode" | "numOctaves" | "operator" | "orient" | "overlinePosition" | "overlineThickness" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rx" | "ry" | "seed" | "slope" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "strikethroughPosition" | "strikethroughThickness" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textLength" | "to" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewTarget" | "vMathematical" | "widths" | "x1" | "x2" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "yChannelSelector" | "z" | "zoomAndPan"> & {
+    ref?: ((instance: SVGSVGElement | null) => void) | React.RefObject<SVGSVGElement> | null | undefined;
+}, keyof import("@mui/material/OverridableComponent").CommonProps | "color" | "fontSize" | "shapeRendering" | "children" | "sx" | "htmlColor" | "inheritViewBox" | "titleAccess" | "viewBox"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const LabelContainerStyled: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material/styles").Theme> & {
+    children?: React.ReactNode;
+    component?: React.ElementType<any> | undefined;
+    ref?: React.Ref<unknown> | undefined;
+    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
+} & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/material/OverridableComponent").CommonProps | ("border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "color" | "zIndex" | "position" | "top" | "right" | "bottom" | "left" | "boxShadow" | "width" | "maxWidth" | "minWidth" | "height" | "maxHeight" | "minHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "typography" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "textTransform") | "ref" | "children" | "component" | "sx"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
 export declare const CheckIconStyled: import("@emotion/styled").StyledComponent<{
     children?: React.ReactNode;
     classes?: Partial<import("@mui/material").SvgIconClasses> | undefined;
-    color?: "inherit" | "disabled" | "error" | "info" | "primary" | "secondary" | "action" | "success" | "warning" | undefined;
+    color?: "inherit" | "disabled" | "error" | "success" | "info" | "primary" | "secondary" | "action" | "warning" | undefined;
     fontSize?: "small" | "inherit" | "medium" | "large" | undefined;
     htmlColor?: string | undefined;
     inheritViewBox?: boolean | undefined;