@tuwaio/satellite-react 0.4.10 → 0.6.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 CHANGED
@@ -1,148 +1,103 @@
1
- # Satellite Connect React
1
+ # @tuwaio/satellite-react
2
2
 
3
3
  [![NPM Version](https://img.shields.io/npm/v/@tuwaio/satellite-react.svg)](https://www.npmjs.com/package/@tuwaio/satellite-react)
4
- [![License](https://img.shields.io/npm/l/@tuwaio/satellite-react.svg)](./LICENSE)
5
- [![Build Status](https://img.shields.io/github/actions/workflow/status/TuwaIO/satellite-connect/release.yml?branch=main)](https://github.com/TuwaIO/satellite-connect/actions)
4
+ [![License](https://img.shields.io/npm/l/@tuwaio/satellite-react.svg)](https://github.com/TuwaIO/satellite-connect/blob/main/packages/satellite-react/LICENSE)
6
5
 
7
- React state hooks and context providers for orchestrating framework-agnostic Satellite wallet connector instances.
6
+ `@tuwaio/satellite-react` is the React Layer 4 (L4) package of **Satellite Connect**, the wallet connection project of TUWA Stage 2 ("State & Connection", next to Pulsar). Built on **`react`**, **`zustand`** and [`@tuwaio/satellite-core`](https://satellite.docs.tuwa.io/packages/satellite-core), it provides a provider that creates the connection store, a hook to read it in components, and one headless watcher component per chain that keeps the store in sync with the wallets. It has no UI components: wallet modals and buttons live in Nova Connect.
8
7
 
9
8
  ---
10
9
 
11
- ## 🏛️ What is `@tuwaio/satellite-react`?
10
+ ## 🏛️ Core Capabilities
12
11
 
13
- `@tuwaio/satellite-react` provides the React integration layer for the Satellite framework. It exposes optimized state hooks and context providers to orchestrate and watch framework-agnostic Satellite wallet connector instances.
14
-
15
- By mapping underlying Zustand store mutations to React's rendering lifecycle, it enables developers to maintain a synchronized, multi-chain connection state.
16
-
17
- Built on top of `@tuwaio/satellite-core`, this package offers a seamless developer experience for React applications requiring Web3 wallet integration.
12
+ - **Provider:** `SatelliteConnectProvider` creates the store once, passes later `adapter` and `callbackAfterConnected` changes to it, and runs `initializeAutoConnect` after mount, so the last connected wallet is restored in the browser.
13
+ - **Hook:** `useSatelliteConnectStore(selector)` reads a value from the store and re-renders when it changes. `SatelliteStoreContext` gives access to the store itself (`getState`, `subscribe`); it is shared on `globalThis`, so packages that bundle their own copy of `@tuwaio/satellite-react` see the same store.
14
+ - **Chain watchers:** `EVMConnectorsWatcher` (`/evm`) and `SolanaConnectorsWatcher` (`/solana`) render nothing. They load the watcher of their chain package after mount and copy account and chain changes made in the wallet into the store. With the `siwx` prop, for example the result of `useSiwxSession()` from [`@tuwaio/siwx-react`](https://siwx.docs.tuwa.io/packages/siwx-react), they disconnect the wallet when the sign-in is rejected or fails, or when the wallet moves to another account (or EVM chain) than the session. They restart only when a field of `siwx` changes, not when a new but equal object is passed.
15
+ - **Typed connections:** importing `/evm` or `/solana` adds the connection types of that chain to `AllConnections` and `AllConnectors`, so `activeConnection` is typed as `EVMConnection | SolanaConnection` in an app that imports both.
18
16
 
19
17
  ---
20
18
 
21
- ## ✨ Key Features
19
+ ## 💾 Installation
22
20
 
23
- - **Type Safety:** Full TypeScript support with proper type definitions
24
- - **Chain Agnostic:** Unified support for both EVM and Solana wallets
25
- - **Modern React:** Built with React 19+ features and best practices
26
- - **Multi-Chain Support:** Seamless integration with multiple blockchain networks
27
- - **State Management:** Zustand-based store for efficient state handling
21
+ The package has three entry points. Install the peer dependencies of the ones you import:
28
22
 
29
- ---
23
+ | Import path | Provides | Peer dependencies to install |
24
+ | -------------------------------- | ---------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------- |
25
+ | `@tuwaio/satellite-react` | `SatelliteConnectProvider`, `useSatelliteConnectStore`, context, types | `@tuwaio/satellite-core` (>=0.5), `react` (>=19.2.3), `zustand` (5.x) |
26
+ | `@tuwaio/satellite-react/evm` | `EVMConnectorsWatcher` | Also `@tuwaio/satellite-evm` (>=0.5), `@wagmi/core` (3.x) and `@tuwaio/orbit-core` (>=0.3) |
27
+ | `@tuwaio/satellite-react/solana` | `SolanaConnectorsWatcher` | Also `@tuwaio/satellite-solana` (>=0.5), `@wallet-standard/react` (1.x) and `@tuwaio/orbit-core` (>=0.3) |
30
28
 
31
- ## 💾 Installation
29
+ The `/evm` and `/solana` peer dependencies are optional, so an EVM-only app does not install Solana packages. The chain packages bring their own peer dependencies, and `@tuwaio/satellite-core` needs `@tuwaio/orbit-core` and `immer`:
32
30
 
33
- ### Requirements
31
+ ```bash
32
+ # @tuwaio/satellite-react
33
+ pnpm add @tuwaio/satellite-react @tuwaio/satellite-core @tuwaio/orbit-core react zustand immer
34
34
 
35
- - React 19+
36
- - Node.js 20-24
37
- - TypeScript 5.9+
35
+ # @tuwaio/satellite-react/evm
36
+ pnpm add @tuwaio/satellite-evm @tuwaio/orbit-evm @wagmi/core viem
38
37
 
39
- ```bash
40
- # Using pnpm (recommended), but you can use npm, yarn or bun as well
41
- pnpm add @tuwaio/satellite-react @tuwaio/satellite-core @tuwaio/orbit-core @wagmi/core @wallet-standard/react gill react immer zustand
38
+ # @tuwaio/satellite-react/solana
39
+ pnpm add @tuwaio/satellite-solana @tuwaio/orbit-solana @solana/kit @wallet-standard/react @wallet-standard/base @wallet-standard/features @wallet-standard/ui @wallet-standard/ui-registry @wallet-standard/app @wallet-standard/ui-core react-dom
42
40
  ```
43
41
 
44
42
  ---
45
43
 
46
- ## 🚀 Quick Start
44
+ ## 🚀 Usage
47
45
 
48
- ### Basic Setup
46
+ Render the provider and the watchers once, around your app:
49
47
 
50
48
  ```tsx
51
- import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
52
- import { satelliteEVMAdapter, createDefaultTransports } from '@tuwaio/satellite-evm';
53
- import { SatelliteConnectProvider } from '@tuwaio/satellite-react';
49
+ 'use client';
50
+
51
+ import { satelliteEVMAdapter } from '@tuwaio/satellite-evm';
52
+ import { SatelliteConnectProvider, useSatelliteConnectStore } from '@tuwaio/satellite-react';
54
53
  import { EVMConnectorsWatcher } from '@tuwaio/satellite-react/evm';
55
54
  import { SolanaConnectorsWatcher } from '@tuwaio/satellite-react/solana';
56
55
  import { satelliteSolanaAdapter } from '@tuwaio/satellite-solana';
57
- import { WagmiProvider } from 'wagmi';
58
- import { ReactNode } from 'react';
59
- import { createConfig } from '@wagmi/core';
60
- import { injected } from '@wagmi/connectors';
61
- import { mainnet, sepolia } from 'viem/chains';
62
- import type { Chain } from 'viem/chains';
63
-
64
- export const appEVMChains = [mainnet, sepolia] as readonly [Chain, ...Chain[]];
65
-
66
- export const wagmiConfig = createConfig({
67
- connectors: [injected()],
68
- transports: createDefaultTransports(appEVMChains), // Automatically creates http transports
69
- chains: appEVMChains,
70
- ssr: true, // Enable SSR support if needed (e.g., in Next.js)
71
- });
72
-
73
- export const solanaRPCUrls = {
74
- devnet: 'https://api.devnet.solana.com',
75
- };
76
-
77
- const queryClient = new QueryClient();
78
-
79
- export function Providers({ children }: { children: ReactNode }) {
80
- return (
81
- <WagmiProvider config={wagmiConfig}>
82
- <QueryClientProvider client={queryClient}>
83
- <SatelliteConnectProvider
84
- adapter={[satelliteEVMAdapter(wagmiConfig, appEVMChains), satelliteSolanaAdapter({ rpcUrls: solanaRPCUrls })]}
85
- autoConnect={true}
86
- >
87
- <EVMConnectorsWatcher wagmiConfig={wagmiConfig} />
88
- <SolanaConnectorsWatcher />
89
- {children}
90
- </SatelliteConnectProvider>
91
- </QueryClientProvider>
92
- </WagmiProvider>
93
- );
94
- }
95
- ```
96
-
97
- ### Using Hooks
98
-
99
- ```tsx
100
- import { useSatelliteConnectStore } from '@tuwaio/satellite-react';
101
-
102
- function ExampleGettingActiveWalletFromStore() {
103
- const activeConnection = useSatelliteConnectStore((state) => state.activeConnection);
104
- return <div>{activeConnection?.address}</div>;
105
- }
106
- ```
107
-
108
- ---
109
-
110
- ## 🔐 Sign-In With X (SIWX) Integration
111
-
112
- The `EVMConnectorsWatcher` and `SolanaConnectorsWatcher` components accept the `siwx` session state from `@tuwaio/siwx-react`. The watchers automatically monitor connection parity and disconnect the wallet if account switching occurs without a matching session, or if the user rejects signing:
113
-
114
- ```tsx
115
56
  import { useSiwxSession } from '@tuwaio/siwx-react';
116
- import { SatelliteConnectProvider } from '@tuwaio/satellite-react';
117
- import { EVMConnectorsWatcher } from '@tuwaio/satellite-react/evm';
118
- import { SolanaConnectorsWatcher } from '@tuwaio/satellite-react/solana';
57
+ import { createConfig, http, injected } from '@wagmi/core';
58
+ import type { ReactNode } from 'react';
59
+ import { mainnet } from 'viem/chains';
60
+
61
+ const appChains = [mainnet] as const;
62
+ const wagmiConfig = createConfig({ chains: appChains, connectors: [injected()], transports: { [mainnet.id]: http() } });
63
+ const adapters = [
64
+ satelliteEVMAdapter(wagmiConfig, appChains),
65
+ satelliteSolanaAdapter({ rpcUrls: { devnet: 'https://api.devnet.solana.com' } }),
66
+ ];
119
67
 
120
68
  export function Providers({ children }: { children: ReactNode }) {
121
- const siwxSession = useSiwxSession();
69
+ const siwxSession = useSiwxSession(); // optional: pass the SIWX session to the watchers
122
70
 
123
71
  return (
124
- <SatelliteConnectProvider
125
- adapter={[satelliteEVMAdapter(wagmiConfig, appEVMChains), satelliteSolanaAdapter({ rpcUrls: solanaRPCUrls })]}
126
- autoConnect={true}
127
- >
72
+ <SatelliteConnectProvider adapter={adapters} autoConnect>
128
73
  <EVMConnectorsWatcher wagmiConfig={wagmiConfig} siwx={siwxSession} />
129
74
  <SolanaConnectorsWatcher siwx={siwxSession} />
130
75
  {children}
131
76
  </SatelliteConnectProvider>
132
77
  );
133
78
  }
79
+
80
+ export function ActiveAddress() {
81
+ const activeConnection = useSatelliteConnectStore((state) => state.activeConnection);
82
+ const connecting = useSatelliteConnectStore((state) => state.connecting);
83
+ return <span>{connecting ? 'Connecting…' : (activeConnection?.address ?? 'Not connected')}</span>;
84
+ }
134
85
  ```
135
86
 
87
+ Connect a wallet with `useSatelliteConnectStore((state) => state.connect)`. Ready-made connect modals are in Nova Connect ([storybook](https://stories.tuwa.io/)), and a full-stack app with Nova Connect, SIWX and Pulsar is in the **[TUWA SDK documentation](https://sdk.docs.tuwa.io/full-stack)**.
88
+
136
89
  ---
137
90
 
138
- ## 🤝 Contributing & Support
91
+ ## 🗄️ Browser Storage
139
92
 
140
- Contributions are welcome! Please read our main **[Contribution Guidelines](https://github.com/TuwaIO/workflows/blob/main/CONTRIBUTING.md)**.
93
+ The provider's store saves the last connection and the recently connected wallets to `localStorage`, and removes the impersonated address, through `@tuwaio/orbit-core`. The keys, their content and when they change are listed on the [`@tuwaio/satellite-core`](https://satellite.docs.tuwa.io/packages/satellite-core) page. The store state itself is not persisted: server rendering and the first client render start with no connection, and `initializeAutoConnect` restores it after mount (it waits 300 ms and disconnects the wallets of every adapter first).
94
+
95
+ ---
141
96
 
142
- If you find this library useful, please consider supporting its development. Every contribution helps!
97
+ ## 📚 API Reference
143
98
 
144
- [**➡️ View Support Options**](https://github.com/TuwaIO/workflows/blob/main/Donation.md)
99
+ Every export, with signatures and types generated from the source, is documented at **[satellite.docs.tuwa.io/packages/satellite-react](https://satellite.docs.tuwa.io/packages/satellite-react)**.
145
100
 
146
101
  ## 📄 License
147
102
 
148
- This project is licensed under the **Apache-2.0 License** - see the [LICENSE](./LICENSE) file for details.
103
+ Licensed under the **Apache-2.0 License**. See the [LICENSE](https://github.com/TuwaIO/satellite-connect/blob/main/packages/satellite-react/LICENSE) file for details.
@@ -1 +1 @@
1
- import {createContext,useContext}from'react';import {useStore}from'zustand';var e=Symbol.for("tuwaio.satellite.context"),o=globalThis,a=o[e]||(o[e]=createContext(null)),m=n=>{let t=useContext(a);if(!t)throw new Error("useSatelliteConnectStore must be used within a SatelliteConnectProvider");return useStore(t,n)};export{a,m as b};
1
+ import {createContext,useContext}from'react';import {useStore}from'zustand';var e=Symbol.for("tuwaio.satellite.context"),o=globalThis,a=o[e]||(o[e]=createContext(null)),u=n=>{let t=useContext(a);if(!t)throw new Error("useSatelliteConnectStore must be used within a SatelliteConnectProvider");return useStore(t,n)};export{a,u as b};
@@ -0,0 +1 @@
1
+ import {useMemo}from'react';function m(e){let t=e!=null,s=e?.enabled,n=e?.isSignedIn,d=e?.isAuthenticated,i=e?.isRejected,a=e?.status,o=e?.address,c=e?.chainId,S=!!e?.session,l=e?.session?.address,u=e?.session?.chainId;return useMemo(()=>t?{enabled:s,isSignedIn:n,isAuthenticated:d,isRejected:i,status:a,address:o,chainId:c,session:S?{address:l,chainId:u}:null}:void 0,[t,s,n,d,i,a,o,c,S,l,u])}export{m as a};
@@ -1 +1 @@
1
- 'use strict';var react=require('react'),zustand=require('zustand');var e=Symbol.for("tuwaio.satellite.context"),o=globalThis,a=o[e]||(o[e]=react.createContext(null)),u=n=>{let t=react.useContext(a);if(!t)throw new Error("useSatelliteConnectStore must be used within a SatelliteConnectProvider");return zustand.useStore(t,n)};exports.a=a;exports.b=u;
1
+ 'use strict';var react=require('react'),zustand=require('zustand');var e=Symbol.for("tuwaio.satellite.context"),o=globalThis,a=o[e]||(o[e]=react.createContext(null)),p=n=>{let t=react.useContext(a);if(!t)throw new Error("useSatelliteConnectStore must be used within a SatelliteConnectProvider");return zustand.useStore(t,n)};exports.a=a;exports.b=p;
@@ -0,0 +1 @@
1
+ 'use strict';var react=require('react');function I(e){let t=e!=null,s=e?.enabled,n=e?.isSignedIn,d=e?.isAuthenticated,i=e?.isRejected,a=e?.status,o=e?.address,c=e?.chainId,S=!!e?.session,l=e?.session?.address,u=e?.session?.chainId;return react.useMemo(()=>t?{enabled:s,isSignedIn:n,isAuthenticated:d,isRejected:i,status:a,address:o,chainId:c,session:S?{address:l,chainId:u}:null}:void 0,[t,s,n,d,i,a,o,c,S,l,u])}exports.a=I;
@@ -1 +1 @@
1
- 'use strict';require('../chunk-YTP4ADBV.cjs');var chunkG2YC6JBO_cjs=require('../chunk-G2YC6JBO.cjs'),react=require('react'),jsxRuntime=require('react/jsx-runtime');function M(t){let[r,f]=react.useState(null);return react.useEffect(()=>{(async()=>{try{let n=!1,i=null;try{let[c]=await Promise.all([import('@tuwaio/satellite-evm'),import('@wagmi/core'),import('viem')]);i=c.createEVMConnectionsWatcher,n=!0;}catch{n=!1;}if(n){let c=()=>{let a=chunkG2YC6JBO_cjs.b(e=>e.activeConnection),l=chunkG2YC6JBO_cjs.b(e=>e.disconnect),s=chunkG2YC6JBO_cjs.b(e=>e.connectionError),C=chunkG2YC6JBO_cjs.b(e=>e.updateActiveConnection);return react.useEffect(()=>i({wagmiConfig:t.wagmiConfig,siwx:t.siwx,siwe:t.siwe},{activeConnection:a,disconnect:l,connectionError:s,updateActiveConnection:C}),[a?.connectorType,t.siwx,t.siwe,s,t.wagmiConfig,l,C]),null};f(()=>c);}}catch(n){console.warn("Failed to load EVM watcher:",n);}})();},[]),r?jsxRuntime.jsx(r,{...t}):null}exports.EVMConnectorsWatcher=M;
1
+ 'use strict';var chunkLSWAATDN_cjs=require('../chunk-LSWAATDN.cjs'),chunkHEG6FP5Z_cjs=require('../chunk-HEG6FP5Z.cjs'),react=require('react'),jsxRuntime=require('react/jsx-runtime');function x({createWatcher:c,wagmiConfig:o,siwx:i,siwe:e}){let n=chunkHEG6FP5Z_cjs.b(t=>t.activeConnection),a=chunkHEG6FP5Z_cjs.b(t=>t.disconnect),s=chunkHEG6FP5Z_cjs.b(t=>t.connectionError),l=chunkHEG6FP5Z_cjs.b(t=>t.updateActiveConnection),C=react.useContext(chunkHEG6FP5Z_cjs.a),p=chunkLSWAATDN_cjs.a(i),d=e!==void 0,f=e?.enabled,u=e?.isSignedIn,S=e?.isRejected,m=react.useMemo(()=>d?{enabled:f,isSignedIn:u,isRejected:S}:void 0,[d,f,u,S]);return react.useEffect(()=>c({wagmiConfig:o,siwx:p,siwe:m},{disconnect:a,updateActiveConnection:l,getState:()=>C?.getState()??{activeConnection:n,connectionError:s}}),[c,C,o,p,m,n?.connectorType,s,a,l]),null}function I(c){let[o,i]=react.useState(null);return react.useEffect(()=>{let e=true;return import('@tuwaio/satellite-evm').then(n=>{e&&i(()=>n.createEVMConnectionsWatcher);}).catch(n=>console.warn("Failed to load EVM watcher:",n)),()=>{e=false;}},[]),o?jsxRuntime.jsx(x,{createWatcher:o,...c}):null}exports.EVMConnectorsWatcher=I;
@@ -2,60 +2,77 @@ import { OrbitAdapter } from '@tuwaio/orbit-core';
2
2
  import { EVMConnection, ConnectorEVM } from '@tuwaio/satellite-evm';
3
3
  import * as react from 'react';
4
4
  import { SatelliteSiwxState } from '@tuwaio/satellite-core';
5
+ import { Config } from '@wagmi/core';
5
6
 
6
7
  /**
7
8
  * Props for the {@link EVMConnectorsWatcher} component.
8
9
  */
9
10
  interface EVMConnectorsWatcherProps {
10
11
  /**
11
- * The configuration object from `@wagmi/core`.
12
- * This is required to initialize the account watcher.
12
+ * The wagmi `Config` from `@wagmi/core` that the EVM adapter uses. Its connections are watched with
13
+ * `watchConnections`.
13
14
  */
14
- wagmiConfig: any;
15
+ wagmiConfig: Config;
15
16
  /**
16
- * Optional Sign-In With X (SIWX) session state.
17
- * If provided, the watcher will manage updates and disconnections based on SIWX status.
18
- * Directly compatible with `useSiwxSession()` from `@tuwaio/siwx-react`.
17
+ * Optional Sign-In With X (SIWX) session state, for example the result of `useSiwxSession()` from
18
+ * `@tuwaio/siwx-react`. The watcher is restarted when one of its fields changes.
19
19
  */
20
20
  siwx?: SatelliteSiwxState;
21
21
  /**
22
- * @deprecated Legacy SIWE prop alias for backwards compatibility
22
+ * Legacy SIWE state, used only when `siwx` is not passed.
23
+ *
24
+ * @deprecated Pass `siwx` instead.
23
25
  */
24
26
  siwe?: {
27
+ /** Whether the user rejected the sign-in or it failed. */
25
28
  isRejected?: boolean;
29
+ /** Whether the user is signed in. */
26
30
  isSignedIn?: boolean;
31
+ /** Whether sign-in is enabled. `false` turns off the disconnect on rejection. */
27
32
  enabled?: boolean;
28
33
  };
29
34
  }
30
35
  /**
31
- * A dynamic version of the EVMConnectorsWatcher component that avoids static imports.
32
- * This component dynamically imports the dependencies only when they are available.
36
+ * Headless component that keeps the Satellite Connect store in sync with wagmi. Render it once inside
37
+ * `SatelliteConnectProvider`, next to an EVM adapter created with the same `wagmiConfig`.
33
38
  *
34
- * @param props - The component's props. See {@link EVMConnectorsWatcherProps} for details.
35
- * @returns {null} This component does not render any UI.
39
+ * After mount it loads `@tuwaio/satellite-evm` with a dynamic import and runs its `createEVMConnectionsWatcher`: account
40
+ * and network changes made in the wallet update the active connection, a wallet disconnect removes it, and with `siwx`
41
+ * the connection is disconnected when the SIWX sign-in is rejected or fails, or when the account or chain no longer
42
+ * matches the signed-in session. The watcher restarts when `wagmiConfig`, a field of `siwx`, the active connector or
43
+ * the connection error changes, and stops on unmount. If the import fails, a warning is logged and nothing is watched.
44
+ *
45
+ * @param props - The component props. See {@link EVMConnectorsWatcherProps}.
46
+ * @returns `null`; the component renders nothing.
36
47
  *
37
48
  * @example
38
49
  * ```tsx
39
- * import { useSiwxSession } from '@tuwaio/siwx-react';
40
50
  * import { EVMConnectorsWatcher } from '@tuwaio/satellite-react/evm';
51
+ * import { useSiwxSession } from '@tuwaio/siwx-react';
52
+ * import type { Config } from '@wagmi/core';
41
53
  *
42
- * function WatcherContainer() {
54
+ * export function WatcherContainer({ wagmiConfig }: { wagmiConfig: Config }) {
43
55
  * const siwxSession = useSiwxSession();
44
56
  * return <EVMConnectorsWatcher wagmiConfig={wagmiConfig} siwx={siwxSession} />;
45
57
  * }
46
58
  * ```
47
- *
48
- * @remarks
49
- * Monitors Wagmi account and network changes. Automatically disconnects wallet state if SIWX
50
- * session validation fails or is rejected.
51
59
  */
52
60
  declare function EVMConnectorsWatcher(props: EVMConnectorsWatcherProps): react.JSX.Element | null;
53
61
 
62
+ /**
63
+ * The EVM watcher component, imported from `@tuwaio/satellite-react/evm`. Importing this entry point also adds
64
+ * `EVMConnection` and `ConnectorEVM` from `@tuwaio/satellite-evm` to `AllConnections` and `AllConnectors`.
65
+ *
66
+ * @module evm
67
+ */
68
+
54
69
  declare module '@tuwaio/satellite-react' {
55
70
  interface AllConnections {
71
+ /** EVM connections (`EVMConnection` from `@tuwaio/satellite-evm`), added by `@tuwaio/satellite-react/evm`. */
56
72
  [OrbitAdapter.EVM]: EVMConnection;
57
73
  }
58
74
  interface AllConnectors {
75
+ /** wagmi connectors (`ConnectorEVM` from `@tuwaio/satellite-evm`), added by `@tuwaio/satellite-react/evm`. */
59
76
  [OrbitAdapter.EVM]: ConnectorEVM;
60
77
  }
61
78
  }
@@ -2,60 +2,77 @@ import { OrbitAdapter } from '@tuwaio/orbit-core';
2
2
  import { EVMConnection, ConnectorEVM } from '@tuwaio/satellite-evm';
3
3
  import * as react from 'react';
4
4
  import { SatelliteSiwxState } from '@tuwaio/satellite-core';
5
+ import { Config } from '@wagmi/core';
5
6
 
6
7
  /**
7
8
  * Props for the {@link EVMConnectorsWatcher} component.
8
9
  */
9
10
  interface EVMConnectorsWatcherProps {
10
11
  /**
11
- * The configuration object from `@wagmi/core`.
12
- * This is required to initialize the account watcher.
12
+ * The wagmi `Config` from `@wagmi/core` that the EVM adapter uses. Its connections are watched with
13
+ * `watchConnections`.
13
14
  */
14
- wagmiConfig: any;
15
+ wagmiConfig: Config;
15
16
  /**
16
- * Optional Sign-In With X (SIWX) session state.
17
- * If provided, the watcher will manage updates and disconnections based on SIWX status.
18
- * Directly compatible with `useSiwxSession()` from `@tuwaio/siwx-react`.
17
+ * Optional Sign-In With X (SIWX) session state, for example the result of `useSiwxSession()` from
18
+ * `@tuwaio/siwx-react`. The watcher is restarted when one of its fields changes.
19
19
  */
20
20
  siwx?: SatelliteSiwxState;
21
21
  /**
22
- * @deprecated Legacy SIWE prop alias for backwards compatibility
22
+ * Legacy SIWE state, used only when `siwx` is not passed.
23
+ *
24
+ * @deprecated Pass `siwx` instead.
23
25
  */
24
26
  siwe?: {
27
+ /** Whether the user rejected the sign-in or it failed. */
25
28
  isRejected?: boolean;
29
+ /** Whether the user is signed in. */
26
30
  isSignedIn?: boolean;
31
+ /** Whether sign-in is enabled. `false` turns off the disconnect on rejection. */
27
32
  enabled?: boolean;
28
33
  };
29
34
  }
30
35
  /**
31
- * A dynamic version of the EVMConnectorsWatcher component that avoids static imports.
32
- * This component dynamically imports the dependencies only when they are available.
36
+ * Headless component that keeps the Satellite Connect store in sync with wagmi. Render it once inside
37
+ * `SatelliteConnectProvider`, next to an EVM adapter created with the same `wagmiConfig`.
33
38
  *
34
- * @param props - The component's props. See {@link EVMConnectorsWatcherProps} for details.
35
- * @returns {null} This component does not render any UI.
39
+ * After mount it loads `@tuwaio/satellite-evm` with a dynamic import and runs its `createEVMConnectionsWatcher`: account
40
+ * and network changes made in the wallet update the active connection, a wallet disconnect removes it, and with `siwx`
41
+ * the connection is disconnected when the SIWX sign-in is rejected or fails, or when the account or chain no longer
42
+ * matches the signed-in session. The watcher restarts when `wagmiConfig`, a field of `siwx`, the active connector or
43
+ * the connection error changes, and stops on unmount. If the import fails, a warning is logged and nothing is watched.
44
+ *
45
+ * @param props - The component props. See {@link EVMConnectorsWatcherProps}.
46
+ * @returns `null`; the component renders nothing.
36
47
  *
37
48
  * @example
38
49
  * ```tsx
39
- * import { useSiwxSession } from '@tuwaio/siwx-react';
40
50
  * import { EVMConnectorsWatcher } from '@tuwaio/satellite-react/evm';
51
+ * import { useSiwxSession } from '@tuwaio/siwx-react';
52
+ * import type { Config } from '@wagmi/core';
41
53
  *
42
- * function WatcherContainer() {
54
+ * export function WatcherContainer({ wagmiConfig }: { wagmiConfig: Config }) {
43
55
  * const siwxSession = useSiwxSession();
44
56
  * return <EVMConnectorsWatcher wagmiConfig={wagmiConfig} siwx={siwxSession} />;
45
57
  * }
46
58
  * ```
47
- *
48
- * @remarks
49
- * Monitors Wagmi account and network changes. Automatically disconnects wallet state if SIWX
50
- * session validation fails or is rejected.
51
59
  */
52
60
  declare function EVMConnectorsWatcher(props: EVMConnectorsWatcherProps): react.JSX.Element | null;
53
61
 
62
+ /**
63
+ * The EVM watcher component, imported from `@tuwaio/satellite-react/evm`. Importing this entry point also adds
64
+ * `EVMConnection` and `ConnectorEVM` from `@tuwaio/satellite-evm` to `AllConnections` and `AllConnectors`.
65
+ *
66
+ * @module evm
67
+ */
68
+
54
69
  declare module '@tuwaio/satellite-react' {
55
70
  interface AllConnections {
71
+ /** EVM connections (`EVMConnection` from `@tuwaio/satellite-evm`), added by `@tuwaio/satellite-react/evm`. */
56
72
  [OrbitAdapter.EVM]: EVMConnection;
57
73
  }
58
74
  interface AllConnectors {
75
+ /** wagmi connectors (`ConnectorEVM` from `@tuwaio/satellite-evm`), added by `@tuwaio/satellite-react/evm`. */
59
76
  [OrbitAdapter.EVM]: ConnectorEVM;
60
77
  }
61
78
  }
package/dist/evm/index.js CHANGED
@@ -1 +1 @@
1
- import'../chunk-UDS7MUYZ.js';import {b}from'../chunk-EYVLQZ24.js';import {useState,useEffect}from'react';import {jsx}from'react/jsx-runtime';function V(t){let[r,f]=useState(null);return useEffect(()=>{(async()=>{try{let n=!1,i=null;try{let[c]=await Promise.all([import('@tuwaio/satellite-evm'),import('@wagmi/core'),import('viem')]);i=c.createEVMConnectionsWatcher,n=!0;}catch{n=!1;}if(n){let c=()=>{let a=b(e=>e.activeConnection),l=b(e=>e.disconnect),s=b(e=>e.connectionError),C=b(e=>e.updateActiveConnection);return useEffect(()=>i({wagmiConfig:t.wagmiConfig,siwx:t.siwx,siwe:t.siwe},{activeConnection:a,disconnect:l,connectionError:s,updateActiveConnection:C}),[a?.connectorType,t.siwx,t.siwe,s,t.wagmiConfig,l,C]),null};f(()=>c);}}catch(n){console.warn("Failed to load EVM watcher:",n);}})();},[]),r?jsx(r,{...t}):null}export{V as EVMConnectorsWatcher};
1
+ import {a as a$1}from'../chunk-FBHCKH6M.js';import {b,a}from'../chunk-4A4PSLAK.js';import {useState,useEffect,useContext,useMemo}from'react';import {jsx}from'react/jsx-runtime';function g({createWatcher:c,wagmiConfig:o,siwx:i,siwe:e}){let n=b(t=>t.activeConnection),a$2=b(t=>t.disconnect),s=b(t=>t.connectionError),l=b(t=>t.updateActiveConnection),C=useContext(a),p=a$1(i),d=e!==void 0,f=e?.enabled,u=e?.isSignedIn,S=e?.isRejected,m=useMemo(()=>d?{enabled:f,isSignedIn:u,isRejected:S}:void 0,[d,f,u,S]);return useEffect(()=>c({wagmiConfig:o,siwx:p,siwe:m},{disconnect:a$2,updateActiveConnection:l,getState:()=>C?.getState()??{activeConnection:n,connectionError:s}}),[c,C,o,p,m,n?.connectorType,s,a$2,l]),null}function R(c){let[o,i]=useState(null);return useEffect(()=>{let e=true;return import('@tuwaio/satellite-evm').then(n=>{e&&i(()=>n.createEVMConnectionsWatcher);}).catch(n=>console.warn("Failed to load EVM watcher:",n)),()=>{e=false;}},[]),o?jsx(g,{createWatcher:o,...c}):null}export{R as EVMConnectorsWatcher};
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- 'use strict';var chunkYTP4ADBV_cjs=require('./chunk-YTP4ADBV.cjs'),chunkG2YC6JBO_cjs=require('./chunk-G2YC6JBO.cjs');Object.defineProperty(exports,"SatelliteConnectProvider",{enumerable:true,get:function(){return chunkYTP4ADBV_cjs.b}});Object.defineProperty(exports,"useInitializeAutoConnect",{enumerable:true,get:function(){return chunkYTP4ADBV_cjs.a}});Object.defineProperty(exports,"SatelliteStoreContext",{enumerable:true,get:function(){return chunkG2YC6JBO_cjs.a}});Object.defineProperty(exports,"useSatelliteConnectStore",{enumerable:true,get:function(){return chunkG2YC6JBO_cjs.b}});
1
+ 'use strict';var chunkHEG6FP5Z_cjs=require('./chunk-HEG6FP5Z.cjs'),react=require('react'),satelliteCore=require('@tuwaio/satellite-core'),jsxRuntime=require('react/jsx-runtime');var a=({initializeAutoConnect:n,onError:r})=>{let e=react.useEffectEvent(async()=>n()),t=react.useEffectEvent(o=>{(r??(s=>console.error("Failed to initialize auto connect:",s)))(o);});react.useEffect(()=>{e().catch(o=>t(o));},[]);};function g({children:n,autoConnect:r,adapter:e,callbackAfterConnected:t}){let o=react.useMemo(()=>satelliteCore.createSatelliteConnectStore({adapter:e,callbackAfterConnected:t}),[]);return react.useEffect(()=>{o.getState().updateParameters({adapter:e,callbackAfterConnected:t});},[o,e,t]),a({initializeAutoConnect:()=>o.getState().initializeAutoConnect(r??false)}),jsxRuntime.jsx(chunkHEG6FP5Z_cjs.a.Provider,{value:o,children:n})}Object.defineProperty(exports,"SatelliteStoreContext",{enumerable:true,get:function(){return chunkHEG6FP5Z_cjs.a}});Object.defineProperty(exports,"useSatelliteConnectStore",{enumerable:true,get:function(){return chunkHEG6FP5Z_cjs.b}});exports.SatelliteConnectProvider=g;exports.useInitializeAutoConnect=a;