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

package/build/hooks/useLanguage.js

@@ -1,8 +1,8 @@
-import { useTranslation } from 'react-i18next';
-import { LanguageMode } from '../@types';
-export function useLanguage() {
-    var i18n = useTranslation().i18n;
-    var isAr = i18n.language === LanguageMode.AR;
-    var isEn = i18n.language === LanguageMode.EN;
-    return { isAr: isAr, isEn: isEn };
-}
+import { useTranslation } from 'react-i18next';
+import { LanguageMode } from '../@types';
+export function useLanguage() {
+    var i18n = useTranslation().i18n;
+    var isAr = i18n.language === LanguageMode.AR;
+    var isEn = i18n.language === LanguageMode.EN;
+    return { isAr: isAr, isEn: isEn };
+}

package/build/hooks/useRedirectionListener.d.ts

@@ -1,4 +1,4 @@
-export declare const useRedirectionData: <T>(dataKey?: string) => {
-    data?: T | undefined;
-    error: boolean;
-};
+export declare const useRedirectionData: <T>(dataKey?: string) => {
+    data?: T | undefined;
+    error: boolean;
+};

package/build/hooks/useRedirectionListener.js

@@ -1,12 +1,12 @@
-import { decodeObjectBase64, getParameterByName } from '../utils';
-export var useRedirectionData = function (dataKey) {
-    if (dataKey === void 0) { dataKey = 'data'; }
-    var dataToken = getParameterByName(dataKey);
-    if (!dataToken)
-        return { error: true };
-    var data = decodeObjectBase64(dataToken);
-    return {
-        data: data,
-        error: false
-    };
-};
+import { decodeObjectBase64, getParameterByName } from '../utils';
+export var useRedirectionData = function (dataKey) {
+    if (dataKey === void 0) { dataKey = 'data'; }
+    var dataToken = getParameterByName(dataKey);
+    if (!dataToken)
+        return { error: true };
+    var data = decodeObjectBase64(dataToken);
+    return {
+        data: data,
+        error: false
+    };
+};

package/build/hooks/useScreen.d.ts

@@ -1,3 +1,3 @@
-export declare const useScreen: (breakpoint?: 'xs' | 'sm' | 'md' | 'lg' | 'xl') => {
-    small: boolean;
-};
+export declare const useScreen: (breakpoint?: 'xs' | 'sm' | 'md' | 'lg' | 'xl') => {
+    small: boolean;
+};

package/build/hooks/useScreen.js

@@ -1,14 +1,14 @@
-import { useEffect, useState } from 'react';
-import { useWindowSize } from '.';
-import { useTheme } from '@mui/material/styles';
-export var useScreen = function (breakpoint) {
-    if (breakpoint === void 0) { breakpoint = 'sm'; }
-    var _a = useState(false), small = _a[0], setSmall = _a[1];
-    var width = useWindowSize().width;
-    var theme = useTheme();
-    useEffect(function () {
-        var target = theme.breakpoints.values[breakpoint || 'sm'];
-        setSmall(width < target);
-    }, [width]);
-    return { small: small };
-};
+import { useEffect, useState } from 'react';
+import { useWindowSize } from '.';
+import { useTheme } from '@mui/material/styles';
+export var useScreen = function (breakpoint) {
+    if (breakpoint === void 0) { breakpoint = 'sm'; }
+    var _a = useState(false), small = _a[0], setSmall = _a[1];
+    var width = useWindowSize().width;
+    var theme = useTheme();
+    useEffect(function () {
+        var target = theme.breakpoints.values[breakpoint || 'sm'];
+        setSmall(width < target);
+    }, [width]);
+    return { small: small };
+};

package/build/hooks/useSetFromDefaultValues.d.ts

@@ -0,0 +1,2 @@
+import { FieldValues, UseFormReturn } from 'react-hook-form';
+export declare const useSetFromDefaultValues: <TFieldValues extends FieldValues = FieldValues>(method: UseFormReturn<TFieldValues, any>, defaultValues: TFieldValues, shouldValidate?: boolean) => void;

package/build/hooks/useSetFromDefaultValues.js

@@ -0,0 +1,26 @@
+import { useEffect } from 'react';
+var isValidValue = function (value) {
+    if (Array.isArray(value))
+        return value.length > 0;
+    if (typeof value === 'object' && !!value)
+        return (Object === null || Object === void 0 ? void 0 : Object.keys(value).length) > 0;
+    return value !== undefined && value !== null && value !== '';
+};
+export var useSetFromDefaultValues = function (method, defaultValues, shouldValidate) {
+    if (shouldValidate === void 0) { shouldValidate = false; }
+    var setFromDefaultValues = function () {
+        for (var key in defaultValues) {
+            if (Object.prototype.hasOwnProperty.call(defaultValues, key)) {
+                if (key === 'responseBody')
+                    continue;
+                var value = defaultValues[key];
+                if (!isValidValue(method.getValues(key)) && isValidValue(value)) {
+                    method.setValue(key, value, { shouldValidate: shouldValidate });
+                }
+            }
+        }
+    };
+    useEffect(function () {
+        setFromDefaultValues();
+    }, [defaultValues]);
+};

package/build/hooks/useStepStartedListener.d.ts

@@ -1 +1 @@
-export declare const useStepStartedListener: () => void;
+export declare const useStepStartedListener: () => void;

package/build/hooks/useStepStartedListener.js

@@ -1,10 +1,10 @@
-import { useEffect } from 'react';
-import { settingsSelector } from '../app/settings';
-import { useAppSelector } from './useAppSelector';
-export var useStepStartedListener = function () {
-    var settings = useAppSelector(settingsSelector);
-    useEffect(function () {
-        var _a, _b;
-        (_b = (_a = settings.data.appConfig).onStepStarted) === null || _b === void 0 ? void 0 : _b.call(_a, settings.data.activeScreen.name);
-    }, [settings.data.activeScreen]);
-};
+import { useEffect } from 'react';
+import { settingsSelector } from '../app/settings';
+import { useAppSelector } from './useAppSelector';
+export var useStepStartedListener = function () {
+    var settings = useAppSelector(settingsSelector);
+    useEffect(function () {
+        var _a, _b;
+        (_b = (_a = settings.data.appConfig).onStepStarted) === null || _b === void 0 ? void 0 : _b.call(_a, settings.data.activeScreen.name);
+    }, [settings.data.activeScreen]);
+};

package/build/hooks/useThemeMode.d.ts

@@ -1,4 +1,4 @@
-export declare const useThemeMode: () => {
-    isDark: boolean;
-    isLight: boolean;
-};
+export declare const useThemeMode: () => {
+    isDark: boolean;
+    isLight: boolean;
+};

package/build/hooks/useThemeMode.js

@@ -1,7 +1,7 @@
-import { useTheme } from '@mui/material/styles';
-export var useThemeMode = function () {
-    var theme = useTheme();
-    var isDark = theme.palette.mode === 'dark';
-    var isLight = theme.palette.mode === 'light';
-    return { isDark: isDark, isLight: isLight };
-};
+import { useTheme } from '@mui/material/styles';
+export var useThemeMode = function () {
+    var theme = useTheme();
+    var isDark = theme.palette.mode === 'dark';
+    var isLight = theme.palette.mode === 'light';
+    return { isDark: isDark, isLight: isLight };
+};

package/build/hooks/useVerifyToken.d.ts

@@ -0,0 +1,15 @@
+import { ScreenStepNavigation } from '../@types';
+interface VerifyLeadTokenProps {
+    token: string;
+    isInternally?: boolean;
+}
+interface IVerifyToken {
+    verify: (props: VerifyLeadTokenProps) => any;
+    internalToken?: string;
+    open: boolean;
+    settingLoading: boolean;
+    navigation: ScreenStepNavigation[];
+    loadingScreenName: string;
+}
+export declare const useVerifyToken: ({ verify, internalToken, navigation, open, settingLoading, loadingScreenName }: IVerifyToken) => void;
+export {};

package/build/hooks/useVerifyToken.js

@@ -0,0 +1,25 @@
+import { handleCurrentActiveScreen, handleLanguage } from '../app/settings';
+import { getParameterByName } from '../utils';
+import { useAppDispatch } from './useAppDispatch';
+import { useEffect } from 'react';
+export var useVerifyToken = function (_a) {
+    var verify = _a.verify, internalToken = _a.internalToken, navigation = _a.navigation, open = _a.open, settingLoading = _a.settingLoading, loadingScreenName = _a.loadingScreenName;
+    var dispatch = useAppDispatch();
+    var verifyTokenFun = function () {
+        var token = getParameterByName('token') || internalToken;
+        var lang = getParameterByName('lang');
+        if (lang)
+            dispatch(handleLanguage(lang));
+        if (!token)
+            throw new Error('Auth token is not found!');
+        dispatch(verify({ token: token, isInternally: !!internalToken }));
+    };
+    useEffect(function () {
+        if (!settingLoading && open)
+            verifyTokenFun();
+    }, [settingLoading, open]);
+    useEffect(function () {
+        if (internalToken && open)
+            dispatch(handleCurrentActiveScreen(loadingScreenName));
+    }, [navigation]);
+};

package/build/hooks/useWindowSize.d.ts

@@ -1,6 +1,6 @@
-interface WindowSize {
-    width: number;
-    height: number;
-}
-export declare const useWindowSize: () => WindowSize;
-export {};
+interface WindowSize {
+    width: number;
+    height: number;
+}
+export declare const useWindowSize: () => WindowSize;
+export {};

package/build/hooks/useWindowSize.js

@@ -1,19 +1,19 @@
-import { useEffect, useState } from 'react';
-export var useWindowSize = function () {
-    var _a = useState({
-        width: 0,
-        height: 0
-    }), windowSize = _a[0], setWindowSize = _a[1];
-    var handleSize = function () {
-        setWindowSize({
-            width: window.innerWidth,
-            height: window.innerHeight
-        });
-    };
-    useEffect(function () {
-        window.addEventListener('resize', handleSize);
-        handleSize();
-        return function () { return window.removeEventListener('resize', handleSize); };
-    }, []);
-    return windowSize;
-};
+import { useEffect, useState } from 'react';
+export var useWindowSize = function () {
+    var _a = useState({
+        width: 0,
+        height: 0
+    }), windowSize = _a[0], setWindowSize = _a[1];
+    var handleSize = function () {
+        setWindowSize({
+            width: window.innerWidth,
+            height: window.innerHeight
+        });
+    };
+    useEffect(function () {
+        window.addEventListener('resize', handleSize);
+        handleSize();
+        return function () { return window.removeEventListener('resize', handleSize); };
+    }, []);
+    return windowSize;
+};

package/build/i18n.d.ts

@@ -1,2 +1,2 @@
-import i18n from 'i18next';
-export default i18n;
+import i18n from 'i18next';
+export default i18n;

package/build/i18n.js

@@ -1,34 +1,34 @@
-import i18n from 'i18next';
-import { initReactI18next } from 'react-i18next';
-import Backend from 'i18next-http-backend';
-import LanguageDetector from 'i18next-browser-languagedetector';
-import { LOCAL_STORAGE_KEYS } from './constants';
-import translationEN from './assets/locales/en.json';
-import translationAR from './assets/locales/ar.json';
-var resources = {
-    en: {
-        translation: translationEN
-    },
-    ar: {
-        translation: translationAR
-    }
-};
-i18n
-    .use(Backend)
-    .use(LanguageDetector)
-    .use(initReactI18next)
-    .init({
-    resources: resources,
-    detection: {
-        order: ['querystring', 'localStorage'],
-        lookupQuerystring: LOCAL_STORAGE_KEYS.languageMode || 'lng',
-        htmlTag: document.documentElement
-    },
-    fallbackLng: 'en',
-    debug: false,
-    keySeparator: false,
-    interpolation: {
-        escapeValue: false
-    }
-});
-export default i18n;
+import i18n from 'i18next';
+import { initReactI18next } from 'react-i18next';
+import Backend from 'i18next-http-backend';
+import LanguageDetector from 'i18next-browser-languagedetector';
+import { LOCAL_STORAGE_KEYS } from './constants';
+import translationEN from './assets/locales/en.json';
+import translationAR from './assets/locales/ar.json';
+var resources = {
+    en: {
+        translation: translationEN
+    },
+    ar: {
+        translation: translationAR
+    }
+};
+i18n
+    .use(Backend)
+    .use(LanguageDetector)
+    .use(initReactI18next)
+    .init({
+    resources: resources,
+    detection: {
+        order: ['querystring', 'localStorage'],
+        lookupQuerystring: LOCAL_STORAGE_KEYS.languageMode || 'lng',
+        htmlTag: document.documentElement
+    },
+    fallbackLng: 'en',
+    debug: false,
+    keySeparator: false,
+    interpolation: {
+        escapeValue: false
+    }
+});
+export default i18n;

package/build/index.d.ts

@@ -1,14 +1,14 @@
-import './index.css';
-import './i18n';
-import { ConnectLib, renderConnectLib, ConnectLibProps, unmountConnectLib } from './features/connect';
-import { BusinessLib, renderBusinessLib, BusinessLibProps, unmountBusinessLib } from './features/business';
-import { PasswordLib, renderPasswordLib, PasswordLibProps, unmountPasswordLib } from './features/password';
-import { IndividualLib, renderIndividualLib, IndividualLibProps, unmountIndividualLib } from './features/individual';
-import { BankLib, renderBankLib, BankLibProps, unmountBankLib } from './features/bank';
-import { TaxLib, renderTaxLib, TaxLibProps, unmountTaxLib } from './features/tax';
-import { SignInLib, renderSignInLib, SignInLibProps, unmountSignInLib } from './features/signIn';
-import { EntityLib, EntityLibProps, renderEntityLib, unmountEntityLib } from './features/entity';
-import { OTPLib, OTPLibProps, renderOTPLib, unmountOTPLib } from './features/otp/OTP';
-import { AuthLib, AuthLibProps, renderAuthLib, unmountAuthLib } from './features/auth';
-export type { ConnectLibProps, BusinessLibProps, PasswordLibProps, IndividualLibProps, BankLibProps, TaxLibProps, EntityLibProps, OTPLibProps, AuthLibProps, SignInLibProps };
-export { ConnectLib, renderConnectLib, unmountConnectLib, BusinessLib, renderBusinessLib, unmountBusinessLib, PasswordLib, renderPasswordLib, unmountPasswordLib, IndividualLib, renderIndividualLib, unmountIndividualLib, BankLib, renderBankLib, unmountBankLib, TaxLib, renderTaxLib, unmountTaxLib, EntityLib, renderEntityLib, unmountEntityLib, OTPLib, renderOTPLib, unmountOTPLib, SignInLib, renderSignInLib, unmountSignInLib, AuthLib, renderAuthLib, unmountAuthLib };
+import './index.css';
+import './i18n';
+import { ConnectElement, ConnectLibProps } from './features/connect';
+import { ConnectExpressElement, ConnectExpressLibProps } from './features/connectExpress';
+import { BusinessElement, BusinessLibProps } from './features/business';
+import { PasswordElement, PasswordLibProps } from './features/password';
+import { IndividualElement, IndividualLibProps } from './features/individual';
+import { BankElement, BankLibProps } from './features/bank';
+import { TaxElement, TaxLibProps } from './features/tax';
+import { SignInElement, SignInLibProps } from './features/signIn';
+import { EntityElement, EntityLibProps } from './features/entity';
+import { BrandElement, BrandLibProps } from './features/brand';
+export type { ConnectLibProps, ConnectExpressLibProps, BusinessLibProps, PasswordLibProps, IndividualLibProps, BankLibProps, TaxLibProps, EntityLibProps, BrandLibProps, SignInLibProps };
+export { ConnectElement, ConnectExpressElement, BusinessElement, PasswordElement, IndividualElement, BankElement, TaxElement, EntityElement, BrandElement, SignInElement };

package/build/index.js

@@ -1,36 +1,26 @@
-import './index.css';
-import './i18n';
-import { ConnectLib, renderConnectLib, unmountConnectLib } from './features/connect';
-import { BusinessLib, renderBusinessLib, unmountBusinessLib } from './features/business';
-import { PasswordLib, renderPasswordLib, unmountPasswordLib } from './features/password';
-import { IndividualLib, renderIndividualLib, unmountIndividualLib } from './features/individual';
-import { BankLib, renderBankLib, unmountBankLib } from './features/bank';
-import { TaxLib, renderTaxLib, unmountTaxLib } from './features/tax';
-import { SignInLib, renderSignInLib, unmountSignInLib } from './features/signIn';
-import { EntityLib, renderEntityLib, unmountEntityLib } from './features/entity';
-import { OTPLib, renderOTPLib, unmountOTPLib } from './features/otp/OTP';
-import { AuthLib, renderAuthLib, unmountAuthLib } from './features/auth';
-export { ConnectLib, renderConnectLib, unmountConnectLib, BusinessLib, renderBusinessLib, unmountBusinessLib, PasswordLib, renderPasswordLib, unmountPasswordLib, IndividualLib, renderIndividualLib, unmountIndividualLib, BankLib, renderBankLib, unmountBankLib, TaxLib, renderTaxLib, unmountTaxLib, EntityLib, renderEntityLib, unmountEntityLib, OTPLib, renderOTPLib, unmountOTPLib, SignInLib, renderSignInLib, unmountSignInLib, AuthLib, renderAuthLib, unmountAuthLib };
-window['TapAuth'] = {
-    renderConnectLib: renderConnectLib,
-    unmountConnectLib: unmountConnectLib,
-    renderBusinessLib: renderBusinessLib,
-    unmountBusinessLib: unmountBusinessLib,
-    renderPasswordLib: renderPasswordLib,
-    unmountPasswordLib: unmountPasswordLib,
-    renderIndividualLib: renderIndividualLib,
-    unmountIndividualLib: unmountIndividualLib,
-    renderBankLib: renderBankLib,
-    unmountBankLib: unmountBankLib,
-    renderTaxLib: renderTaxLib,
-    unmountTaxLib: unmountTaxLib,
-    renderEntityLib: renderEntityLib,
-    unmountEntityLib: unmountEntityLib,
-    renderOTPLib: renderOTPLib,
-    unmountOTPLib: unmountOTPLib,
-    renderSignInLib: renderSignInLib,
-    unmountSignInLib: unmountSignInLib,
-    renderAuthLib: renderAuthLib,
-    unmountAuthLib: unmountAuthLib
-};
-console.log("TapAuth version: ".concat(require('../package.json').version));
+import './index.css';
+import './i18n';
+import { ConnectElement, renderConnectLib } from './features/connect';
+import { ConnectExpressElement, renderConnectExpressLib } from './features/connectExpress';
+import { BusinessElement, renderBusinessLib } from './features/business';
+import { PasswordElement, renderPasswordLib } from './features/password';
+import { IndividualElement, renderIndividualLib } from './features/individual';
+import { BankElement, renderBankLib } from './features/bank';
+import { TaxElement, renderTaxLib } from './features/tax';
+import { SignInElement, renderSignInLib } from './features/signIn';
+import { EntityElement, renderEntityLib } from './features/entity';
+import { BrandElement, renderBrandLib } from './features/brand';
+export { ConnectElement, ConnectExpressElement, BusinessElement, PasswordElement, IndividualElement, BankElement, TaxElement, EntityElement, BrandElement, SignInElement };
+window['TapAuth'] = {
+    renderConnectLib: renderConnectLib,
+    renderConnectExpressLib: renderConnectExpressLib,
+    renderBusinessLib: renderBusinessLib,
+    renderPasswordLib: renderPasswordLib,
+    renderIndividualLib: renderIndividualLib,
+    renderBankLib: renderBankLib,
+    renderTaxLib: renderTaxLib,
+    renderEntityLib: renderEntityLib,
+    renderBrandLib: renderBrandLib,
+    renderSignInLib: renderSignInLib
+};
+console.log("TapAuth version: ".concat(require('../package.json').version));

package/build/theme/components.d.ts

@@ -1,2 +1,2 @@
-import { Components, Theme } from '@mui/material/styles';
-export declare const components: Components<Theme> | undefined;
+import { Components, Theme } from '@mui/material/styles';
+export declare const components: Components<Theme> | undefined;

package/build/theme/components.js

@@ -1,19 +1,19 @@
-export var components = {
-    MuiSvgIcon: {
-        styleOverrides: {
-            root: {
-                width: '0.8em',
-                height: '0.8em'
-            }
-        }
-    },
-    MuiBackdrop: {
-        styleOverrides: {
-            root: {
-                '&.MuiDialog-backdrop': {
-                    backgroundColor: 'transparent'
-                }
-            }
-        }
-    }
-};
+export var components = {
+    MuiSvgIcon: {
+        styleOverrides: {
+            root: {
+                width: '0.8em',
+                height: '0.8em'
+            }
+        }
+    },
+    MuiBackdrop: {
+        styleOverrides: {
+            root: {
+                '&.MuiDialog-backdrop': {
+                    backgroundColor: 'transparent'
+                }
+            }
+        }
+    }
+};

package/build/theme/index.d.ts

@@ -1 +1 @@
-export { appTheme } from './theme';
+export { appTheme } from './theme';

package/build/theme/index.js

@@ -1 +1 @@
-export { appTheme } from './theme';
+export { appTheme } from './theme';

package/build/theme/palette.d.ts

@@ -1,3 +1,3 @@
-import { PaletteOptions } from '@mui/material/styles';
-export declare const lightPalette: PaletteOptions;
-export declare const darkPalette: PaletteOptions;
+import { PaletteOptions } from '@mui/material/styles';
+export declare const lightPalette: PaletteOptions;
+export declare const darkPalette: PaletteOptions;

package/build/theme/palette.js

@@ -1,68 +1,68 @@
-export var lightPalette = {
-    mode: 'light',
-    divider: '#e3e8ee',
-    primary: {
-        main: '#007aff',
-        dark: '#9CA0A94D',
-        light: '#0E9346'
-    },
-    success: {
-        light: '#2CCE01',
-        main: '#1ECB40',
-        dark: '#3A4155'
-    },
-    common: {
-        black: '#000',
-        white: '#fff'
-    },
-    background: {
-        paper: '#fafbfd',
-        default: '#ffffff'
-    },
-    text: {
-        primary: '#3f424d',
-        secondary: '#ABAEB6',
-        disabled: '#3A4154B3'
-    },
-    action: {
-        selected: 'rgba(0, 0, 0, 0.08)',
-        hover: 'rgba(0, 0, 0, 0.08)'
-    },
-    secondary: {
-        light: '#FAFBFC',
-        main: '#c2c6cc',
-        dark: '#ABAEB6'
-    },
-    error: {
-        main: '#EB3746',
-        light: '#FF0F3E',
-        dark: '#E937454D'
-    },
-    warning: {
-        main: '#F5A623',
-        light: '#FF9F00',
-        dark: '#F5A6234D'
-    },
-    info: {
-        main: '#808592',
-        light: '#EAECEF'
-    }
-};
-export var darkPalette = {
-    mode: 'dark',
-    divider: '#cdd2e0',
-    background: {
-        paper: '#171a21',
-        default: '#21252f'
-    },
-    text: {
-        primary: '#cdd2e0'
-    },
-    action: {
-        selected: 'rgba(0, 0, 0, 0.08)',
-        hover: 'rgba(0, 0, 0, 0.08)'
-    },
-    primary: {
-        main: '#007aff'
-    }
-};
+export var lightPalette = {
+    mode: 'light',
+    divider: '#e3e8ee',
+    primary: {
+        main: '#007aff',
+        dark: '#9CA0A94D',
+        light: '#0E9346'
+    },
+    success: {
+        light: '#2CCE01',
+        main: '#1ECB40',
+        dark: '#3A4155'
+    },
+    common: {
+        black: '#000',
+        white: '#fff'
+    },
+    background: {
+        paper: '#fafbfd',
+        default: '#ffffff'
+    },
+    text: {
+        primary: '#3f424d',
+        secondary: '#ABAEB6',
+        disabled: '#3A4154B3'
+    },
+    action: {
+        selected: 'rgba(0, 0, 0, 0.08)',
+        hover: 'rgba(0, 0, 0, 0.08)'
+    },
+    secondary: {
+        light: '#FAFBFC',
+        main: '#c2c6cc',
+        dark: '#ABAEB6'
+    },
+    error: {
+        main: '#EB3746',
+        light: '#FF0F3E',
+        dark: '#E937454D'
+    },
+    warning: {
+        main: '#F5A623',
+        light: '#FF9F00',
+        dark: '#F5A6234D'
+    },
+    info: {
+        main: '#808592',
+        light: '#EAECEF'
+    }
+};
+export var darkPalette = {
+    mode: 'dark',
+    divider: '#cdd2e0',
+    background: {
+        paper: '#171a21',
+        default: '#21252f'
+    },
+    text: {
+        primary: '#cdd2e0'
+    },
+    action: {
+        selected: 'rgba(0, 0, 0, 0.08)',
+        hover: 'rgba(0, 0, 0, 0.08)'
+    },
+    primary: {
+        main: '#007aff'
+    }
+};