@getpara/react-sdk 1.1.0 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/MoonPayEmbed-GAWXP6V7.js +2 -0
- package/dist/MoonPayEmbed-GAWXP6V7.js.br +0 -0
- package/dist/MoonPayEmbed-GAWXP6V7.js.gz +0 -0
- package/dist/index.js +675 -5
- package/dist/index.js.br +0 -0
- package/dist/index.js.gz +0 -0
- package/dist/provider/hooks/utils/useEventListeners.d.ts +1 -1
- package/dist/provider/stores/useStore.d.ts +7 -2
- package/dist/provider/types/provider.d.ts +15 -3
- package/package.json +8 -7
- package/dist/modal/ParaModal.js +0 -281
- package/dist/modal/components/Account/Account.js +0 -60
- package/dist/modal/components/AddFunds/AddFunds.js +0 -147
- package/dist/modal/components/AddFunds/AddFundsAwaiting.js +0 -65
- package/dist/modal/components/AddFunds/AddFundsDone.js +0 -26
- package/dist/modal/components/AddFunds/MoonPayEmbed.js +0 -2
- package/dist/modal/components/AddFunds/index.js +0 -3
- package/dist/modal/components/AuthInput/AuthInput.js +0 -221
- package/dist/modal/components/AuthInput/countryCodes.js +0 -40
- package/dist/modal/components/AuthInput/hooks/useDropdownPosition.js +0 -23
- package/dist/modal/components/AuthInput/phoneMasks.js +0 -247
- package/dist/modal/components/AuthMainStep/AuthMainStep.js +0 -21
- package/dist/modal/components/AuthMainStep/AuthMainStepContent.js +0 -89
- package/dist/modal/components/AuthOptions/AuthOptions.js +0 -28
- package/dist/modal/components/AwaitingBiometricsStep/AwaitingBiometricsStep.js +0 -7
- package/dist/modal/components/AwaitingOAuthStep/AwaitingOAuthStep.js +0 -5
- package/dist/modal/components/AwaitingPasswordStep/AwaitingPasswordStep.js +0 -7
- package/dist/modal/components/AwaitingWalletCreationStep/AwaitingWalletCreationStep.js +0 -18
- package/dist/modal/components/BiometricCreationStep/BiometricCreationStep.js +0 -17
- package/dist/modal/components/BiometricLoginStep/BiometricLoginStep.js +0 -131
- package/dist/modal/components/Body/AnimatedHeightWrapper.js +0 -26
- package/dist/modal/components/Body/Body.js +0 -232
- package/dist/modal/components/ChainSwitch/ChainSwitch.js +0 -77
- package/dist/modal/components/ChainSwitch/config.js +0 -11
- package/dist/modal/components/Controls/Controls.js +0 -54
- package/dist/modal/components/Controls/Selects.js +0 -159
- package/dist/modal/components/ExternalWalletStep/ExternalWalletStep.js +0 -116
- package/dist/modal/components/ExternalWalletStep/config.js +0 -11
- package/dist/modal/components/ExternalWallets/ExternalWallets.js +0 -142
- package/dist/modal/components/ExternalWalletsWrapper/ExternalWalletsWrapper.js +0 -119
- package/dist/modal/components/Footer/Footer.js +0 -71
- package/dist/modal/components/Header/Header.js +0 -24
- package/dist/modal/components/Header/hooks/useStepTitle.js +0 -42
- package/dist/modal/components/Hero/Hero.js +0 -119
- package/dist/modal/components/IFrameStep/IFrameStep.js +0 -41
- package/dist/modal/components/LoginDoneStep/LoginDoneStep.js +0 -19
- package/dist/modal/components/ModalContent/ModalContent.js +0 -280
- package/dist/modal/components/OAuth/FarcasterOAuthStep.js +0 -82
- package/dist/modal/components/OAuth/OAuth.js +0 -125
- package/dist/modal/components/OAuth/TelegramOAuthStep.js +0 -133
- package/dist/modal/components/OnRampComponents/AddingFunds.js +0 -10
- package/dist/modal/components/OnRampComponents/OnRampProviderButton.js +0 -72
- package/dist/modal/components/RecoverySecretStep/RecoverySecretStep.js +0 -67
- package/dist/modal/components/Setup2FAStep/Setup2FAStep.js +0 -105
- package/dist/modal/components/StripeComponents/StripeComponents.js +0 -78
- package/dist/modal/components/TwoFactorDoneStep/TwoFactorDoneStep.js +0 -8
- package/dist/modal/components/VerificationCodeStep/VerificationCodeStep.js +0 -135
- package/dist/modal/components/Waiting/Waiting.js +0 -6
- package/dist/modal/components/WalletCard/PartnerIcon.js +0 -29
- package/dist/modal/components/WalletCard/WalletCard.js +0 -93
- package/dist/modal/components/WalletCreationDoneStep/WalletCreationDoneStep.js +0 -50
- package/dist/modal/components/common.js +0 -67
- package/dist/modal/components/index.js +0 -1
- package/dist/modal/constants/constants.js +0 -93
- package/dist/modal/constants/defaults.js +0 -5
- package/dist/modal/constants/oAuthLogos.js +0 -18
- package/dist/modal/hooks/useActiveWallet.js +0 -11
- package/dist/modal/hooks/useEmbeddedExternalConnection.js +0 -46
- package/dist/modal/hooks/useGoBack.js +0 -34
- package/dist/modal/index.js +0 -9
- package/dist/modal/providers/CosmosExternalWalletContextStub.js +0 -18
- package/dist/modal/providers/EvmExternalWalletContextStub.js +0 -22
- package/dist/modal/providers/ExternalWalletContext.js +0 -253
- package/dist/modal/providers/SolanaExternalWalletContextStub.js +0 -12
- package/dist/modal/stores/externalWalletProvider/actions.js +0 -5
- package/dist/modal/stores/externalWalletProvider/useExternalWalletProviderStore.js +0 -13
- package/dist/modal/stores/index.js +0 -3
- package/dist/modal/stores/modal/actions.js +0 -64
- package/dist/modal/stores/modal/useModalStore.js +0 -41
- package/dist/modal/stores/para/actions.js +0 -5
- package/dist/modal/stores/para/useParaStore.js +0 -3
- package/dist/modal/stores/theme/actions.js +0 -24
- package/dist/modal/stores/theme/useThemeStore.js +0 -14
- package/dist/modal/stores/userInfo/actions.js +0 -34
- package/dist/modal/stores/userInfo/useUserInfoStore.js +0 -9
- package/dist/modal/types/commonTypes.js +0 -1
- package/dist/modal/types/externalWallets.js +0 -21
- package/dist/modal/types/modalProps.js +0 -7
- package/dist/modal/utils/authLayoutHelpers.js +0 -2
- package/dist/modal/utils/getMailtoLink.js +0 -5
- package/dist/modal/utils/getTileButtonFlex.js +0 -15
- package/dist/modal/utils/isPasskeySupported.js +0 -10
- package/dist/modal/utils/openPopup.js +0 -55
- package/dist/modal/utils/routeMobileExternalWallet.js +0 -35
- package/dist/modal/utils/steps.js +0 -215
- package/dist/modal/utils/stringFormatters.js +0 -12
- package/dist/modal/utils/validateOnRampConfig.js +0 -26
- package/dist/provider/ParaProvider.js +0 -16
- package/dist/provider/actions/checkIfUserExists.js +0 -26
- package/dist/provider/actions/createUser.js +0 -30
- package/dist/provider/actions/getAccount.js +0 -24
- package/dist/provider/actions/getWallet.js +0 -16
- package/dist/provider/actions/initiateLogin.js +0 -23
- package/dist/provider/actions/keepSessionAlive.js +0 -23
- package/dist/provider/actions/logout.js +0 -20
- package/dist/provider/actions/signMessage.js +0 -23
- package/dist/provider/actions/signTransaction.js +0 -23
- package/dist/provider/actions/waitForAccountCreation.js +0 -24
- package/dist/provider/actions/waitForLoginAndSetup.js +0 -27
- package/dist/provider/actions/waitForPasskeyAndCreateWallet.js +0 -24
- package/dist/provider/hooks/index.js +0 -3
- package/dist/provider/hooks/mutations/index.js +0 -10
- package/dist/provider/hooks/mutations/useCheckIfUserExists.js +0 -23
- package/dist/provider/hooks/mutations/useCreateUser.js +0 -23
- package/dist/provider/hooks/mutations/useInitiateLogin.js +0 -23
- package/dist/provider/hooks/mutations/useKeepSessionAlive.js +0 -23
- package/dist/provider/hooks/mutations/useLogout.js +0 -33
- package/dist/provider/hooks/mutations/useSignMessage.js +0 -33
- package/dist/provider/hooks/mutations/useSignTransaction.js +0 -33
- package/dist/provider/hooks/mutations/useWaitForAccountCreation.js +0 -30
- package/dist/provider/hooks/mutations/useWaitForLoginAndSetup.js +0 -30
- package/dist/provider/hooks/mutations/useWaitForPasskeyAndCreateWallet.js +0 -30
- package/dist/provider/hooks/queries/index.js +0 -2
- package/dist/provider/hooks/queries/useAccount.js +0 -23
- package/dist/provider/hooks/queries/useWallet.js +0 -24
- package/dist/provider/hooks/utils/index.js +0 -3
- package/dist/provider/hooks/utils/useAutoSessionKeepAlive.js +0 -79
- package/dist/provider/hooks/utils/useClient.js +0 -8
- package/dist/provider/hooks/utils/useEventListeners.js +0 -87
- package/dist/provider/hooks/utils/useInternalClient.js +0 -9
- package/dist/provider/hooks/utils/useModal.js +0 -15
- package/dist/provider/hooks/utils/useWalletState.js +0 -33
- package/dist/provider/index.js +0 -3
- package/dist/provider/stores/getters.js +0 -5
- package/dist/provider/stores/slices/client.js +0 -4
- package/dist/provider/stores/slices/index.js +0 -3
- package/dist/provider/stores/slices/modal.js +0 -4
- package/dist/provider/stores/slices/wallet.js +0 -6
- package/dist/provider/stores/types.js +0 -1
- package/dist/provider/stores/useStore.js +0 -12
- package/dist/provider/types/provider.js +0 -1
- package/dist/provider/types/query.js +0 -1
- package/dist/provider/types/utils.js +0 -1
- package/dist/provider/utils/renameMutations.js +0 -19
- /package/dist/{modal/css → css}/modal.css +0 -0
- /package/dist/{modal/public → public}/Inter-VariableFont_slnt,wght.ttf +0 -0
|
@@ -1,65 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { StepContainer } from '../common.js';
|
|
3
|
-
import { OnRampProvider } from '@getpara/web-sdk';
|
|
4
|
-
import { useModalStore, useThemeStore } from '../../stores/index.js';
|
|
5
|
-
import { lazy, useEffect, useMemo, useState } from 'react';
|
|
6
|
-
import { ModalStep } from '../../utils/steps.js';
|
|
7
|
-
import { RampEmbed, StripeEmbed } from '@getpara/react-common';
|
|
8
|
-
import styled from 'styled-components';
|
|
9
|
-
import { useGoBack } from '../../hooks/useGoBack.js';
|
|
10
|
-
import { useInternalClient } from '../../../provider/hooks/utils/useInternalClient.js';
|
|
11
|
-
const STEPS = {
|
|
12
|
-
CANCELLED: ModalStep.ADD_FUNDS_FAILURE,
|
|
13
|
-
FINISHED: ModalStep.ADD_FUNDS_SUCCESS,
|
|
14
|
-
};
|
|
15
|
-
export const AddFundsAwaiting = () => {
|
|
16
|
-
const setStep = useModalStore(state => state.setStep);
|
|
17
|
-
const goBack = useGoBack();
|
|
18
|
-
const onRampConfig = useModalStore(state => state.onRampConfig);
|
|
19
|
-
const onRampPurchase = useModalStore(state => state.onRampPurchase);
|
|
20
|
-
const setOnRampPurchase = useModalStore(state => state.setOnRampPurchase);
|
|
21
|
-
const para = useInternalClient();
|
|
22
|
-
const appName = useThemeStore(state => state.appName);
|
|
23
|
-
const isDark = useThemeStore(state => state.isDark);
|
|
24
|
-
const [MoonPayEmbed, setMoonPayEmbed] = useState(null);
|
|
25
|
-
const props = {
|
|
26
|
-
para,
|
|
27
|
-
appName,
|
|
28
|
-
onRampConfig,
|
|
29
|
-
onRampPurchase: onRampPurchase,
|
|
30
|
-
isDark,
|
|
31
|
-
isEmbedded: true,
|
|
32
|
-
setOnRampPurchase,
|
|
33
|
-
onClose: goBack,
|
|
34
|
-
};
|
|
35
|
-
useEffect(() => {
|
|
36
|
-
const _MoonPayEmbed = lazy(() => import(`./MoonPayEmbed.js`));
|
|
37
|
-
setMoonPayEmbed(_MoonPayEmbed);
|
|
38
|
-
}, []);
|
|
39
|
-
const onRampEmbed = useMemo(() => {
|
|
40
|
-
if (!onRampPurchase.id) {
|
|
41
|
-
return null;
|
|
42
|
-
}
|
|
43
|
-
switch (onRampPurchase === null || onRampPurchase === void 0 ? void 0 : onRampPurchase.provider) {
|
|
44
|
-
case OnRampProvider.STRIPE:
|
|
45
|
-
return _jsx(StripeEmbed, Object.assign({}, props));
|
|
46
|
-
case OnRampProvider.MOONPAY:
|
|
47
|
-
return !MoonPayEmbed || typeof window === 'undefined' ? null : _jsx(MoonPayEmbed, Object.assign({}, props));
|
|
48
|
-
case OnRampProvider.RAMP:
|
|
49
|
-
return _jsx(RampEmbed, Object.assign({ apiKey: onRampConfig.rampApiKey }, props));
|
|
50
|
-
}
|
|
51
|
-
}, [onRampPurchase === null || onRampPurchase === void 0 ? void 0 : onRampPurchase.provider, MoonPayEmbed]);
|
|
52
|
-
useEffect(() => {
|
|
53
|
-
let timeoutId;
|
|
54
|
-
if ((onRampPurchase === null || onRampPurchase === void 0 ? void 0 : onRampPurchase.status) && ['CANCELLED', 'FINISHED'].includes(onRampPurchase.status)) {
|
|
55
|
-
timeoutId = setTimeout(() => {
|
|
56
|
-
setStep(STEPS[onRampPurchase.status]);
|
|
57
|
-
}, 5000);
|
|
58
|
-
}
|
|
59
|
-
return () => clearTimeout(timeoutId);
|
|
60
|
-
}, [onRampPurchase === null || onRampPurchase === void 0 ? void 0 : onRampPurchase.status]);
|
|
61
|
-
return _jsx(Container, { "$wide": true, children: onRampEmbed });
|
|
62
|
-
};
|
|
63
|
-
const Container = styled(StepContainer) `
|
|
64
|
-
flex: 1;
|
|
65
|
-
`;
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Heading, HeroIcon, InnerStepContainer, StepContainer } from '../common.js';
|
|
3
|
-
import { useModalStore, useThemeStore } from '../../stores/index.js';
|
|
4
|
-
import { useMemo } from 'react';
|
|
5
|
-
import { CpslButton, CpslText } from '@getpara/react-components';
|
|
6
|
-
import { getAddFundsStep } from '../../utils/steps.js';
|
|
7
|
-
export const AddFundsDone = ({ isSuccess, onClose }) => {
|
|
8
|
-
const hideWallets = useThemeStore(state => state.hideWallets);
|
|
9
|
-
const setStep = useModalStore(state => state.setStep);
|
|
10
|
-
const onRampPurchase = useModalStore(state => state.onRampPurchase);
|
|
11
|
-
const accountAddFundTab = useModalStore(state => state.accountAddFundTab);
|
|
12
|
-
const formatter = useMemo(() => {
|
|
13
|
-
return new Intl.NumberFormat('en-US', {
|
|
14
|
-
style: 'currency',
|
|
15
|
-
currency: (onRampPurchase === null || onRampPurchase === void 0 ? void 0 : onRampPurchase.fiat) || 'USD',
|
|
16
|
-
});
|
|
17
|
-
}, [onRampPurchase === null || onRampPurchase === void 0 ? void 0 : onRampPurchase.fiat]);
|
|
18
|
-
const heading = isSuccess ? 'Transaction Successful' : 'Something Went Wrong';
|
|
19
|
-
const text = isSuccess
|
|
20
|
-
? `${formatter.format(parseFloat(onRampPurchase === null || onRampPurchase === void 0 ? void 0 : onRampPurchase.fiatQuantity))} is now available in your ${hideWallets ? 'account' : 'wallet'}.`
|
|
21
|
-
: `No funds were added to your ${hideWallets ? 'account' : 'wallet'}.`;
|
|
22
|
-
const buttonText = isSuccess ? 'Done' : 'Try Again';
|
|
23
|
-
return (_jsxs(StepContainer, { children: [_jsx(HeroIcon, { icon: "checkCircleFilled" }), _jsxs(InnerStepContainer, { children: [_jsx(Heading, { variant: "headingS", weight: "bold", children: heading }), _jsx(CpslText, { variant: "bodyS", color: "secondary", children: text })] }), _jsx(CpslButton, { fullWidth: true, onClick: () => {
|
|
24
|
-
isSuccess ? onClose() : setStep(getAddFundsStep(accountAddFundTab));
|
|
25
|
-
}, children: buttonText })] }));
|
|
26
|
-
};
|
|
@@ -1,221 +0,0 @@
|
|
|
1
|
-
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
2
|
-
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
3
|
-
return new (P || (P = Promise))(function (resolve, reject) {
|
|
4
|
-
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
5
|
-
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
6
|
-
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
7
|
-
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
8
|
-
});
|
|
9
|
-
};
|
|
10
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
11
|
-
import { CpslButton, CpslIcon, CpslInput, CpslSelect, CpslSelectItem, CpslSpinner, CpslText, } from '@getpara/react-components';
|
|
12
|
-
import { useRef, useState } from 'react';
|
|
13
|
-
import styled from 'styled-components';
|
|
14
|
-
import countryCodes from './countryCodes.js';
|
|
15
|
-
import { useModalStore, useUserInfoStore } from '../../stores/index.js';
|
|
16
|
-
import { EMAIL_REGEX, MOBILE_SIZE } from '../../constants/constants.js';
|
|
17
|
-
import { useDropdownPosition } from './hooks/useDropdownPosition.js';
|
|
18
|
-
import { ModalStep } from '../../utils/steps.js';
|
|
19
|
-
import { defaultPhoneMask, phoneMasks } from './phoneMasks.js';
|
|
20
|
-
import { AuthMethod } from '@getpara/web-sdk';
|
|
21
|
-
import { useInternalClient } from '../../../provider/hooks/utils/useInternalClient.js';
|
|
22
|
-
const DEFAULT_COUNTRY = { label: 'United States', value: '+1', selectedLabel: 'US', icon: 'US' };
|
|
23
|
-
export const AuthInput = ({ disableEmailLogin, disablePhoneLogin }) => {
|
|
24
|
-
var _a;
|
|
25
|
-
const inputRef = useRef(null);
|
|
26
|
-
const { dropdownMaxHeight, dropdownWidth } = useDropdownPosition(inputRef);
|
|
27
|
-
const para = useInternalClient();
|
|
28
|
-
const setAuthInfo = useUserInfoStore(state => state.setAuthInfo);
|
|
29
|
-
const authInfo = useUserInfoStore(state => state.getAuthInfo());
|
|
30
|
-
const setFlow = useModalStore(state => state.setFlow);
|
|
31
|
-
const setStep = useModalStore(state => state.setStep);
|
|
32
|
-
const setSupportedAuthMethods = useModalStore(state => state.setSupportedAuthMethods);
|
|
33
|
-
const setBiometricLocationHints = useModalStore(state => state.setBiometricLocationHints);
|
|
34
|
-
const [countryCode, setCountryCode] = useState(((authInfo === null || authInfo === void 0 ? void 0 : authInfo.authType) === 'phone' ? authInfo.auth.countryCode : '+1'));
|
|
35
|
-
const [identifier, setIdentifier] = useState((() => {
|
|
36
|
-
if (!authInfo || ['telegramUserId', 'farcasterUsername'].includes(authInfo.authType)) {
|
|
37
|
-
return '';
|
|
38
|
-
}
|
|
39
|
-
if (authInfo.authType !== 'phone') {
|
|
40
|
-
return authInfo.identifier;
|
|
41
|
-
}
|
|
42
|
-
return authInfo.auth.phone;
|
|
43
|
-
})());
|
|
44
|
-
const [identifierType, setIdentifierType] = useState(authInfo && (authInfo.authType === 'email' || authInfo.authType === 'phone') ? authInfo.authType : undefined);
|
|
45
|
-
const [matchedCountryCode, setMatchedCountryCode] = useState(DEFAULT_COUNTRY);
|
|
46
|
-
const [isLoggingIn, setIsLoggingIn] = useState(false);
|
|
47
|
-
const [error, setError] = useState('');
|
|
48
|
-
const [search, setSearch] = useState('');
|
|
49
|
-
const isEmail = identifierType === 'email';
|
|
50
|
-
const isPhone = identifierType === 'phone';
|
|
51
|
-
const isUnknown = !identifierType;
|
|
52
|
-
const filteredCountryCodes = search
|
|
53
|
-
? countryCodes.filter(cc => cc.selectedLabel.toLowerCase().includes(search.toLowerCase()) ||
|
|
54
|
-
cc.label.toLowerCase().includes(search.toLowerCase()) ||
|
|
55
|
-
cc.value.toLowerCase().includes(search.toLowerCase()))
|
|
56
|
-
: countryCodes;
|
|
57
|
-
const handleSearchInput = (ev) => {
|
|
58
|
-
setSearch(ev.detail);
|
|
59
|
-
};
|
|
60
|
-
const handleIdentifierInput = (ev) => {
|
|
61
|
-
const newIdentifier = ev.detail.value;
|
|
62
|
-
let isNewPhone = false, isNewEmail = false;
|
|
63
|
-
if (!disablePhoneLogin) {
|
|
64
|
-
const countryCodeInputMatch = countryCodes.find(cc => cc.value === newIdentifier);
|
|
65
|
-
if (countryCodeInputMatch) {
|
|
66
|
-
setCountryCode(countryCodeInputMatch.value);
|
|
67
|
-
setMatchedCountryCode(countryCodeInputMatch);
|
|
68
|
-
setIdentifierType('phone');
|
|
69
|
-
setIdentifier('');
|
|
70
|
-
return;
|
|
71
|
-
}
|
|
72
|
-
isNewPhone = !isEmail && isPhone ? /\d+$/.test(newIdentifier) : /\d\d\d+$/.test(newIdentifier);
|
|
73
|
-
}
|
|
74
|
-
if (!disableEmailLogin) {
|
|
75
|
-
isNewEmail = /\D.*$/.test(newIdentifier);
|
|
76
|
-
}
|
|
77
|
-
setIdentifierType(isNewEmail ? 'email' : isNewPhone ? 'phone' : undefined);
|
|
78
|
-
setIdentifier(newIdentifier);
|
|
79
|
-
};
|
|
80
|
-
const handleCountryCodeInput = (ev) => {
|
|
81
|
-
const matchedCountryCode = countryCodes.find(code => code.selectedLabel === ev.detail);
|
|
82
|
-
setCountryCode(matchedCountryCode.value);
|
|
83
|
-
setMatchedCountryCode(matchedCountryCode);
|
|
84
|
-
};
|
|
85
|
-
const login = () => __awaiter(void 0, void 0, void 0, function* () {
|
|
86
|
-
setError('');
|
|
87
|
-
if (isUnknown) {
|
|
88
|
-
setError('Please enter a valid email or phone number!');
|
|
89
|
-
return;
|
|
90
|
-
}
|
|
91
|
-
let auth;
|
|
92
|
-
if (isEmail) {
|
|
93
|
-
if (!EMAIL_REGEX.test(identifier)) {
|
|
94
|
-
setError('Please enter a valid email!');
|
|
95
|
-
return;
|
|
96
|
-
}
|
|
97
|
-
// Logout to ensure cleared Capsule state but preserve pregen wallets
|
|
98
|
-
// TODO: migrate to hook once we force the use of the CapsuleProvider
|
|
99
|
-
yield para.logout();
|
|
100
|
-
auth = { email: identifier };
|
|
101
|
-
setAuthInfo(auth);
|
|
102
|
-
const userExists = yield para.checkIfUserExists({ email: identifier });
|
|
103
|
-
if (userExists) {
|
|
104
|
-
const supportedAuthMethods = yield para.initiateUserLoginV2(auth);
|
|
105
|
-
const biometricLocationHints = supportedAuthMethods.has(AuthMethod.PASSKEY)
|
|
106
|
-
? yield para.getUserBiometricLocationHints()
|
|
107
|
-
: [];
|
|
108
|
-
setFlow('login');
|
|
109
|
-
setStep(ModalStep.BIOMETRIC_LOGIN);
|
|
110
|
-
setSupportedAuthMethods(supportedAuthMethods);
|
|
111
|
-
setBiometricLocationHints(biometricLocationHints);
|
|
112
|
-
return;
|
|
113
|
-
}
|
|
114
|
-
// TODO: migrate to hook once we force the use of the CapsuleProvider
|
|
115
|
-
yield para.createUser(auth);
|
|
116
|
-
setFlow('signUp');
|
|
117
|
-
setStep(ModalStep.VERIFICATIONS);
|
|
118
|
-
return;
|
|
119
|
-
}
|
|
120
|
-
if (isPhone) {
|
|
121
|
-
// Logout to ensure cleared Capsule state but preserve pregen wallets
|
|
122
|
-
// TODO: migrate to hook once we force the use of the CapsuleProvider
|
|
123
|
-
yield para.logout();
|
|
124
|
-
let userExists = false;
|
|
125
|
-
try {
|
|
126
|
-
userExists = yield para.checkIfUserExistsByPhone({ phone: identifier, countryCode });
|
|
127
|
-
}
|
|
128
|
-
catch (error) {
|
|
129
|
-
setError('Please enter a valid phone number!');
|
|
130
|
-
return;
|
|
131
|
-
}
|
|
132
|
-
auth = { phone: identifier, countryCode };
|
|
133
|
-
setAuthInfo(auth);
|
|
134
|
-
if (userExists) {
|
|
135
|
-
// TODO: migrate to hook once we force the use of the CapsuleProvider
|
|
136
|
-
const supportedAuthMethods = yield para.initiateUserLoginV2(auth);
|
|
137
|
-
const biometricLocationHints = supportedAuthMethods.has(AuthMethod.PASSKEY)
|
|
138
|
-
? yield para.getUserBiometricLocationHints()
|
|
139
|
-
: [];
|
|
140
|
-
setFlow('login');
|
|
141
|
-
setStep(ModalStep.BIOMETRIC_LOGIN);
|
|
142
|
-
setSupportedAuthMethods(supportedAuthMethods);
|
|
143
|
-
setBiometricLocationHints(biometricLocationHints);
|
|
144
|
-
return;
|
|
145
|
-
}
|
|
146
|
-
// TODO: migrate to hook once we force the use of the CapsuleProvider
|
|
147
|
-
yield para.createUserByPhone(auth);
|
|
148
|
-
setFlow('signUp');
|
|
149
|
-
setStep(ModalStep.VERIFICATIONS);
|
|
150
|
-
return;
|
|
151
|
-
}
|
|
152
|
-
});
|
|
153
|
-
const handleSubmit = () => __awaiter(void 0, void 0, void 0, function* () {
|
|
154
|
-
setIsLoggingIn(true);
|
|
155
|
-
yield login();
|
|
156
|
-
setIsLoggingIn(false);
|
|
157
|
-
});
|
|
158
|
-
if (disableEmailLogin && disablePhoneLogin) {
|
|
159
|
-
return null;
|
|
160
|
-
}
|
|
161
|
-
return (_jsx("form", { onSubmit: (e) => __awaiter(void 0, void 0, void 0, function* () {
|
|
162
|
-
e.preventDefault();
|
|
163
|
-
yield handleSubmit();
|
|
164
|
-
}), children: _jsxs(StyledInput, { ref: inputRef, id: "authInput", placeholder: isEmail || disablePhoneLogin
|
|
165
|
-
? 'Enter email'
|
|
166
|
-
: isPhone || disableEmailLogin
|
|
167
|
-
? 'Enter phone'
|
|
168
|
-
: 'Enter email or phone', onCpslInput: handleIdentifierInput, value: identifier, errorText: error, autofocus: true, inputMode: "email", onKeyDown: (e) => __awaiter(void 0, void 0, void 0, function* () { return e.key === 'Enter' && handleSubmit(); }), contrastText: true, isPhone: isPhone, mask: identifierType === 'phone' ? ((_a = phoneMasks[matchedCountryCode.selectedLabel]) !== null && _a !== void 0 ? _a : defaultPhoneMask) : undefined, enterkeyhint: "go", noAutoDisable: true, disabled: isLoggingIn, "data-testid": "auth-input", children: [_jsxs(IconContainer, { slot: "start", children: [!disableEmailLogin && (isUnknown || isEmail) && _jsx(CpslIcon, { "aria-label": "email", icon: "mail" }), !disablePhoneLogin && isUnknown && _jsx(CpslIcon, { "aria-label": "phone", icon: "phone" }), isPhone && (_jsxs(CountryCodeSelect, { selectedValue: matchedCountryCode.selectedLabel, onCpslSelectValueChange: handleCountryCodeInput, showFormattedSelectedItem: true, autoWidth: true, dropdownMaxHeight: dropdownMaxHeight, anchorElId: "authInput", "$width": dropdownWidth, showSearch: true, searchPlaceholder: "Search Countries", onCpslSearchChange: handleSearchInput, "data-testid": "country-code-select", children: [matchedCountryCode && (_jsxs(SelectedItem, { slot: "selected-item", children: [_jsx(CpslText, { children: matchedCountryCode.selectedLabel }), _jsx(CpslText, { children: matchedCountryCode.value })] })), filteredCountryCodes.map(cc => (_jsxs(StyledSelectItem, { slot: "items", value: cc.selectedLabel, children: [_jsx(CpslText, { children: cc.label }), _jsx(CpslText, { children: cc.value })] }, cc.selectedLabel)))] }))] }), identifier && (_jsx(CpslButton, { slot: "end", size: "small", fullWidth: true, disabled: isLoggingIn, onClick: handleSubmit, children: isLoggingIn ? _jsx(CpslSpinner, { size: 16 }) : _jsx(CpslIcon, { icon: "arrowNarrow" }) }))] }, 'email') }));
|
|
169
|
-
};
|
|
170
|
-
const IconContainer = styled.div `
|
|
171
|
-
height: 100%;
|
|
172
|
-
display: flex;
|
|
173
|
-
align-items: center;
|
|
174
|
-
gap: 8px;
|
|
175
|
-
padding-right: 12px;
|
|
176
|
-
border-right: 1px solid var(--cpsl-color-background-16);
|
|
177
|
-
|
|
178
|
-
& cpsl-icon {
|
|
179
|
-
--icon-color: var(--cpsl-color-contrast);
|
|
180
|
-
}
|
|
181
|
-
`;
|
|
182
|
-
const CountryCodeSelect = styled(CpslSelect) `
|
|
183
|
-
--container-height: 100%;
|
|
184
|
-
--container-padding-start: 0px;
|
|
185
|
-
--container-padding-end: 0px;
|
|
186
|
-
--container-border-width: 0px;
|
|
187
|
-
--container-gap: 4px;
|
|
188
|
-
--container-background-color: transparent;
|
|
189
|
-
--container-box-shadow: none;
|
|
190
|
-
|
|
191
|
-
&::part(dropdown) {
|
|
192
|
-
width: ${({ $width }) => `${$width - 2}px`};
|
|
193
|
-
}
|
|
194
|
-
|
|
195
|
-
&::part(popover) {
|
|
196
|
-
@media (max-width: ${MOBILE_SIZE}px) {
|
|
197
|
-
top: unset !important;
|
|
198
|
-
bottom: 16px;
|
|
199
|
-
}
|
|
200
|
-
|
|
201
|
-
cpsl-auth-modal.force-mobile-media & {
|
|
202
|
-
top: unset !important;
|
|
203
|
-
bottom: 16px;
|
|
204
|
-
}
|
|
205
|
-
}
|
|
206
|
-
`;
|
|
207
|
-
const StyledSelectItem = styled(CpslSelectItem) `
|
|
208
|
-
&::part(inner-container) {
|
|
209
|
-
justify-content: space-between;
|
|
210
|
-
}
|
|
211
|
-
`;
|
|
212
|
-
const SelectedItem = styled.div `
|
|
213
|
-
display: flex;
|
|
214
|
-
gap: 4px;
|
|
215
|
-
align-items: center;
|
|
216
|
-
`;
|
|
217
|
-
const StyledInput = styled(CpslInput) `
|
|
218
|
-
--container-background-color: var(--cpsl-color-background-8);
|
|
219
|
-
--input-background-color: var(--cpsl-color-background-8);
|
|
220
|
-
--container-padding-end: 8px;
|
|
221
|
-
`;
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
import { getCountries, getCountryCallingCode } from 'libphonenumber-js';
|
|
2
|
-
const excludedCountries = [
|
|
3
|
-
'AC',
|
|
4
|
-
'CG',
|
|
5
|
-
'CI',
|
|
6
|
-
'CV',
|
|
7
|
-
'GF',
|
|
8
|
-
'GP',
|
|
9
|
-
'MF',
|
|
10
|
-
'NC',
|
|
11
|
-
'PM',
|
|
12
|
-
'RE',
|
|
13
|
-
'SD',
|
|
14
|
-
'SH',
|
|
15
|
-
'SJ',
|
|
16
|
-
'TA',
|
|
17
|
-
'VA',
|
|
18
|
-
'WF',
|
|
19
|
-
'XK',
|
|
20
|
-
'YT',
|
|
21
|
-
];
|
|
22
|
-
const generateCountryCodes = () => {
|
|
23
|
-
const countries = getCountries();
|
|
24
|
-
const countryList = countries
|
|
25
|
-
.filter(country => !excludedCountries.includes(country))
|
|
26
|
-
.map(country => {
|
|
27
|
-
const countryCode = getCountryCallingCode(country);
|
|
28
|
-
const countryName = new Intl.DisplayNames(['en'], { type: 'region' }).of(country);
|
|
29
|
-
return {
|
|
30
|
-
label: countryName,
|
|
31
|
-
value: `+${countryCode}`,
|
|
32
|
-
selectedLabel: country,
|
|
33
|
-
icon: country,
|
|
34
|
-
};
|
|
35
|
-
})
|
|
36
|
-
.sort((a, b) => a.label.localeCompare(b.label));
|
|
37
|
-
return countryList;
|
|
38
|
-
};
|
|
39
|
-
const countryCodes = generateCountryCodes();
|
|
40
|
-
export default countryCodes;
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import { useEffect, useState } from 'react';
|
|
2
|
-
export const useDropdownPosition = (inputRef) => {
|
|
3
|
-
const [dropdownMaxHeight, setDropdownMaxHeight] = useState();
|
|
4
|
-
const [dropdownWidth, setDropdownWidth] = useState();
|
|
5
|
-
const [mobileAnchor, setMobileAnchor] = useState();
|
|
6
|
-
const resize = () => {
|
|
7
|
-
var _a, _b, _c;
|
|
8
|
-
const newMaxHeight = Math.max(window.innerHeight - ((_a = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().bottom) - 20, window.innerHeight * 0.25);
|
|
9
|
-
setDropdownMaxHeight(newMaxHeight);
|
|
10
|
-
setDropdownWidth((_b = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().width);
|
|
11
|
-
setMobileAnchor((_c = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect().height);
|
|
12
|
-
};
|
|
13
|
-
if (inputRef.current && !dropdownMaxHeight) {
|
|
14
|
-
resize();
|
|
15
|
-
}
|
|
16
|
-
useEffect(() => {
|
|
17
|
-
window.addEventListener('resize', resize);
|
|
18
|
-
return () => {
|
|
19
|
-
window.removeEventListener('resize', resize);
|
|
20
|
-
};
|
|
21
|
-
}, []);
|
|
22
|
-
return { dropdownMaxHeight, dropdownWidth, mobileAnchor, resize };
|
|
23
|
-
};
|
|
@@ -1,247 +0,0 @@
|
|
|
1
|
-
export const defaultPhoneMask = '#################';
|
|
2
|
-
export const phoneMasks = {
|
|
3
|
-
AF: '### ### ####',
|
|
4
|
-
AX: '## ### ####',
|
|
5
|
-
AL: '(###) ### ###',
|
|
6
|
-
DZ: '(###) ### ###',
|
|
7
|
-
AS: '(###) ###-####',
|
|
8
|
-
AD: '### ###',
|
|
9
|
-
AO: '(###) ### ###',
|
|
10
|
-
AI: '(###) ###-####',
|
|
11
|
-
AG: '(###) ###-####',
|
|
12
|
-
AR: '(###) ###-####',
|
|
13
|
-
AM: '## ### ###',
|
|
14
|
-
AW: '### ####',
|
|
15
|
-
AU: '# #### ####',
|
|
16
|
-
AT: '(###) ### ####',
|
|
17
|
-
AZ: '(###) ### ## ##',
|
|
18
|
-
BS: '(###) ###-####',
|
|
19
|
-
BH: '#### ####',
|
|
20
|
-
BD: '# ### ###',
|
|
21
|
-
BB: '(###) ###-####',
|
|
22
|
-
BY: '(##) ###-##-##',
|
|
23
|
-
BE: '(###) ### ###',
|
|
24
|
-
BZ: '###-####',
|
|
25
|
-
BJ: '##-##-####',
|
|
26
|
-
BM: '(###) ###-####',
|
|
27
|
-
BT: '# ### ###',
|
|
28
|
-
BO: '# ### ####',
|
|
29
|
-
BA: '## ###-###',
|
|
30
|
-
BW: '## ### ###',
|
|
31
|
-
BR: '(##) ####-####',
|
|
32
|
-
IO: '### ####',
|
|
33
|
-
BN: '### ####',
|
|
34
|
-
BG: '(###) ### ###',
|
|
35
|
-
BF: '## ## ####',
|
|
36
|
-
BI: '## ## ####',
|
|
37
|
-
KH: '## ### ###',
|
|
38
|
-
CM: '#### ####',
|
|
39
|
-
CA: '(###) ###-####',
|
|
40
|
-
CV: '(###) ## ##',
|
|
41
|
-
KY: '(###) ###-####',
|
|
42
|
-
CF: '## ## ####',
|
|
43
|
-
TD: '## ## ## ##',
|
|
44
|
-
CL: '# #### ####',
|
|
45
|
-
CN: '(###) #### ####',
|
|
46
|
-
CX: '# ## ## ##',
|
|
47
|
-
CC: '# ## ## ##',
|
|
48
|
-
CO: '(###) ### ####',
|
|
49
|
-
KM: '## ## ## ##',
|
|
50
|
-
CG: '## ### ####',
|
|
51
|
-
CK: '## ###',
|
|
52
|
-
CR: '#### ####',
|
|
53
|
-
HR: '## #### ###',
|
|
54
|
-
CU: '# ### ####',
|
|
55
|
-
CY: '## ### ###',
|
|
56
|
-
CZ: '### ### ###',
|
|
57
|
-
CD: '### ### ###',
|
|
58
|
-
DK: '## ## ## ##',
|
|
59
|
-
DJ: '## ## ## ##',
|
|
60
|
-
DM: '(###) ###-####',
|
|
61
|
-
DO: '(###) ###-####',
|
|
62
|
-
EC: '## ### ####',
|
|
63
|
-
EG: '# #### ####',
|
|
64
|
-
SV: '#### ####',
|
|
65
|
-
GQ: '## ### ####',
|
|
66
|
-
ER: '# ### ###',
|
|
67
|
-
EE: '#### ####',
|
|
68
|
-
SZ: '#### ####',
|
|
69
|
-
ET: '## ### ####',
|
|
70
|
-
FK: '#####',
|
|
71
|
-
FO: '######',
|
|
72
|
-
FJ: '### ####',
|
|
73
|
-
FI: '## ### ####',
|
|
74
|
-
FR: '## ## ## ## ##',
|
|
75
|
-
GF: '### ## ## ##',
|
|
76
|
-
PF: '## ## ##',
|
|
77
|
-
GA: '# ## ## ##',
|
|
78
|
-
GM: '### ####',
|
|
79
|
-
GE: '(###) ## ## ##',
|
|
80
|
-
DE: '(###) ### ####',
|
|
81
|
-
GH: '## ### ####',
|
|
82
|
-
GI: '### #####',
|
|
83
|
-
GR: '(###) ### ####',
|
|
84
|
-
GL: '## ## ##',
|
|
85
|
-
GD: '(###) ###-####',
|
|
86
|
-
GP: '### ## ## ##',
|
|
87
|
-
GU: '(###) ###-####',
|
|
88
|
-
GT: '# ### ####',
|
|
89
|
-
GG: '(####) ### ###',
|
|
90
|
-
GN: '## ### ###',
|
|
91
|
-
GW: '# #######',
|
|
92
|
-
GY: '### ####',
|
|
93
|
-
HT: '## ## ####',
|
|
94
|
-
VA: '### ####',
|
|
95
|
-
HN: '####-####',
|
|
96
|
-
HK: '#### ####',
|
|
97
|
-
HU: '(##) ### ####',
|
|
98
|
-
IS: '### ####',
|
|
99
|
-
IN: '####### ###',
|
|
100
|
-
ID: '(###) ###-####',
|
|
101
|
-
IR: '(###) ### ####',
|
|
102
|
-
IQ: '(###) ### ####',
|
|
103
|
-
IE: '(###) ### ###',
|
|
104
|
-
IM: '(####) ### ###',
|
|
105
|
-
IL: '#-###-####',
|
|
106
|
-
IT: '(###) #### ###',
|
|
107
|
-
CI: '## ## ## ##',
|
|
108
|
-
JM: '(###) ###-####',
|
|
109
|
-
JP: '(###) ###-####',
|
|
110
|
-
JE: '(####) ### ###',
|
|
111
|
-
JO: '# #### ####',
|
|
112
|
-
KZ: '(###) ###-##-##',
|
|
113
|
-
KE: '### ######',
|
|
114
|
-
KI: '## ###',
|
|
115
|
-
KP: '###-###-####',
|
|
116
|
-
KR: '(###) ####-####',
|
|
117
|
-
XK: '## ### ###',
|
|
118
|
-
KW: '#### ####',
|
|
119
|
-
KG: '(###) ###-###',
|
|
120
|
-
LA: '## ## ####',
|
|
121
|
-
LV: '## ### ###',
|
|
122
|
-
LB: '## ### ###',
|
|
123
|
-
LS: '# ### ####',
|
|
124
|
-
LR: '## ### ###',
|
|
125
|
-
LY: '##-#######',
|
|
126
|
-
LI: '(###) ###-####',
|
|
127
|
-
LT: '(###) ## ###',
|
|
128
|
-
LU: '### ### ###',
|
|
129
|
-
MO: '#### ####',
|
|
130
|
-
MG: '## ## ### ##',
|
|
131
|
-
MW: '# #### ####',
|
|
132
|
-
MY: '(###) ###-###',
|
|
133
|
-
MV: '###-####',
|
|
134
|
-
ML: '## ## ####',
|
|
135
|
-
MT: '#### ####',
|
|
136
|
-
MH: '###-####',
|
|
137
|
-
MQ: '### ## ## ##',
|
|
138
|
-
MR: '## ## ####',
|
|
139
|
-
MU: '### ####',
|
|
140
|
-
YT: '### ## ## ##',
|
|
141
|
-
MX: '(###) ###-####',
|
|
142
|
-
FM: '### ####',
|
|
143
|
-
MD: '#### ####',
|
|
144
|
-
MC: '(###) ###-###',
|
|
145
|
-
MN: '## ## ####',
|
|
146
|
-
ME: '## ### ###',
|
|
147
|
-
MS: '(###) ###-####',
|
|
148
|
-
MA: '#-####-####',
|
|
149
|
-
MZ: '## ### ####',
|
|
150
|
-
MM: '# ### ####',
|
|
151
|
-
NA: '## ### ####',
|
|
152
|
-
NR: '### ####',
|
|
153
|
-
NP: '#-######',
|
|
154
|
-
NL: '## ### ####',
|
|
155
|
-
NC: '##.##.##',
|
|
156
|
-
NZ: '## ### ###',
|
|
157
|
-
NI: '#### ####',
|
|
158
|
-
NE: '## ## ## ##',
|
|
159
|
-
NG: '## ### ####',
|
|
160
|
-
NU: '####',
|
|
161
|
-
NF: '### ###',
|
|
162
|
-
MK: '## ### ###',
|
|
163
|
-
MP: '(###) ###-####',
|
|
164
|
-
NO: '### ## ###',
|
|
165
|
-
OM: '#### ####',
|
|
166
|
-
PK: '(###) #######',
|
|
167
|
-
PW: '### ####',
|
|
168
|
-
PS: '## ### ####',
|
|
169
|
-
PA: '####-####',
|
|
170
|
-
PG: '(###) ## ###',
|
|
171
|
-
PY: '## ### ####',
|
|
172
|
-
PE: '(###) ### ###',
|
|
173
|
-
PH: '(###) ###-####',
|
|
174
|
-
PN: '### ####',
|
|
175
|
-
PL: '### ### ###',
|
|
176
|
-
PT: '## ### ####',
|
|
177
|
-
PR: '(###) ###-####',
|
|
178
|
-
QA: '#### ####',
|
|
179
|
-
RE: '##### ####',
|
|
180
|
-
RO: '## ### ####',
|
|
181
|
-
RU: '(###) ###-##-##',
|
|
182
|
-
RW: '(###) ### ###',
|
|
183
|
-
BL: '### ## ## ##',
|
|
184
|
-
SH: '####',
|
|
185
|
-
KN: '(###) ###-####',
|
|
186
|
-
LC: '(###) ###-####',
|
|
187
|
-
MF: '### ## ## ##',
|
|
188
|
-
PM: '## ## ##',
|
|
189
|
-
VC: '(###) ###-####',
|
|
190
|
-
WS: '####',
|
|
191
|
-
SM: '(####) ######',
|
|
192
|
-
ST: '## ####',
|
|
193
|
-
SA: '# ### ####',
|
|
194
|
-
SN: '## ### ####',
|
|
195
|
-
RS: '## ### ####',
|
|
196
|
-
SC: '# ### ###',
|
|
197
|
-
SL: '## ######',
|
|
198
|
-
SG: '#### ####',
|
|
199
|
-
SX: '(###) ###-####',
|
|
200
|
-
SK: '(###) ### ###',
|
|
201
|
-
SI: '## ### ###',
|
|
202
|
-
SB: '### ####',
|
|
203
|
-
SO: '# ### ###',
|
|
204
|
-
ZA: '## ### ####',
|
|
205
|
-
GS: '####',
|
|
206
|
-
SS: '# ### ####',
|
|
207
|
-
ES: '### ### ###',
|
|
208
|
-
LK: '## ### ####',
|
|
209
|
-
SD: '## ### ####',
|
|
210
|
-
SR: '###-####',
|
|
211
|
-
SJ: '### ## ###',
|
|
212
|
-
SE: '## ### ####',
|
|
213
|
-
CH: '## ### ####',
|
|
214
|
-
SY: '## #### ###',
|
|
215
|
-
TW: '#### ####',
|
|
216
|
-
TJ: '## ### ####',
|
|
217
|
-
TZ: '## ### ####',
|
|
218
|
-
TH: '# #### ####',
|
|
219
|
-
TL: '#### ####',
|
|
220
|
-
TG: '## ## ## ##',
|
|
221
|
-
TK: '####',
|
|
222
|
-
TO: '####',
|
|
223
|
-
TT: '(###) ###-####',
|
|
224
|
-
TN: '## ### ###',
|
|
225
|
-
TR: '(###) ### ####',
|
|
226
|
-
TM: '# ### ###',
|
|
227
|
-
TC: '(###) ###-####',
|
|
228
|
-
TV: '####',
|
|
229
|
-
UG: '## ### ####',
|
|
230
|
-
UA: '## ### ####',
|
|
231
|
-
AE: '# ### ####',
|
|
232
|
-
GB: '#### ### ###',
|
|
233
|
-
US: '(###) ###-####',
|
|
234
|
-
UM: '(###) ###-####',
|
|
235
|
-
UY: '# ### ## ##',
|
|
236
|
-
UZ: '## ### ####',
|
|
237
|
-
VU: '## ####',
|
|
238
|
-
VE: '###-###-####',
|
|
239
|
-
VN: '## #### ###',
|
|
240
|
-
VG: '(###) ###-####',
|
|
241
|
-
VI: '(###) ###-####',
|
|
242
|
-
WF: '## ####',
|
|
243
|
-
EH: '###-###-###',
|
|
244
|
-
YE: '# ### ###',
|
|
245
|
-
ZM: '## ### ####',
|
|
246
|
-
ZW: '# #######',
|
|
247
|
-
};
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import styled from 'styled-components';
|
|
3
|
-
import { useThemeStore } from '../../stores/theme/useThemeStore.js';
|
|
4
|
-
import { AuthMainStepContent } from './AuthMainStepContent.js';
|
|
5
|
-
import { CenteredText } from '../common.js';
|
|
6
|
-
export const AuthMainStep = ({ oAuthMethods, disableEmailLogin, disablePhoneLogin }) => {
|
|
7
|
-
const logo = useThemeStore(state => state.getLogo());
|
|
8
|
-
const appName = useThemeStore(state => state.appName);
|
|
9
|
-
const authLayout = useThemeStore(state => state.authLayout);
|
|
10
|
-
const embeddedModal = useThemeStore(state => state.embeddedModal);
|
|
11
|
-
const firstLayoutType = authLayout[0].split(':')[0];
|
|
12
|
-
const heading = firstLayoutType === 'AUTH' ? 'Sign Up or Login' : 'Connect Wallet';
|
|
13
|
-
return (_jsxs(_Fragment, { children: [logo && _jsx(Logo, { src: logo, alt: `${appName ? `${appName} -` : ''}logo` }), !embeddedModal && (_jsx(CenteredText, { variant: logo ? 'bodyM' : 'headingS', weight: "semiBold", children: heading })), _jsx(AuthMainStepContent, { disableEmailLogin: disableEmailLogin, disablePhoneLogin: disablePhoneLogin, oAuthMethods: oAuthMethods })] }));
|
|
14
|
-
};
|
|
15
|
-
const Logo = styled.img `
|
|
16
|
-
height: 100px;
|
|
17
|
-
max-width: 260px;
|
|
18
|
-
object-fit: contain;
|
|
19
|
-
box-sizing: content-box;
|
|
20
|
-
align-self: center;
|
|
21
|
-
`;
|