@nexus-cross/connect-kit-react 1.0.0-beta.1
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 +258 -0
- package/dist/components/ConnectButton.d.ts +64 -0
- package/dist/components/ConnectButton.d.ts.map +1 -0
- package/dist/components/ConnectButton.js +257 -0
- package/dist/components/ConnectButton.js.map +1 -0
- package/dist/components/CrossConnectKitProvider.d.ts +15 -0
- package/dist/components/CrossConnectKitProvider.d.ts.map +1 -0
- package/dist/components/CrossConnectKitProvider.js +570 -0
- package/dist/components/CrossConnectKitProvider.js.map +1 -0
- package/dist/components/OtherWalletsModal.d.ts +20 -0
- package/dist/components/OtherWalletsModal.d.ts.map +1 -0
- package/dist/components/OtherWalletsModal.js +300 -0
- package/dist/components/OtherWalletsModal.js.map +1 -0
- package/dist/components/WalletInfoPopover.d.ts +7 -0
- package/dist/components/WalletInfoPopover.d.ts.map +1 -0
- package/dist/components/WalletInfoPopover.js +166 -0
- package/dist/components/WalletInfoPopover.js.map +1 -0
- package/dist/components/types.d.ts +23 -0
- package/dist/components/types.d.ts.map +1 -0
- package/dist/components/types.js +2 -0
- package/dist/components/types.js.map +1 -0
- package/dist/context/CrossConnectKitContext.d.ts +30 -0
- package/dist/context/CrossConnectKitContext.d.ts.map +1 -0
- package/dist/context/CrossConnectKitContext.js +10 -0
- package/dist/context/CrossConnectKitContext.js.map +1 -0
- package/dist/context/CrossConnectKitThemeContext.d.ts +41 -0
- package/dist/context/CrossConnectKitThemeContext.d.ts.map +1 -0
- package/dist/context/CrossConnectKitThemeContext.js +22 -0
- package/dist/context/CrossConnectKitThemeContext.js.map +1 -0
- package/dist/hooks/useCrossxEmbeddedInfo.d.ts +25 -0
- package/dist/hooks/useCrossxEmbeddedInfo.d.ts.map +1 -0
- package/dist/hooks/useCrossxEmbeddedInfo.js +71 -0
- package/dist/hooks/useCrossxEmbeddedInfo.js.map +1 -0
- package/dist/index.d.ts +20 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +10 -0
- package/dist/index.js.map +1 -0
- package/package.json +43 -0
package/README.md
ADDED
|
@@ -0,0 +1,258 @@
|
|
|
1
|
+
# @nexus-cross/connect-kit-react
|
|
2
|
+
|
|
3
|
+
React provider, connect button, and hooks for **crossx-kit**. Drop
|
|
4
|
+
`<CrossConnectKitProvider>` at your tree root, render `<ConnectButton />`, and you
|
|
5
|
+
get a working multi-wallet connect flow for CROSSx (embedded / wallet /
|
|
6
|
+
extension) plus Reown-routed wallets (MetaMask, Binance) with a single config.
|
|
7
|
+
|
|
8
|
+
This is the primary entrypoint for DApp developers. If you need a headless
|
|
9
|
+
setup, use [`@nexus-cross/connect-kit-wagmi`](../wagmi) directly.
|
|
10
|
+
|
|
11
|
+
## Install
|
|
12
|
+
|
|
13
|
+
```sh
|
|
14
|
+
pnpm add @nexus-cross/connect-kit-react @nexus-cross/connect-kit-wagmi \
|
|
15
|
+
wagmi viem @tanstack/react-query react react-dom
|
|
16
|
+
```
|
|
17
|
+
|
|
18
|
+
Optional peers (same as `@nexus-cross/connect-kit-wagmi`): `@to-nexus/sdk`,
|
|
19
|
+
`@to-nexus/appkit-adapter-wagmi`, `@reown/appkit`,
|
|
20
|
+
`@reown/appkit-adapter-wagmi`, `@nexus-cross/crossx-sdk-core`,
|
|
21
|
+
`@nexus-cross/crossx-sdk-wagmi`. Install the ones matching the adapters you
|
|
22
|
+
enable in your config.
|
|
23
|
+
|
|
24
|
+
## Quick start
|
|
25
|
+
|
|
26
|
+
```tsx
|
|
27
|
+
// config.ts
|
|
28
|
+
import { createCrossxConfig } from '@nexus-cross/connect-kit-wagmi';
|
|
29
|
+
import { toNexusAdapter } from '@nexus-cross/connect-kit-wagmi/to-nexus';
|
|
30
|
+
import { reownAdapter } from '@nexus-cross/connect-kit-wagmi/reown';
|
|
31
|
+
import { embeddedConnectorFactory } from '@nexus-cross/connect-kit-wagmi/embedded';
|
|
32
|
+
|
|
33
|
+
export const config = createCrossxConfig({
|
|
34
|
+
crossProjectId: '...',
|
|
35
|
+
reownProjectId: '...',
|
|
36
|
+
appMetadata: { name: 'My DApp', url: 'https://example.com' },
|
|
37
|
+
networks: [crossTestnet],
|
|
38
|
+
defaultNetwork: crossTestnet,
|
|
39
|
+
crossProvider: toNexusAdapter(),
|
|
40
|
+
reownProvider: reownAdapter(),
|
|
41
|
+
embeddedConnectorFactory,
|
|
42
|
+
});
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
```tsx
|
|
46
|
+
// App.tsx
|
|
47
|
+
import { CrossConnectKitProvider, ConnectButton } from '@nexus-cross/connect-kit-react';
|
|
48
|
+
import { config } from './config';
|
|
49
|
+
|
|
50
|
+
export function App() {
|
|
51
|
+
return (
|
|
52
|
+
<CrossConnectKitProvider config={config}>
|
|
53
|
+
<ConnectButton />
|
|
54
|
+
{/* your app */}
|
|
55
|
+
</CrossConnectKitProvider>
|
|
56
|
+
);
|
|
57
|
+
}
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
That's it. Clicking the button launches the CROSSx embedded wallet flow; the
|
|
61
|
+
"Other wallets" link opens a modal listing `cross_wallet`, `cross_extension`,
|
|
62
|
+
`metamask`, `binance` — each of which routes through the correct provider
|
|
63
|
+
automatically.
|
|
64
|
+
|
|
65
|
+
## Components
|
|
66
|
+
|
|
67
|
+
### `<CrossConnectKitProvider>`
|
|
68
|
+
|
|
69
|
+
```tsx
|
|
70
|
+
<CrossConnectKitProvider
|
|
71
|
+
config={config}
|
|
72
|
+
initialState={initialState /* optional — SSR hydration */}
|
|
73
|
+
>
|
|
74
|
+
{children}
|
|
75
|
+
</CrossConnectKitProvider>
|
|
76
|
+
```
|
|
77
|
+
|
|
78
|
+
Wraps children in `WagmiProvider` + `QueryClientProvider` + kit context. Swaps
|
|
79
|
+
the active wagmi config when the user picks a wallet from the other provider
|
|
80
|
+
(`<WagmiProvider key={activeProvider}>` triggers a clean remount), and
|
|
81
|
+
suppresses benign WalletConnect teardown noise in `unhandledrejection`.
|
|
82
|
+
|
|
83
|
+
- Reads the last-active provider from localStorage so reloads stay on the
|
|
84
|
+
correct side.
|
|
85
|
+
- Persists the user's last wallet intent so `resolveCurrentWallet` can
|
|
86
|
+
disambiguate EIP-6963 connector ID promotion (e.g. `io.metamask` vs
|
|
87
|
+
`metaMask`).
|
|
88
|
+
|
|
89
|
+
#### SSR (Next.js App Router)
|
|
90
|
+
|
|
91
|
+
```tsx
|
|
92
|
+
// app/layout.tsx (Server Component)
|
|
93
|
+
import { headers } from 'next/headers';
|
|
94
|
+
import { cookieToCrossConnectKitState } from '@nexus-cross/connect-kit-wagmi';
|
|
95
|
+
import { config } from './config';
|
|
96
|
+
import { Providers } from './providers';
|
|
97
|
+
|
|
98
|
+
export default async function RootLayout({ children }) {
|
|
99
|
+
const cookie = (await headers()).get('cookie');
|
|
100
|
+
const initialState = cookieToCrossConnectKitState(config, cookie);
|
|
101
|
+
return (
|
|
102
|
+
<html><body>
|
|
103
|
+
<Providers initialState={initialState}>{children}</Providers>
|
|
104
|
+
</body></html>
|
|
105
|
+
);
|
|
106
|
+
}
|
|
107
|
+
```
|
|
108
|
+
|
|
109
|
+
```tsx
|
|
110
|
+
// app/providers.tsx ('use client')
|
|
111
|
+
'use client';
|
|
112
|
+
import { CrossConnectKitProvider } from '@nexus-cross/connect-kit-react';
|
|
113
|
+
import { config } from './config';
|
|
114
|
+
|
|
115
|
+
export function Providers({ children, initialState }) {
|
|
116
|
+
return (
|
|
117
|
+
<CrossConnectKitProvider config={config} initialState={initialState}>
|
|
118
|
+
{children}
|
|
119
|
+
</CrossConnectKitProvider>
|
|
120
|
+
);
|
|
121
|
+
}
|
|
122
|
+
```
|
|
123
|
+
|
|
124
|
+
Requires `createCrossxConfig({ ssr: true })`.
|
|
125
|
+
|
|
126
|
+
### `<ConnectButton>`
|
|
127
|
+
|
|
128
|
+
```tsx
|
|
129
|
+
<ConnectButton
|
|
130
|
+
label="Connect Wallet" // disconnected state label
|
|
131
|
+
showBalance={true} // popover shows native balance
|
|
132
|
+
theme="dark" // or 'light'
|
|
133
|
+
className="my-btn" // optional — overrides built-in styles
|
|
134
|
+
style={{ /* WalletInfoStyle */ }}
|
|
135
|
+
/>
|
|
136
|
+
```
|
|
137
|
+
|
|
138
|
+
Three visual states, driven by wagmi + the kit context:
|
|
139
|
+
|
|
140
|
+
1. **Disconnected** — solid pill with `label`, launches the embedded wallet
|
|
141
|
+
flow on click.
|
|
142
|
+
2. **Connecting / Reconnecting** — spinner + "Connecting…".
|
|
143
|
+
3. **Connected** — pill showing a **platform icon** + shortened address.
|
|
144
|
+
Clicking opens a popover powered by `@nexus-cross/dapp-ui`'s `WalletInfo`
|
|
145
|
+
with balance, copy-address, and a Disconnect footer.
|
|
146
|
+
|
|
147
|
+
The platform icon adapts per wallet:
|
|
148
|
+
- `cross_embedded` — the OAuth provider icon (Google / Apple) when available,
|
|
149
|
+
falls back to the CROSSx glyph.
|
|
150
|
+
- `cross_wallet` / `cross_extension` — CROSSx glyph.
|
|
151
|
+
- `metamask` / `binance` — the wallet's own brand mark.
|
|
152
|
+
|
|
153
|
+
For `cross_embedded`, the popover's **My Wallet** header is populated with
|
|
154
|
+
the saved wallet name from crossy-sdk 2.0 (`sdk.getAddresses()`) when one
|
|
155
|
+
exists.
|
|
156
|
+
|
|
157
|
+
### `<OtherWalletsModal>`
|
|
158
|
+
|
|
159
|
+
```tsx
|
|
160
|
+
import { OtherWalletsModal, useCrossConnectKit } from '@nexus-cross/connect-kit-react';
|
|
161
|
+
|
|
162
|
+
function MyCustomButton() {
|
|
163
|
+
const { connect, otherWalletsOpen, openOtherWallets, closeOtherWallets } =
|
|
164
|
+
useCrossConnectKit();
|
|
165
|
+
|
|
166
|
+
return (
|
|
167
|
+
<>
|
|
168
|
+
<button onClick={openOtherWallets}>Other wallets</button>
|
|
169
|
+
<OtherWalletsModal
|
|
170
|
+
open={otherWalletsOpen}
|
|
171
|
+
onClose={closeOtherWallets}
|
|
172
|
+
onSelect={connect}
|
|
173
|
+
/>
|
|
174
|
+
</>
|
|
175
|
+
);
|
|
176
|
+
}
|
|
177
|
+
```
|
|
178
|
+
|
|
179
|
+
Ported from posa's ConnectWalletModal — themed via `--wi-*` CSS custom
|
|
180
|
+
properties so it inherits the same palette as the WalletInfo popover.
|
|
181
|
+
|
|
182
|
+
## Hooks
|
|
183
|
+
|
|
184
|
+
### `useCrossConnectKit()`
|
|
185
|
+
|
|
186
|
+
```ts
|
|
187
|
+
const {
|
|
188
|
+
kitConfig,
|
|
189
|
+
connectorRegistry,
|
|
190
|
+
availableWallets, // registry entries with type !== 'embedded'
|
|
191
|
+
connect, // (walletId: WalletId) => Promise<void>
|
|
192
|
+
connectWallet, // () => Promise<void> — launches embedded flow
|
|
193
|
+
disconnect, // () => Promise<void>
|
|
194
|
+
selectWallet, // () => Promise<{ address, index } | null>
|
|
195
|
+
currentWallet, // WalletId | null
|
|
196
|
+
otherWalletsOpen,
|
|
197
|
+
openOtherWallets,
|
|
198
|
+
closeOtherWallets,
|
|
199
|
+
} = useCrossConnectKit();
|
|
200
|
+
```
|
|
201
|
+
|
|
202
|
+
`selectWallet` is a no-op for non-embedded wallets (returns `null`) — only
|
|
203
|
+
the crossy-sdk 2.0 embedded wallet exposes a wallet-switcher.
|
|
204
|
+
|
|
205
|
+
For address, chain, balance, and signing use **wagmi's own hooks**
|
|
206
|
+
(`useAccount`, `useBalance`, `useSignMessage`, …). This package doesn't
|
|
207
|
+
reinvent them.
|
|
208
|
+
|
|
209
|
+
## Re-exports
|
|
210
|
+
|
|
211
|
+
For convenience, `@nexus-cross/connect-kit-react` re-exports the types and the
|
|
212
|
+
`WalletInfo` component you normally need so you don't have to import from
|
|
213
|
+
three packages:
|
|
214
|
+
|
|
215
|
+
```ts
|
|
216
|
+
import {
|
|
217
|
+
WalletInfo, // cross-app-launcher compound component
|
|
218
|
+
ConnectorId,
|
|
219
|
+
ConnectionStatus,
|
|
220
|
+
formatBalance,
|
|
221
|
+
formatWei,
|
|
222
|
+
type WalletId,
|
|
223
|
+
type Account,
|
|
224
|
+
type ChainBalance,
|
|
225
|
+
type CrossConnectKitConfig,
|
|
226
|
+
type ConnectorRegistry,
|
|
227
|
+
type ConnectorEntry,
|
|
228
|
+
} from '@nexus-cross/connect-kit-react';
|
|
229
|
+
```
|
|
230
|
+
|
|
231
|
+
## Theming
|
|
232
|
+
|
|
233
|
+
`WalletInfo` and `OtherWalletsModal` are styled through the `--wi-*` custom
|
|
234
|
+
property set (surface, border, text, accent tokens). The kit reads these at
|
|
235
|
+
runtime and forwards them to the crossy-sdk 2.0 login modal via
|
|
236
|
+
`deriveSDKThemeTokensFromWalletInfo`, so a single CSS palette styles both
|
|
237
|
+
the connect UI and the embedded login overlay.
|
|
238
|
+
|
|
239
|
+
## Allowed dependencies
|
|
240
|
+
|
|
241
|
+
This package may depend on: `react`, `react-dom` (peer), `wagmi` (peer, hooks
|
|
242
|
+
only), `@tanstack/react-query` (peer), `@nexus-cross/connect-kit-core`,
|
|
243
|
+
`@nexus-cross/connect-kit-wagmi`, `@nexus-cross/dapp-ui` (peer), `@to-nexus/sdk` (optional
|
|
244
|
+
peer, for the hook that inspects the embedded session), radix-ui, vaul.
|
|
245
|
+
|
|
246
|
+
It must **not** import `@nexus-cross/*` or `viem` directly — domain types
|
|
247
|
+
flow through `@nexus-cross/connect-kit-core`, and any external SDK access happens in the
|
|
248
|
+
wagmi layer.
|
|
249
|
+
|
|
250
|
+
## Compatibility
|
|
251
|
+
|
|
252
|
+
- `react@^18`, `react-dom@^18`
|
|
253
|
+
- `wagmi@^2`, `viem@^2`
|
|
254
|
+
- `@tanstack/react-query@^5`
|
|
255
|
+
|
|
256
|
+
## License
|
|
257
|
+
|
|
258
|
+
MIT
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import type { Environment, WalletInfoStyle } from '@nexus-cross/dapp-ui';
|
|
2
|
+
/**
|
|
3
|
+
* ConnectButton이 사용하는 사용자 프로바이더 식별자.
|
|
4
|
+
* crossy-sdk의 OAuth 로그인(`google`/`apple`)과 실제 지갑 커넥터
|
|
5
|
+
* (`cross`/`metamask`/`binance`)를 하나의 enum처럼 통합 표기한 값.
|
|
6
|
+
*/
|
|
7
|
+
export type WalletProvider = 'google' | 'apple' | 'cross' | 'metamask' | 'binance';
|
|
8
|
+
/**
|
|
9
|
+
* 외부에서 `ConnectButton`에 전달할 수 있는 사용자 정보 객체.
|
|
10
|
+
* 지정 시 내부 자동 감지 로직(useAccount / crossy-sdk)보다 우선하여
|
|
11
|
+
* trigger pill / WalletInfo 헤더 표시에 사용된다.
|
|
12
|
+
*/
|
|
13
|
+
export interface WalletUser {
|
|
14
|
+
/** `google` | `apple` | `cross` | `metamask` | `binance` */
|
|
15
|
+
provider: WalletProvider;
|
|
16
|
+
/** WalletInfo 헤더에 노출될 계정 라벨 (예: `"Account 1"`). */
|
|
17
|
+
name?: string;
|
|
18
|
+
/** 0x... 지갑 주소. */
|
|
19
|
+
address: string;
|
|
20
|
+
}
|
|
21
|
+
export interface ConnectButtonProps {
|
|
22
|
+
showBalance?: boolean;
|
|
23
|
+
label?: string;
|
|
24
|
+
className?: string;
|
|
25
|
+
theme?: 'light' | 'dark';
|
|
26
|
+
style?: WalletInfoStyle;
|
|
27
|
+
/**
|
|
28
|
+
* 사용자 정보 객체. 지정 시 `provider`/`name`/`address`가 자동 감지값보다
|
|
29
|
+
* 우선하여 trigger pill과 WalletInfo 헤더에 반영된다. 연결 상태 자체
|
|
30
|
+
* (`isConnected`/`isConnecting`)는 여전히 wagmi에서 가져온다.
|
|
31
|
+
*/
|
|
32
|
+
user?: WalletUser;
|
|
33
|
+
/**
|
|
34
|
+
* WalletInfo 내부에 포트폴리오 뷰를 활성화할지 여부.
|
|
35
|
+
* - `true`: WalletInfo가 기본 `WalletPortfolioBody`를 자동 마운트
|
|
36
|
+
* - `false`/`undefined`: 비활성
|
|
37
|
+
*/
|
|
38
|
+
enablePortfolio?: boolean;
|
|
39
|
+
/**
|
|
40
|
+
* WalletInfo가 사용할 API 환경. `enablePortfolio`가 true일 때 내부
|
|
41
|
+
* `WalletPortfolioBody`의 데이터 소스로도 전달된다. 기본값 `"production"`.
|
|
42
|
+
*/
|
|
43
|
+
env?: Environment;
|
|
44
|
+
}
|
|
45
|
+
/**
|
|
46
|
+
* `WalletInfo` from cross-app-launcher always renders a "select wallet"
|
|
47
|
+
* chevron next to the address. The selection feature is implemented by
|
|
48
|
+
* crossy-sdk 2.0 (`provider.sdk.selectWallet`) and only works for the
|
|
49
|
+
* embedded CROSSx wallet — for every other connector, the chevron's
|
|
50
|
+
* default click handler shows an `alert("지갑 선택을 지원하지 않습니다.")`.
|
|
51
|
+
*
|
|
52
|
+
* To match user expectations:
|
|
53
|
+
* - When the active wallet is `cross_embedded`, wire the chevron to
|
|
54
|
+
* our `selectWallet()` (opens the SDK's native wallet picker).
|
|
55
|
+
* - For any other wallet, hide the chevron entirely so users can't
|
|
56
|
+
* hit the unsupported-feature alert.
|
|
57
|
+
*
|
|
58
|
+
* The hide is done via a scoped <style> tag because cross-app-launcher's
|
|
59
|
+
* type definitions don't currently expose `onSelectWallet` (the prop
|
|
60
|
+
* exists at runtime but the bundled `.d.ts` is stale). When the package
|
|
61
|
+
* republishes its types, we can drop the cast below.
|
|
62
|
+
*/
|
|
63
|
+
export declare function ConnectButton({ label, showBalance, className, theme: themeProp, style, user, enablePortfolio, env, }: ConnectButtonProps): import("react/jsx-runtime").JSX.Element;
|
|
64
|
+
//# sourceMappingURL=ConnectButton.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ConnectButton.d.ts","sourceRoot":"","sources":["../../src/components/ConnectButton.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAazE;;;;GAIG;AACH,MAAM,MAAM,cAAc,GACtB,QAAQ,GACR,OAAO,GACP,OAAO,GACP,UAAU,GACV,SAAS,CAAC;AAEd;;;;GAIG;AACH,MAAM,WAAW,UAAU;IACzB,4DAA4D;IAC5D,QAAQ,EAAE,cAAc,CAAC;IACzB,mDAAmD;IACnD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mBAAmB;IACnB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,kBAAkB;IACjC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB;;;;OAIG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,GAAG,CAAC,EAAE,WAAW,CAAC;CACnB;AA2ED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAwB,EACxB,WAAkB,EAClB,SAAS,EACT,KAAK,EAAE,SAAS,EAChB,KAAK,EACL,IAAI,EACJ,eAAe,EACf,GAAkB,GACnB,EAAE,kBAAkB,2CAsLpB"}
|
|
@@ -0,0 +1,257 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useCallback, useEffect, useMemo, useState } from 'react';
|
|
3
|
+
import { useAccount } from 'wagmi';
|
|
4
|
+
import { WalletInfo, ConnectorId } from '@nexus-cross/dapp-ui';
|
|
5
|
+
import { APPLE_ICON, BINANCE_ICON, CROSSX_ICON, EXTENSION_ICON, GOOGLE_ICON, METAMASK_ICON, } from '@nexus-cross/connect-kit-wagmi';
|
|
6
|
+
import { useCrossConnectKit } from '../context/CrossConnectKitContext.js';
|
|
7
|
+
import { useOptionalCrossConnectKitTheme } from '../context/CrossConnectKitThemeContext.js';
|
|
8
|
+
import { useCrossxEmbeddedInfo } from '../hooks/useCrossxEmbeddedInfo.js';
|
|
9
|
+
/**
|
|
10
|
+
* `WalletProvider` → trigger pill 표시 정보 + WalletInfo의 `connectorId` 매핑.
|
|
11
|
+
* `google`/`apple`은 crossy-sdk embedded 지갑의 로그인 타입이므로 커넥터는
|
|
12
|
+
* `CROSSx`로 귀속된다.
|
|
13
|
+
*/
|
|
14
|
+
const PROVIDER_MAP = {
|
|
15
|
+
google: { name: 'Google', iconUrl: GOOGLE_ICON, connectorId: ConnectorId.CROSSx },
|
|
16
|
+
apple: { name: 'Apple', iconUrl: APPLE_ICON, connectorId: ConnectorId.CROSSx },
|
|
17
|
+
cross: { name: 'CROSSx', iconUrl: CROSSX_ICON, connectorId: ConnectorId.CROSSx },
|
|
18
|
+
metamask: {
|
|
19
|
+
name: 'MetaMask',
|
|
20
|
+
iconUrl: METAMASK_ICON,
|
|
21
|
+
connectorId: ConnectorId.MetaMask,
|
|
22
|
+
},
|
|
23
|
+
binance: {
|
|
24
|
+
name: 'Binance Wallet',
|
|
25
|
+
iconUrl: BINANCE_ICON,
|
|
26
|
+
connectorId: ConnectorId.Binance,
|
|
27
|
+
},
|
|
28
|
+
};
|
|
29
|
+
function mapConnectorId(walletId) {
|
|
30
|
+
switch (walletId) {
|
|
31
|
+
case 'cross_embedded':
|
|
32
|
+
return ConnectorId.CROSSx;
|
|
33
|
+
case 'metamask':
|
|
34
|
+
return ConnectorId.MetaMask;
|
|
35
|
+
case 'binance':
|
|
36
|
+
return ConnectorId.Binance;
|
|
37
|
+
default:
|
|
38
|
+
return undefined;
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
/**
|
|
42
|
+
* Trigger-only display mapping — what the pill next to the address
|
|
43
|
+
* shows. crossy-sdk 2.0 users see Google/Apple (their OAuth provider)
|
|
44
|
+
* rather than the generic CROSSx glyph; cross_wallet / cross_extension
|
|
45
|
+
* stay on CROSSx; external wallets show their own brand.
|
|
46
|
+
*
|
|
47
|
+
* The WalletInfo popover itself keeps cross-app-launcher's built-in
|
|
48
|
+
* "Connected with CROSSx" wording — we deliberately do NOT override
|
|
49
|
+
* `connectorName` / `connectorIconUrl` on the WalletInfo root.
|
|
50
|
+
*/
|
|
51
|
+
function resolveTriggerDisplay(walletId, loginType) {
|
|
52
|
+
switch (walletId) {
|
|
53
|
+
case 'cross_embedded':
|
|
54
|
+
if (loginType === 'google') {
|
|
55
|
+
return { name: 'Google', iconUrl: GOOGLE_ICON };
|
|
56
|
+
}
|
|
57
|
+
if (loginType === 'apple') {
|
|
58
|
+
return { name: 'Apple', iconUrl: APPLE_ICON };
|
|
59
|
+
}
|
|
60
|
+
return { name: 'CROSSx', iconUrl: CROSSX_ICON };
|
|
61
|
+
case 'cross_wallet':
|
|
62
|
+
return { name: 'CROSSx Wallet', iconUrl: CROSSX_ICON };
|
|
63
|
+
case 'cross_extension':
|
|
64
|
+
return { name: 'CROSSx Extension', iconUrl: EXTENSION_ICON };
|
|
65
|
+
case 'metamask':
|
|
66
|
+
return { name: 'MetaMask', iconUrl: METAMASK_ICON };
|
|
67
|
+
case 'binance':
|
|
68
|
+
return { name: 'Binance Wallet', iconUrl: BINANCE_ICON };
|
|
69
|
+
default:
|
|
70
|
+
return null;
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
/**
|
|
74
|
+
* `WalletInfo` from cross-app-launcher always renders a "select wallet"
|
|
75
|
+
* chevron next to the address. The selection feature is implemented by
|
|
76
|
+
* crossy-sdk 2.0 (`provider.sdk.selectWallet`) and only works for the
|
|
77
|
+
* embedded CROSSx wallet — for every other connector, the chevron's
|
|
78
|
+
* default click handler shows an `alert("지갑 선택을 지원하지 않습니다.")`.
|
|
79
|
+
*
|
|
80
|
+
* To match user expectations:
|
|
81
|
+
* - When the active wallet is `cross_embedded`, wire the chevron to
|
|
82
|
+
* our `selectWallet()` (opens the SDK's native wallet picker).
|
|
83
|
+
* - For any other wallet, hide the chevron entirely so users can't
|
|
84
|
+
* hit the unsupported-feature alert.
|
|
85
|
+
*
|
|
86
|
+
* The hide is done via a scoped <style> tag because cross-app-launcher's
|
|
87
|
+
* type definitions don't currently expose `onSelectWallet` (the prop
|
|
88
|
+
* exists at runtime but the bundled `.d.ts` is stale). When the package
|
|
89
|
+
* republishes its types, we can drop the cast below.
|
|
90
|
+
*/
|
|
91
|
+
export function ConnectButton({ label = 'Connect Wallet', showBalance = true, className, theme: themeProp, style, user, enablePortfolio, env = 'production', }) {
|
|
92
|
+
const { address: wagmiAddress, isConnected, isConnecting, connector } = useAccount();
|
|
93
|
+
const { connectWallet, disconnect, selectWallet, currentWallet } = useCrossConnectKit();
|
|
94
|
+
// When mounted inside `<CrossConnectKitProvider>`, default the `theme` prop
|
|
95
|
+
// to whatever mode the kit is running — so a single kit-level
|
|
96
|
+
// `themeTokens: { light, dark }` plus a `theme: 'dark'` flips
|
|
97
|
+
// WalletInfo + embedded SDK together without per-call wiring.
|
|
98
|
+
const kitTheme = useOptionalCrossConnectKitTheme();
|
|
99
|
+
const theme = themeProp ?? kitTheme?.mode ?? 'dark';
|
|
100
|
+
// `user`가 주어지면 표시용 주소/이름/커넥터 식별자를 override 한다.
|
|
101
|
+
// 실제 연결 상태(isConnected 등)는 여전히 wagmi를 기준으로 한다.
|
|
102
|
+
const address = user?.address ?? wagmiAddress;
|
|
103
|
+
const userProviderMeta = user ? PROVIDER_MAP[user.provider] : null;
|
|
104
|
+
// Only surface the "Connecting…" spinner when the user clicked the
|
|
105
|
+
// button themselves. wagmi may flip `isConnecting` on its own for
|
|
106
|
+
// background reasons (e.g. crossy-sdk restoring a prior OAuth session,
|
|
107
|
+
// an in-flight auto-reconnect), and if we gate the UI on that flag
|
|
108
|
+
// alone the button can lock indefinitely while nothing visible is
|
|
109
|
+
// happening. Resetting on `isConnected` or loss of `isConnecting`
|
|
110
|
+
// keeps the state in sync with the real outcome.
|
|
111
|
+
const [userInitiatedConnect, setUserInitiatedConnect] = useState(false);
|
|
112
|
+
useEffect(() => {
|
|
113
|
+
if (isConnected || !isConnecting)
|
|
114
|
+
setUserInitiatedConnect(false);
|
|
115
|
+
}, [isConnected, isConnecting]);
|
|
116
|
+
const { loginType, accountName: autoAccountName } = useCrossxEmbeddedInfo({
|
|
117
|
+
walletId: currentWallet,
|
|
118
|
+
connector,
|
|
119
|
+
// user.address가 주어지면 해당 주소에 대한 SDK 메타데이터만 조회한다.
|
|
120
|
+
address,
|
|
121
|
+
});
|
|
122
|
+
// `user`가 주어졌을 때 SDK 기반 자동 감지값을 덮어쓴다.
|
|
123
|
+
const triggerDisplay = useMemo(() => userProviderMeta
|
|
124
|
+
? { name: userProviderMeta.name, iconUrl: userProviderMeta.iconUrl }
|
|
125
|
+
: resolveTriggerDisplay(currentWallet, loginType), [userProviderMeta, currentWallet, loginType]);
|
|
126
|
+
const accountName = user?.name ?? autoAccountName;
|
|
127
|
+
const resolvedConnectorId = userProviderMeta
|
|
128
|
+
? userProviderMeta.connectorId
|
|
129
|
+
: mapConnectorId(currentWallet);
|
|
130
|
+
const handleConnectClick = useCallback(() => {
|
|
131
|
+
setUserInitiatedConnect(true);
|
|
132
|
+
connectWallet().catch((err) => {
|
|
133
|
+
console.error('[crossx-kit] connectWallet error:', err);
|
|
134
|
+
setUserInitiatedConnect(false);
|
|
135
|
+
});
|
|
136
|
+
}, [connectWallet]);
|
|
137
|
+
const handleDisconnect = useCallback(() => {
|
|
138
|
+
disconnect();
|
|
139
|
+
}, [disconnect]);
|
|
140
|
+
// 지갑 선택 chevron은 crossy-sdk 2.0 OAuth embedded 세션일 때만 의미가
|
|
141
|
+
// 있다(`provider.sdk.selectWallet` 지원). 즉
|
|
142
|
+
// - `user`가 주어지면 provider ∈ { google, apple }일 때만 노출
|
|
143
|
+
// - `user`가 없으면 기존과 동일하게 currentWallet === "cross_embedded"
|
|
144
|
+
// CROSSx 1.0(cross_wallet/cross_extension) · MetaMask · Binance는 모두 숨김.
|
|
145
|
+
const supportsSelectWallet = user
|
|
146
|
+
? user.provider === 'google' || user.provider === 'apple'
|
|
147
|
+
: currentWallet === 'cross_embedded';
|
|
148
|
+
const handleSelectWallet = useCallback(() => {
|
|
149
|
+
selectWallet().catch((err) => {
|
|
150
|
+
console.error('[crossx-kit] selectWallet error:', err);
|
|
151
|
+
});
|
|
152
|
+
}, [selectWallet]);
|
|
153
|
+
const selectWalletProps = useMemo(() => supportsSelectWallet
|
|
154
|
+
? { onSelectWallet: handleSelectWallet }
|
|
155
|
+
: null, [supportsSelectWallet, handleSelectWallet]);
|
|
156
|
+
const isPortfolioEnabled = !!enablePortfolio;
|
|
157
|
+
// Show the spinner only when the user clicked and wagmi is actually
|
|
158
|
+
// mid-connect. Background `isConnecting` flaps without user intent
|
|
159
|
+
// (SDK session restoration, auto-reconnect) leave the button usable.
|
|
160
|
+
if (userInitiatedConnect && isConnecting) {
|
|
161
|
+
return (_jsxs("button", { type: "button", disabled: true, className: className, style: !className ? { ...ds.button, ...ds.buttonLoading } : undefined, children: [_jsx("span", { style: ds.spinner }), "Connecting..."] }));
|
|
162
|
+
}
|
|
163
|
+
if (isConnected && address) {
|
|
164
|
+
return (_jsxs("span", { "data-crossx-wallet-info": supportsSelectWallet ? 'embedded' : 'external', children: [!supportsSelectWallet && (_jsx("style", { children: SELECT_WALLET_HIDE_CSS })), _jsxs(WalletInfo, { env: env, theme: theme, walletAddress: address, accountName: accountName ?? undefined,
|
|
165
|
+
// NOTE: connectorName / connectorIconUrl intentionally NOT
|
|
166
|
+
// overridden — the "Connected with CROSSx" row inside the
|
|
167
|
+
// popover keeps cross-app-launcher's CONNECTOR_REGISTRY
|
|
168
|
+
// metadata (expected UX). Only the trigger button below uses
|
|
169
|
+
// our own platform-specific icon via `triggerDisplay`.
|
|
170
|
+
connectorId: resolvedConnectorId, showBalance: showBalance, style: style, showPortfolio: isPortfolioEnabled, ...(selectWalletProps ?? {}), children: [_jsx(WalletInfo.Trigger, { asChild: true, children: _jsxs("button", { type: "button", className: className, style: !className ? ds.connectedBtn : undefined, "aria-label": `Connected with ${triggerDisplay?.name ?? 'wallet'}: ${shorten(address)}`, children: [triggerDisplay?.iconUrl ? (_jsx("img", { src: triggerDisplay.iconUrl, alt: "", width: 20, height: 20, style: ds.connectedIcon })) : (_jsx("span", { style: ds.connectedIconPlaceholder, "aria-hidden": "true" })), _jsx("span", { style: ds.connectedAddress, children: shorten(address) })] }) }), _jsx(WalletInfo.Content, { align: "end", sideOffset: 8 }), _jsx(WalletInfo.Footer, { children: _jsx("button", { type: "button", onClick: handleDisconnect, style: ds.disconnectBtn, children: "Disconnect" }) })] })] }));
|
|
171
|
+
}
|
|
172
|
+
return (_jsx("button", { type: "button", onClick: handleConnectClick, className: className, style: !className ? ds.button : undefined, children: label }));
|
|
173
|
+
}
|
|
174
|
+
const SELECT_WALLET_HIDE_CSS = `
|
|
175
|
+
[data-crossx-wallet-info="external"] .wi-select-wallet-btn {
|
|
176
|
+
display: none !important;
|
|
177
|
+
}
|
|
178
|
+
`;
|
|
179
|
+
function shorten(address) {
|
|
180
|
+
return `${address.slice(0, 6)}...${address.slice(-4)}`;
|
|
181
|
+
}
|
|
182
|
+
const ds = {
|
|
183
|
+
button: {
|
|
184
|
+
padding: '10px 24px',
|
|
185
|
+
borderRadius: '12px',
|
|
186
|
+
border: 'none',
|
|
187
|
+
background: '#00D5AA',
|
|
188
|
+
color: '#000',
|
|
189
|
+
fontWeight: 700,
|
|
190
|
+
fontSize: '14px',
|
|
191
|
+
cursor: 'pointer',
|
|
192
|
+
display: 'inline-flex',
|
|
193
|
+
alignItems: 'center',
|
|
194
|
+
gap: '8px',
|
|
195
|
+
transition: 'opacity 0.15s',
|
|
196
|
+
},
|
|
197
|
+
buttonLoading: {
|
|
198
|
+
opacity: 0.7,
|
|
199
|
+
cursor: 'default',
|
|
200
|
+
},
|
|
201
|
+
spinner: {
|
|
202
|
+
display: 'inline-block',
|
|
203
|
+
width: '14px',
|
|
204
|
+
height: '14px',
|
|
205
|
+
border: '2px solid #00000030',
|
|
206
|
+
borderTopColor: '#000',
|
|
207
|
+
borderRadius: '50%',
|
|
208
|
+
animation: 'crossx-spin 0.6s linear infinite',
|
|
209
|
+
},
|
|
210
|
+
disconnectBtn: {
|
|
211
|
+
width: '100%',
|
|
212
|
+
padding: '12px',
|
|
213
|
+
borderRadius: '10px',
|
|
214
|
+
border: '1px solid var(--wi-border-default, #2a2d3a)',
|
|
215
|
+
background: 'transparent',
|
|
216
|
+
color: 'var(--wi-texticon-secondary, #ffffffb2)',
|
|
217
|
+
fontWeight: 600,
|
|
218
|
+
fontSize: '14px',
|
|
219
|
+
cursor: 'pointer',
|
|
220
|
+
transition: 'background 0.15s',
|
|
221
|
+
},
|
|
222
|
+
connectedBtn: {
|
|
223
|
+
display: 'inline-flex',
|
|
224
|
+
alignItems: 'center',
|
|
225
|
+
gap: '8px',
|
|
226
|
+
padding: '8px 14px',
|
|
227
|
+
borderRadius: '999px',
|
|
228
|
+
border: '1px solid var(--wi-border-default, #2a2d3a)',
|
|
229
|
+
background: 'var(--wi-surface-default, #1e232e)',
|
|
230
|
+
color: 'var(--wi-texticon-primary, #ffffff)',
|
|
231
|
+
fontWeight: 600,
|
|
232
|
+
fontSize: '14px',
|
|
233
|
+
cursor: 'pointer',
|
|
234
|
+
fontFamily: 'inherit',
|
|
235
|
+
},
|
|
236
|
+
connectedIcon: {
|
|
237
|
+
width: '20px',
|
|
238
|
+
height: '20px',
|
|
239
|
+
borderRadius: '50%',
|
|
240
|
+
objectFit: 'contain',
|
|
241
|
+
flexShrink: 0,
|
|
242
|
+
background: 'transparent',
|
|
243
|
+
},
|
|
244
|
+
connectedIconPlaceholder: {
|
|
245
|
+
width: '20px',
|
|
246
|
+
height: '20px',
|
|
247
|
+
borderRadius: '50%',
|
|
248
|
+
background: 'var(--wi-surface-subtle, #2a2d3a)',
|
|
249
|
+
flexShrink: 0,
|
|
250
|
+
},
|
|
251
|
+
connectedAddress: {
|
|
252
|
+
fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace',
|
|
253
|
+
fontSize: '13px',
|
|
254
|
+
letterSpacing: '0.02em',
|
|
255
|
+
},
|
|
256
|
+
};
|
|
257
|
+
//# sourceMappingURL=ConnectButton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ConnectButton.js","sourceRoot":"","sources":["../../src/components/ConnectButton.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { type ReactNode } from 'react';
|
|
2
|
+
import type { CrossxConfig, CrossConnectKitInitialState } from '@nexus-cross/connect-kit-wagmi';
|
|
3
|
+
export interface CrossConnectKitProviderProps {
|
|
4
|
+
children: ReactNode;
|
|
5
|
+
config: CrossxConfig;
|
|
6
|
+
/**
|
|
7
|
+
* SSR hydration state for both sides of the dual wagmi config. Produce
|
|
8
|
+
* with `cookieToCrossConnectKitState(config, cookieHeader)` on the server.
|
|
9
|
+
* The provider passes the correct slice into whichever `<WagmiProvider>`
|
|
10
|
+
* is currently active.
|
|
11
|
+
*/
|
|
12
|
+
initialState?: CrossConnectKitInitialState;
|
|
13
|
+
}
|
|
14
|
+
export declare function CrossConnectKitProvider({ children, config, initialState }: CrossConnectKitProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
15
|
+
//# sourceMappingURL=CrossConnectKitProvider.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CrossConnectKitProvider.d.ts","sourceRoot":"","sources":["../../src/components/CrossConnectKitProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAqD,MAAM,OAAO,CAAC;AAG1F,OAAO,KAAK,EACV,YAAY,EACZ,2BAA2B,EAE5B,MAAM,gCAAgC,CAAC;AAuBxC,MAAM,WAAW,4BAA4B;IAC3C,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,EAAE,YAAY,CAAC;IACrB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,2BAA2B,CAAC;CAC5C;AA8fD,wBAAgB,uBAAuB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,YAAY,EAAE,EAAE,4BAA4B,2CAgLvG"}
|