framework-kit

framework-kit (@solana/client + @solana/react-hooks) is the Solana Foundation's reactive toolkit, built on @solana/kit. It is the recommended modern Solana stack: butr discovers and manages the wallet, framework-kit is the reactive RPC and data layer, and the wallet's Wallet Standard features supply signing and submission.

framework-kit runs its own Wallet Standard discovery (autoDiscover()). Here butr owns discovery and connection instead, so createClient gets no walletConnectors; framework-kit is used purely for reactive reads.

ProvidersCopy Anchor Link

Create the client without wallet connectors. butr's provider stays the outer one:

import { createClient } from "@solana/client";
import { SolanaProvider } from "@solana/react-hooks";
import type { WalletManagerConfig } from "@usebutr/core";
import { WalletManagerProvider } from "@usebutr/react";
import { discoverSvmAdapters } from "@usebutr/svm";

const config: WalletManagerConfig = { sources: [discoverSvmAdapters] };
const client = createClient({ cluster: "devnet", commitment: "confirmed" });

<WalletManagerProvider config={config}>
  <SolanaProvider client={client}>
    <App />
  </SolanaProvider>
</WalletManagerProvider>;

Reactive balanceCopy Anchor Link

framework-kit's useBalance fetches and watches the balance of butr's connected address, with no refetch wiring. It is not butr's useBalance, which stays idle on Solana because butr ships no Solana RPC:

import { useBalance } from "@solana/react-hooks";

const { error, fetching, lamports } = useBalance(wallet.account.walletAddress);
const balance = lamports === null ? "…" : `${Number(lamports) / 1_000_000_000} SOL`;

Sign and sendCopy Anchor Link

Get the wallet's Wallet Standard handle from useSigner, then sign and send through its features exactly as in the @solana/kit integration: transaction building rides on @solana/kit, the substrate framework-kit is built on.

import { useSelectedWallet, useSigner } from "@usebutr/react";

const wallet = useSelectedWallet("svm");
const signer = useSigner(wallet);
const walletStd = signer.data?.kind === "wallet-standard" ? signer.data.wallet : null;