[](https://github.com/qubickit/jskit-react/actions/workflows/ci.yml) [](https://www.npmjs.com/package/@qubic
npm install @qubic-labs/react

React bindings for @qubic-labs/sdk built on @tanstack/react-query.
``bash`
bun add @qubic-labs/react @qubic-labs/sdk @tanstack/react-query react react-dom
@qubic-labs/sdk (via @qubic-labs/core) includes Node-only modules (for example node:net). In Next.js, importing it from a Client Component will fail during bundling.
Use it from a Server Component or Route Handler instead, then call it from the client.
`tsx
import { QueryClient } from "@tanstack/react-query";
import { createSdk } from "@qubic-labs/sdk";
import { QubicQueryProvider, SdkProvider, useBalance } from "@qubic-labs/react";
const queryClient = new QueryClient();
const sdk = createSdk({ baseUrl: "https://rpc.qubic.org" });
function BalanceCard({ identity }: { identity: string }) {
const balance = useBalance(identity, { refetchInterval: 10_000 });
if (balance.isLoading) return
export function App() {
return (
);
}
`
- docs/setup.mddocs/hooks.md
- docs/qbi.md
- docs/wallets.md
- docs/vaults.md
-
- examples/basic.tsxexamples/transactions.tsx
- examples/qbi.tsx
-
`bash``from jskit-react/
bun add @qubic-labs/sdk@file:../jskit-sdk