Developers

Examples

Quick code samples for the DropFi injection API. Use the extension or mobile in-app browser — no QR scans.

Connect wallet (injection)

Use the DropFi extension or in-app browser to connect without QR codes.

import { XrplProvider, useXrplReact } from '@dropfi/xrpl-react';

function App() {
  return (
    <XrplProvider>
      <WalletButton />
    </XrplProvider>
  );
}

function WalletButton() {
  const { address, connect, disconnect } = useXrplReact();
  return address
    ? <button onClick={disconnect}>Connected: {address.slice(0, 8)}…</button>
    : <button onClick={connect}>Connect Wallet</button>;
}

Sign a message (auth)

Prove ownership without passwords. Sign a message and verify on your backend.

const { address, signMessage } = useXrplReact();

const message = `Sign in to My App
Wallet: ${address}
Time: ${Date.now()}`;

const signature = await signMessage(message);
// Send address + message + signature to your API for verification

Check connection

Detect if DropFi is installed and get the current address.

const { address, isConnected } = useXrplReact();

if (!window.dropfi) {
  return <p>Install the DropFi extension to use this app.</p>;
}
if (!isConnected) {
  return <button onClick={connect}>Connect</button>;
}
return <p>Wallet: {address}</p>;

Full docs

Installation, API reference, and more examples are in the documentation.

Documentation