@web3jskit/walletkit 0.1.4 → 0.1.6
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/README.md +131 -152
- package/package.json +2 -2
- package/dist/package.json +0 -46
- package/dist/src/assets/svg/dataBase.d.ts +0 -4
- package/dist/src/assets/svg/dataBase.js +0 -5
- package/dist/src/assets/svg/dataBase.js.map +0 -1
- package/dist/src/assets/svg/metaMaskWallet.d.ts +0 -1
- package/dist/src/assets/svg/metaMaskWallet.js +0 -35
- package/dist/src/assets/svg/metaMaskWallet.js.map +0 -1
- package/dist/src/components/ConnectButton/ConnectedInfo.d.ts +0 -1
- package/dist/src/components/ConnectButton/ConnectedInfo.js +0 -13
- package/dist/src/components/ConnectButton/ConnectedInfo.js.map +0 -1
- package/dist/src/components/ConnectButton/index.d.ts +0 -8
- package/dist/src/components/ConnectButton/index.js +0 -16
- package/dist/src/components/ConnectButton/index.js.map +0 -1
- package/dist/src/components/Connecting/index.d.ts +0 -6
- package/dist/src/components/Connecting/index.js +0 -11
- package/dist/src/components/Connecting/index.js.map +0 -1
- package/dist/src/components/Connecting/style.d.ts +0 -2
- package/dist/src/components/Connecting/style.js +0 -52
- package/dist/src/components/Connecting/style.js.map +0 -1
- package/dist/src/components/GetWallet/index.d.ts +0 -7
- package/dist/src/components/GetWallet/index.js +0 -21
- package/dist/src/components/GetWallet/index.js.map +0 -1
- package/dist/src/components/GetWallet/style.d.ts +0 -2
- package/dist/src/components/GetWallet/style.js +0 -117
- package/dist/src/components/GetWallet/style.js.map +0 -1
- package/dist/src/components/Header/ModalHeader.d.ts +0 -8
- package/dist/src/components/Header/ModalHeader.js +0 -9
- package/dist/src/components/Header/ModalHeader.js.map +0 -1
- package/dist/src/components/Header/style.d.ts +0 -2
- package/dist/src/components/Header/style.js +0 -73
- package/dist/src/components/Header/style.js.map +0 -1
- package/dist/src/components/Icon/index.d.ts +0 -23
- package/dist/src/components/Icon/index.js +0 -48
- package/dist/src/components/Icon/index.js.map +0 -1
- package/dist/src/components/Introduce/index.d.ts +0 -6
- package/dist/src/components/Introduce/index.js +0 -10
- package/dist/src/components/Introduce/index.js.map +0 -1
- package/dist/src/components/Introduce/style.d.ts +0 -2
- package/dist/src/components/Introduce/style.js +0 -72
- package/dist/src/components/Introduce/style.js.map +0 -1
- package/dist/src/components/Modal/ConnectModal.d.ts +0 -7
- package/dist/src/components/Modal/ConnectModal.js +0 -114
- package/dist/src/components/Modal/ConnectModal.js.map +0 -1
- package/dist/src/components/Modal/WalletInfoModal.d.ts +0 -1
- package/dist/src/components/Modal/WalletInfoModal.js +0 -46
- package/dist/src/components/Modal/WalletInfoModal.js.map +0 -1
- package/dist/src/components/Modal/index.d.ts +0 -13
- package/dist/src/components/Modal/index.js +0 -52
- package/dist/src/components/Modal/index.js.map +0 -1
- package/dist/src/components/Modal/style.d.ts +0 -5
- package/dist/src/components/Modal/style.js +0 -186
- package/dist/src/components/Modal/style.js.map +0 -1
- package/dist/src/components/SVGs/backArrowSvg.d.ts +0 -2
- package/dist/src/components/SVGs/backArrowSvg.js +0 -4
- package/dist/src/components/SVGs/backArrowSvg.js.map +0 -1
- package/dist/src/components/SVGs/closeSvg.d.ts +0 -2
- package/dist/src/components/SVGs/closeSvg.js +0 -4
- package/dist/src/components/SVGs/closeSvg.js.map +0 -1
- package/dist/src/components/SVGs/copiedSvg.d.ts +0 -2
- package/dist/src/components/SVGs/copiedSvg.js +0 -4
- package/dist/src/components/SVGs/copiedSvg.js.map +0 -1
- package/dist/src/components/SVGs/copySvg.d.ts +0 -2
- package/dist/src/components/SVGs/copySvg.js +0 -4
- package/dist/src/components/SVGs/copySvg.js.map +0 -1
- package/dist/src/components/SVGs/exitSvg.d.ts +0 -2
- package/dist/src/components/SVGs/exitSvg.js +0 -4
- package/dist/src/components/SVGs/exitSvg.js.map +0 -1
- package/dist/src/components/SVGs/metamaskQrCode.d.ts +0 -2
- package/dist/src/components/SVGs/metamaskQrCode.js +0 -4
- package/dist/src/components/SVGs/metamaskQrCode.js.map +0 -1
- package/dist/src/components/SVGs/spinSvg.d.ts +0 -4
- package/dist/src/components/SVGs/spinSvg.js +0 -4
- package/dist/src/components/SVGs/spinSvg.js.map +0 -1
- package/dist/src/components/Text/index.d.ts +0 -18
- package/dist/src/components/Text/index.js +0 -32
- package/dist/src/components/Text/index.js.map +0 -1
- package/dist/src/components/WalletKitProvider/ChainProvider.d.ts +0 -12
- package/dist/src/components/WalletKitProvider/ChainProvider.js +0 -56
- package/dist/src/components/WalletKitProvider/ChainProvider.js.map +0 -1
- package/dist/src/components/WalletKitProvider/I18nProvider.d.ts +0 -13
- package/dist/src/components/WalletKitProvider/I18nProvider.js +0 -42
- package/dist/src/components/WalletKitProvider/I18nProvider.js.map +0 -1
- package/dist/src/components/WalletKitProvider/ThemeProvider.d.ts +0 -8
- package/dist/src/components/WalletKitProvider/ThemeProvider.js +0 -13
- package/dist/src/components/WalletKitProvider/ThemeProvider.js.map +0 -1
- package/dist/src/components/WalletKitProvider/index.d.ts +0 -16
- package/dist/src/components/WalletKitProvider/index.js +0 -14
- package/dist/src/components/WalletKitProvider/index.js.map +0 -1
- package/dist/src/components/WalletList/index.d.ts +0 -8
- package/dist/src/components/WalletList/index.js +0 -16
- package/dist/src/components/WalletList/index.js.map +0 -1
- package/dist/src/components/WalletList/style.d.ts +0 -2
- package/dist/src/components/WalletList/style.js +0 -102
- package/dist/src/components/WalletList/style.js.map +0 -1
- package/dist/src/components/WalletTriggerButton/index.d.ts +0 -11
- package/dist/src/components/WalletTriggerButton/index.js +0 -28
- package/dist/src/components/WalletTriggerButton/index.js.map +0 -1
- package/dist/src/components/WalletTriggerButton/style.d.ts +0 -2
- package/dist/src/components/WalletTriggerButton/style.js +0 -52
- package/dist/src/components/WalletTriggerButton/style.js.map +0 -1
- package/dist/src/errors/index.d.ts +0 -2
- package/dist/src/errors/index.js +0 -6
- package/dist/src/errors/index.js.map +0 -1
- package/dist/src/hooks/useWalletKit.d.ts +0 -70
- package/dist/src/hooks/useWalletKit.js +0 -38
- package/dist/src/hooks/useWalletKit.js.map +0 -1
- package/dist/src/index.d.ts +0 -8
- package/dist/src/index.js +0 -9
- package/dist/src/index.js.map +0 -1
- package/dist/src/locals/i18n.d.ts +0 -2
- package/dist/src/locals/i18n.js +0 -17
- package/dist/src/locals/i18n.js.map +0 -1
- package/dist/src/locals/languages/en.json +0 -30
- package/dist/src/locals/languages/zh.json +0 -30
- package/dist/src/locals/resources.d.ts +0 -66
- package/dist/src/locals/resources.js +0 -11
- package/dist/src/locals/resources.js.map +0 -1
- package/dist/src/modals/connectModal/index.d.ts +0 -0
- package/dist/src/modals/connectModal/index.js +0 -2
- package/dist/src/modals/connectModal/index.js.map +0 -1
- package/dist/src/stores/SlotsWalletStore.d.ts +0 -18
- package/dist/src/stores/SlotsWalletStore.js +0 -33
- package/dist/src/stores/SlotsWalletStore.js.map +0 -1
- package/dist/src/stores/index.d.ts +0 -27
- package/dist/src/stores/index.js +0 -25
- package/dist/src/stores/index.js.map +0 -1
- package/dist/src/stores/modalStore.d.ts +0 -17
- package/dist/src/stores/modalStore.js +0 -41
- package/dist/src/stores/modalStore.js.map +0 -1
- package/dist/src/styled/index.d.ts +0 -17
- package/dist/src/styled/index.js +0 -76
- package/dist/src/styled/index.js.map +0 -1
- package/dist/src/test/getwalletprovider.test.d.ts +0 -1
- package/dist/src/test/getwalletprovider.test.js +0 -10
- package/dist/src/test/getwalletprovider.test.js.map +0 -1
- package/dist/src/test/setup.d.ts +0 -1
- package/dist/src/test/setup.js +0 -7
- package/dist/src/test/setup.js.map +0 -1
- package/dist/src/theme/index.d.ts +0 -53
- package/dist/src/theme/index.js +0 -92
- package/dist/src/theme/index.js.map +0 -1
- package/dist/src/types/configType.d.ts +0 -2
- package/dist/src/types/configType.js +0 -2
- package/dist/src/types/configType.js.map +0 -1
- package/dist/src/types/error.d.ts +0 -7
- package/dist/src/types/error.js +0 -5
- package/dist/src/types/error.js.map +0 -1
- package/dist/src/types/slotsType.d.ts +0 -23
- package/dist/src/types/slotsType.js +0 -2
- package/dist/src/types/slotsType.js.map +0 -1
- package/dist/src/types/store.d.ts +0 -2
- package/dist/src/types/store.js +0 -2
- package/dist/src/types/store.js.map +0 -1
- package/dist/src/utils/formatter.d.ts +0 -1
- package/dist/src/utils/formatter.js +0 -6
- package/dist/src/utils/formatter.js.map +0 -1
- package/dist/src/utils/generateAvatar.d.ts +0 -4
- package/dist/src/utils/generateAvatar.js +0 -32
- package/dist/src/utils/generateAvatar.js.map +0 -1
- package/dist/src/wallets/GelWallet/index.d.ts +0 -0
- package/dist/src/wallets/GelWallet/index.js +0 -2
- package/dist/src/wallets/GelWallet/index.js.map +0 -1
- package/dist/src/wallets/SlotsWallets/index.d.ts +0 -3
- package/dist/src/wallets/SlotsWallets/index.js +0 -26
- package/dist/src/wallets/SlotsWallets/index.js.map +0 -1
- package/dist/tsconfig.build.tsbuildinfo +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"style.js","sourceRoot":"","sources":["../../../../src/components/Connecting/style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE3C,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;WAmB3B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,SAAS;;;;;;;;WAQ9B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,UAAU;;;;;;;;WAQ/B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,SAAS;;;;;;;;;;;;;CAaxC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import { useTranslation } from 'react-i18next';
|
|
4
|
-
import { useState } from 'react';
|
|
5
|
-
import ModalHeader from '../Header/ModalHeader';
|
|
6
|
-
import GetWalletContainer from './style';
|
|
7
|
-
import { chromeIcon } from '../../assets/svg/dataBase';
|
|
8
|
-
import QRCode from 'react-qr-code';
|
|
9
|
-
export function GetWallet({ wallet, onBack, onClose }) {
|
|
10
|
-
const { t } = useTranslation();
|
|
11
|
-
const [showQRCode, setShowQRCode] = useState(false);
|
|
12
|
-
return (_jsxs(GetWalletContainer, { children: [_jsx(ModalHeader, { onClose: onClose, title: `${t('get')} ${wallet.name}`, onBack: () => {
|
|
13
|
-
if (showQRCode) {
|
|
14
|
-
return setShowQRCode(false);
|
|
15
|
-
}
|
|
16
|
-
onBack && onBack();
|
|
17
|
-
} }), showQRCode ? (_jsxs("div", { className: "qrCodeBox", children: [_jsx("div", { className: "downloadTip", children: t('getAppTip') }), _jsx("div", { className: "qrCode", children: _jsx(QRCode, { value: wallet.downloadUrl }) }), _jsx("div", { className: "button", onClick: () => setShowQRCode(false), children: t('continue') })] })) : (_jsxs("div", { className: "cardBox", children: [_jsxs("div", { className: "card", children: [_jsx("img", { src: chromeIcon, alt: "Chrome" }), _jsxs("div", { children: [_jsx("div", { className: "title", children: `${wallet.name} ${t('forChrome')}` }), _jsx("div", { className: "description", children: t('chromeDescription') }), _jsx("div", { className: "button", onClick: () => {
|
|
18
|
-
window.open(wallet.extension, '_blank');
|
|
19
|
-
}, children: t('addToChrome') })] })] }), _jsxs("div", { className: "card", children: [_jsx("img", { src: wallet.icon, alt: wallet.name }), _jsxs("div", { children: [_jsx("div", { className: "title", children: `${wallet.name} ${t('forMobile')}` }), _jsx("div", { className: "description", children: t('mobileDescription') }), _jsx("div", { className: "button", onClick: () => setShowQRCode(true), children: t('getMobileApp') })] })] })] }))] }));
|
|
20
|
-
}
|
|
21
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/GetWallet/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AACb,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,WAAW,MAAM,uBAAuB,CAAC;AAChD,OAAO,kBAAkB,MAAM,SAAS,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AACvD,OAAO,MAAM,MAAM,eAAe,CAAC;AAQnC,MAAM,UAAU,SAAS,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAkB;IACpE,MAAM,EAAE,CAAC,EAAE,GAAG,cAAc,EAAE,CAAC;IAE/B,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEpD,OAAO,CACN,MAAC,kBAAkB,eAClB,KAAC,WAAW,IACX,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,GAAG,CAAC,CAAC,KAAK,CAAC,IAAI,MAAM,CAAC,IAAI,EAAE,EACnC,MAAM,EAAE,GAAG,EAAE;oBACZ,IAAI,UAAU,EAAE,CAAC;wBAChB,OAAO,aAAa,CAAC,KAAK,CAAC,CAAC;oBAC7B,CAAC;oBACD,MAAM,IAAI,MAAM,EAAE,CAAC;gBACpB,CAAC,GACA,EACD,UAAU,CAAC,CAAC,CAAC,CACb,eAAK,SAAS,EAAC,WAAW,aACzB,cAAK,SAAS,EAAC,aAAa,YAAE,CAAC,CAAC,WAAW,CAAC,GAAO,EACnD,cAAK,SAAS,EAAC,QAAQ,YACtB,KAAC,MAAM,IAAC,KAAK,EAAE,MAAM,CAAC,WAAW,GAAI,GAChC,EACN,cAAK,SAAS,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,YACzD,CAAC,CAAC,UAAU,CAAC,GACT,IACD,CACN,CAAC,CAAC,CAAC,CACH,eAAK,SAAS,EAAC,SAAS,aACvB,eAAK,SAAS,EAAC,MAAM,aACpB,cAAK,GAAG,EAAE,UAAU,EAAE,GAAG,EAAC,QAAQ,GAAG,EACrC,0BACC,cAAK,SAAS,EAAC,OAAO,YAAE,GAAG,MAAM,CAAC,IAAI,IAAI,CAAC,CAAC,WAAW,CAAC,EAAE,GAAO,EACjE,cAAK,SAAS,EAAC,aAAa,YAAE,CAAC,CAAC,mBAAmB,CAAC,GAAO,EAC3D,cACC,SAAS,EAAC,QAAQ,EAClB,OAAO,EAAE,GAAG,EAAE;4CACb,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;wCACzC,CAAC,YAEA,CAAC,CAAC,aAAa,CAAC,GACZ,IACD,IACD,EACN,eAAK,SAAS,EAAC,MAAM,aACpB,cAAK,GAAG,EAAE,MAAM,CAAC,IAAI,EAAE,GAAG,EAAE,MAAM,CAAC,IAAI,GAAI,EAC3C,0BACC,cAAK,SAAS,EAAC,OAAO,YAAE,GAAG,MAAM,CAAC,IAAI,IAAI,CAAC,CAAC,WAAW,CAAC,EAAE,GAAO,EACjE,cAAK,SAAS,EAAC,aAAa,YAAE,CAAC,CAAC,mBAAmB,CAAC,GAAO,EAC3D,cAAK,SAAS,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,IAAI,CAAC,YACxD,CAAC,CAAC,cAAc,CAAC,GACb,IACD,IACD,IACD,CACN,IACmB,CACrB,CAAC;AACH,CAAC"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
declare const GetWalletContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
2
|
-
export default GetWalletContainer;
|
|
@@ -1,117 +0,0 @@
|
|
|
1
|
-
import { styled } from 'styled-components';
|
|
2
|
-
const GetWalletContainer = styled.div `
|
|
3
|
-
display: flex;
|
|
4
|
-
flex-direction: column;
|
|
5
|
-
font-family: Manrope;
|
|
6
|
-
color: ${({ theme }) => theme.textColor1};
|
|
7
|
-
height: 100%;
|
|
8
|
-
|
|
9
|
-
.cardBox {
|
|
10
|
-
display: flex;
|
|
11
|
-
flex-direction: column;
|
|
12
|
-
margin: 0 64px 24px;
|
|
13
|
-
gap: 24px;
|
|
14
|
-
flex: 1;
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
.card {
|
|
18
|
-
display: flex;
|
|
19
|
-
gap: 24px;
|
|
20
|
-
padding: 40px 60px 0;
|
|
21
|
-
border: 1px solid ${({ theme }) => theme.borderColor};
|
|
22
|
-
border-radius: 12px;
|
|
23
|
-
flex: 1;
|
|
24
|
-
background: ${({ theme }) => theme.cardBg};
|
|
25
|
-
|
|
26
|
-
img {
|
|
27
|
-
width: 60px;
|
|
28
|
-
height: 60px;
|
|
29
|
-
border-radius: 12px;
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
.title {
|
|
33
|
-
font-size: 14px;
|
|
34
|
-
font-weight: 700;
|
|
35
|
-
line-height: 14px;
|
|
36
|
-
color: ${({ theme }) => theme.textColor};
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
.description {
|
|
40
|
-
margin-top: 10px;
|
|
41
|
-
font-size: 12px;
|
|
42
|
-
font-weight: 500;
|
|
43
|
-
line-height: 14px;
|
|
44
|
-
color: ${({ theme }) => theme.textColor3};
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
.button {
|
|
48
|
-
margin-top: 18px;
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
.button {
|
|
53
|
-
display: inline-block;
|
|
54
|
-
padding: 11px 16px;
|
|
55
|
-
color: ${({ theme }) => theme.buttonColor};
|
|
56
|
-
background: ${({ theme }) => theme.buttonBg};
|
|
57
|
-
font-size: 14px;
|
|
58
|
-
font-weight: 700;
|
|
59
|
-
line-height: 14px;
|
|
60
|
-
text-align: center;
|
|
61
|
-
border-radius: 8px;
|
|
62
|
-
box-sizing: border-box;
|
|
63
|
-
cursor: pointer;
|
|
64
|
-
height: 36px;
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
.qrCodeBox {
|
|
68
|
-
display: flex;
|
|
69
|
-
flex-direction: column;
|
|
70
|
-
align-items: center;
|
|
71
|
-
justify-content: space-between;
|
|
72
|
-
flex: 1;
|
|
73
|
-
|
|
74
|
-
.downloadTip {
|
|
75
|
-
text-align: center;
|
|
76
|
-
font-size: 14px;
|
|
77
|
-
font-weight: 600;
|
|
78
|
-
line-height: 18px;
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
.qrCode {
|
|
82
|
-
margin-top: 24px;
|
|
83
|
-
display: flex;
|
|
84
|
-
justify-content: center;
|
|
85
|
-
align-items: center;
|
|
86
|
-
width: 270px;
|
|
87
|
-
height: 270px;
|
|
88
|
-
border-radius: 12px;
|
|
89
|
-
border: 1px solid ${({ theme }) => theme.borderColor};
|
|
90
|
-
font-size: 0;
|
|
91
|
-
overflow: hidden;
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
.button {
|
|
95
|
-
margin-top: auto;
|
|
96
|
-
margin-bottom: 24px;
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
@media (max-width: 768px) {
|
|
101
|
-
.cardBox {
|
|
102
|
-
margin: 0 24px 24px;
|
|
103
|
-
|
|
104
|
-
.card {
|
|
105
|
-
padding: 35px 24px;
|
|
106
|
-
}
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
.qrCodeBox {
|
|
110
|
-
.button {
|
|
111
|
-
margin-top: 16px;
|
|
112
|
-
}
|
|
113
|
-
}
|
|
114
|
-
}
|
|
115
|
-
`;
|
|
116
|
-
export default GetWalletContainer;
|
|
117
|
-
//# sourceMappingURL=style.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"style.js","sourceRoot":"","sources":["../../../../src/components/GetWallet/style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE3C,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;UAI3B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,UAAU;;;;;;;;;;;;;;;sBAenB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,WAAW;;;gBAGtC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,MAAM;;;;;;;;;;;;YAY/B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,SAAS;;;;;;;;YAQ9B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,UAAU;;;;;;;;;;;WAWhC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,WAAW;gBAC3B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uBAiCtB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BtD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
interface ModalHeaderProps {
|
|
2
|
-
title?: string | null;
|
|
3
|
-
onBack?: () => void;
|
|
4
|
-
className?: string;
|
|
5
|
-
onClose: () => void;
|
|
6
|
-
}
|
|
7
|
-
export default function ModalHeader({ title, onBack, className, onClose }: ModalHeaderProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
-
export {};
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import ModalHeaderBox from './style';
|
|
4
|
-
import BackArrowSvg from '../SVGs/backArrowSvg';
|
|
5
|
-
import CloseSvg from '../SVGs/closeSvg';
|
|
6
|
-
export default function ModalHeader({ title = '', onBack, className, onClose }) {
|
|
7
|
-
return (_jsxs(ModalHeaderBox, { className: className, children: [onBack ? _jsx(BackArrowSvg, { className: "backBtn", onClick: onBack }) : _jsx("div", { className: "backBtn" }), title ? _jsx("div", { className: "title", children: title }) : _jsx("div", {}), _jsx("div", { className: "closeBtn", onClick: onClose, children: _jsx(CloseSvg, {}) })] }));
|
|
8
|
-
}
|
|
9
|
-
//# sourceMappingURL=ModalHeader.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ModalHeader.js","sourceRoot":"","sources":["../../../../src/components/Header/ModalHeader.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AACb,OAAO,cAAc,MAAM,SAAS,CAAC;AACrC,OAAO,YAAY,MAAM,sBAAsB,CAAC;AAChD,OAAO,QAAQ,MAAM,kBAAkB,CAAC;AASxC,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAE,KAAK,GAAG,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAoB;IAC/F,OAAO,CACN,MAAC,cAAc,IAAC,SAAS,EAAE,SAAS,aAClC,MAAM,CAAC,CAAC,CAAC,KAAC,YAAY,IAAC,SAAS,EAAC,SAAS,EAAC,OAAO,EAAE,MAAM,GAAI,CAAC,CAAC,CAAC,cAAK,SAAS,EAAC,SAAS,GAAO,EAChG,KAAK,CAAC,CAAC,CAAC,cAAK,SAAS,EAAC,OAAO,YAAE,KAAK,GAAO,CAAC,CAAC,CAAC,eAAW,EAC3D,cAAK,SAAS,EAAC,UAAU,EAAC,OAAO,EAAE,OAAO,YACzC,KAAC,QAAQ,KAAG,GACP,IACU,CACjB,CAAC;AACH,CAAC"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
declare const ModalHeaderBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
2
|
-
export default ModalHeaderBox;
|
|
@@ -1,73 +0,0 @@
|
|
|
1
|
-
import { styled } from 'styled-components';
|
|
2
|
-
const ModalHeaderBox = styled.div `
|
|
3
|
-
width: 100%;
|
|
4
|
-
height: 56px;
|
|
5
|
-
position: relative;
|
|
6
|
-
display: flex;
|
|
7
|
-
align-items: center;
|
|
8
|
-
justify-content: space-between;
|
|
9
|
-
flex-shrink: 0;
|
|
10
|
-
|
|
11
|
-
.backBtn {
|
|
12
|
-
cursor: pointer;
|
|
13
|
-
margin-left: 16px;
|
|
14
|
-
|
|
15
|
-
path {
|
|
16
|
-
fill: ${({ theme }) => theme.backArrowColor};
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
.title {
|
|
21
|
-
color: ${({ theme }) => theme.textColor};
|
|
22
|
-
font-size: 16px;
|
|
23
|
-
font-weight: 700;
|
|
24
|
-
line-height: 170%;
|
|
25
|
-
letter-spacing: 0.3px;
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
.closeBtn {
|
|
29
|
-
margin-right: 16px;
|
|
30
|
-
cursor: pointer;
|
|
31
|
-
display: flex;
|
|
32
|
-
align-items: center;
|
|
33
|
-
justify-content: center;
|
|
34
|
-
width: 24px;
|
|
35
|
-
height: 24px;
|
|
36
|
-
border-radius: 12px;
|
|
37
|
-
transition: all 0.2s;
|
|
38
|
-
color: ${({ theme }) => theme.closeBtnColor};
|
|
39
|
-
transform-origin: 50% 50%;
|
|
40
|
-
background-color: ${({ theme }) => theme.closeBtnBg};
|
|
41
|
-
z-index: 1;
|
|
42
|
-
|
|
43
|
-
&:hover {
|
|
44
|
-
background-color: ${({ theme }) => theme.closeBtnHoverBg};
|
|
45
|
-
transform: rotate(180deg);
|
|
46
|
-
transition: all 0.2s;
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
&.asideTitle {
|
|
51
|
-
justify-content: flex-start;
|
|
52
|
-
|
|
53
|
-
.closeBtn {
|
|
54
|
-
display: none;
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
@media (max-width: 768px) {
|
|
59
|
-
&.mainTitle {
|
|
60
|
-
display: none;
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
&.asideTitle {
|
|
64
|
-
justify-content: space-between;
|
|
65
|
-
|
|
66
|
-
.closeBtn {
|
|
67
|
-
display: flex;
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
}
|
|
71
|
-
`;
|
|
72
|
-
export default ModalHeaderBox;
|
|
73
|
-
//# sourceMappingURL=style.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"style.js","sourceRoot":"","sources":["../../../../src/components/Header/style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE3C,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;WActB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,cAAc;;;;;WAKnC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,SAAS;;;;;;;;;;;;;;;;;WAiB9B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,aAAa;;sBAEvB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,UAAU;;;;uBAI9B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2B1D,CAAC;AAEF,eAAe,cAAc,CAAC"}
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
interface IconImageArg {
|
|
3
|
-
src: any;
|
|
4
|
-
width?: number | string;
|
|
5
|
-
height?: number | string;
|
|
6
|
-
borderRadius?: string;
|
|
7
|
-
isRadius?: boolean;
|
|
8
|
-
className?: string;
|
|
9
|
-
}
|
|
10
|
-
interface FoldIconImageArg {
|
|
11
|
-
src: Array<string>;
|
|
12
|
-
width?: number | string;
|
|
13
|
-
height?: number | string;
|
|
14
|
-
offset?: number;
|
|
15
|
-
proportion?: number;
|
|
16
|
-
className?: string;
|
|
17
|
-
isRadius?: boolean;
|
|
18
|
-
}
|
|
19
|
-
export declare const Icon: React.FC<IconImageArg>;
|
|
20
|
-
export declare const Image: React.FC<IconImageArg>;
|
|
21
|
-
export declare const FoldIconBox: React.FC<FoldIconImageArg>;
|
|
22
|
-
export declare const FoldIconBoxBig: React.FC<FoldIconImageArg>;
|
|
23
|
-
export default Icon;
|
|
@@ -1,48 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { styled } from 'styled-components';
|
|
5
|
-
const IconImage = styled.img `
|
|
6
|
-
display: block;
|
|
7
|
-
transition: all 0.2s;
|
|
8
|
-
`;
|
|
9
|
-
const IconImageBox = styled.div `
|
|
10
|
-
cursor: pointer;
|
|
11
|
-
display: flex;
|
|
12
|
-
position: relative;
|
|
13
|
-
`;
|
|
14
|
-
const IconItem = styled.div `
|
|
15
|
-
cursor: pointer;
|
|
16
|
-
float: left;
|
|
17
|
-
display: flex;
|
|
18
|
-
justify-items: center;
|
|
19
|
-
`;
|
|
20
|
-
export const Icon = ({ src, width, height, className }) => {
|
|
21
|
-
return (_jsx(IconImage, { className: className, src: src, width: width ? width + 'px' : '24px', height: height ? height + 'px' : '24px' }));
|
|
22
|
-
};
|
|
23
|
-
export const Image = ({ src, width, height, isRadius = true, className, borderRadius }) => {
|
|
24
|
-
return (_jsx(IconImage, { className: className, src: src, width: width ? width : 'auto', height: height ? height : 'auto', style: { borderRadius: borderRadius ? borderRadius : isRadius ? '50%' : '0' } }));
|
|
25
|
-
};
|
|
26
|
-
export const FoldIconBox = ({ src, width, height, offset = 0, isRadius = true }) => {
|
|
27
|
-
return (_jsx(IconImageBox, { children: src.map((item, index) => {
|
|
28
|
-
return (_jsx(IconItem, { style: {
|
|
29
|
-
zIndex: index + 1,
|
|
30
|
-
marginLeft: index == 0 ? '0px' : offset + 'px',
|
|
31
|
-
width: width ? width + 'px' : '24px',
|
|
32
|
-
height: height ? height + 'px' : '24px'
|
|
33
|
-
}, children: _jsx(IconImage, { src: item, width: width ? width : 24, height: height ? height : 24, style: { borderRadius: isRadius ? '50%' : '0' } }) }, index));
|
|
34
|
-
}) }));
|
|
35
|
-
};
|
|
36
|
-
export const FoldIconBoxBig = ({ src, width, height, offset = 0, proportion = 1 }) => {
|
|
37
|
-
return (_jsx(IconImageBox, { children: src.map((item, index) => {
|
|
38
|
-
return (_jsx(IconItem, { style: {
|
|
39
|
-
zIndex: index + 1,
|
|
40
|
-
marginLeft: index == 0 ? '0px' : offset + 'px',
|
|
41
|
-
marginTop: index == 0 ? '0px' : -(offset / 2) + 'px',
|
|
42
|
-
width: width ? width + 'px' : '24px',
|
|
43
|
-
height: height ? height + 'px' : '24px'
|
|
44
|
-
}, children: index === src.length - 1 ? (_jsx(IconImage, { src: item, width: width ? Number(width) * proportion : 24 * proportion, height: height ? Number(height) * proportion : 24 * proportion })) : (_jsx(IconImage, { src: item, width: width ? width : 24, height: height ? height : 24 })) }, index));
|
|
45
|
-
}) }));
|
|
46
|
-
};
|
|
47
|
-
export default Icon;
|
|
48
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Icon/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
|
-
import { useTranslation } from 'react-i18next';
|
|
4
|
-
import ModalHeader from '../Header/ModalHeader';
|
|
5
|
-
import IntroduceContainer from './style';
|
|
6
|
-
export function Introduce({ onGetWallet, onClose }) {
|
|
7
|
-
const { t } = useTranslation();
|
|
8
|
-
return (_jsxs(_Fragment, { children: [_jsx(ModalHeader, { onClose: onClose, className: "mainTitle" }), _jsxs(IntroduceContainer, { children: [_jsx("div", { className: "title", children: t('introduceQuestion') }), _jsx("div", { className: "introduce", children: t('introduceAnswer') }), _jsx("div", { className: "detail", children: t('introduceDetail') }), _jsx("div", { className: "footer", children: _jsx("div", { className: "button", onClick: () => onGetWallet?.(), children: t('getWallet') }) })] })] }));
|
|
9
|
-
}
|
|
10
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Introduce/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AACb,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,WAAW,MAAM,uBAAuB,CAAC;AAChD,OAAO,kBAAkB,MAAM,SAAS,CAAC;AAOzC,MAAM,UAAU,SAAS,CAAC,EAAE,WAAW,EAAE,OAAO,EAAkB;IACjE,MAAM,EAAE,CAAC,EAAE,GAAG,cAAc,EAAE,CAAC;IAE/B,OAAO,CACN,8BACC,KAAC,WAAW,IAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAC,WAAW,GAAG,EACvD,MAAC,kBAAkB,eAClB,cAAK,SAAS,EAAC,OAAO,YAAE,CAAC,CAAC,mBAAmB,CAAC,GAAO,EACrD,cAAK,SAAS,EAAC,WAAW,YAAE,CAAC,CAAC,iBAAiB,CAAC,GAAO,EACvD,cAAK,SAAS,EAAC,QAAQ,YAAE,CAAC,CAAC,iBAAiB,CAAC,GAAO,EACpD,cAAK,SAAS,EAAC,QAAQ,YACtB,cAAK,SAAS,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,EAAE,EAAE,YACpD,CAAC,CAAC,WAAW,CAAC,GACV,GAID,IACc,IACnB,CACH,CAAC;AACH,CAAC"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
declare const IntroduceContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
2
|
-
export default IntroduceContainer;
|
|
@@ -1,72 +0,0 @@
|
|
|
1
|
-
import { styled } from 'styled-components';
|
|
2
|
-
const IntroduceContainer = styled.div `
|
|
3
|
-
display: flex;
|
|
4
|
-
flex-direction: column;
|
|
5
|
-
margin: 84px 50px 0 96px;
|
|
6
|
-
font-family: Manrope;
|
|
7
|
-
color: ${({ theme }) => theme.textColor1};
|
|
8
|
-
|
|
9
|
-
.title {
|
|
10
|
-
color: ${({ theme }) => theme.blue};
|
|
11
|
-
font-size: 18px;
|
|
12
|
-
font-weight: 700;
|
|
13
|
-
line-height: 18px;
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
.introduce {
|
|
17
|
-
margin-top: 24px;
|
|
18
|
-
font-size: 12px;
|
|
19
|
-
font-weight: 700;
|
|
20
|
-
line-height: 14px;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
.detail {
|
|
24
|
-
margin-top: 16px;
|
|
25
|
-
font-size: 12px;
|
|
26
|
-
font-weight: 500;
|
|
27
|
-
line-height: 14px;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
.footer {
|
|
31
|
-
display: flex;
|
|
32
|
-
flex-direction: column;
|
|
33
|
-
align-items: center;
|
|
34
|
-
max-width: 120px;
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
.button {
|
|
38
|
-
width: 100%;
|
|
39
|
-
display: inline-block;
|
|
40
|
-
margin-top: 32px;
|
|
41
|
-
padding: 11px 16px;
|
|
42
|
-
color: ${({ theme }) => theme.buttonColor};
|
|
43
|
-
background: ${({ theme }) => theme.buttonBg};
|
|
44
|
-
font-size: 14px;
|
|
45
|
-
font-weight: 700;
|
|
46
|
-
line-height: 14px;
|
|
47
|
-
text-align: center;
|
|
48
|
-
border-radius: 8px;
|
|
49
|
-
box-sizing: border-box;
|
|
50
|
-
cursor: pointer;
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
.more {
|
|
54
|
-
margin-top: 8px;
|
|
55
|
-
font-size: 12px;
|
|
56
|
-
font-style: normal;
|
|
57
|
-
font-weight: 700;
|
|
58
|
-
cursor: pointer;
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
@media (max-width: 768px) {
|
|
62
|
-
padding: 40px 32px 0;
|
|
63
|
-
margin: 0;
|
|
64
|
-
align-items: center;
|
|
65
|
-
|
|
66
|
-
.detail {
|
|
67
|
-
text-align: center;
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
`;
|
|
71
|
-
export default IntroduceContainer;
|
|
72
|
-
//# sourceMappingURL=style.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"style.js","sourceRoot":"","sources":["../../../../src/components/Introduce/style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE3C,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;UAK3B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,UAAU;;;WAG9B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;WAgCzB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,WAAW;gBAC3B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2B5C,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
|
|
@@ -1,114 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import ModalHeader from '../Header/ModalHeader';
|
|
4
|
-
import Modal from './index';
|
|
5
|
-
import { SlotWrapper } from '../../styled';
|
|
6
|
-
import { createConnector, SupportWallets } from '@web3jskit/wallethelper';
|
|
7
|
-
import { useTranslation } from 'react-i18next';
|
|
8
|
-
import { useCallback, useEffect, useMemo, useState } from 'react';
|
|
9
|
-
import { WalletTriggerButton } from '../WalletTriggerButton';
|
|
10
|
-
import { Introduce } from '../Introduce';
|
|
11
|
-
import { WalletList } from '../WalletList';
|
|
12
|
-
import { GetWallet } from '../GetWallet';
|
|
13
|
-
import { Connecting } from '../Connecting';
|
|
14
|
-
import { useWalletKit } from '../../hooks/useWalletKit';
|
|
15
|
-
import { AsideList, ModalAside, ModalContainer, ModalMain } from './style';
|
|
16
|
-
import { useModalStore } from '../../stores/modalStore';
|
|
17
|
-
import { UserRejectError } from '../../errors';
|
|
18
|
-
var Step;
|
|
19
|
-
(function (Step) {
|
|
20
|
-
Step[Step["Introduce"] = 0] = "Introduce";
|
|
21
|
-
Step[Step["WalletList"] = 1] = "WalletList";
|
|
22
|
-
Step[Step["GetWallet"] = 2] = "GetWallet";
|
|
23
|
-
Step[Step["Connecting"] = 3] = "Connecting";
|
|
24
|
-
})(Step || (Step = {}));
|
|
25
|
-
export function ConnectModal({ slots }) {
|
|
26
|
-
const { t } = useTranslation();
|
|
27
|
-
const { currentChainType, supportWallets, connectStatus, isConnecting } = useWalletKit();
|
|
28
|
-
const { connectModalData } = useModalStore();
|
|
29
|
-
const [step, setStep] = useState(Step.Introduce);
|
|
30
|
-
const [selectedWallet, setSelectedWallet] = useState(null);
|
|
31
|
-
const [connectors, setConnectors] = useState([]);
|
|
32
|
-
const isOpen = useMemo(() => {
|
|
33
|
-
return !!connectModalData;
|
|
34
|
-
}, [connectModalData]);
|
|
35
|
-
const requestConnectors = async () => {
|
|
36
|
-
const list = await createConnector(currentChainType, supportWallets || []);
|
|
37
|
-
setConnectors(list);
|
|
38
|
-
};
|
|
39
|
-
const connectorsGroupByType = useMemo(() => {
|
|
40
|
-
const result = connectors.reduce((acc, connector) => {
|
|
41
|
-
if (!acc[connector.connectorType]) {
|
|
42
|
-
acc[connector.connectorType] = [];
|
|
43
|
-
}
|
|
44
|
-
acc[connector.connectorType].push(connector);
|
|
45
|
-
return acc;
|
|
46
|
-
}, {});
|
|
47
|
-
return result;
|
|
48
|
-
}, [connectors]);
|
|
49
|
-
const sortedKeys = useMemo(() => {
|
|
50
|
-
const keys = Object.keys(connectorsGroupByType);
|
|
51
|
-
const sortedKeys = keys.sort((a, b) => {
|
|
52
|
-
const order = ['installed', 'run', 'more'];
|
|
53
|
-
return order.indexOf(a) - order.indexOf(b);
|
|
54
|
-
});
|
|
55
|
-
return sortedKeys;
|
|
56
|
-
}, [connectorsGroupByType]);
|
|
57
|
-
useEffect(() => {
|
|
58
|
-
if (isOpen) {
|
|
59
|
-
requestConnectors();
|
|
60
|
-
}
|
|
61
|
-
else {
|
|
62
|
-
setStep(0);
|
|
63
|
-
setConnectors([]);
|
|
64
|
-
}
|
|
65
|
-
}, [isOpen, currentChainType]);
|
|
66
|
-
useEffect(() => {
|
|
67
|
-
switch (connectStatus) {
|
|
68
|
-
case 'connected':
|
|
69
|
-
break;
|
|
70
|
-
default:
|
|
71
|
-
setStep(0);
|
|
72
|
-
break;
|
|
73
|
-
}
|
|
74
|
-
}, [connectStatus]);
|
|
75
|
-
const renderMainByStep = useCallback(() => {
|
|
76
|
-
switch (step) {
|
|
77
|
-
case 0:
|
|
78
|
-
return (_jsx(Introduce, { onClose: handleCancel, onGetWallet: () => {
|
|
79
|
-
setStep(Step.WalletList);
|
|
80
|
-
} }));
|
|
81
|
-
case 1:
|
|
82
|
-
return (_jsx(WalletList, { onClose: handleCancel, list: SupportWallets, onBack: () => {
|
|
83
|
-
setStep(0);
|
|
84
|
-
}, onGetWallet: wallet => {
|
|
85
|
-
if (wallet.name === 'Gel Wallet') {
|
|
86
|
-
window.open(wallet.webUrl, '_blank');
|
|
87
|
-
return;
|
|
88
|
-
}
|
|
89
|
-
setSelectedWallet(wallet);
|
|
90
|
-
setStep(Step.GetWallet);
|
|
91
|
-
} }));
|
|
92
|
-
case 2:
|
|
93
|
-
return (_jsx(GetWallet, { onClose: handleCancel, wallet: selectedWallet, onBack: () => {
|
|
94
|
-
setStep(Step.WalletList);
|
|
95
|
-
} }));
|
|
96
|
-
default:
|
|
97
|
-
return _jsx(_Fragment, {});
|
|
98
|
-
}
|
|
99
|
-
}, [step]);
|
|
100
|
-
const handleConnect = (address) => {
|
|
101
|
-
connectModalData?.onConnect(address);
|
|
102
|
-
};
|
|
103
|
-
const handleCancel = () => {
|
|
104
|
-
useModalStore.getState().connectModalData?.onError(UserRejectError);
|
|
105
|
-
};
|
|
106
|
-
return (_jsx(Modal, { isOpen: isOpen, onCancel: handleCancel, children: _jsxs(ModalContainer, { children: [_jsxs(ModalAside, { className: step !== 0 ? 'hidden' : '', children: [_jsx(ModalHeader, { onClose: handleCancel, title: t('connectWallet'), className: "asideTitle" }), _jsxs(AsideList, { children: [sortedKeys.map(connectorType => {
|
|
107
|
-
return (_jsxs("div", { className: "typeBox", children: [_jsx("div", { className: `typeHeader ${connectorType}`, children: t(connectorType) }), connectorsGroupByType[connectorType].map((connector) => {
|
|
108
|
-
return (_jsx(WalletTriggerButton, { onConnect: handleConnect, connector: connector }, connectorType + connector.name));
|
|
109
|
-
})] }, connectorType));
|
|
110
|
-
}), slots ? (slots.map((Slot, index) => {
|
|
111
|
-
return _jsx(SlotWrapper, { children: Slot }, index);
|
|
112
|
-
})) : (_jsx(_Fragment, {}))] })] }), _jsx(ModalMain, { children: isConnecting ? _jsx(Connecting, { onClose: handleCancel, wallet: isConnecting }) : renderMainByStep() })] }) }));
|
|
113
|
-
}
|
|
114
|
-
//# sourceMappingURL=ConnectModal.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ConnectModal.js","sourceRoot":"","sources":["../../../../src/components/Modal/ConnectModal.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function WalletInfoModal(): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import Modal from './index';
|
|
4
|
-
import { useTranslation } from 'react-i18next';
|
|
5
|
-
import ModalHeader from '../Header/ModalHeader';
|
|
6
|
-
import { useWalletKit } from '../../hooks/useWalletKit';
|
|
7
|
-
import { formatAddress } from '../../utils/formatter';
|
|
8
|
-
import { InfoModalContainer } from './style';
|
|
9
|
-
import CopySvg from '../SVGs/copySvg';
|
|
10
|
-
import CopiedSvg from '../SVGs/copiedSvg';
|
|
11
|
-
import ExitSvg from '../SVGs/exitSvg';
|
|
12
|
-
import copyToClipboard from 'copy-to-clipboard';
|
|
13
|
-
import { useEffect, useState } from 'react';
|
|
14
|
-
import { generateRandomAvatar } from '../../utils/generateAvatar';
|
|
15
|
-
import { useModalStore } from '../../stores/modalStore';
|
|
16
|
-
export function WalletInfoModal() {
|
|
17
|
-
const { t } = useTranslation();
|
|
18
|
-
const { walletAddress, avatar, setAvatar, currentConnector } = useWalletKit();
|
|
19
|
-
const [copied, setCopied] = useState(false);
|
|
20
|
-
const { closeWalletInfoModal, isShowWalletInfoModal } = useModalStore();
|
|
21
|
-
const generateAvatar = () => {
|
|
22
|
-
const newAvatar = generateRandomAvatar();
|
|
23
|
-
setAvatar(newAvatar);
|
|
24
|
-
};
|
|
25
|
-
useEffect(() => {
|
|
26
|
-
generateAvatar();
|
|
27
|
-
}, []);
|
|
28
|
-
const handleCancel = () => {
|
|
29
|
-
closeWalletInfoModal();
|
|
30
|
-
};
|
|
31
|
-
return (_jsx(Modal, { isOpen: isShowWalletInfoModal, onCancel: handleCancel, children: _jsxs(InfoModalContainer, { children: [_jsx(ModalHeader, { onClose: handleCancel }), _jsx("div", { className: "avatarBox", onClick: () => generateAvatar(), children: _jsx("div", { className: "avatar", style: {
|
|
32
|
-
backgroundColor: avatar?.bg
|
|
33
|
-
}, children: avatar?.text }) }), _jsx("div", { className: "accountInfo", children: _jsx("div", { className: "address", children: formatAddress(walletAddress) }) }), _jsxs("div", { className: "btnGroup", children: [_jsxs("div", { className: "button", onClick: () => {
|
|
34
|
-
copyToClipboard(walletAddress);
|
|
35
|
-
if (copied)
|
|
36
|
-
return;
|
|
37
|
-
setCopied(true);
|
|
38
|
-
setTimeout(() => {
|
|
39
|
-
setCopied(false);
|
|
40
|
-
}, 1000);
|
|
41
|
-
}, children: [_jsx("div", { className: "btnIcon", children: copied ? _jsx(CopiedSvg, {}) : _jsx(CopySvg, {}) }), _jsx("div", { className: "btnText", children: t(copied ? 'copied' : 'copyAddress') })] }), _jsxs("div", { className: "button", onClick: () => {
|
|
42
|
-
currentConnector?.disconnect();
|
|
43
|
-
closeWalletInfoModal();
|
|
44
|
-
}, children: [_jsx("div", { className: "btnIcon", children: _jsx(ExitSvg, {}) }), _jsx("div", { className: "btnText", children: t('disConnect') })] })] })] }) }));
|
|
45
|
-
}
|
|
46
|
-
//# sourceMappingURL=WalletInfoModal.js.map
|