API ReferenceReact provider and hooksFunction
AnvilProvider()
function AnvilProvider(props): ReactNode;React context provider that makes one configured AnvilSDK available to
every hook and component beneath it. Pass the instance as sdk and construct it once (module scope
or useMemo) so hooks keyed on the SDK do not refetch on every render.
The provider deliberately accepts an SDK instance rather than raw AnvilDependencies: the caller
owns its lifecycle and may update its wallet client or account in place without replacing active
workflows or query identity.
useAnvilSDK reads it and throws outside the provider;
useAnvilSDKOptional returns null instead. sdk may be null while the
SDK is still being built (e.g. before a wallet connects) — components that call useAnvilSDK must
not render until it is set.
The provider also supplies a TanStack QueryClient when the host application has none: an existing
host client is reused untouched, so mounting this inside an app that already owns one does not fork
its cache.
Parameters
| Parameter | Type | Description |
|---|---|---|
props | AnvilProviderProps | The SDK instance to publish and the subtree to publish it to. |
Returns
ReactNode
The subtree, wrapped in the SDK context and — only when the host supplies no query client — a
QueryClientProvider.
Example
export function App() { // Build the SDK once (module scope or useMemo); hooks key on it. return ( <AnvilProvider sdk={sdk}> <LOCBeneficiary id={1n} /> </AnvilProvider> );}
function LOCBeneficiary({ id }: { id: bigint }) { // Throws if this component renders outside <AnvilProvider>. const sdk = useAnvilSDK(); const [loc, setLoc] = useState<OutstandingLetterOfCredit>();
useEffect(() => { void sdk.loc.getOutstandingLetterOfCredit({ id }).then(setLoc); }, [sdk, id]);
return <p>Beneficiary: {loc?.beneficiary ?? 'loading'}</p>;}