Xaman Wallet Integration
by @harleyscodes
Integrate Xaman wallet SDK to authenticate users, connect wallets, request XRP payments, and manage sessions on the XRP Ledger.
clawhub install xaman-wallet-integrationπ About This Skill
name: xaman-wallet description: Integrate Xaman wallet (formerly Xumm) for XRP Ledger authentication and transactions. Use for: (1) Adding wallet connection to a webapp, (2) Implementing sign-in with Xaman, (3) Requesting payment/signatures from users, (4) Loading XummPkce SDK from CDN.
Xaman Wallet Integration
Quick Start
1. Load the SDK (in layout.tsx or HTML head):
2. Initialize and connect:
const XummPkce = (window as any).XummPkce;
const xumm = new XummPkce(API_KEY, {
redirectUrl: window.location.origin + "/dashboard"
});// Listen for auth events
xumm.on("success", async (state) => {
const account = (await xumm.state())?.me?.account;
console.log("Connected:", account);
});
// Start auth flow (opens popup)
await xumm.authorize();
API Key
Get your API key from: https://xumm.app/dashboard/developer
Environment variable: NEXT_PUBLIC_XAMAN_API_KEY
Key Methods
new XummPkce(apiKey, options) - Initialize SDKxumm.authorize() - Start OAuth flow, opens Xaman appxumm.state() - Get current user sessionxumm.logout() - Clear sessionxumm.on("success", callback) - Listen for successful authxumm.on("error", callback) - Listen for errorsOptions
{
redirectUrl: string, // Where to redirect after auth
rememberJwt: boolean, // Persist session in localStorage (default: true)
storage: Storage, // Custom storage (default: localStorage)
implicit: boolean // Use implicit flow (default: false)
}
Session Recovery
The SDK auto-restores sessions. Call xumm.logout() before authorize() to force fresh login.
Troubleshooting
xumm.state().then(s => s.me.account) after success eventπ‘ Examples
1. Load the SDK (in layout.tsx or HTML head):
2. Initialize and connect:
const XummPkce = (window as any).XummPkce;
const xumm = new XummPkce(API_KEY, {
redirectUrl: window.location.origin + "/dashboard"
});// Listen for auth events
xumm.on("success", async (state) => {
const account = (await xumm.state())?.me?.account;
console.log("Connected:", account);
});
// Start auth flow (opens popup)
await xumm.authorize();
βοΈ Configuration
{
redirectUrl: string, // Where to redirect after auth
rememberJwt: boolean, // Persist session in localStorage (default: true)
storage: Storage, // Custom storage (default: localStorage)
implicit: boolean // Use implicit flow (default: false)
}
π Tips & Best Practices
xumm.state().then(s => s.me.account) after success event