The React SDK provides chain-specific hooks (useSolana and useEthereum) for signing and sending transactions with optimal blockchain-specific handling.
Embedded wallet limitations: The signTransaction and signAllTransactions methods aren’t supported for embedded wallets. For embedded wallets, use only signAndSendTransaction that signs and broadcasts the transaction in a single step.
Transaction security for embedded wallets: All transactions signed for embedded wallets pass through Phantom’s advanced simulation system before execution. This security layer automatically blocks malicious transactions and transactions from origins that have been reported as malicious, providing an additional layer of protection for your users’ assets.
Chain-specific transaction hooks
Solana transactions (useSolana)
import { useSolana } from "@phantom/react-sdk";
function SolanaTransactions() {
const { solana } = useSolana();
const sendTransaction = async () => {
// Sign and send transaction
const result = await solana.signAndSendTransaction(transaction);
console.log("Transaction sent:", result.hash);
};
const signOnly = async () => {
// Just sign (without sending) - Note: Not supported for embedded wallets
const signedTx = await solana.signTransaction(transaction);
console.log("Signed transaction:", signedTx);
};
return (
<div>
<button onClick={sendTransaction}>Send Transaction</button>
<button onClick={signOnly}>Sign Only</button>
</div>
);
}
Ethereum transactions (useEthereum)
import { useEthereum } from "@phantom/react-sdk";
function EthereumTransactions() {
const { ethereum } = useEthereum();
const sendTransaction = async () => {
const result = await ethereum.sendTransaction({
to: "0x742d35Cc6634C0532925a3b8D4C8db86fB5C4A7E",
value: "1000000000000000000", // 1 ETH in wei
gas: "21000",
});
console.log("Transaction sent:", result.hash);
};
return (
<button onClick={sendTransaction}>Send ETH</button>
);
}
presignTransaction callback to signAndSendTransaction for Solana transactions that need double signing, such as dapp fee payer flows. Calls without it proceed normally — it is never applied globally.
Phantom embedded wallets do not accept pre-signed transactions. If your use case requires a second signer (for example, your app as the fee payer), that signing must happen via this callback, after Phantom has constructed and validated the transaction. This restriction does not apply to injected providers (Phantom browser extension).
presignTransaction only fires for Solana transactions via the embedded provider. EVM transactions and injected providers are unaffected.
import { useSolana, base64urlDecode, base64urlEncode } from "@phantom/react-sdk";
function SendWithFeeSponsor() {
const { solana } = useSolana();
const sendSponsored = async () => {
const result = await solana.signAndSendTransaction(transaction, {
presignTransaction: async (tx, context) => {
// Send the transaction to your backend for fee payer signing
const response = await fetch("/api/presign", {
method: "POST",
body: JSON.stringify({ transaction: tx, networkId: context.networkId }),
headers: { "Content-Type": "application/json" },
});
const { transaction: signedTx } = await response.json();
return signedTx; // base64url-encoded, partially signed by the fee payer
},
});
console.log("Sponsored transaction sent:", result.hash);
};
const sendNormal = async () => {
const result = await solana.signAndSendTransaction(transaction);
console.log("Normal transaction sent:", result.hash);
};
return (
<div>
<button onClick={sendSponsored}>Send (Dapp Pays Fees)</button>
<button onClick={sendNormal}>Send (User Pays Fees)</button>
</div>
);
}
Never hold a fee payer keypair in frontend code. The presignTransaction callback runs in the browser — use it to call your own backend, which holds the keypair securely and returns the partially-signed transaction.
Transaction examples
Solana with @solana/web3.js
import { VersionedTransaction, TransactionMessage, SystemProgram, PublicKey, Connection } from "@solana/web3.js";
import { useSolana } from "@phantom/react-sdk";
function SolanaExample() {
const { solana } = useSolana();
const sendTransaction = async () => {
// Get recent blockhash
const connection = new Connection("https://api.mainnet-beta.solana.com");
const { blockhash } = await connection.getLatestBlockhash();
// Create transfer instruction
const fromAddress = await solana.getPublicKey();
const transferInstruction = SystemProgram.transfer({
fromPubkey: new PublicKey(fromAddress),
toPubkey: new PublicKey(toAddress),
lamports: 1000000, // 0.001 SOL
});
// Create VersionedTransaction
const messageV0 = new TransactionMessage({
payerKey: new PublicKey(fromAddress),
recentBlockhash: blockhash,
instructions: [transferInstruction],
}).compileToV0Message();
const transaction = new VersionedTransaction(messageV0);
// Sign and send using chain-specific hook
const result = await solana.signAndSendTransaction(transaction);
console.log("Transaction sent:", result.hash);
};
return <button onClick={sendTransaction}>Send SOL</button>;
}
Solana with @solana/kit
import {
createSolanaRpc,
pipe,
createTransactionMessage,
setTransactionMessageFeePayer,
setTransactionMessageLifetimeUsingBlockhash,
address,
compileTransaction,
} from "@solana/kit";
import { useSolana } from "@phantom/react-sdk";
function SolanaKitExample() {
const { solana } = useSolana();
const sendTransaction = async () => {
const rpc = createSolanaRpc("https://api.mainnet-beta.solana.com");
const { value: latestBlockhash } = await rpc.getLatestBlockhash().send();
const userPublicKey = await solana.getPublicKey();
const transactionMessage = pipe(
createTransactionMessage({ version: 0 }),
tx => setTransactionMessageFeePayer(address(userPublicKey), tx),
tx => setTransactionMessageLifetimeUsingBlockhash(latestBlockhash, tx),
);
const transaction = compileTransaction(transactionMessage);
// Sign and send using chain-specific hook
const result = await solana.signAndSendTransaction(transaction);
console.log("Transaction sent:", result.hash);
};
return <button onClick={sendTransaction}>Send SOL</button>;
}
presignTransaction hook lets your app co-sign the transaction before the wallet signs it, enabling use cases like:
- Dapp-as-fee-payer — your app covers the transaction fee so users don’t need SOL
- Platform fees — add a fee instruction signed by your app’s keypair
- Multi-signer flows — any scenario where the app needs to sign alongside the user’s wallet
Phantom embedded wallets do not accept pre-signed transactions. If your use case requires a second signer, this hook is the only supported approach — your app’s signing must happen after Phantom has constructed and validated the transaction. This restriction does not apply to injected providers (e.g. the Phantom browser extension).
presignTransaction directly to signAndSendTransaction for the specific calls that need it. Calls without it proceed normally — the function is never applied globally.
Example: app as fee payer
import { useSolana, base64urlDecode, base64urlEncode } from "@phantom/react-sdk";
import { Keypair, VersionedTransaction } from "@solana/web3.js";
// Your app's fee payer keypair (keep this on your backend in production)
const feePayerKeypair = Keypair.fromSecretKey(/* your fee payer secret key */);
function SendWithFeeSponsor() {
const { solana } = useSolana();
const sendSponsored = async () => {
const result = await solana.signAndSendTransaction(transaction, {
presignTransaction: async (tx, context) => {
// tx: base64url-encoded Solana transaction bytes
// context: { networkId: string, walletId: string }
// 1. Decode base64url → raw bytes
const txBytes = base64urlDecode(tx);
// 2. Deserialize
const versionedTx = VersionedTransaction.deserialize(txBytes);
// 3. Partially sign as fee payer — the user's wallet will sign next
versionedTx.sign([feePayerKeypair]);
// 4. Re-serialize → encode back to base64url
return base64urlEncode(versionedTx.serialize());
},
});
console.log("Transaction sent:", result.signature);
};
// This call has no presignTransaction — proceeds without any co-signing
const sendNormal = async () => {
const result = await solana.signAndSendTransaction(transaction);
console.log("Transaction sent:", result.signature);
};
}
The hook only fires for Solana transactions via the embedded provider. EVM transactions and injected providers are unaffected.
Ethereum with viem
import { parseEther, parseGwei, encodeFunctionData } from "viem";
import { useEthereum } from "@phantom/react-sdk";
function EthereumExample() {
const { ethereum } = useEthereum();
const sendEth = async () => {
const result = await ethereum.sendTransaction({
to: "0x742d35Cc6634C0532925a3b8D4C8db86fB5C4A7E",
value: parseEther("1").toString(), // 1 ETH
gas: "21000",
gasPrice: parseGwei("20").toString(), // 20 gwei
});
console.log("ETH sent:", result.hash);
};
const sendToken = async () => {
const result = await ethereum.sendTransaction({
to: tokenContractAddress,
data: encodeFunctionData({
abi: erc20Abi,
functionName: "transfer",
args: [recipientAddress, parseEther("100")],
}),
gas: "50000",
maxFeePerGas: parseGwei("30").toString(),
maxPriorityFeePerGas: parseGwei("2").toString(),
});
console.log("Token sent:", result.hash);
};
return (
<div>
<button onClick={sendEth}>Send ETH</button>
<button onClick={sendToken}>Send Token</button>
</div>
);
}
