@zama-fhe/react-sdk 1.0.0-alpha.2
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/LICENSE +28 -0
- package/README.md +990 -0
- package/dist/chunk-463DUSLG.js +1005 -0
- package/dist/chunk-463DUSLG.js.map +1 -0
- package/dist/ethers/index.d.ts +142 -0
- package/dist/ethers/index.js +173 -0
- package/dist/ethers/index.js.map +1 -0
- package/dist/index.d.ts +1082 -0
- package/dist/index.js +4 -0
- package/dist/index.js.map +1 -0
- package/dist/use-approve-underlying-DAkxWhfm.d.ts +784 -0
- package/dist/viem/index.d.ts +142 -0
- package/dist/viem/index.js +173 -0
- package/dist/viem/index.js.map +1 -0
- package/dist/wagmi/index.d.ts +7139 -0
- package/dist/wagmi/index.js +280 -0
- package/dist/wagmi/index.js.map +1 -0
- package/package.json +91 -0
package/README.md
ADDED
|
@@ -0,0 +1,990 @@
|
|
|
1
|
+
# @zama-fhe/react-sdk
|
|
2
|
+
|
|
3
|
+
React hooks for confidential token operations, built on [React Query](https://tanstack.com/query). Provides declarative, cache-aware hooks for balances, confidential transfers, shielding, unshielding, and decryption — so you never deal with raw FHE operations in your components.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
pnpm add @zama-fhe/react-sdk @tanstack/react-query
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
`@zama-fhe/sdk` is included as a direct dependency — no need to install it separately.
|
|
12
|
+
|
|
13
|
+
### Peer dependencies
|
|
14
|
+
|
|
15
|
+
| Package | Version | Required? |
|
|
16
|
+
| ----------------------- | ------- | --------------------------------------------- |
|
|
17
|
+
| `react` | >= 18 | Yes |
|
|
18
|
+
| `@tanstack/react-query` | >= 5 | Yes |
|
|
19
|
+
| `viem` | >= 2 | Optional — for `/viem` and `/wagmi` sub-paths |
|
|
20
|
+
| `ethers` | >= 6 | Optional — for `/ethers` sub-path |
|
|
21
|
+
| `wagmi` | >= 2 | Optional — for `/wagmi` sub-path |
|
|
22
|
+
|
|
23
|
+
## Quick Start
|
|
24
|
+
|
|
25
|
+
### With wagmi
|
|
26
|
+
|
|
27
|
+
```tsx
|
|
28
|
+
import { WagmiProvider, createConfig, http } from "wagmi";
|
|
29
|
+
import { mainnet, sepolia } from "wagmi/chains";
|
|
30
|
+
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
|
31
|
+
import { ZamaProvider, RelayerWeb, indexedDBStorage } from "@zama-fhe/react-sdk";
|
|
32
|
+
import { WagmiSigner } from "@zama-fhe/react-sdk/wagmi";
|
|
33
|
+
|
|
34
|
+
const wagmiConfig = createConfig({
|
|
35
|
+
chains: [mainnet, sepolia],
|
|
36
|
+
transports: {
|
|
37
|
+
[mainnet.id]: http("https://mainnet.infura.io/v3/YOUR_KEY"),
|
|
38
|
+
[sepolia.id]: http("https://sepolia.infura.io/v3/YOUR_KEY"),
|
|
39
|
+
},
|
|
40
|
+
});
|
|
41
|
+
|
|
42
|
+
const signer = new WagmiSigner({ config: wagmiConfig });
|
|
43
|
+
|
|
44
|
+
const relayer = new RelayerWeb({
|
|
45
|
+
getChainId: () => signer.getChainId(),
|
|
46
|
+
transports: {
|
|
47
|
+
[mainnet.id]: {
|
|
48
|
+
relayerUrl: "https://your-app.com/api/relayer/1",
|
|
49
|
+
network: "https://mainnet.infura.io/v3/YOUR_KEY",
|
|
50
|
+
},
|
|
51
|
+
[sepolia.id]: {
|
|
52
|
+
relayerUrl: "https://your-app.com/api/relayer/11155111",
|
|
53
|
+
network: "https://sepolia.infura.io/v3/YOUR_KEY",
|
|
54
|
+
},
|
|
55
|
+
},
|
|
56
|
+
});
|
|
57
|
+
|
|
58
|
+
const queryClient = new QueryClient();
|
|
59
|
+
|
|
60
|
+
function App() {
|
|
61
|
+
return (
|
|
62
|
+
<WagmiProvider config={wagmiConfig}>
|
|
63
|
+
<QueryClientProvider client={queryClient}>
|
|
64
|
+
<ZamaProvider relayer={relayer} signer={signer} storage={indexedDBStorage}>
|
|
65
|
+
<TokenBalance />
|
|
66
|
+
</ZamaProvider>
|
|
67
|
+
</QueryClientProvider>
|
|
68
|
+
</WagmiProvider>
|
|
69
|
+
);
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
function TokenBalance() {
|
|
73
|
+
const { data: balance, isLoading } = useConfidentialBalance({ tokenAddress: "0xTokenAddress" });
|
|
74
|
+
|
|
75
|
+
if (isLoading) return <p>Decrypting balance...</p>;
|
|
76
|
+
return <p>Balance: {balance?.toString()}</p>;
|
|
77
|
+
}
|
|
78
|
+
```
|
|
79
|
+
|
|
80
|
+
### With a custom signer
|
|
81
|
+
|
|
82
|
+
```tsx
|
|
83
|
+
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
|
84
|
+
import { mainnet, sepolia } from "wagmi/chains"; // or define your own chain IDs
|
|
85
|
+
import {
|
|
86
|
+
ZamaProvider,
|
|
87
|
+
RelayerWeb,
|
|
88
|
+
useConfidentialBalance,
|
|
89
|
+
useConfidentialTransfer,
|
|
90
|
+
memoryStorage,
|
|
91
|
+
} from "@zama-fhe/react-sdk";
|
|
92
|
+
|
|
93
|
+
const relayer = new RelayerWeb({
|
|
94
|
+
getChainId: () => yourCustomSigner.getChainId(),
|
|
95
|
+
transports: {
|
|
96
|
+
[mainnet.id]: {
|
|
97
|
+
relayerUrl: "https://your-app.com/api/relayer/1",
|
|
98
|
+
network: "https://mainnet.infura.io/v3/YOUR_KEY",
|
|
99
|
+
},
|
|
100
|
+
[sepolia.id]: {
|
|
101
|
+
relayerUrl: "https://your-app.com/api/relayer/11155111",
|
|
102
|
+
network: "https://sepolia.infura.io/v3/YOUR_KEY",
|
|
103
|
+
},
|
|
104
|
+
},
|
|
105
|
+
});
|
|
106
|
+
|
|
107
|
+
const queryClient = new QueryClient();
|
|
108
|
+
|
|
109
|
+
function App() {
|
|
110
|
+
return (
|
|
111
|
+
<QueryClientProvider client={queryClient}>
|
|
112
|
+
<ZamaProvider relayer={relayer} signer={yourCustomSigner} storage={memoryStorage}>
|
|
113
|
+
<TransferForm />
|
|
114
|
+
</ZamaProvider>
|
|
115
|
+
</QueryClientProvider>
|
|
116
|
+
);
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
function TransferForm() {
|
|
120
|
+
const { data: balance } = useConfidentialBalance({ tokenAddress: "0xTokenAddress" });
|
|
121
|
+
const { mutateAsync: transfer, isPending } = useConfidentialTransfer({
|
|
122
|
+
tokenAddress: "0xTokenAddress",
|
|
123
|
+
});
|
|
124
|
+
|
|
125
|
+
const handleTransfer = async () => {
|
|
126
|
+
const txHash = await transfer({ to: "0xRecipient", amount: 100n });
|
|
127
|
+
console.log("Transfer tx:", txHash);
|
|
128
|
+
};
|
|
129
|
+
|
|
130
|
+
return (
|
|
131
|
+
<div>
|
|
132
|
+
<p>Balance: {balance?.toString()}</p>
|
|
133
|
+
<button onClick={handleTransfer} disabled={isPending}>
|
|
134
|
+
{isPending ? "Transferring..." : "Send 100 tokens"}
|
|
135
|
+
</button>
|
|
136
|
+
</div>
|
|
137
|
+
);
|
|
138
|
+
}
|
|
139
|
+
```
|
|
140
|
+
|
|
141
|
+
## Provider Setup
|
|
142
|
+
|
|
143
|
+
All setups use `ZamaProvider`. Create a signer with the adapter for your library, then pass it directly.
|
|
144
|
+
|
|
145
|
+
```tsx
|
|
146
|
+
import { ZamaProvider } from "@zama-fhe/react-sdk";
|
|
147
|
+
|
|
148
|
+
<ZamaProvider
|
|
149
|
+
relayer={relayer} // RelayerSDK (RelayerWeb or RelayerNode instance)
|
|
150
|
+
signer={signer} // GenericSigner (WagmiSigner, ViemSigner, EthersSigner, or custom)
|
|
151
|
+
storage={storage} // GenericStringStorage
|
|
152
|
+
credentialDurationDays={1} // Optional. Days FHE credentials remain valid. Default: 1. Set 0 for sign-every-time.
|
|
153
|
+
onEvent={(event) => console.debug(event)} // Optional. Structured event listener for debugging.
|
|
154
|
+
>
|
|
155
|
+
{children}
|
|
156
|
+
</ZamaProvider>;
|
|
157
|
+
```
|
|
158
|
+
|
|
159
|
+
## Which Hooks Should I Use?
|
|
160
|
+
|
|
161
|
+
The React SDK exports hooks from two layers. **Pick one layer per operation — never mix them.**
|
|
162
|
+
|
|
163
|
+
**Use the main import** (`@zama-fhe/react-sdk`) when you have a `ZamaProvider` in your component tree. These hooks handle FHE encryption, cache invalidation, and error wrapping automatically:
|
|
164
|
+
|
|
165
|
+
```tsx
|
|
166
|
+
import { useShield, useConfidentialTransfer } from "@zama-fhe/react-sdk";
|
|
167
|
+
|
|
168
|
+
const { mutateAsync: shield } = useShield({ tokenAddress });
|
|
169
|
+
await shield({ amount: 1000n }); // encryption + approval handled for you
|
|
170
|
+
```
|
|
171
|
+
|
|
172
|
+
**Use the library sub-path** (`/viem`, `/ethers`, `/wagmi`) when you need direct contract-level control without a provider. You handle encryption and cache management yourself:
|
|
173
|
+
|
|
174
|
+
```tsx
|
|
175
|
+
import { useShield } from "@zama-fhe/react-sdk/viem";
|
|
176
|
+
|
|
177
|
+
const { mutateAsync: shield } = useShield();
|
|
178
|
+
await shield({ client: walletClient, wrapperAddress, to, amount }); // raw contract call
|
|
179
|
+
```
|
|
180
|
+
|
|
181
|
+
### Comparison of Colliding Hook Names
|
|
182
|
+
|
|
183
|
+
Five hooks share names across both layers. Here's how they differ:
|
|
184
|
+
|
|
185
|
+
| Hook | Main (`@zama-fhe/react-sdk`) | Sub-path (`/viem`, `/ethers`, `/wagmi`) |
|
|
186
|
+
| ------------------------- | ----------------------------------------------------------- | ------------------------------------------------------------------------------------ |
|
|
187
|
+
| `useConfidentialTransfer` | `mutate({ to, amount })` — auto-encrypts | `mutate({ client, token, to, handle, inputProof })` — pre-encrypted |
|
|
188
|
+
| `useShield` | `mutate({ amount, approvalStrategy? })` — auto-approves | `mutate({ client, wrapper, to, amount })` — raw wrap call |
|
|
189
|
+
| `useShieldETH` | `mutate({ amount, value? })` — `value` defaults to `amount` | `mutate({ client, wrapper, to, amount, value })` — all fields required |
|
|
190
|
+
| `useUnwrap` | `mutate({ amount })` — auto-encrypts | `mutate({ client, token, from, to, encryptedAmount, inputProof })` — pre-encrypted |
|
|
191
|
+
| `useFinalizeUnwrap` | `mutate({ burnAmountHandle })` — fetches proof from relayer | `mutate({ client, wrapper, burntAmount, cleartext, proof })` — caller provides proof |
|
|
192
|
+
|
|
193
|
+
| Feature | Main | Sub-path |
|
|
194
|
+
| ----------------------- | ----------------------- | ----------------------------- |
|
|
195
|
+
| Requires `ZamaProvider` | Yes | No |
|
|
196
|
+
| FHE encryption | Automatic | Manual (caller pre-encrypts) |
|
|
197
|
+
| ERC-20 approval | Automatic (`useShield`) | None |
|
|
198
|
+
| Cache invalidation | Automatic | None |
|
|
199
|
+
| Return type | `TransactionResult` | Raw tx hash or wagmi mutation |
|
|
200
|
+
|
|
201
|
+
> **Rule of thumb:** If you're building a standard dApp UI, use the main import. If you're building custom transaction pipelines or need to compose with other wagmi hooks at the contract level, use the sub-path.
|
|
202
|
+
|
|
203
|
+
## Hooks Reference
|
|
204
|
+
|
|
205
|
+
All hooks require a `ZamaProvider` (or one of its variants) in the component tree.
|
|
206
|
+
|
|
207
|
+
### SDK Access
|
|
208
|
+
|
|
209
|
+
#### `useZamaSDK`
|
|
210
|
+
|
|
211
|
+
Returns the `ZamaSDK` instance from context. Use this when you need direct access to the SDK (e.g. for low-level relayer operations).
|
|
212
|
+
|
|
213
|
+
```ts
|
|
214
|
+
function useZamaSDK(): ZamaSDK;
|
|
215
|
+
```
|
|
216
|
+
|
|
217
|
+
#### `useToken`
|
|
218
|
+
|
|
219
|
+
Returns a `Token` instance for a given token address. The encrypted ERC-20 contract IS the wrapper, so `wrapperAddress` defaults to `tokenAddress`. Pass it only if they differ. Memoized — same config returns the same instance.
|
|
220
|
+
|
|
221
|
+
```ts
|
|
222
|
+
function useToken(config: { tokenAddress: Address; wrapperAddress?: Address }): Token;
|
|
223
|
+
```
|
|
224
|
+
|
|
225
|
+
#### `useReadonlyToken`
|
|
226
|
+
|
|
227
|
+
Returns a `ReadonlyToken` instance for a given token address (no wrapper needed). Memoized.
|
|
228
|
+
|
|
229
|
+
```ts
|
|
230
|
+
function useReadonlyToken(tokenAddress: Address): ReadonlyToken;
|
|
231
|
+
```
|
|
232
|
+
|
|
233
|
+
### Balance Hooks
|
|
234
|
+
|
|
235
|
+
#### `useConfidentialBalance`
|
|
236
|
+
|
|
237
|
+
Single-token balance with automatic decryption. Uses two-phase polling: polls the encrypted handle at a configurable interval, and only triggers the expensive decryption when the handle changes.
|
|
238
|
+
|
|
239
|
+
```ts
|
|
240
|
+
function useConfidentialBalance(
|
|
241
|
+
config: UseConfidentialBalanceConfig,
|
|
242
|
+
options?: UseConfidentialBalanceOptions,
|
|
243
|
+
): UseQueryResult<bigint, Error>;
|
|
244
|
+
|
|
245
|
+
interface UseConfidentialBalanceConfig {
|
|
246
|
+
tokenAddress: Address;
|
|
247
|
+
handleRefetchInterval?: number; // default: 10000ms
|
|
248
|
+
}
|
|
249
|
+
```
|
|
250
|
+
|
|
251
|
+
Options extend `UseQueryOptions`.
|
|
252
|
+
|
|
253
|
+
```tsx
|
|
254
|
+
const {
|
|
255
|
+
data: balance,
|
|
256
|
+
isLoading,
|
|
257
|
+
error,
|
|
258
|
+
} = useConfidentialBalance({
|
|
259
|
+
tokenAddress: "0xTokenAddress",
|
|
260
|
+
handleRefetchInterval: 5_000,
|
|
261
|
+
});
|
|
262
|
+
```
|
|
263
|
+
|
|
264
|
+
#### `useConfidentialBalances`
|
|
265
|
+
|
|
266
|
+
Multi-token batch balance. Same two-phase polling pattern.
|
|
267
|
+
|
|
268
|
+
```ts
|
|
269
|
+
function useConfidentialBalances(
|
|
270
|
+
config: UseConfidentialBalancesConfig,
|
|
271
|
+
options?: UseConfidentialBalancesOptions,
|
|
272
|
+
): UseQueryResult<Map<Address, bigint>, Error>;
|
|
273
|
+
|
|
274
|
+
interface UseConfidentialBalancesConfig {
|
|
275
|
+
tokenAddresses: Address[];
|
|
276
|
+
handleRefetchInterval?: number;
|
|
277
|
+
maxConcurrency?: number;
|
|
278
|
+
}
|
|
279
|
+
```
|
|
280
|
+
|
|
281
|
+
```tsx
|
|
282
|
+
const { data: balances } = useConfidentialBalances({
|
|
283
|
+
tokenAddresses: ["0xTokenA", "0xTokenB", "0xTokenC"],
|
|
284
|
+
});
|
|
285
|
+
|
|
286
|
+
// balances is a Map<Address, bigint>
|
|
287
|
+
const tokenABalance = balances?.get("0xTokenA");
|
|
288
|
+
```
|
|
289
|
+
|
|
290
|
+
### Authorization
|
|
291
|
+
|
|
292
|
+
#### `useAuthorizeAll`
|
|
293
|
+
|
|
294
|
+
Pre-authorize FHE decrypt credentials for a list of token addresses with a single wallet signature. Call this early (e.g. after loading the token list) so that subsequent individual decrypt operations reuse cached credentials without prompting the wallet again.
|
|
295
|
+
|
|
296
|
+
```ts
|
|
297
|
+
function useAuthorizeAll(): UseMutationResult<void, Error, Address[]>;
|
|
298
|
+
```
|
|
299
|
+
|
|
300
|
+
```tsx
|
|
301
|
+
const { mutateAsync: authorizeAll, isPending } = useAuthorizeAll();
|
|
302
|
+
|
|
303
|
+
// Pre-authorize all known tokens up front
|
|
304
|
+
await authorizeAll(allTokenAddresses);
|
|
305
|
+
|
|
306
|
+
// Individual balance decrypts now reuse cached credentials
|
|
307
|
+
const { data: balance } = useConfidentialBalance("0xTokenA");
|
|
308
|
+
```
|
|
309
|
+
|
|
310
|
+
### Transfer Hooks
|
|
311
|
+
|
|
312
|
+
#### `useConfidentialTransfer`
|
|
313
|
+
|
|
314
|
+
Encrypted transfer. Encrypts the amount and calls the contract. Automatically invalidates balance caches on success.
|
|
315
|
+
|
|
316
|
+
```ts
|
|
317
|
+
function useConfidentialTransfer(
|
|
318
|
+
config: UseZamaConfig,
|
|
319
|
+
options?: UseMutationOptions<Address, Error, ConfidentialTransferParams>,
|
|
320
|
+
): UseMutationResult<Address, Error, ConfidentialTransferParams>;
|
|
321
|
+
|
|
322
|
+
interface ConfidentialTransferParams {
|
|
323
|
+
to: Address;
|
|
324
|
+
amount: bigint;
|
|
325
|
+
}
|
|
326
|
+
```
|
|
327
|
+
|
|
328
|
+
```tsx
|
|
329
|
+
const { mutateAsync: transfer, isPending } = useConfidentialTransfer({
|
|
330
|
+
tokenAddress: "0xTokenAddress",
|
|
331
|
+
});
|
|
332
|
+
|
|
333
|
+
const txHash = await transfer({ to: "0xRecipient", amount: 1000n });
|
|
334
|
+
```
|
|
335
|
+
|
|
336
|
+
#### `useConfidentialTransferFrom`
|
|
337
|
+
|
|
338
|
+
Operator transfer on behalf of another address.
|
|
339
|
+
|
|
340
|
+
```ts
|
|
341
|
+
function useConfidentialTransferFrom(
|
|
342
|
+
config: UseZamaConfig,
|
|
343
|
+
options?: UseMutationOptions<Address, Error, ConfidentialTransferFromParams>,
|
|
344
|
+
): UseMutationResult<Address, Error, ConfidentialTransferFromParams>;
|
|
345
|
+
|
|
346
|
+
interface ConfidentialTransferFromParams {
|
|
347
|
+
from: Address;
|
|
348
|
+
to: Address;
|
|
349
|
+
amount: bigint;
|
|
350
|
+
}
|
|
351
|
+
```
|
|
352
|
+
|
|
353
|
+
### Shield Hooks
|
|
354
|
+
|
|
355
|
+
#### `useShield`
|
|
356
|
+
|
|
357
|
+
Shield public ERC-20 tokens into confidential tokens. Handles ERC-20 approval automatically.
|
|
358
|
+
|
|
359
|
+
```ts
|
|
360
|
+
function useShield(
|
|
361
|
+
config: UseZamaConfig,
|
|
362
|
+
options?: UseMutationOptions<Address, Error, ShieldParams>,
|
|
363
|
+
): UseMutationResult<Address, Error, ShieldParams>;
|
|
364
|
+
|
|
365
|
+
interface ShieldParams {
|
|
366
|
+
amount: bigint;
|
|
367
|
+
approvalStrategy?: "max" | "exact" | "skip"; // default: "exact"
|
|
368
|
+
}
|
|
369
|
+
```
|
|
370
|
+
|
|
371
|
+
```tsx
|
|
372
|
+
const { mutateAsync: shield } = useShield({ tokenAddress: "0xTokenAddress" });
|
|
373
|
+
|
|
374
|
+
// Shield 1000 tokens with exact approval (default)
|
|
375
|
+
await shield({ amount: 1000n });
|
|
376
|
+
|
|
377
|
+
// Shield with max approval
|
|
378
|
+
await shield({ amount: 1000n, approvalStrategy: "max" });
|
|
379
|
+
```
|
|
380
|
+
|
|
381
|
+
#### `useShieldETH`
|
|
382
|
+
|
|
383
|
+
Shield native ETH into confidential tokens. Use when the underlying token is the zero address (native ETH).
|
|
384
|
+
|
|
385
|
+
```ts
|
|
386
|
+
function useShieldETH(
|
|
387
|
+
config: UseZamaConfig,
|
|
388
|
+
options?: UseMutationOptions<Address, Error, ShieldETHParams>,
|
|
389
|
+
): UseMutationResult<Address, Error, ShieldETHParams>;
|
|
390
|
+
|
|
391
|
+
interface ShieldETHParams {
|
|
392
|
+
amount: bigint;
|
|
393
|
+
value?: bigint; // defaults to amount
|
|
394
|
+
}
|
|
395
|
+
```
|
|
396
|
+
|
|
397
|
+
### Unshield Hooks (Combined)
|
|
398
|
+
|
|
399
|
+
These hooks orchestrate the full unshield flow in a single call: unwrap → wait for receipt → parse event → finalizeUnwrap. Use these for the simplest integration.
|
|
400
|
+
|
|
401
|
+
#### `useUnshield`
|
|
402
|
+
|
|
403
|
+
Unshield a specific amount. Handles the entire unwrap + finalize flow. Supports optional progress callbacks to track each step.
|
|
404
|
+
|
|
405
|
+
```ts
|
|
406
|
+
function useUnshield(
|
|
407
|
+
config: UseZamaConfig,
|
|
408
|
+
options?: UseMutationOptions<Address, Error, UnshieldParams>,
|
|
409
|
+
): UseMutationResult<Address, Error, UnshieldParams>;
|
|
410
|
+
|
|
411
|
+
interface UnshieldParams {
|
|
412
|
+
amount: bigint;
|
|
413
|
+
callbacks?: UnshieldCallbacks;
|
|
414
|
+
}
|
|
415
|
+
```
|
|
416
|
+
|
|
417
|
+
```tsx
|
|
418
|
+
const { mutateAsync: unshield, isPending } = useUnshield({
|
|
419
|
+
tokenAddress: "0xTokenAddress",
|
|
420
|
+
});
|
|
421
|
+
|
|
422
|
+
const finalizeTxHash = await unshield({
|
|
423
|
+
amount: 500n,
|
|
424
|
+
callbacks: {
|
|
425
|
+
onUnwrapSubmitted: (txHash) => console.log("Unwrap tx:", txHash),
|
|
426
|
+
onFinalizing: () => console.log("Finalizing..."),
|
|
427
|
+
onFinalizeSubmitted: (txHash) => console.log("Finalize tx:", txHash),
|
|
428
|
+
},
|
|
429
|
+
});
|
|
430
|
+
```
|
|
431
|
+
|
|
432
|
+
#### `useUnshieldAll`
|
|
433
|
+
|
|
434
|
+
Unshield the entire balance. Handles the entire unwrap + finalize flow. Supports optional progress callbacks.
|
|
435
|
+
|
|
436
|
+
```ts
|
|
437
|
+
function useUnshieldAll(
|
|
438
|
+
config: UseZamaConfig,
|
|
439
|
+
options?: UseMutationOptions<Address, Error, UnshieldAllParams | void>,
|
|
440
|
+
): UseMutationResult<Address, Error, UnshieldAllParams | void>;
|
|
441
|
+
|
|
442
|
+
interface UnshieldAllParams {
|
|
443
|
+
callbacks?: UnshieldCallbacks;
|
|
444
|
+
}
|
|
445
|
+
```
|
|
446
|
+
|
|
447
|
+
```tsx
|
|
448
|
+
const { mutateAsync: unshieldAll } = useUnshieldAll({
|
|
449
|
+
tokenAddress: "0xTokenAddress",
|
|
450
|
+
});
|
|
451
|
+
|
|
452
|
+
const finalizeTxHash = await unshieldAll();
|
|
453
|
+
```
|
|
454
|
+
|
|
455
|
+
#### `useResumeUnshield`
|
|
456
|
+
|
|
457
|
+
Resume an interrupted unshield from a saved unwrap tx hash. Useful when the user submitted the unwrap but the finalize step was interrupted (e.g. page reload, network error). Pair with the `savePendingUnshield`/`loadPendingUnshield`/`clearPendingUnshield` utilities for persistence.
|
|
458
|
+
|
|
459
|
+
```ts
|
|
460
|
+
function useResumeUnshield(
|
|
461
|
+
config: UseZamaConfig,
|
|
462
|
+
options?: UseMutationOptions<Address, Error, ResumeUnshieldParams>,
|
|
463
|
+
): UseMutationResult<Address, Error, ResumeUnshieldParams>;
|
|
464
|
+
|
|
465
|
+
interface ResumeUnshieldParams {
|
|
466
|
+
unwrapTxHash: Hex;
|
|
467
|
+
callbacks?: UnshieldCallbacks;
|
|
468
|
+
}
|
|
469
|
+
```
|
|
470
|
+
|
|
471
|
+
```tsx
|
|
472
|
+
import { loadPendingUnshield, clearPendingUnshield } from "@zama-fhe/react-sdk";
|
|
473
|
+
|
|
474
|
+
const { mutateAsync: resumeUnshield } = useResumeUnshield({
|
|
475
|
+
tokenAddress: "0xTokenAddress",
|
|
476
|
+
});
|
|
477
|
+
|
|
478
|
+
// On mount, check for interrupted unshields
|
|
479
|
+
const pending = await loadPendingUnshield(storage, wrapperAddress);
|
|
480
|
+
if (pending) {
|
|
481
|
+
await resumeUnshield({ unwrapTxHash: pending });
|
|
482
|
+
await clearPendingUnshield(storage, wrapperAddress);
|
|
483
|
+
}
|
|
484
|
+
```
|
|
485
|
+
|
|
486
|
+
#### Pending Unshield Persistence
|
|
487
|
+
|
|
488
|
+
Save the unwrap tx hash before finalization so interrupted unshields can be resumed after page reloads:
|
|
489
|
+
|
|
490
|
+
```ts
|
|
491
|
+
import {
|
|
492
|
+
savePendingUnshield,
|
|
493
|
+
loadPendingUnshield,
|
|
494
|
+
clearPendingUnshield,
|
|
495
|
+
} from "@zama-fhe/react-sdk";
|
|
496
|
+
|
|
497
|
+
// Save before the finalize step
|
|
498
|
+
await savePendingUnshield(storage, wrapperAddress, unwrapTxHash);
|
|
499
|
+
|
|
500
|
+
// Load on next visit
|
|
501
|
+
const pending = await loadPendingUnshield(storage, wrapperAddress);
|
|
502
|
+
|
|
503
|
+
// Clear after successful finalization
|
|
504
|
+
await clearPendingUnshield(storage, wrapperAddress);
|
|
505
|
+
```
|
|
506
|
+
|
|
507
|
+
### Unwrap Hooks (Low-Level)
|
|
508
|
+
|
|
509
|
+
These hooks expose the individual unwrap steps. Use them when you need fine-grained control over the flow.
|
|
510
|
+
|
|
511
|
+
#### `useUnwrap`
|
|
512
|
+
|
|
513
|
+
Request unwrap for a specific amount (requires manual finalization via `useFinalizeUnwrap`).
|
|
514
|
+
|
|
515
|
+
```ts
|
|
516
|
+
function useUnwrap(
|
|
517
|
+
config: UseZamaConfig,
|
|
518
|
+
options?: UseMutationOptions<Address, Error, UnwrapParams>,
|
|
519
|
+
): UseMutationResult<Address, Error, UnwrapParams>;
|
|
520
|
+
|
|
521
|
+
interface UnwrapParams {
|
|
522
|
+
amount: bigint;
|
|
523
|
+
}
|
|
524
|
+
```
|
|
525
|
+
|
|
526
|
+
#### `useUnwrapAll`
|
|
527
|
+
|
|
528
|
+
Request unwrap for the entire balance (requires manual finalization).
|
|
529
|
+
|
|
530
|
+
```ts
|
|
531
|
+
function useUnwrapAll(
|
|
532
|
+
config: UseZamaConfig,
|
|
533
|
+
options?: UseMutationOptions<Address, Error, void>,
|
|
534
|
+
): UseMutationResult<Address, Error, void>;
|
|
535
|
+
```
|
|
536
|
+
|
|
537
|
+
#### `useFinalizeUnwrap`
|
|
538
|
+
|
|
539
|
+
Complete an unwrap by providing the decryption proof.
|
|
540
|
+
|
|
541
|
+
```ts
|
|
542
|
+
function useFinalizeUnwrap(
|
|
543
|
+
config: UseZamaConfig,
|
|
544
|
+
options?: UseMutationOptions<Address, Error, FinalizeUnwrapParams>,
|
|
545
|
+
): UseMutationResult<Address, Error, FinalizeUnwrapParams>;
|
|
546
|
+
|
|
547
|
+
interface FinalizeUnwrapParams {
|
|
548
|
+
burnAmountHandle: Address;
|
|
549
|
+
}
|
|
550
|
+
```
|
|
551
|
+
|
|
552
|
+
### Approval Hooks
|
|
553
|
+
|
|
554
|
+
#### `useConfidentialApprove`
|
|
555
|
+
|
|
556
|
+
Set operator approval for the confidential token.
|
|
557
|
+
|
|
558
|
+
```ts
|
|
559
|
+
function useConfidentialApprove(
|
|
560
|
+
config: UseZamaConfig,
|
|
561
|
+
options?: UseMutationOptions<Address, Error, ConfidentialApproveParams>,
|
|
562
|
+
): UseMutationResult<Address, Error, ConfidentialApproveParams>;
|
|
563
|
+
|
|
564
|
+
interface ConfidentialApproveParams {
|
|
565
|
+
spender: Address;
|
|
566
|
+
until?: number; // Unix timestamp, defaults to now + 1 hour
|
|
567
|
+
}
|
|
568
|
+
```
|
|
569
|
+
|
|
570
|
+
#### `useConfidentialIsApproved`
|
|
571
|
+
|
|
572
|
+
Check if a spender is an approved operator. Enabled only when `spender` is defined.
|
|
573
|
+
|
|
574
|
+
```ts
|
|
575
|
+
function useConfidentialIsApproved(
|
|
576
|
+
config: UseZamaConfig,
|
|
577
|
+
spender: Address | undefined,
|
|
578
|
+
options?: Omit<UseQueryOptions<boolean, Error>, "queryKey" | "queryFn">,
|
|
579
|
+
): UseQueryResult<boolean, Error>;
|
|
580
|
+
```
|
|
581
|
+
|
|
582
|
+
#### `useUnderlyingAllowance`
|
|
583
|
+
|
|
584
|
+
Read the ERC-20 allowance of the underlying token for the wrapper.
|
|
585
|
+
|
|
586
|
+
```ts
|
|
587
|
+
function useUnderlyingAllowance(
|
|
588
|
+
config: UseUnderlyingAllowanceConfig,
|
|
589
|
+
options?: Omit<UseQueryOptions<bigint, Error>, "queryKey" | "queryFn">,
|
|
590
|
+
): UseQueryResult<bigint, Error>;
|
|
591
|
+
|
|
592
|
+
interface UseUnderlyingAllowanceConfig {
|
|
593
|
+
tokenAddress: Address;
|
|
594
|
+
wrapperAddress: Address;
|
|
595
|
+
}
|
|
596
|
+
```
|
|
597
|
+
|
|
598
|
+
### Discovery & Metadata
|
|
599
|
+
|
|
600
|
+
#### `useWrapperDiscovery`
|
|
601
|
+
|
|
602
|
+
Find the wrapper contract for a given token via the deployment coordinator. Enabled only when `coordinatorAddress` is defined. Results are cached indefinitely (`staleTime: Infinity`).
|
|
603
|
+
|
|
604
|
+
```ts
|
|
605
|
+
function useWrapperDiscovery(
|
|
606
|
+
config: UseWrapperDiscoveryConfig,
|
|
607
|
+
options?: Omit<UseQueryOptions<Address | null, Error>, "queryKey" | "queryFn">,
|
|
608
|
+
): UseQueryResult<Address | null, Error>;
|
|
609
|
+
|
|
610
|
+
interface UseWrapperDiscoveryConfig {
|
|
611
|
+
tokenAddress: Address;
|
|
612
|
+
coordinatorAddress: Address | undefined;
|
|
613
|
+
}
|
|
614
|
+
```
|
|
615
|
+
|
|
616
|
+
#### `useTokenMetadata`
|
|
617
|
+
|
|
618
|
+
Fetch token name, symbol, and decimals in parallel. Cached indefinitely.
|
|
619
|
+
|
|
620
|
+
```ts
|
|
621
|
+
function useTokenMetadata(
|
|
622
|
+
tokenAddress: Address,
|
|
623
|
+
options?: Omit<UseQueryOptions<TokenMetadata, Error>, "queryKey" | "queryFn">,
|
|
624
|
+
): UseQueryResult<TokenMetadata, Error>;
|
|
625
|
+
|
|
626
|
+
interface TokenMetadata {
|
|
627
|
+
name: string;
|
|
628
|
+
symbol: string;
|
|
629
|
+
decimals: number;
|
|
630
|
+
}
|
|
631
|
+
```
|
|
632
|
+
|
|
633
|
+
```tsx
|
|
634
|
+
const { data: meta } = useTokenMetadata("0xTokenAddress");
|
|
635
|
+
// meta?.name, meta?.symbol, meta?.decimals
|
|
636
|
+
```
|
|
637
|
+
|
|
638
|
+
### Activity Feed
|
|
639
|
+
|
|
640
|
+
#### `useActivityFeed`
|
|
641
|
+
|
|
642
|
+
Parse raw event logs into a classified, optionally decrypted activity feed.
|
|
643
|
+
|
|
644
|
+
```ts
|
|
645
|
+
function useActivityFeed(config: UseActivityFeedConfig): UseQueryResult<ActivityItem[], Error>;
|
|
646
|
+
|
|
647
|
+
interface UseActivityFeedConfig {
|
|
648
|
+
tokenAddress: Address;
|
|
649
|
+
userAddress: Address | undefined;
|
|
650
|
+
logs: readonly (RawLog & Partial<ActivityLogMetadata>)[] | undefined;
|
|
651
|
+
decrypt?: boolean; // default: true — batch-decrypt encrypted amounts
|
|
652
|
+
}
|
|
653
|
+
```
|
|
654
|
+
|
|
655
|
+
Enabled when both `logs` and `userAddress` are defined. When `decrypt` is `true` (default), encrypted transfer amounts are automatically decrypted via the relayer.
|
|
656
|
+
|
|
657
|
+
```tsx
|
|
658
|
+
const { data: feed } = useActivityFeed({
|
|
659
|
+
tokenAddress: "0xTokenAddress",
|
|
660
|
+
logs, // from getLogs or a similar source
|
|
661
|
+
userAddress,
|
|
662
|
+
decrypt: true,
|
|
663
|
+
});
|
|
664
|
+
|
|
665
|
+
feed?.forEach((item) => {
|
|
666
|
+
console.log(item.type, item.direction, item.amount);
|
|
667
|
+
});
|
|
668
|
+
```
|
|
669
|
+
|
|
670
|
+
### Fee Hooks
|
|
671
|
+
|
|
672
|
+
#### `useShieldFee`
|
|
673
|
+
|
|
674
|
+
Read the shield (wrap) fee for a given amount and address pair.
|
|
675
|
+
|
|
676
|
+
```ts
|
|
677
|
+
function useShieldFee(
|
|
678
|
+
config: UseFeeConfig,
|
|
679
|
+
options?: Omit<UseQueryOptions<bigint, Error>, "queryKey" | "queryFn">,
|
|
680
|
+
): UseQueryResult<bigint, Error>;
|
|
681
|
+
|
|
682
|
+
interface UseFeeConfig {
|
|
683
|
+
feeManagerAddress: Address;
|
|
684
|
+
amount: bigint;
|
|
685
|
+
from: Address;
|
|
686
|
+
to: Address;
|
|
687
|
+
}
|
|
688
|
+
```
|
|
689
|
+
|
|
690
|
+
```tsx
|
|
691
|
+
const { data: fee } = useShieldFee({
|
|
692
|
+
feeManagerAddress: "0xFeeManager",
|
|
693
|
+
amount: 1000n,
|
|
694
|
+
from: "0xSender",
|
|
695
|
+
to: "0xReceiver",
|
|
696
|
+
});
|
|
697
|
+
```
|
|
698
|
+
|
|
699
|
+
#### `useUnshieldFee`
|
|
700
|
+
|
|
701
|
+
Read the unshield (unwrap) fee for a given amount and address pair. Same signature as `useShieldFee`.
|
|
702
|
+
|
|
703
|
+
#### `useBatchTransferFee`
|
|
704
|
+
|
|
705
|
+
Read the batch transfer fee from the fee manager.
|
|
706
|
+
|
|
707
|
+
```ts
|
|
708
|
+
function useBatchTransferFee(
|
|
709
|
+
feeManagerAddress: Address,
|
|
710
|
+
options?: Omit<UseQueryOptions<bigint, Error>, "queryKey" | "queryFn">,
|
|
711
|
+
): UseQueryResult<bigint, Error>;
|
|
712
|
+
```
|
|
713
|
+
|
|
714
|
+
#### `useFeeRecipient`
|
|
715
|
+
|
|
716
|
+
Read the fee recipient address from the fee manager.
|
|
717
|
+
|
|
718
|
+
```ts
|
|
719
|
+
function useFeeRecipient(
|
|
720
|
+
feeManagerAddress: Address,
|
|
721
|
+
options?: Omit<UseQueryOptions<Address, Error>, "queryKey" | "queryFn">,
|
|
722
|
+
): UseQueryResult<Address, Error>;
|
|
723
|
+
```
|
|
724
|
+
|
|
725
|
+
### Low-Level FHE Hooks
|
|
726
|
+
|
|
727
|
+
These hooks expose the raw `RelayerSDK` operations as React Query mutations.
|
|
728
|
+
|
|
729
|
+
#### Encryption & Decryption
|
|
730
|
+
|
|
731
|
+
| Hook | Input | Output | Description |
|
|
732
|
+
| --------------------------- | ---------------------------- | ------------------------ | -------------------------------------------------------------------- |
|
|
733
|
+
| `useEncrypt()` | `EncryptParams` | `EncryptResult` | Encrypt values for smart contract calls. |
|
|
734
|
+
| `useUserDecrypt()` | `UserDecryptParams` | `Record<string, bigint>` | Decrypt with user's FHE private key. Populates the decryption cache. |
|
|
735
|
+
| `usePublicDecrypt()` | `string[]` (handles) | `PublicDecryptResult` | Public decryption. Populates the decryption cache. |
|
|
736
|
+
| `useDelegatedUserDecrypt()` | `DelegatedUserDecryptParams` | `Record<string, bigint>` | Decrypt via delegation. |
|
|
737
|
+
|
|
738
|
+
#### Key Management
|
|
739
|
+
|
|
740
|
+
| Hook | Input | Output | Description |
|
|
741
|
+
| --------------------------------------- | ---------------------------------------- | ----------------------------------- | ---------------------------------------------------- |
|
|
742
|
+
| `useGenerateKeypair()` | `void` | `FHEKeypair` | Generate an FHE keypair. |
|
|
743
|
+
| `useCreateEIP712()` | `CreateEIP712Params` | `EIP712TypedData` | Create EIP-712 typed data for decrypt authorization. |
|
|
744
|
+
| `useCreateDelegatedUserDecryptEIP712()` | `CreateDelegatedUserDecryptEIP712Params` | `KmsDelegatedUserDecryptEIP712Type` | Create EIP-712 for delegated decryption. |
|
|
745
|
+
| `useRequestZKProofVerification()` | `ZKProofLike` | `InputProofBytesType` | Submit a ZK proof for verification. |
|
|
746
|
+
|
|
747
|
+
#### Network
|
|
748
|
+
|
|
749
|
+
| Hook | Input | Output | Description |
|
|
750
|
+
| ------------------- | --------------- | ------------------------------------------ | ------------------------------------- |
|
|
751
|
+
| `usePublicKey()` | `void` | `{ publicKeyId, publicKey } \| null` | Get the TFHE compact public key. |
|
|
752
|
+
| `usePublicParams()` | `number` (bits) | `{ publicParams, publicParamsId } \| null` | Get public parameters for encryption. |
|
|
753
|
+
|
|
754
|
+
### Decryption Cache Hooks
|
|
755
|
+
|
|
756
|
+
`useUserDecrypt` and `usePublicDecrypt` populate a shared React Query cache. These hooks read from that cache without triggering new decryption requests.
|
|
757
|
+
|
|
758
|
+
```ts
|
|
759
|
+
// Single handle
|
|
760
|
+
function useUserDecryptedValue(handle: string | undefined): UseQueryResult<bigint>;
|
|
761
|
+
|
|
762
|
+
// Multiple handles
|
|
763
|
+
function useUserDecryptedValues(handles: string[]): {
|
|
764
|
+
data: Record<string, bigint | undefined>;
|
|
765
|
+
results: UseQueryResult<bigint>[];
|
|
766
|
+
};
|
|
767
|
+
```
|
|
768
|
+
|
|
769
|
+
```tsx
|
|
770
|
+
// First, trigger decryption
|
|
771
|
+
const { mutateAsync: decrypt } = useUserDecrypt();
|
|
772
|
+
await decrypt(decryptParams);
|
|
773
|
+
|
|
774
|
+
// Then read cached results anywhere in the tree
|
|
775
|
+
const { data: value } = useUserDecryptedValue("0xHandleHash");
|
|
776
|
+
```
|
|
777
|
+
|
|
778
|
+
## Query Keys
|
|
779
|
+
|
|
780
|
+
Exported query key factories for manual cache management (invalidation, prefetching, removal).
|
|
781
|
+
|
|
782
|
+
```ts
|
|
783
|
+
import {
|
|
784
|
+
confidentialBalanceQueryKeys,
|
|
785
|
+
confidentialBalancesQueryKeys,
|
|
786
|
+
confidentialHandleQueryKeys,
|
|
787
|
+
confidentialHandlesQueryKeys,
|
|
788
|
+
underlyingAllowanceQueryKeys,
|
|
789
|
+
activityFeedQueryKeys,
|
|
790
|
+
feeQueryKeys,
|
|
791
|
+
decryptionKeys,
|
|
792
|
+
} from "@zama-fhe/react-sdk";
|
|
793
|
+
```
|
|
794
|
+
|
|
795
|
+
| Factory | Keys | Description |
|
|
796
|
+
| ------------------------------- | ---------------------------------------------------------------------------------------- | ----------------------------------- |
|
|
797
|
+
| `confidentialBalanceQueryKeys` | `.all`, `.token(address)`, `.owner(address, owner)` | Single-token decrypted balance. |
|
|
798
|
+
| `confidentialBalancesQueryKeys` | `.all`, `.tokens(addresses, owner)` | Multi-token batch balances. |
|
|
799
|
+
| `confidentialHandleQueryKeys` | `.all`, `.token(address)`, `.owner(address, owner)` | Single-token encrypted handle. |
|
|
800
|
+
| `confidentialHandlesQueryKeys` | `.all`, `.tokens(addresses, owner)` | Multi-token batch handles. |
|
|
801
|
+
| `underlyingAllowanceQueryKeys` | `.all`, `.token(address, wrapper)` | Underlying ERC-20 allowance. |
|
|
802
|
+
| `activityFeedQueryKeys` | `.all`, `.token(address)` | Activity feed items. |
|
|
803
|
+
| `feeQueryKeys` | `.shieldFee(...)`, `.unshieldFee(...)`, `.batchTransferFee(addr)`, `.feeRecipient(addr)` | Fee manager queries. |
|
|
804
|
+
| `decryptionKeys` | `.value(handle)` | Individual decrypted handle values. |
|
|
805
|
+
|
|
806
|
+
```tsx
|
|
807
|
+
import { useQueryClient } from "@tanstack/react-query";
|
|
808
|
+
import { confidentialBalanceQueryKeys } from "@zama-fhe/react-sdk";
|
|
809
|
+
|
|
810
|
+
const queryClient = useQueryClient();
|
|
811
|
+
|
|
812
|
+
// Invalidate all balances
|
|
813
|
+
queryClient.invalidateQueries({ queryKey: confidentialBalanceQueryKeys.all });
|
|
814
|
+
|
|
815
|
+
// Invalidate a specific token's balance
|
|
816
|
+
queryClient.invalidateQueries({
|
|
817
|
+
queryKey: confidentialBalanceQueryKeys.token("0xTokenAddress"),
|
|
818
|
+
});
|
|
819
|
+
```
|
|
820
|
+
|
|
821
|
+
## Wagmi Adapter Hooks
|
|
822
|
+
|
|
823
|
+
`@zama-fhe/react-sdk/wagmi` exports low-level hooks that wrap wagmi's `useReadContract` and `useWriteContract` directly. These do **not** use the SDK provider for their contract calls — they operate through wagmi's `Config`. Use them for advanced scenarios where you need fine-grained control.
|
|
824
|
+
|
|
825
|
+
### Read Hooks
|
|
826
|
+
|
|
827
|
+
| Hook | Parameters | Description |
|
|
828
|
+
| -------------------------------------------- | ------------------------------- | ---------------------------------------------------------- |
|
|
829
|
+
| `useBalanceOf(token, user?)` | Token and optional user address | ERC-20 balance with symbol, decimals, and formatted value. |
|
|
830
|
+
| `useConfidentialBalanceOf(token?, user?)` | Token and user addresses | Read encrypted balance handle. |
|
|
831
|
+
| `useWrapperForToken(coordinator?, token?)` | Coordinator and token addresses | Look up wrapper for token. |
|
|
832
|
+
| `useUnderlyingToken(wrapper?)` | Wrapper address | Read underlying ERC-20 address. |
|
|
833
|
+
| `useWrapperExists(coordinator?, token?)` | Coordinator and token addresses | Check if wrapper exists. |
|
|
834
|
+
| `useSupportsInterface(token?, interfaceId?)` | Token address and interface ID | ERC-165 support check. |
|
|
835
|
+
|
|
836
|
+
All read hooks are enabled only when their required parameters are defined. All read hooks have `*Suspense` variants for use with React Suspense boundaries.
|
|
837
|
+
|
|
838
|
+
### Write Hooks
|
|
839
|
+
|
|
840
|
+
All write hooks return `{ mutate, mutateAsync, ...mutation }` from wagmi's `useWriteContract`.
|
|
841
|
+
|
|
842
|
+
| Hook | Mutation Parameters | Description |
|
|
843
|
+
| -------------------------------- | ------------------------------------------------ | ----------------------------- |
|
|
844
|
+
| `useConfidentialTransfer()` | `(token, to, handle, inputProof)` | Encrypted transfer. |
|
|
845
|
+
| `useConfidentialBatchTransfer()` | `(batcher, token, from, transfers, fees)` | Batch encrypted transfer. |
|
|
846
|
+
| `useUnwrap()` | `(token, from, to, encryptedAmount, inputProof)` | Request unwrap. |
|
|
847
|
+
| `useUnwrapFromBalance()` | `(token, from, to, encryptedBalance)` | Unwrap using on-chain handle. |
|
|
848
|
+
| `useFinalizeUnwrap()` | `(wrapper, burntAmount, cleartext, proof)` | Finalize unwrap. |
|
|
849
|
+
| `useSetOperator()` | `(token, spender, timestamp?)` | Set operator approval. |
|
|
850
|
+
| `useShield()` | `(wrapper, to, amount)` | Shield ERC-20 tokens. |
|
|
851
|
+
| `useShieldETH()` | `(wrapper, to, amount, value)` | Shield native ETH. |
|
|
852
|
+
|
|
853
|
+
### Wagmi Signer Adapter
|
|
854
|
+
|
|
855
|
+
```ts
|
|
856
|
+
import { WagmiSigner } from "@zama-fhe/react-sdk/wagmi";
|
|
857
|
+
|
|
858
|
+
const signer = new WagmiSigner({ config: wagmiConfig });
|
|
859
|
+
```
|
|
860
|
+
|
|
861
|
+
## Viem & Ethers Adapter Hooks
|
|
862
|
+
|
|
863
|
+
Both `@zama-fhe/react-sdk/viem` and `@zama-fhe/react-sdk/ethers` export the same set of read/write hooks, but typed for their respective libraries. They also include `Suspense` variants of all read hooks.
|
|
864
|
+
|
|
865
|
+
### Read hooks
|
|
866
|
+
|
|
867
|
+
`useConfidentialBalanceOf`, `useWrapperForToken`, `useUnderlyingToken`, `useWrapperExists`, `useSupportsInterface` — plus `*Suspense` variants.
|
|
868
|
+
|
|
869
|
+
- **viem:** First parameter is `PublicClient`.
|
|
870
|
+
- **ethers:** First parameter is `Provider | Signer`.
|
|
871
|
+
|
|
872
|
+
### Write hooks
|
|
873
|
+
|
|
874
|
+
`useConfidentialTransfer`, `useConfidentialBatchTransfer`, `useUnwrap`, `useUnwrapFromBalance`, `useFinalizeUnwrap`, `useSetOperator`, `useShield`, `useShieldETH`.
|
|
875
|
+
|
|
876
|
+
- **viem:** Mutation params include `client: WalletClient`.
|
|
877
|
+
- **ethers:** Mutation params include `signer: Signer`.
|
|
878
|
+
|
|
879
|
+
### Signer adapters
|
|
880
|
+
|
|
881
|
+
```ts
|
|
882
|
+
// Re-exported for convenience
|
|
883
|
+
import { ViemSigner } from "@zama-fhe/react-sdk/viem";
|
|
884
|
+
import { EthersSigner } from "@zama-fhe/react-sdk/ethers";
|
|
885
|
+
```
|
|
886
|
+
|
|
887
|
+
## Wallet Integration Guide
|
|
888
|
+
|
|
889
|
+
### SSR / Next.js
|
|
890
|
+
|
|
891
|
+
All components using SDK hooks must be client components. Add `"use client"` at the top of files that import from `@zama-fhe/react-sdk`. FHE operations (encryption, decryption) run in a Web Worker and require browser APIs — they cannot execute on the server.
|
|
892
|
+
|
|
893
|
+
```tsx
|
|
894
|
+
"use client";
|
|
895
|
+
|
|
896
|
+
import { useConfidentialBalance } from "@zama-fhe/react-sdk";
|
|
897
|
+
```
|
|
898
|
+
|
|
899
|
+
Place `ZamaProvider` inside your client-only layout. Do **not** create the relayer or signer at the module level in a server component — wrap them in a client component or use lazy initialization.
|
|
900
|
+
|
|
901
|
+
### FHE Credentials Lifecycle
|
|
902
|
+
|
|
903
|
+
FHE decrypt credentials are generated once per wallet + token set and cached in the storage backend you provide (e.g. `IndexedDBStorage`). The lifecycle:
|
|
904
|
+
|
|
905
|
+
1. **First decrypt** — SDK generates an FHE keypair, creates EIP-712 typed data, and prompts the wallet to sign. The signed credential is stored.
|
|
906
|
+
2. **Subsequent decrypts** — If cached credentials cover the requested token, they're reused silently (no wallet prompt).
|
|
907
|
+
3. **Expiry** — Credentials expire based on `durationDays`. After expiry, the next decrypt re-prompts the wallet.
|
|
908
|
+
4. **Pre-authorization** — Call `useAuthorizeAll(tokenAddresses)` early to batch-authorize all tokens in one wallet prompt, avoiding repeated popups.
|
|
909
|
+
|
|
910
|
+
### Error-to-User-Message Mapping
|
|
911
|
+
|
|
912
|
+
Map SDK errors to user-friendly messages in your UI:
|
|
913
|
+
|
|
914
|
+
```tsx
|
|
915
|
+
import {
|
|
916
|
+
SigningRejectedError,
|
|
917
|
+
EncryptionFailedError,
|
|
918
|
+
DecryptionFailedError,
|
|
919
|
+
TransactionRevertedError,
|
|
920
|
+
ApprovalFailedError,
|
|
921
|
+
} from "@zama-fhe/react-sdk";
|
|
922
|
+
|
|
923
|
+
function getUserMessage(error: Error): string {
|
|
924
|
+
if (error instanceof SigningRejectedError)
|
|
925
|
+
return "Transaction cancelled — please approve in your wallet.";
|
|
926
|
+
if (error instanceof EncryptionFailedError) return "Encryption failed — please try again.";
|
|
927
|
+
if (error instanceof DecryptionFailedError) return "Decryption failed — please try again.";
|
|
928
|
+
if (error instanceof ApprovalFailedError) return "Token approval failed — please try again.";
|
|
929
|
+
if (error instanceof TransactionRevertedError)
|
|
930
|
+
return "Transaction failed on-chain — check your balance.";
|
|
931
|
+
return "An unexpected error occurred.";
|
|
932
|
+
}
|
|
933
|
+
```
|
|
934
|
+
|
|
935
|
+
Or use `matchZamaError` for a more concise pattern:
|
|
936
|
+
|
|
937
|
+
```tsx
|
|
938
|
+
import { matchZamaError } from "@zama-fhe/react-sdk";
|
|
939
|
+
|
|
940
|
+
const message = matchZamaError(error, {
|
|
941
|
+
SIGNING_REJECTED: () => "Transaction cancelled — please approve in your wallet.",
|
|
942
|
+
ENCRYPTION_FAILED: () => "Encryption failed — please try again.",
|
|
943
|
+
DECRYPTION_FAILED: () => "Decryption failed — please try again.",
|
|
944
|
+
APPROVAL_FAILED: () => "Token approval failed — please try again.",
|
|
945
|
+
TRANSACTION_REVERTED: () => "Transaction failed on-chain — check your balance.",
|
|
946
|
+
_: () => "An unexpected error occurred.",
|
|
947
|
+
});
|
|
948
|
+
```
|
|
949
|
+
|
|
950
|
+
### Balance Caching and Refresh
|
|
951
|
+
|
|
952
|
+
Balance queries use two-phase polling:
|
|
953
|
+
|
|
954
|
+
1. **Phase 1 (cheap)** — Polls the encrypted balance handle via a read-only RPC call at `handleRefetchInterval` (default: 10s).
|
|
955
|
+
2. **Phase 2 (expensive)** — Only when the handle changes (i.e. balance updated on-chain), triggers an FHE decryption via the relayer.
|
|
956
|
+
|
|
957
|
+
This means balances update within `handleRefetchInterval` ms of any on-chain change, without wasting decryption resources. Mutation hooks (`useConfidentialTransfer`, `useShield`, `useUnshield`, etc.) automatically invalidate the relevant caches on success, so the UI updates immediately after user actions.
|
|
958
|
+
|
|
959
|
+
To force a refresh:
|
|
960
|
+
|
|
961
|
+
```tsx
|
|
962
|
+
const queryClient = useQueryClient();
|
|
963
|
+
queryClient.invalidateQueries({ queryKey: confidentialBalanceQueryKeys.all });
|
|
964
|
+
```
|
|
965
|
+
|
|
966
|
+
## Re-exports from Core SDK
|
|
967
|
+
|
|
968
|
+
All public exports from `@zama-fhe/sdk` are re-exported from the main entry point. You never need to import from the core package directly.
|
|
969
|
+
|
|
970
|
+
**Classes:** `RelayerWeb`, `ZamaSDK`, `Token`, `ReadonlyToken`, `MemoryStorage`, `memoryStorage`, `IndexedDBStorage`, `indexedDBStorage`, `CredentialsManager`.
|
|
971
|
+
|
|
972
|
+
**Network configs:** `SepoliaConfig`, `MainnetConfig`, `HardhatConfig`.
|
|
973
|
+
|
|
974
|
+
**Pending unshield:** `savePendingUnshield`, `loadPendingUnshield`, `clearPendingUnshield`.
|
|
975
|
+
|
|
976
|
+
**Types:** `Address`, `ZamaSDKConfig`, `ZamaConfig`, `ReadonlyTokenConfig`, `NetworkType`, `RelayerSDK`, `RelayerSDKStatus`, `EncryptResult`, `EncryptParams`, `UserDecryptParams`, `PublicDecryptResult`, `FHEKeypair`, `EIP712TypedData`, `DelegatedUserDecryptParams`, `KmsDelegatedUserDecryptEIP712Type`, `ZKProofLike`, `InputProofBytesType`, `BatchTransferData`, `StoredCredentials`, `GenericSigner`, `GenericStringStorage`, `ContractCallConfig`, `TransactionReceipt`, `TransactionResult`, `UnshieldCallbacks`.
|
|
977
|
+
|
|
978
|
+
**Errors:** `ZamaError`, `ZamaErrorCode`, `SigningRejectedError`, `SigningFailedError`, `EncryptionFailedError`, `DecryptionFailedError`, `ApprovalFailedError`, `TransactionRevertedError`, `InvalidCredentialsError`, `NoCiphertextError`, `RelayerRequestFailedError`, `matchZamaError`.
|
|
979
|
+
|
|
980
|
+
**Constants:** `ZERO_HANDLE`, `ERC7984_INTERFACE_ID`, `ERC7984_WRAPPER_INTERFACE_ID`.
|
|
981
|
+
|
|
982
|
+
**ABIs:** `ERC20_ABI`, `ERC20_METADATA_ABI`, `DEPLOYMENT_COORDINATOR_ABI`, `ERC165_ABI`, `ENCRYPTION_ABI`, `FEE_MANAGER_ABI`, `TRANSFER_BATCHER_ABI`, `WRAPPER_ABI`, `BATCH_SWAP_ABI`.
|
|
983
|
+
|
|
984
|
+
**Events:** `RawLog`, `ConfidentialTransferEvent`, `WrappedEvent`, `UnwrapRequestedEvent`, `UnwrappedFinalizedEvent`, `UnwrappedStartedEvent`, `OnChainEvent`, `Topics`, `TOKEN_TOPICS`.
|
|
985
|
+
|
|
986
|
+
**Event decoders:** `decodeConfidentialTransfer`, `decodeWrapped`, `decodeUnwrapRequested`, `decodeUnwrappedFinalized`, `decodeUnwrappedStarted`, `decodeOnChainEvent`, `decodeOnChainEvents`, `findUnwrapRequested`, `findWrapped`.
|
|
987
|
+
|
|
988
|
+
**Activity feed:** `ActivityDirection`, `ActivityType`, `ActivityAmount`, `ActivityLogMetadata`, `ActivityItem`, `parseActivityFeed`, `extractEncryptedHandles`, `applyDecryptedValues`, `sortByBlockNumber`.
|
|
989
|
+
|
|
990
|
+
**Contract call builders:** All 31 builders — `confidentialBalanceOfContract`, `confidentialTransferContract`, `confidentialTransferFromContract`, `isOperatorContract`, `confidentialBatchTransferContract`, `unwrapContract`, `unwrapFromBalanceContract`, `finalizeUnwrapContract`, `setOperatorContract`, `getWrapperContract`, `wrapperExistsContract`, `underlyingContract`, `wrapContract`, `wrapETHContract`, `supportsInterfaceContract`, `nameContract`, `symbolContract`, `decimalsContract`, `allowanceContract`, `approveContract`, `confidentialTotalSupplyContract`, `totalSupplyContract`, `rateContract`, `deploymentCoordinatorContract`, `isFinalizeUnwrapOperatorContract`, `setFinalizeUnwrapOperatorContract`, `getWrapFeeContract`, `getUnwrapFeeContract`, `getBatchTransferFeeContract`, `getFeeRecipientContract`.
|