@tap-payments/auth-jsconnect 2.10.6-beta → 2.10.6-development

package/build/components/ArabicDatePicker/ArabicDatePicker.js

@@ -1,116 +1,116 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-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 React, { memo } from 'react';
-import { Calendar, toDateObject } from 'react-multi-date-picker';
-import arabic from 'react-date-object/calendars/arabic';
-import Box from '@mui/material/Box';
-import { styled } from '@mui/material/styles';
-import Divider from '@mui/material/Divider';
-import Collapse from '../Collapse';
-import Icon from '../Icon';
-import { ICONS_NAMES } from '../../constants';
-import { getEighteenYearsAgo } from '../../utils';
-import { EndAdornmentExpanded } from '../../features/shared/EndAdornment';
-import Input from '../Input';
-import Text from '../Text';
-import arabic_en from './arabicEn';
-import arabic_ar from './arabicAr';
-import './style.css';
-var ContainerIcon = styled(Icon, { shouldForwardProp: function (prop) { return prop !== 'disabled'; } })(function (_a) {
-    var theme = _a.theme, disabled = _a.disabled;
-    return (__assign(__assign({ marginInlineStart: theme.spacing(2.5) }, theme.typography.h6), { cursor: disabled ? 'auto' : 'pointer', width: theme.spacing(2), height: theme.spacing(2) }));
-});
-var Container = styled(Box, { shouldForwardProp: function (prop) { return prop !== 'disabled' && prop !== 'openCalender'; } })(function (_a) {
-    var theme = _a.theme, disabled = _a.disabled, openCalender = _a.openCalender;
-    return ({
-        transition: 'min-height 0.5s',
-        cursor: disabled ? 'auto' : 'pointer',
-        opacity: disabled ? '0.6' : '1',
-        fontFamily: theme.typography.fontFamily,
-        minHeight: openCalender ? '345px' : '46px'
-    });
-});
-var InputFieldStyled = styled(Input)(function (_a) {
-    var theme = _a.theme, disabled = _a.disabled;
-    return ({
-        cursor: disabled ? 'auto' : 'pointer',
-        '&::placeholder': __assign(__assign({ opacity: 1, color: theme.palette.text.primary, lineHeight: theme.spacing(2.125) }, theme.typography.body2), { fontWeight: theme.typography.fontWeightLight }),
-        '& .MuiInputBase-input': {
-            WebkitTextFillColor: 'inherit',
-            cursor: disabled ? 'auto' : 'pointer'
-        }
-    });
-});
-var ArrowIcon = styled(Text, { shouldForwardProp: function (prop) { return prop !== 'disabled'; } })(function (_a) {
-    var theme = _a.theme, disabled = _a.disabled;
-    return ({
-        cursor: disabled ? 'auto' : 'pointer',
-        marginInlineEnd: theme.spacing(2.5),
-        display: 'flex'
-    });
-});
-var DatePicker = function (_a) {
-    var _b = _a.open, open = _b === void 0 ? false : _b, disabled = _a.disabled, dir = _a.dir, readOnly = _a.readOnly, onDateChange = _a.onDateChange, onClick = _a.onClick, onDatePicked = _a.onDatePicked, value = _a.value, isDob = _a.isDob, isVerified = _a.isVerified, minDate = _a.minDate, maxDate = _a.maxDate, rest = __rest(_a, ["open", "disabled", "dir", "readOnly", "onDateChange", "onClick", "onDatePicked", "value", "isDob", "isVerified", "minDate", "maxDate"]);
-    var _c = React.useState(), date = _c[0], setDate = _c[1];
-    var _d = React.useState(null), anchor = _d[0], setAnchor = _d[1];
-    var _e = React.useState(open), openCalender = _e[0], setOpenCalender = _e[1];
-    var calenderIcon = _jsx(ContainerIcon, { disabled: disabled, src: ICONS_NAMES.SWITCH_HIJRI_CALENDER });
-    var defaultMax = new Date();
-    var defaultMin = new Date('1900-01-01');
-    var DATE_FORMAT = 'YYYY-MM-DD';
-    React.useEffect(function () {
-        if (value)
-            setDate(value);
-    }, [value]);
-    var toggleCalender = function (event) {
-        if (anchor || openCalender) {
-            onDatePicked === null || onDatePicked === void 0 ? void 0 : onDatePicked();
-            setOpenCalender(false);
-            return setAnchor(null);
-        }
-        setAnchor(event.currentTarget);
-        setOpenCalender(true);
-        onClick === null || onClick === void 0 ? void 0 : onClick();
-    };
-    var getEndAdornment = function () {
-        if (disabled && !isVerified)
-            return '';
-        return _jsx(EndAdornmentExpanded, { isVerified: isVerified, anchorEl: anchor });
-    };
-    var handleOnDateChange = function (date) {
-        onDateChange === null || onDateChange === void 0 ? void 0 : onDateChange(date.toDate().toLocaleDateString('en-CA'));
-        setAnchor(null);
-        setOpenCalender(false);
-        onDatePicked === null || onDatePicked === void 0 ? void 0 : onDatePicked();
-    };
-    var formateDate = function (date) {
-        var dateObject = toDateObject(date);
-        return dateObject.convert(arabic).format(DATE_FORMAT);
-    };
-    return (_jsxs(Container, __assign({ openCalender: openCalender, disabled: disabled, id: 'arabic-container-calendar' }, { children: [_jsx(InputFieldStyled, { endAdornment: _jsx(ArrowIcon, __assign({ disabled: disabled }, { children: getEndAdornment() })), value: date ? formateDate(date) : '', placeholder: DATE_FORMAT, onClick: function (e) {
-                    if (!disabled)
-                        toggleCalender(e);
-                }, startAdornment: calenderIcon, disabled: disabled, readOnly: readOnly, dir: dir }), _jsxs(Collapse, __assign({ in: openCalender }, { children: [_jsx(Calendar, __assign({ calendar: arabic, locale: dir === 'rtl' ? arabic_ar : arabic_en, maxDate: maxDate || defaultMax, minDate: minDate || defaultMin, format: DATE_FORMAT, onChange: handleOnDateChange, value: date || (isDob ? new Date(getEighteenYearsAgo()) : undefined), className: 'custom-container' }, rest)), _jsx(Divider, {})] }))] })));
-};
-export default memo(DatePicker);
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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 React, { memo } from 'react';
+import { Calendar, toDateObject } from 'react-multi-date-picker';
+import arabic from 'react-date-object/calendars/arabic';
+import Box from '@mui/material/Box';
+import { styled } from '@mui/material/styles';
+import Divider from '@mui/material/Divider';
+import Collapse from '../Collapse';
+import Icon from '../Icon';
+import { ICONS_NAMES } from '../../constants';
+import { getEighteenYearsAgo } from '../../utils';
+import { EndAdornmentExpanded } from '../../features/shared/EndAdornment';
+import Input from '../Input';
+import Text from '../Text';
+import arabic_en from './arabicEn';
+import arabic_ar from './arabicAr';
+import './style.css';
+var ContainerIcon = styled(Icon, { shouldForwardProp: function (prop) { return prop !== 'disabled'; } })(function (_a) {
+    var theme = _a.theme, disabled = _a.disabled;
+    return (__assign(__assign({ marginInlineStart: theme.spacing(2.5) }, theme.typography.h6), { cursor: disabled ? 'auto' : 'pointer', width: theme.spacing(2), height: theme.spacing(2) }));
+});
+var Container = styled(Box, { shouldForwardProp: function (prop) { return prop !== 'disabled' && prop !== 'openCalender'; } })(function (_a) {
+    var theme = _a.theme, disabled = _a.disabled, openCalender = _a.openCalender;
+    return ({
+        transition: 'min-height 0.5s',
+        cursor: disabled ? 'auto' : 'pointer',
+        opacity: disabled ? '0.6' : '1',
+        fontFamily: theme.typography.fontFamily,
+        minHeight: openCalender ? '345px' : '46px'
+    });
+});
+var InputFieldStyled = styled(Input)(function (_a) {
+    var theme = _a.theme, disabled = _a.disabled;
+    return ({
+        cursor: disabled ? 'auto' : 'pointer',
+        '&::placeholder': __assign(__assign({ opacity: 1, color: theme.palette.text.primary, lineHeight: theme.spacing(2.125) }, theme.typography.body2), { fontWeight: theme.typography.fontWeightLight }),
+        '& .MuiInputBase-input': {
+            WebkitTextFillColor: 'inherit',
+            cursor: disabled ? 'auto' : 'pointer'
+        }
+    });
+});
+var ArrowIcon = styled(Text, { shouldForwardProp: function (prop) { return prop !== 'disabled'; } })(function (_a) {
+    var theme = _a.theme, disabled = _a.disabled;
+    return ({
+        cursor: disabled ? 'auto' : 'pointer',
+        marginInlineEnd: theme.spacing(2.5),
+        display: 'flex'
+    });
+});
+var DatePicker = function (_a) {
+    var _b = _a.open, open = _b === void 0 ? false : _b, disabled = _a.disabled, dir = _a.dir, readOnly = _a.readOnly, onDateChange = _a.onDateChange, onClick = _a.onClick, onDatePicked = _a.onDatePicked, value = _a.value, isDob = _a.isDob, isVerified = _a.isVerified, minDate = _a.minDate, maxDate = _a.maxDate, rest = __rest(_a, ["open", "disabled", "dir", "readOnly", "onDateChange", "onClick", "onDatePicked", "value", "isDob", "isVerified", "minDate", "maxDate"]);
+    var _c = React.useState(), date = _c[0], setDate = _c[1];
+    var _d = React.useState(null), anchor = _d[0], setAnchor = _d[1];
+    var _e = React.useState(open), openCalender = _e[0], setOpenCalender = _e[1];
+    var calenderIcon = _jsx(ContainerIcon, { disabled: disabled, src: ICONS_NAMES.SWITCH_HIJRI_CALENDER });
+    var defaultMax = new Date();
+    var defaultMin = new Date('1900-01-01');
+    var DATE_FORMAT = 'YYYY-MM-DD';
+    React.useEffect(function () {
+        if (value)
+            setDate(value);
+    }, [value]);
+    var toggleCalender = function (event) {
+        if (anchor || openCalender) {
+            onDatePicked === null || onDatePicked === void 0 ? void 0 : onDatePicked();
+            setOpenCalender(false);
+            return setAnchor(null);
+        }
+        setAnchor(event.currentTarget);
+        setOpenCalender(true);
+        onClick === null || onClick === void 0 ? void 0 : onClick();
+    };
+    var getEndAdornment = function () {
+        if (disabled && !isVerified)
+            return '';
+        return _jsx(EndAdornmentExpanded, { isVerified: isVerified, anchorEl: anchor });
+    };
+    var handleOnDateChange = function (date) {
+        onDateChange === null || onDateChange === void 0 ? void 0 : onDateChange(date.toDate().toLocaleDateString('en-CA'));
+        setAnchor(null);
+        setOpenCalender(false);
+        onDatePicked === null || onDatePicked === void 0 ? void 0 : onDatePicked();
+    };
+    var formateDate = function (date) {
+        var dateObject = toDateObject(date);
+        return dateObject.convert(arabic).format(DATE_FORMAT);
+    };
+    return (_jsxs(Container, __assign({ openCalender: openCalender, disabled: disabled, id: 'arabic-container-calendar' }, { children: [_jsx(InputFieldStyled, { endAdornment: _jsx(ArrowIcon, __assign({ disabled: disabled }, { children: getEndAdornment() })), value: date ? formateDate(date) : '', placeholder: DATE_FORMAT, onClick: function (e) {
+                    if (!disabled)
+                        toggleCalender(e);
+                }, startAdornment: calenderIcon, disabled: disabled, readOnly: readOnly, dir: dir }), _jsxs(Collapse, __assign({ in: openCalender }, { children: [_jsx(Calendar, __assign({ calendar: arabic, locale: dir === 'rtl' ? arabic_ar : arabic_en, maxDate: maxDate || defaultMax, minDate: minDate || defaultMin, format: DATE_FORMAT, onChange: handleOnDateChange, value: date || (isDob ? new Date(getEighteenYearsAgo()) : undefined), className: 'custom-container' }, rest)), _jsx(Divider, {})] }))] })));
+};
+export default memo(DatePicker);

package/build/components/ArabicDatePicker/arabicAr.d.ts

@@ -1,8 +1,8 @@
-declare const arabic_ar: {
-    name: string;
-    months: string[][];
-    weekDays: string[][];
-    digits: string[];
-    meridiems: string[][];
-};
-export default arabic_ar;
+declare const arabic_ar: {
+    name: string;
+    months: string[][];
+    weekDays: string[][];
+    digits: string[];
+    meridiems: string[][];
+};
+export default arabic_ar;

package/build/components/ArabicDatePicker/arabicAr.js

@@ -1,32 +1,32 @@
-var arabic_ar = {
-    name: 'arabic_ar',
-    months: [
-        ['محرم', 'محرم'],
-        ['صفر', 'صفر'],
-        ['ربیع الاول', 'ربیع الاول'],
-        ['ربیع الثانی', 'ربیع الثانی'],
-        ['جمادی الاول', 'جمادی الاول'],
-        ['جمادی الثانی', 'جمادی الثانی'],
-        ['رجب', 'رجب'],
-        ['شعبان', 'شعبان'],
-        ['رمضان', 'رمضان'],
-        ['شوال', 'شوال'],
-        ['ذی القعده ', 'ذی القعده'],
-        ['ذی الحجه', 'ذی الحجه']
-    ],
-    weekDays: [
-        ['السّبت', 'سب'],
-        ['الأحد', 'اح'],
-        ['الإثنينِ', 'ثن'],
-        ['الثلاثاء', 'ثل'],
-        ['الأربعاء', 'ار'],
-        ['الخميس', 'خم'],
-        ['الجمعة', 'جم']
-    ],
-    digits: ['٠', '١', '٢', '٣', '٤', '٥', '٦', '٧', '٨', '٩'],
-    meridiems: [
-        ['قبل الظهر', 'ق.ظ'],
-        ['بعد الظهر', 'ب.ظ']
-    ]
-};
-export default arabic_ar;
+var arabic_ar = {
+    name: 'arabic_ar',
+    months: [
+        ['محرم', 'محرم'],
+        ['صفر', 'صفر'],
+        ['ربیع الاول', 'ربیع الاول'],
+        ['ربیع الثانی', 'ربیع الثانی'],
+        ['جمادی الاول', 'جمادی الاول'],
+        ['جمادی الثانی', 'جمادی الثانی'],
+        ['رجب', 'رجب'],
+        ['شعبان', 'شعبان'],
+        ['رمضان', 'رمضان'],
+        ['شوال', 'شوال'],
+        ['ذی القعده ', 'ذی القعده'],
+        ['ذی الحجه', 'ذی الحجه']
+    ],
+    weekDays: [
+        ['السّبت', 'سب'],
+        ['الأحد', 'اح'],
+        ['الإثنينِ', 'ثن'],
+        ['الثلاثاء', 'ثل'],
+        ['الأربعاء', 'ار'],
+        ['الخميس', 'خم'],
+        ['الجمعة', 'جم']
+    ],
+    digits: ['٠', '١', '٢', '٣', '٤', '٥', '٦', '٧', '٨', '٩'],
+    meridiems: [
+        ['قبل الظهر', 'ق.ظ'],
+        ['بعد الظهر', 'ب.ظ']
+    ]
+};
+export default arabic_ar;

package/build/components/ArabicDatePicker/arabicEn.d.ts

@@ -1,8 +1,8 @@
-declare const arabic_en: {
-    name: string;
-    months: string[][];
-    weekDays: string[][];
-    digits: string[];
-    meridiems: string[][];
-};
-export default arabic_en;
+declare const arabic_en: {
+    name: string;
+    months: string[][];
+    weekDays: string[][];
+    digits: string[];
+    meridiems: string[][];
+};
+export default arabic_en;

package/build/components/ArabicDatePicker/arabicEn.js

@@ -1,32 +1,32 @@
-var arabic_en = {
-    name: 'arabic_en',
-    months: [
-        ['Muharram', 'Mu'],
-        ['Safar', 'Sa'],
-        ['Rabi`al-Awwal', 'RI'],
-        ['Rabi`ath-Thani', 'RII'],
-        ['Jumada l-Ula', 'JI'],
-        ['Jumada t-Tania', 'JII'],
-        ['Rajab', 'Ra'],
-        ['Sha`ban', 'Sh'],
-        ['Ramadan', 'Ra'],
-        ['Shawwal', 'Sh'],
-        ['Dhu l-Qa`da ', 'DhQ'],
-        ['Dhu l-Hijja', 'DhH']
-    ],
-    weekDays: [
-        ['as-sabt', 'Sab'],
-        ["al-'ahad", 'Aha'],
-        ["al-'ithnayn", 'Ith'],
-        ['ath-thalatha', 'Tha'],
-        ["al-'arb`a'", 'Arb'],
-        ['al-khamis', 'Kha'],
-        ['al-jum`a', 'Jum']
-    ],
-    digits: ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'],
-    meridiems: [
-        ['AM', 'am'],
-        ['PM', 'pm']
-    ]
-};
-export default arabic_en;
+var arabic_en = {
+    name: 'arabic_en',
+    months: [
+        ['Muharram', 'Mu'],
+        ['Safar', 'Sa'],
+        ['Rabi`al-Awwal', 'RI'],
+        ['Rabi`ath-Thani', 'RII'],
+        ['Jumada l-Ula', 'JI'],
+        ['Jumada t-Tania', 'JII'],
+        ['Rajab', 'Ra'],
+        ['Sha`ban', 'Sh'],
+        ['Ramadan', 'Ra'],
+        ['Shawwal', 'Sh'],
+        ['Dhu l-Qa`da ', 'DhQ'],
+        ['Dhu l-Hijja', 'DhH']
+    ],
+    weekDays: [
+        ['as-sabt', 'Sab'],
+        ["al-'ahad", 'Aha'],
+        ["al-'ithnayn", 'Ith'],
+        ['ath-thalatha', 'Tha'],
+        ["al-'arb`a'", 'Arb'],
+        ['al-khamis', 'Kha'],
+        ['al-jum`a', 'Jum']
+    ],
+    digits: ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'],
+    meridiems: [
+        ['AM', 'am'],
+        ['PM', 'pm']
+    ]
+};
+export default arabic_en;

package/build/components/ArabicDatePicker/index.d.ts

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

package/build/components/ArabicDatePicker/index.js

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

package/build/components/Button/Button.d.ts

@@ -1,14 +1,14 @@
-import * as React from 'react';
-import { ButtonProps as MUIButtonProps } from '@mui/material/Button';
-export interface ButtonStyledProps {
-    touched?: boolean;
-    outLineColor?: string;
-}
-export interface ButtonProps extends MUIButtonProps {
-    outLineColor?: string;
-}
-declare const _default: React.MemoExoticComponent<{
-    ({ children, startIcon, outLineColor, endIcon, ...rest }: ButtonProps): JSX.Element;
-    defaultProps: {};
-}>;
-export default _default;
+import * as React from 'react';
+import { ButtonProps as MUIButtonProps } from '@mui/material/Button';
+export interface ButtonStyledProps {
+    touched?: boolean;
+    outLineColor?: string;
+}
+export interface ButtonProps extends MUIButtonProps {
+    outLineColor?: string;
+}
+declare const _default: React.MemoExoticComponent<{
+    ({ children, startIcon, outLineColor, endIcon, ...rest }: ButtonProps): JSX.Element;
+    defaultProps: {};
+}>;
+export default _default;

package/build/components/Button/Button.js

@@ -1,97 +1,97 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-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 * as React from 'react';
-import Button from '@mui/material/Button';
-import { styled, alpha } from '@mui/material/styles';
-var ButtonStyled = styled(Button, {
-    shouldForwardProp: function (prop) { return !['outLineColor', 'touched'].includes(prop.toString()); }
-})(function (_a) {
-    var _b;
-    var theme = _a.theme, touched = _a.touched, outLineColor = _a.outLineColor;
-    return ({
-        '&.MuiButton-contained': {
-            color: theme.palette.common.white,
-            backgroundColor: theme.palette.primary.main,
-            '&:hover': {
-                backgroundColor: theme.palette.primary.main
-            },
-            '&:active': {
-                backgroundColor: theme.palette.primary.main
-            },
-            ':disabled': {
-                backgroundColor: alpha(theme.palette.primary.main, 0.3),
-                borderColor: alpha(theme.palette.primary.main, 0.2),
-                color: theme.palette.common.white
-            },
-            '& .MuiButton-endIcon': {
-                margin: theme.spacing(0)
-            },
-            '& .MuiButton-startIcon': {
-                margin: theme.spacing(0)
-            }
-        },
-        minHeight: theme.spacing(5.5),
-        maxHeight: theme.spacing(5.5),
-        borderRadius: theme.spacing(4.1),
-        fontWeight: 'bold',
-        lineHeight: 1.7,
-        display: 'flex',
-        justifyContent: 'space-between',
-        paddingInlineStart: theme.spacing(0.75),
-        textTransform: 'none',
-        '&.MuiButton-outlined': (_b = {
-                backgroundColor: theme.palette.common.white,
-                border: "1px solid ".concat(!!outLineColor ? outLineColor : theme.palette.primary.main),
-                color: !!outLineColor ? outLineColor : theme.palette.primary.main,
-                '&:hover': {
-                    backgroundColor: !!outLineColor ? outLineColor : theme.palette.primary.main,
-                    color: theme.palette.common.white,
-                    img: {
-                        filter: 'brightness(0) invert(1)'
-                    }
-                }
-            },
-            _b[theme.breakpoints.down('sm')] = {
-                '&:hover': {
-                    backgroundColor: touched ? (!!outLineColor ? outLineColor : theme.palette.primary.main) : theme.palette.common.white,
-                    color: touched ? theme.palette.common.white : !!outLineColor ? outLineColor : theme.palette.primary.main,
-                    img: {
-                        filter: touched ? 'brightness(0) invert(1)' : 'none'
-                    }
-                }
-            },
-            _b['&:disabled'] = {
-                backgroundColor: theme.palette.common.white,
-                color: alpha(!!outLineColor ? outLineColor : theme.palette.primary.main, 0.3)
-            },
-            _b)
-    });
-});
-var ButtonComponent = function (_a) {
-    var children = _a.children, startIcon = _a.startIcon, outLineColor = _a.outLineColor, endIcon = _a.endIcon, rest = __rest(_a, ["children", "startIcon", "outLineColor", "endIcon"]);
-    var _b = React.useState(false), isTouched = _b[0], setIsTouched = _b[1];
-    return (_jsx(ButtonStyled, __assign({ onTouchStart: function () { return setIsTouched(true); }, touched: isTouched, outLineColor: outLineColor, variant: 'contained', startIcon: startIcon || _jsx("span", {}), endIcon: endIcon || _jsx("span", {}), disableFocusRipple: true, disableElevation: true, disableRipple: true, disableTouchRipple: true, fullWidth: true }, rest, { children: children })));
-};
-ButtonComponent.defaultProps = {};
-export default React.memo(ButtonComponent);
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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 * as React from 'react';
+import Button from '@mui/material/Button';
+import { styled, alpha } from '@mui/material/styles';
+var ButtonStyled = styled(Button, {
+    shouldForwardProp: function (prop) { return !['outLineColor', 'touched'].includes(prop.toString()); }
+})(function (_a) {
+    var _b;
+    var theme = _a.theme, touched = _a.touched, outLineColor = _a.outLineColor;
+    return ({
+        '&.MuiButton-contained': {
+            color: theme.palette.common.white,
+            backgroundColor: theme.palette.primary.main,
+            '&:hover': {
+                backgroundColor: theme.palette.primary.main
+            },
+            '&:active': {
+                backgroundColor: theme.palette.primary.main
+            },
+            ':disabled': {
+                backgroundColor: alpha(theme.palette.primary.main, 0.3),
+                borderColor: alpha(theme.palette.primary.main, 0.2),
+                color: theme.palette.common.white
+            },
+            '& .MuiButton-endIcon': {
+                margin: theme.spacing(0)
+            },
+            '& .MuiButton-startIcon': {
+                margin: theme.spacing(0)
+            }
+        },
+        minHeight: theme.spacing(5.5),
+        maxHeight: theme.spacing(5.5),
+        borderRadius: theme.spacing(4.1),
+        fontWeight: 'bold',
+        lineHeight: 1.7,
+        display: 'flex',
+        justifyContent: 'space-between',
+        paddingInlineStart: theme.spacing(0.75),
+        textTransform: 'none',
+        '&.MuiButton-outlined': (_b = {
+                backgroundColor: theme.palette.common.white,
+                border: "1px solid ".concat(!!outLineColor ? outLineColor : theme.palette.primary.main),
+                color: !!outLineColor ? outLineColor : theme.palette.primary.main,
+                '&:hover': {
+                    backgroundColor: !!outLineColor ? outLineColor : theme.palette.primary.main,
+                    color: theme.palette.common.white,
+                    img: {
+                        filter: 'brightness(0) invert(1)'
+                    }
+                }
+            },
+            _b[theme.breakpoints.down('sm')] = {
+                '&:hover': {
+                    backgroundColor: touched ? (!!outLineColor ? outLineColor : theme.palette.primary.main) : theme.palette.common.white,
+                    color: touched ? theme.palette.common.white : !!outLineColor ? outLineColor : theme.palette.primary.main,
+                    img: {
+                        filter: touched ? 'brightness(0) invert(1)' : 'none'
+                    }
+                }
+            },
+            _b['&:disabled'] = {
+                backgroundColor: theme.palette.common.white,
+                color: alpha(!!outLineColor ? outLineColor : theme.palette.primary.main, 0.3)
+            },
+            _b)
+    });
+});
+var ButtonComponent = function (_a) {
+    var children = _a.children, startIcon = _a.startIcon, outLineColor = _a.outLineColor, endIcon = _a.endIcon, rest = __rest(_a, ["children", "startIcon", "outLineColor", "endIcon"]);
+    var _b = React.useState(false), isTouched = _b[0], setIsTouched = _b[1];
+    return (_jsx(ButtonStyled, __assign({ onTouchStart: function () { return setIsTouched(true); }, touched: isTouched, outLineColor: outLineColor, variant: 'contained', startIcon: startIcon || _jsx("span", {}), endIcon: endIcon || _jsx("span", {}), disableFocusRipple: true, disableElevation: true, disableRipple: true, disableTouchRipple: true, fullWidth: true }, rest, { children: children })));
+};
+ButtonComponent.defaultProps = {};
+export default React.memo(ButtonComponent);