@moon-x/react-sdk 0.9.1 → 0.10.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/README.md +18 -16
- package/dist/{chunk-7XFCJAFG.mjs → chunk-ACYQG7VT.mjs} +4 -4
- package/dist/{chunk-VBAVYDWQ.js → chunk-IPTLHXJ4.js} +4 -4
- package/dist/{chunk-OAG4S5VJ.mjs → chunk-MURLJWUN.mjs} +3 -3
- package/dist/{chunk-F345C4FX.js → chunk-RRFMI4ZL.js} +3 -3
- package/dist/index.css +43 -43
- package/dist/index.d.mts +13 -13
- package/dist/index.d.ts +13 -13
- package/dist/index.js +730 -687
- package/dist/index.mjs +728 -684
- package/dist/style.css +43 -43
- package/dist/wallets/ethereum.js +15 -15
- package/dist/wallets/ethereum.mjs +1 -1
- package/dist/wallets/solana.js +11 -11
- package/dist/wallets/solana.mjs +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -10,15 +10,15 @@ pnpm add @moon-x/react-sdk
|
|
|
10
10
|
|
|
11
11
|
## Quick start
|
|
12
12
|
|
|
13
|
-
Wrap your app with `
|
|
13
|
+
Wrap your app with `MoonXProvider` and import the CSS bundle once:
|
|
14
14
|
|
|
15
15
|
```tsx
|
|
16
|
-
import {
|
|
16
|
+
import { MoonXProvider, mainnet, sepolia } from "@moon-x/react-sdk";
|
|
17
17
|
import "@moon-x/react-sdk/style.css";
|
|
18
18
|
|
|
19
19
|
export default function App() {
|
|
20
20
|
return (
|
|
21
|
-
<
|
|
21
|
+
<MoonXProvider
|
|
22
22
|
publishableKey={process.env.NEXT_PUBLIC_MOONKEY_PUBLISHABLE_KEY!}
|
|
23
23
|
config={{
|
|
24
24
|
appearance: {
|
|
@@ -36,7 +36,7 @@ export default function App() {
|
|
|
36
36
|
}}
|
|
37
37
|
>
|
|
38
38
|
<YourApp />
|
|
39
|
-
</
|
|
39
|
+
</MoonXProvider>
|
|
40
40
|
);
|
|
41
41
|
}
|
|
42
42
|
```
|
|
@@ -44,10 +44,10 @@ export default function App() {
|
|
|
44
44
|
Open the auth modal and read user state:
|
|
45
45
|
|
|
46
46
|
```tsx
|
|
47
|
-
import {
|
|
47
|
+
import { useMoonX } from "@moon-x/react-sdk";
|
|
48
48
|
|
|
49
49
|
function LoginButton() {
|
|
50
|
-
const { ready, isAuthenticated, user, start, logout } =
|
|
50
|
+
const { ready, isAuthenticated, user, start, logout } = useMoonX();
|
|
51
51
|
|
|
52
52
|
if (!ready) return null;
|
|
53
53
|
if (isAuthenticated) {
|
|
@@ -84,7 +84,7 @@ function SignDemo() {
|
|
|
84
84
|
|
|
85
85
|
## Configuration
|
|
86
86
|
|
|
87
|
-
`
|
|
87
|
+
`MoonXProvider` accepts `publishableKey` (required) plus a `config` object:
|
|
88
88
|
|
|
89
89
|
| Field | Type | Purpose |
|
|
90
90
|
|---|---|---|
|
|
@@ -103,7 +103,7 @@ function SignDemo() {
|
|
|
103
103
|
|
|
104
104
|
| Hook | What it does |
|
|
105
105
|
|---|---|
|
|
106
|
-
| `
|
|
106
|
+
| `useMoonX()` | The big one. `{ ready, isAuthenticated, user, start, logout, setAppearance, getSessionTokens, refreshUser, ... }` + every SDK method on the same instance. |
|
|
107
107
|
| `useUser()` | Just `{ user, refreshUser }`. Re-subscribes to user changes. |
|
|
108
108
|
| `useLoginWithEmail({ onComplete?, onError? })` | Headless email-OTP. Returns `{ state, sendCode, loginWithCode, reset }`. `state` is a discriminated union: `idle` / `sending` / `awaiting-code` / `verifying` / `complete` / `error`. |
|
|
109
109
|
| `useLoginWithOAuth()` | Google + Apple flows. Returns `{ state, loginWithOAuth, reset }`. |
|
|
@@ -180,7 +180,7 @@ branding fields (`accentColor`, `backgroundColor`, `displayMode`, `logo`,
|
|
|
180
180
|
per-mode `light` / `dark`) when you want finer control.
|
|
181
181
|
|
|
182
182
|
```tsx
|
|
183
|
-
<
|
|
183
|
+
<MoonXProvider
|
|
184
184
|
config={{
|
|
185
185
|
appearance: {
|
|
186
186
|
// Branding
|
|
@@ -212,7 +212,7 @@ per-mode `light` / `dark`) when you want finer control.
|
|
|
212
212
|
Update appearance at runtime — handy for a light/dark toggle:
|
|
213
213
|
|
|
214
214
|
```tsx
|
|
215
|
-
const { setAppearance } =
|
|
215
|
+
const { setAppearance } = useMoonX();
|
|
216
216
|
setAppearance({ displayMode: colorScheme });
|
|
217
217
|
```
|
|
218
218
|
|
|
@@ -223,14 +223,16 @@ token always wins over the high-level derivations.
|
|
|
223
223
|
|
|
224
224
|
#### Token reference
|
|
225
225
|
|
|
226
|
-
|
|
227
|
-
emit
|
|
226
|
+
All theming tokens emit `--moonx-*` CSS variables. The base palette/radius/font
|
|
227
|
+
emit the core tokens (e.g. `--moonx-color-*`, `--moonx-border-radius-*`); the
|
|
228
|
+
newer granular tokens each fall back to their base token (e.g. `--moonx-radius-button`
|
|
229
|
+
→ `--moonx-border-radius-md`), so defaults are unchanged until you set one.
|
|
228
230
|
|
|
229
231
|
| Group | Tokens | CSS variables |
|
|
230
232
|
|---|---|---|
|
|
231
|
-
| `colors` | `accent`, `accentForeground`, `background`, `background2/3`, `foreground`, `foreground2–4`, `border`, `success`, `error`, … | `--
|
|
233
|
+
| `colors` | `accent`, `accentForeground`, `background`, `background2/3`, `foreground`, `foreground2–4`, `border`, `success`, `error`, … | `--moonx-color-*` |
|
|
232
234
|
| `colors` | `warning`, `info`, `link`, `ring` (focus) | `--moonx-color-*` |
|
|
233
|
-
| `borderRadius` | `sm`, `md`, `lg`, `full` | `--
|
|
235
|
+
| `borderRadius` | `sm`, `md`, `lg`, `full` | `--moonx-border-radius-*` |
|
|
234
236
|
| `borderRadius` | `button`, `card`, `input` | `--moonx-radius-*` |
|
|
235
237
|
| `typography` | `fontFamilyHeading`, `letterSpacing`, `fontSize.{sm,lg,xl}`, `fontWeight.{medium,bold}` | `--moonx-font-*`, `--moonx-letter-spacing` |
|
|
236
238
|
| `typography` | `fontUrl` | injected `<link rel="stylesheet">` |
|
|
@@ -244,11 +246,11 @@ For finer control, `appearance.components` styles individual surfaces — `card`
|
|
|
244
246
|
accept `background`, `text`, `border` (color), `borderWidth`, and `radius`;
|
|
245
247
|
`card` accepts the same minus `background` (the card surface **is** the global
|
|
246
248
|
`backgroundColor`). Anything you omit falls through to the global tokens /
|
|
247
|
-
`--
|
|
249
|
+
`--moonx-*` defaults. The header is styled via the typography tokens instead
|
|
248
250
|
(`appearance.typography.colorHeading`, `fontFamilyHeading`, …).
|
|
249
251
|
|
|
250
252
|
```tsx
|
|
251
|
-
<
|
|
253
|
+
<MoonXProvider
|
|
252
254
|
config={{
|
|
253
255
|
appearance: {
|
|
254
256
|
components: {
|
|
@@ -444,7 +444,7 @@ var useEthereumProvider = function useEthereumProvider(wallet) {
|
|
|
444
444
|
defaultSelector: (_coreSDK_config1 = coreSDK.config) === null || _coreSDK_config1 === void 0 ? void 0 : _coreSDK_config1.defaultChain
|
|
445
445
|
});
|
|
446
446
|
if (!sendEntry) {
|
|
447
|
-
throw new Error(requestedSendChainId != null ? "Transaction targets chainId ".concat(requestedSendChainId, ", which is not in the configured chains.") : "No chain configured. Please set `chains` (and optionally `defaultChain`) in
|
|
447
|
+
throw new Error(requestedSendChainId != null ? "Transaction targets chainId ".concat(requestedSendChainId, ", which is not in the configured chains.") : "No chain configured. Please set `chains` (and optionally `defaultChain`) in MoonXProvider config.");
|
|
448
448
|
}
|
|
449
449
|
sendRpcUrl = resolveRpcUrl(sendEntry);
|
|
450
450
|
return [
|
|
@@ -552,7 +552,7 @@ var useEthereumProvider = function useEthereumProvider(wallet) {
|
|
|
552
552
|
});
|
|
553
553
|
rpcUrl = defaultEntry ? resolveRpcUrl(defaultEntry) : void 0;
|
|
554
554
|
if (!rpcUrl) {
|
|
555
|
-
throw new Error("Unsupported method: ".concat(method, ". No RPC configured for chain ID ").concat(currentChainId, ". Please configure 'chains' (and optionally 'defaultChain') in
|
|
555
|
+
throw new Error("Unsupported method: ".concat(method, ". No RPC configured for chain ID ").concat(currentChainId, ". Please configure 'chains' (and optionally 'defaultChain') in MoonXProvider."));
|
|
556
556
|
}
|
|
557
557
|
_state.label = 17;
|
|
558
558
|
case 17:
|
|
@@ -1300,7 +1300,7 @@ var useSign7702Authorization = function useSign7702Authorization() {
|
|
|
1300
1300
|
defaultSelector: (_coreSDK_config1 = coreSDK.config) === null || _coreSDK_config1 === void 0 ? void 0 : _coreSDK_config1.defaultChain
|
|
1301
1301
|
});
|
|
1302
1302
|
if (!targetEntry) {
|
|
1303
|
-
throw new Error(chain != null ? 'chain "'.concat(chain, '" is not in the configured chains.') : "No chain configured. Please set `chains` (and optionally `defaultChain`) in
|
|
1303
|
+
throw new Error(chain != null ? 'chain "'.concat(chain, '" is not in the configured chains.') : "No chain configured. Please set `chains` (and optionally `defaultChain`) in MoonXProvider config.");
|
|
1304
1304
|
}
|
|
1305
1305
|
derivedChainId = targetEntry.chain.id;
|
|
1306
1306
|
_state.label = 1;
|
|
@@ -1451,7 +1451,7 @@ var useGetBalance = function useGetBalance() {
|
|
|
1451
1451
|
}
|
|
1452
1452
|
rpcUrl = (_params_rpcUrl = params.rpcUrl) !== null && _params_rpcUrl !== void 0 ? _params_rpcUrl : entry ? resolveRpcUrl2(entry) : void 0;
|
|
1453
1453
|
if (!rpcUrl) {
|
|
1454
|
-
throw new Error("No RPC URL \u2014 set `chains` (and optionally `defaultChain`) in
|
|
1454
|
+
throw new Error("No RPC URL \u2014 set `chains` (and optionally `defaultChain`) in MoonXProvider config, or pass an `rpcUrl`.");
|
|
1455
1455
|
}
|
|
1456
1456
|
return [
|
|
1457
1457
|
4,
|
|
@@ -521,7 +521,7 @@ var useEthereumProvider = function useEthereumProvider(wallet) {
|
|
|
521
521
|
])
|
|
522
522
|
});
|
|
523
523
|
if (!sendEntry) {
|
|
524
|
-
throw new Error(requestedSendChainId != null ? "Transaction targets chainId ".concat(requestedSendChainId, ", which is not in the configured chains.") : "No chain configured. Please set `chains` (and optionally `defaultChain`) in
|
|
524
|
+
throw new Error(requestedSendChainId != null ? "Transaction targets chainId ".concat(requestedSendChainId, ", which is not in the configured chains.") : "No chain configured. Please set `chains` (and optionally `defaultChain`) in MoonXProvider config.");
|
|
525
525
|
}
|
|
526
526
|
sendRpcUrl = _lib.resolveRpcUrl.call(void 0, sendEntry);
|
|
527
527
|
return [
|
|
@@ -649,7 +649,7 @@ var useEthereumProvider = function useEthereumProvider(wallet) {
|
|
|
649
649
|
});
|
|
650
650
|
rpcUrl = defaultEntry ? _lib.resolveRpcUrl.call(void 0, defaultEntry) : void 0;
|
|
651
651
|
if (!rpcUrl) {
|
|
652
|
-
throw new Error("Unsupported method: ".concat(method, ". No RPC configured for chain ID ").concat(currentChainId, ". Please configure 'chains' (and optionally 'defaultChain') in
|
|
652
|
+
throw new Error("Unsupported method: ".concat(method, ". No RPC configured for chain ID ").concat(currentChainId, ". Please configure 'chains' (and optionally 'defaultChain') in MoonXProvider."));
|
|
653
653
|
}
|
|
654
654
|
_state.label = 17;
|
|
655
655
|
case 17:
|
|
@@ -1607,7 +1607,7 @@ var useSign7702Authorization = function useSign7702Authorization() {
|
|
|
1607
1607
|
])
|
|
1608
1608
|
});
|
|
1609
1609
|
if (!targetEntry) {
|
|
1610
|
-
throw new Error(chain != null ? 'chain "'.concat(chain, '" is not in the configured chains.') : "No chain configured. Please set `chains` (and optionally `defaultChain`) in
|
|
1610
|
+
throw new Error(chain != null ? 'chain "'.concat(chain, '" is not in the configured chains.') : "No chain configured. Please set `chains` (and optionally `defaultChain`) in MoonXProvider config.");
|
|
1611
1611
|
}
|
|
1612
1612
|
derivedChainId = targetEntry.chain.id;
|
|
1613
1613
|
_state.label = 1;
|
|
@@ -1852,7 +1852,7 @@ var useGetBalance = function useGetBalance() {
|
|
|
1852
1852
|
return entry ? _lib.resolveRpcUrl.call(void 0, entry) : void 0;
|
|
1853
1853
|
});
|
|
1854
1854
|
if (!rpcUrl) {
|
|
1855
|
-
throw new Error("No RPC URL \u2014 set `chains` (and optionally `defaultChain`) in
|
|
1855
|
+
throw new Error("No RPC URL \u2014 set `chains` (and optionally `defaultChain`) in MoonXProvider config, or pass an `rpcUrl`.");
|
|
1856
1856
|
}
|
|
1857
1857
|
return [
|
|
1858
1858
|
4,
|
|
@@ -434,7 +434,7 @@ var useSendTransaction = function useSendTransaction() {
|
|
|
434
434
|
rpcUrl = (_params_rpcUrl = params.rpcUrl) !== null && _params_rpcUrl !== void 0 ? _params_rpcUrl : entry ? resolveRpcUrl(entry) : void 0;
|
|
435
435
|
wsEndpoint = entry ? resolveWsUrl(entry) : void 0;
|
|
436
436
|
if (!rpcUrl) {
|
|
437
|
-
throw new Error('No RPC URL for chain "'.concat(chain, '". Add it to `chains` in
|
|
437
|
+
throw new Error('No RPC URL for chain "'.concat(chain, '". Add it to `chains` in MoonXProvider config, or pass an `rpcUrl`.'));
|
|
438
438
|
}
|
|
439
439
|
return [
|
|
440
440
|
4,
|
|
@@ -501,7 +501,7 @@ var useGetBalance = function useGetBalance() {
|
|
|
501
501
|
rpcUrl = (_params_rpcUrl = params.rpcUrl) !== null && _params_rpcUrl !== void 0 ? _params_rpcUrl : entry ? resolveRpcUrl(entry) : void 0;
|
|
502
502
|
wsEndpoint = entry ? resolveWsUrl(entry) : void 0;
|
|
503
503
|
if (!rpcUrl) {
|
|
504
|
-
throw new Error('No RPC URL for chain "'.concat(chain, '". Add it to `chains` in
|
|
504
|
+
throw new Error('No RPC URL for chain "'.concat(chain, '". Add it to `chains` in MoonXProvider config, or pass an `rpcUrl`.'));
|
|
505
505
|
}
|
|
506
506
|
return [
|
|
507
507
|
4,
|
|
@@ -554,7 +554,7 @@ var useGetTokenAccounts = function useGetTokenAccounts() {
|
|
|
554
554
|
rpcUrl = (_params_rpcUrl = params.rpcUrl) !== null && _params_rpcUrl !== void 0 ? _params_rpcUrl : entry ? resolveRpcUrl(entry) : void 0;
|
|
555
555
|
wsEndpoint = entry ? resolveWsUrl(entry) : void 0;
|
|
556
556
|
if (!rpcUrl) {
|
|
557
|
-
throw new Error('No RPC URL for chain "'.concat(chain, '". Add it to `chains` in
|
|
557
|
+
throw new Error('No RPC URL for chain "'.concat(chain, '". Add it to `chains` in MoonXProvider config, or pass an `rpcUrl`.'));
|
|
558
558
|
}
|
|
559
559
|
return [
|
|
560
560
|
4,
|
|
@@ -648,7 +648,7 @@ var useSendTransaction = function useSendTransaction() {
|
|
|
648
648
|
});
|
|
649
649
|
wsEndpoint = entry ? _lib.resolveWsUrl.call(void 0, entry) : void 0;
|
|
650
650
|
if (!rpcUrl) {
|
|
651
|
-
throw new Error('No RPC URL for chain "'.concat(chain, '". Add it to `chains` in
|
|
651
|
+
throw new Error('No RPC URL for chain "'.concat(chain, '". Add it to `chains` in MoonXProvider config, or pass an `rpcUrl`.'));
|
|
652
652
|
}
|
|
653
653
|
return [
|
|
654
654
|
4,
|
|
@@ -773,7 +773,7 @@ var useGetBalance = function useGetBalance() {
|
|
|
773
773
|
});
|
|
774
774
|
wsEndpoint = entry ? _lib.resolveWsUrl.call(void 0, entry) : void 0;
|
|
775
775
|
if (!rpcUrl) {
|
|
776
|
-
throw new Error('No RPC URL for chain "'.concat(chain, '". Add it to `chains` in
|
|
776
|
+
throw new Error('No RPC URL for chain "'.concat(chain, '". Add it to `chains` in MoonXProvider config, or pass an `rpcUrl`.'));
|
|
777
777
|
}
|
|
778
778
|
return [
|
|
779
779
|
4,
|
|
@@ -858,7 +858,7 @@ var useGetTokenAccounts = function useGetTokenAccounts() {
|
|
|
858
858
|
});
|
|
859
859
|
wsEndpoint = entry ? _lib.resolveWsUrl.call(void 0, entry) : void 0;
|
|
860
860
|
if (!rpcUrl) {
|
|
861
|
-
throw new Error('No RPC URL for chain "'.concat(chain, '". Add it to `chains` in
|
|
861
|
+
throw new Error('No RPC URL for chain "'.concat(chain, '". Add it to `chains` in MoonXProvider config, or pass an `rpcUrl`.'));
|
|
862
862
|
}
|
|
863
863
|
return [
|
|
864
864
|
4,
|
package/dist/index.css
CHANGED
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
font-display: swap;
|
|
57
57
|
}
|
|
58
58
|
:root {
|
|
59
|
-
--
|
|
59
|
+
--moonx-font-family:
|
|
60
60
|
"Sons",
|
|
61
61
|
-apple-system,
|
|
62
62
|
BlinkMacSystemFont,
|
|
@@ -69,55 +69,55 @@
|
|
|
69
69
|
"Droid Sans",
|
|
70
70
|
"Helvetica Neue",
|
|
71
71
|
sans-serif;
|
|
72
|
-
--
|
|
73
|
-
--
|
|
74
|
-
--
|
|
75
|
-
--
|
|
76
|
-
--
|
|
77
|
-
--
|
|
78
|
-
--
|
|
79
|
-
--
|
|
80
|
-
--
|
|
81
|
-
--
|
|
82
|
-
--
|
|
83
|
-
--
|
|
84
|
-
--
|
|
85
|
-
--
|
|
86
|
-
--
|
|
87
|
-
--
|
|
88
|
-
--
|
|
89
|
-
--
|
|
90
|
-
--
|
|
91
|
-
--
|
|
92
|
-
--
|
|
93
|
-
--
|
|
94
|
-
--
|
|
95
|
-
--
|
|
96
|
-
}
|
|
97
|
-
.
|
|
98
|
-
animation:
|
|
99
|
-
}
|
|
100
|
-
.
|
|
72
|
+
--moonx-border-radius-sm: 0.375rem;
|
|
73
|
+
--moonx-border-radius-md: 0.5rem;
|
|
74
|
+
--moonx-border-radius-lg: 0.75rem;
|
|
75
|
+
--moonx-border-radius-full: 9999px;
|
|
76
|
+
--moonx-color-background: #ffffff;
|
|
77
|
+
--moonx-color-background-2: #f9fafb;
|
|
78
|
+
--moonx-color-background-3: #f3f4f6;
|
|
79
|
+
--moonx-color-foreground: #111827;
|
|
80
|
+
--moonx-color-foreground-2: #374151;
|
|
81
|
+
--moonx-color-foreground-3: #6b7280;
|
|
82
|
+
--moonx-color-foreground-4: #9ca3af;
|
|
83
|
+
--moonx-color-foreground-accent: #4f46e5;
|
|
84
|
+
--moonx-color-accent: #6366f1;
|
|
85
|
+
--moonx-color-accent-foreground: #ffffff;
|
|
86
|
+
--moonx-color-accent-light: #818cf8;
|
|
87
|
+
--moonx-color-accent-lightest: #c7d2fe;
|
|
88
|
+
--moonx-color-accent-dark: #4338ca;
|
|
89
|
+
--moonx-color-accent-darkest: #3730a3;
|
|
90
|
+
--moonx-color-success: #10b981;
|
|
91
|
+
--moonx-color-success-foreground: #ffffff;
|
|
92
|
+
--moonx-color-error: #ef4444;
|
|
93
|
+
--moonx-color-error-foreground: #ffffff;
|
|
94
|
+
--moonx-color-error-light: #fca5a5;
|
|
95
|
+
--moonx-color-border: #e5e7eb;
|
|
96
|
+
}
|
|
97
|
+
.moonx-animate-in {
|
|
98
|
+
animation: moonx-enter 0.2s ease-out;
|
|
99
|
+
}
|
|
100
|
+
.moonx-fade-in-0 {
|
|
101
101
|
--tw-enter-opacity: initial;
|
|
102
102
|
--tw-enter-scale: initial;
|
|
103
103
|
--tw-enter-rotate: initial;
|
|
104
104
|
--tw-enter-translate-x: initial;
|
|
105
105
|
--tw-enter-translate-y: initial;
|
|
106
106
|
}
|
|
107
|
-
.
|
|
107
|
+
.moonx-zoom-in-95 {
|
|
108
108
|
--tw-enter-scale: .95;
|
|
109
109
|
}
|
|
110
|
-
.
|
|
110
|
+
.moonx-duration-200 {
|
|
111
111
|
animation-duration: 0.2s;
|
|
112
112
|
}
|
|
113
|
-
.
|
|
113
|
+
.moonx-center-y {
|
|
114
114
|
top: 50%;
|
|
115
115
|
transform: translateY(-50%);
|
|
116
116
|
}
|
|
117
|
-
.
|
|
118
|
-
animation:
|
|
117
|
+
.moonx-animate-spin {
|
|
118
|
+
animation: moonx-spin 1s linear infinite;
|
|
119
119
|
}
|
|
120
|
-
.
|
|
120
|
+
.moonx-modal-overlay {
|
|
121
121
|
position: fixed;
|
|
122
122
|
top: 0;
|
|
123
123
|
left: 0;
|
|
@@ -125,11 +125,11 @@
|
|
|
125
125
|
bottom: 0;
|
|
126
126
|
width: 100vw;
|
|
127
127
|
height: 100vh;
|
|
128
|
-
background-color: var(--
|
|
128
|
+
background-color: var(--moonx-color-background-3);
|
|
129
129
|
backdrop-filter: blur(4px);
|
|
130
130
|
z-index: 50;
|
|
131
131
|
}
|
|
132
|
-
.
|
|
132
|
+
.moonx-modal-container {
|
|
133
133
|
position: fixed;
|
|
134
134
|
top: 0;
|
|
135
135
|
left: 0;
|
|
@@ -143,23 +143,23 @@
|
|
|
143
143
|
padding: 1rem;
|
|
144
144
|
z-index: 51;
|
|
145
145
|
}
|
|
146
|
-
.
|
|
146
|
+
.moonx-input::placeholder {
|
|
147
147
|
opacity: 0.3;
|
|
148
148
|
}
|
|
149
|
-
.
|
|
149
|
+
.moonx-scrollbar-none {
|
|
150
150
|
scrollbar-width: none;
|
|
151
151
|
-ms-overflow-style: none;
|
|
152
152
|
}
|
|
153
|
-
.
|
|
153
|
+
.moonx-scrollbar-none::-webkit-scrollbar {
|
|
154
154
|
display: none;
|
|
155
155
|
}
|
|
156
|
-
@keyframes
|
|
156
|
+
@keyframes moonx-enter {
|
|
157
157
|
from {
|
|
158
158
|
opacity: 0;
|
|
159
159
|
transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0));
|
|
160
160
|
}
|
|
161
161
|
}
|
|
162
|
-
@keyframes
|
|
162
|
+
@keyframes moonx-spin {
|
|
163
163
|
from {
|
|
164
164
|
transform: rotate(0deg);
|
|
165
165
|
}
|
package/dist/index.d.mts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export { LoginWithEmailState, PasskeyStatusEntry, RegisterPasskeyResult, UseAddPasskeyResult, UseEphemeralSignerResult, UseLoginWithEmailCallbacks, UsePasskeyStatusResult, UseRemovePasskeyResult, useAddPasskey, useEphemeralSigner, useLoginWithEmail, usePasskeyStatus, useRegisterPasskey, useRemovePasskey, useUser } from '@moon-x/core/react';
|
|
2
|
-
import { WalletListEntry, AuthAppearance, PrefillConfig, WalletChainType, PasskeyEnrollConfig, SignMessageConfig, ExportKeyConfig, SignTransactionConfig, SendTransactionConfig, ChainConfigItem,
|
|
2
|
+
import { WalletListEntry, LogoutResponse, EmailOtpFlowState, AuthAppearance, SendEmailOtpResponse, PrefillConfig, WalletChainType, PasskeyEnrollConfig, SignMessageConfig, ExportKeyConfig, SignTransactionConfig, SendTransactionConfig, ChainConfigItem, Wallet, FlexibleTheme, DisplayMode, AppearanceModeTokens } from '@moon-x/core/types';
|
|
3
3
|
export { AppearanceBackdrop, AppearanceBorderRadius, AppearanceCard, AppearanceColors, AppearanceComponents, AppearanceLogo, AppearanceModeTokens, AppearanceTypography, AuthAppearance, Chain, ChainConfigItem, ChainEntry, ComponentStyle, DisplayMode, EphemeralSigner, EphemeralSignerChain, EphemeralSignerScheme, EphemeralSignerWallet, EvmChainEntry, Factor, IdpProvider, ListEphemeralSignersResult, Network, ProvisionEphemeralSignerParams, ProvisionEphemeralSignerResult, PublicEthereumWallet, PublicWallet, RevokeEphemeralSignerParams, SolanaChainEntry, WalletConnectConfig, WalletListEntry } from '@moon-x/core/types';
|
|
4
4
|
import React$1, { ReactNode } from 'react';
|
|
5
5
|
export { e as ethereum } from './ethereum-lovLlqC2.mjs';
|
|
@@ -116,7 +116,7 @@ interface UseLoginWithOAuth {
|
|
|
116
116
|
}
|
|
117
117
|
declare function useLoginWithOAuth(options?: UseLoginWithOAuthCallbacks): UseLoginWithOAuth;
|
|
118
118
|
|
|
119
|
-
interface
|
|
119
|
+
interface MoonXConfig {
|
|
120
120
|
appearance?: AuthAppearance;
|
|
121
121
|
loginMethods?: ("email" | "google" | "apple" | "wallet")[];
|
|
122
122
|
/**
|
|
@@ -162,9 +162,9 @@ interface MoonKeyConfig {
|
|
|
162
162
|
*/
|
|
163
163
|
defaultChain?: string | number;
|
|
164
164
|
}
|
|
165
|
-
interface
|
|
165
|
+
interface MoonXProviderProps$1 {
|
|
166
166
|
publishableKey: string;
|
|
167
|
-
config?:
|
|
167
|
+
config?: MoonXConfig;
|
|
168
168
|
children: React.ReactNode;
|
|
169
169
|
onClose?: () => void;
|
|
170
170
|
}
|
|
@@ -248,7 +248,7 @@ interface MoonKeyInstance {
|
|
|
248
248
|
* Dynamically update the appearance configuration
|
|
249
249
|
* @param appearance - Appearance configuration including displayMode, backgroundColor, and accentColor
|
|
250
250
|
* @example
|
|
251
|
-
* const { setAppearance } =
|
|
251
|
+
* const { setAppearance } = useMoonX();
|
|
252
252
|
* const colorScheme = useColorScheme(); // React Native
|
|
253
253
|
* setAppearance({ displayMode: colorScheme === 'dark' ? 'dark' : 'light' });
|
|
254
254
|
*/
|
|
@@ -279,7 +279,7 @@ interface WalletConfig {
|
|
|
279
279
|
}
|
|
280
280
|
type WalletType = "solana" | "ethereum";
|
|
281
281
|
|
|
282
|
-
declare const
|
|
282
|
+
declare const useMoonX: () => MoonKeyInstance;
|
|
283
283
|
|
|
284
284
|
interface UseOAuthCompletionOptions {
|
|
285
285
|
onSuccess?: (data: any) => void;
|
|
@@ -287,13 +287,13 @@ interface UseOAuthCompletionOptions {
|
|
|
287
287
|
}
|
|
288
288
|
declare function useOAuthCompletion(options?: UseOAuthCompletionOptions): void;
|
|
289
289
|
|
|
290
|
-
interface
|
|
290
|
+
interface MoonXProviderProps {
|
|
291
291
|
publishableKey: string;
|
|
292
292
|
embeddableId?: string;
|
|
293
|
-
config?:
|
|
293
|
+
config?: MoonXConfig;
|
|
294
294
|
children: ReactNode;
|
|
295
295
|
}
|
|
296
|
-
declare const
|
|
296
|
+
declare const MoonXProvider: React$1.FC<MoonXProviderProps>;
|
|
297
297
|
|
|
298
298
|
/**
|
|
299
299
|
* MoonKey Theme - matches CSS variables from styles.css:66-95
|
|
@@ -380,7 +380,7 @@ declare function resolveLogo(logo: AuthAppearance["logo"], isDark: boolean): {
|
|
|
380
380
|
align?: "left" | "center";
|
|
381
381
|
} | undefined;
|
|
382
382
|
/**
|
|
383
|
-
* Derives the `--
|
|
383
|
+
* Derives the `--moonx-*` palette (colors / radius / font) from an
|
|
384
384
|
* AuthAppearance. Used by ScopedContainer so the SDK owns its own derivation.
|
|
385
385
|
*
|
|
386
386
|
* Merge priority (lowest → highest): accent/background derivations →
|
|
@@ -391,7 +391,7 @@ declare function appearanceToTheme(appearance: AuthAppearance | undefined, isDar
|
|
|
391
391
|
* Derives the newer `--moonx-*` CSS variables (warning/info/link/ring colors,
|
|
392
392
|
* granular radii, typography scale, card and backdrop tokens) from an
|
|
393
393
|
* {@link AuthAppearance}. Only explicitly-set tokens are emitted, so components
|
|
394
|
-
* fall back to their `--
|
|
394
|
+
* fall back to their `--moonx-*` defaults via CSS `var(..., fallback)` when
|
|
395
395
|
* unset.
|
|
396
396
|
*/
|
|
397
397
|
declare function appearanceToMoonxVars(appearance: AuthAppearance | undefined, isDark: boolean): Record<string, string>;
|
|
@@ -410,7 +410,7 @@ declare function resolveFontUrls(appearance: AuthAppearance | undefined): string
|
|
|
410
410
|
/**
|
|
411
411
|
* Resolve an {@link AuthAppearance} into the full flat CSS-variable map for
|
|
412
412
|
* surfaces that paint the appearance onto their own root (e.g. the demo applying
|
|
413
|
-
* it to `<html>`): the base light/dark `--
|
|
413
|
+
* it to `<html>`): the base light/dark `--moonx-*` palette merged with the
|
|
414
414
|
* appearance derivations, plus the granular `--moonx-*` tokens and per-component
|
|
415
415
|
* overrides.
|
|
416
416
|
*
|
|
@@ -441,4 +441,4 @@ declare const getReconnectionInfo: (error: any) => {
|
|
|
441
441
|
walletAddress?: string;
|
|
442
442
|
} | null;
|
|
443
443
|
|
|
444
|
-
export { type AttachOAuthState, type BaseConnectedEthereumWallet, type BaseConnectedSolanaWallet, type ConnectWalletCallbacks, type ConnectWalletParams, type DetachOAuthResult, type DetachOAuthState, type
|
|
444
|
+
export { type AttachOAuthState, type BaseConnectedEthereumWallet, type BaseConnectedSolanaWallet, type ConnectWalletCallbacks, type ConnectWalletParams, type DetachOAuthResult, type DetachOAuthState, type MoonKeyInstance, type MoonKeyTheme, type MoonXConfig, MoonXProvider, type MoonXProviderProps$1 as MoonXProviderProps, type OAuthAttachResult, type OAuthProvider, type OAuthState, type OAuthUser, SessionExpiredError, SessionNotFoundError, type UseAttachOAuth, type UseAttachOAuthCallbacks, type UseConnectWallet, type UseDetachOAuth, type UseDetachOAuthCallbacks, type UseLoginWithOAuth, type UseLoginWithOAuthCallbacks, type WalletConfig, type WalletInstance, type WalletType, appearanceToComponentVars, appearanceToCssVars, appearanceToMoonxVars, appearanceToTheme, darkTheme, definedOnly, getReconnectionInfo, isColorDark, isDarkAppearance, isDarkMode, lightTheme, requiresReconnection, resolveAppearanceTokens, resolveFontUrls, resolveLogo, themeToCSS, useAttachOAuth, useConnectWallet, useDetachOAuth, useLoginWithOAuth, useMoonX, useOAuthCompletion };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export { LoginWithEmailState, PasskeyStatusEntry, RegisterPasskeyResult, UseAddPasskeyResult, UseEphemeralSignerResult, UseLoginWithEmailCallbacks, UsePasskeyStatusResult, UseRemovePasskeyResult, useAddPasskey, useEphemeralSigner, useLoginWithEmail, usePasskeyStatus, useRegisterPasskey, useRemovePasskey, useUser } from '@moon-x/core/react';
|
|
2
|
-
import { WalletListEntry, AuthAppearance, PrefillConfig, WalletChainType, PasskeyEnrollConfig, SignMessageConfig, ExportKeyConfig, SignTransactionConfig, SendTransactionConfig, ChainConfigItem,
|
|
2
|
+
import { WalletListEntry, LogoutResponse, EmailOtpFlowState, AuthAppearance, SendEmailOtpResponse, PrefillConfig, WalletChainType, PasskeyEnrollConfig, SignMessageConfig, ExportKeyConfig, SignTransactionConfig, SendTransactionConfig, ChainConfigItem, Wallet, FlexibleTheme, DisplayMode, AppearanceModeTokens } from '@moon-x/core/types';
|
|
3
3
|
export { AppearanceBackdrop, AppearanceBorderRadius, AppearanceCard, AppearanceColors, AppearanceComponents, AppearanceLogo, AppearanceModeTokens, AppearanceTypography, AuthAppearance, Chain, ChainConfigItem, ChainEntry, ComponentStyle, DisplayMode, EphemeralSigner, EphemeralSignerChain, EphemeralSignerScheme, EphemeralSignerWallet, EvmChainEntry, Factor, IdpProvider, ListEphemeralSignersResult, Network, ProvisionEphemeralSignerParams, ProvisionEphemeralSignerResult, PublicEthereumWallet, PublicWallet, RevokeEphemeralSignerParams, SolanaChainEntry, WalletConnectConfig, WalletListEntry } from '@moon-x/core/types';
|
|
4
4
|
import React$1, { ReactNode } from 'react';
|
|
5
5
|
export { e as ethereum } from './ethereum-Eg3cJKce.js';
|
|
@@ -116,7 +116,7 @@ interface UseLoginWithOAuth {
|
|
|
116
116
|
}
|
|
117
117
|
declare function useLoginWithOAuth(options?: UseLoginWithOAuthCallbacks): UseLoginWithOAuth;
|
|
118
118
|
|
|
119
|
-
interface
|
|
119
|
+
interface MoonXConfig {
|
|
120
120
|
appearance?: AuthAppearance;
|
|
121
121
|
loginMethods?: ("email" | "google" | "apple" | "wallet")[];
|
|
122
122
|
/**
|
|
@@ -162,9 +162,9 @@ interface MoonKeyConfig {
|
|
|
162
162
|
*/
|
|
163
163
|
defaultChain?: string | number;
|
|
164
164
|
}
|
|
165
|
-
interface
|
|
165
|
+
interface MoonXProviderProps$1 {
|
|
166
166
|
publishableKey: string;
|
|
167
|
-
config?:
|
|
167
|
+
config?: MoonXConfig;
|
|
168
168
|
children: React.ReactNode;
|
|
169
169
|
onClose?: () => void;
|
|
170
170
|
}
|
|
@@ -248,7 +248,7 @@ interface MoonKeyInstance {
|
|
|
248
248
|
* Dynamically update the appearance configuration
|
|
249
249
|
* @param appearance - Appearance configuration including displayMode, backgroundColor, and accentColor
|
|
250
250
|
* @example
|
|
251
|
-
* const { setAppearance } =
|
|
251
|
+
* const { setAppearance } = useMoonX();
|
|
252
252
|
* const colorScheme = useColorScheme(); // React Native
|
|
253
253
|
* setAppearance({ displayMode: colorScheme === 'dark' ? 'dark' : 'light' });
|
|
254
254
|
*/
|
|
@@ -279,7 +279,7 @@ interface WalletConfig {
|
|
|
279
279
|
}
|
|
280
280
|
type WalletType = "solana" | "ethereum";
|
|
281
281
|
|
|
282
|
-
declare const
|
|
282
|
+
declare const useMoonX: () => MoonKeyInstance;
|
|
283
283
|
|
|
284
284
|
interface UseOAuthCompletionOptions {
|
|
285
285
|
onSuccess?: (data: any) => void;
|
|
@@ -287,13 +287,13 @@ interface UseOAuthCompletionOptions {
|
|
|
287
287
|
}
|
|
288
288
|
declare function useOAuthCompletion(options?: UseOAuthCompletionOptions): void;
|
|
289
289
|
|
|
290
|
-
interface
|
|
290
|
+
interface MoonXProviderProps {
|
|
291
291
|
publishableKey: string;
|
|
292
292
|
embeddableId?: string;
|
|
293
|
-
config?:
|
|
293
|
+
config?: MoonXConfig;
|
|
294
294
|
children: ReactNode;
|
|
295
295
|
}
|
|
296
|
-
declare const
|
|
296
|
+
declare const MoonXProvider: React$1.FC<MoonXProviderProps>;
|
|
297
297
|
|
|
298
298
|
/**
|
|
299
299
|
* MoonKey Theme - matches CSS variables from styles.css:66-95
|
|
@@ -380,7 +380,7 @@ declare function resolveLogo(logo: AuthAppearance["logo"], isDark: boolean): {
|
|
|
380
380
|
align?: "left" | "center";
|
|
381
381
|
} | undefined;
|
|
382
382
|
/**
|
|
383
|
-
* Derives the `--
|
|
383
|
+
* Derives the `--moonx-*` palette (colors / radius / font) from an
|
|
384
384
|
* AuthAppearance. Used by ScopedContainer so the SDK owns its own derivation.
|
|
385
385
|
*
|
|
386
386
|
* Merge priority (lowest → highest): accent/background derivations →
|
|
@@ -391,7 +391,7 @@ declare function appearanceToTheme(appearance: AuthAppearance | undefined, isDar
|
|
|
391
391
|
* Derives the newer `--moonx-*` CSS variables (warning/info/link/ring colors,
|
|
392
392
|
* granular radii, typography scale, card and backdrop tokens) from an
|
|
393
393
|
* {@link AuthAppearance}. Only explicitly-set tokens are emitted, so components
|
|
394
|
-
* fall back to their `--
|
|
394
|
+
* fall back to their `--moonx-*` defaults via CSS `var(..., fallback)` when
|
|
395
395
|
* unset.
|
|
396
396
|
*/
|
|
397
397
|
declare function appearanceToMoonxVars(appearance: AuthAppearance | undefined, isDark: boolean): Record<string, string>;
|
|
@@ -410,7 +410,7 @@ declare function resolveFontUrls(appearance: AuthAppearance | undefined): string
|
|
|
410
410
|
/**
|
|
411
411
|
* Resolve an {@link AuthAppearance} into the full flat CSS-variable map for
|
|
412
412
|
* surfaces that paint the appearance onto their own root (e.g. the demo applying
|
|
413
|
-
* it to `<html>`): the base light/dark `--
|
|
413
|
+
* it to `<html>`): the base light/dark `--moonx-*` palette merged with the
|
|
414
414
|
* appearance derivations, plus the granular `--moonx-*` tokens and per-component
|
|
415
415
|
* overrides.
|
|
416
416
|
*
|
|
@@ -441,4 +441,4 @@ declare const getReconnectionInfo: (error: any) => {
|
|
|
441
441
|
walletAddress?: string;
|
|
442
442
|
} | null;
|
|
443
443
|
|
|
444
|
-
export { type AttachOAuthState, type BaseConnectedEthereumWallet, type BaseConnectedSolanaWallet, type ConnectWalletCallbacks, type ConnectWalletParams, type DetachOAuthResult, type DetachOAuthState, type
|
|
444
|
+
export { type AttachOAuthState, type BaseConnectedEthereumWallet, type BaseConnectedSolanaWallet, type ConnectWalletCallbacks, type ConnectWalletParams, type DetachOAuthResult, type DetachOAuthState, type MoonKeyInstance, type MoonKeyTheme, type MoonXConfig, MoonXProvider, type MoonXProviderProps$1 as MoonXProviderProps, type OAuthAttachResult, type OAuthProvider, type OAuthState, type OAuthUser, SessionExpiredError, SessionNotFoundError, type UseAttachOAuth, type UseAttachOAuthCallbacks, type UseConnectWallet, type UseDetachOAuth, type UseDetachOAuthCallbacks, type UseLoginWithOAuth, type UseLoginWithOAuthCallbacks, type WalletConfig, type WalletInstance, type WalletType, appearanceToComponentVars, appearanceToCssVars, appearanceToMoonxVars, appearanceToTheme, darkTheme, definedOnly, getReconnectionInfo, isColorDark, isDarkAppearance, isDarkMode, lightTheme, requiresReconnection, resolveAppearanceTokens, resolveFontUrls, resolveLogo, themeToCSS, useAttachOAuth, useConnectWallet, useDetachOAuth, useLoginWithOAuth, useMoonX, useOAuthCompletion };
|