Core SDK Integration
The @prepaid-gas/core
package provides the SDK for integrating user-owned gas credits into your dApp.
Installation
npm install @prepaid-gas/core viem permissionless
Note:
viem
is a peer dependency. Make sure you install version^2.28.1
or compatible.
Basic Integration
import { PrepaidGasPaymaster } from '@prepaid-gas/core'
import { createSmartAccountClient } from 'permissionless'
// 1. Create paymaster client for Base Sepolia
const paymaster = PrepaidGasPaymaster.createForNetwork(84532)
// 2. Get user's paymaster context (from their gas card purchase)
const userPaymasterContext = getUserPaymasterContext() // User provides this
// 3. Configure smart account client
const smartAccountClient = createSmartAccountClient({
// ... your smart account configuration
paymaster: {
getPaymasterStubData: (params) => paymaster.getPaymasterStubData(params),
getPaymasterData: (params) => paymaster.getPaymasterData(params)
},
paymasterContext: userPaymasterContext
})
// 4. Regular transactions now use user's gas credits
const txHash = await smartAccountClient.writeContract({
address: contractAddress,
abi: contractAbi,
functionName: 'yourFunction',
args: [param1, param2]
})
How Users Get Gas Credits
Your users visit testnet.prepaidgas.xyz to:
- Buy gas credits by depositing ETH
- Get an encoded paymaster context string
- Paste this context into your dApp's settings
User Configuration UI
Allow users to configure their gas credits:
export function PaymasterSettings() {
const [paymasterContext, setPaymasterContext] = useState('')
return (
<div>
<h3>Configure Gas Credits</h3>
<p>Get credits at <a href="https://testnet.prepaidgas.xyz">testnet.prepaidgas.xyz</a></p>
<textarea
placeholder="Paste your paymaster context here..."
value={paymasterContext}
onChange={(e) => setPaymasterContext(e.target.value)}
/>
<button onClick={() => handleSave(paymasterContext)}>
Save Gas Credits
</button>
</div>
)
}
Supported Network
- Base Sepolia (Chain ID: 84532)
Source Code
- GitHub: prepaid-gas-packages
- Package: Located in
/packages/core/
Next Steps
- Smart Contracts - Understand the paymaster implementations
- Live Demo - See it in action