TronWallet Adapter

📘

Prerequisites

• TronWeb

TronWallet Adapter is the standard SDK for connecting a TRON DApp to a user's wallet. Instead of writing per-wallet integration code for TronLink, OKX Wallet, Bitget, WalletConnect, Ledger, and others, you integrate the adapter once and let it negotiate with whichever wallet the user has installed.

This page is a brief orientation. The canonical reference — installation matrix, all React / Vue hooks, every UI component, full event and error catalogs — lives at walletadapter.org/docs.

What is TronWallet Adapter

TronWallet Adapter is a JavaScript SDK published as a family of npm packages under the @tronweb3/ scope. At its core it standardizes the connect / disconnect / sign / send flow so a DApp can target a single interface and have it work across every supported wallet provider.

The SDK comes in three layers:

• Adapters (@tronweb3/tronwallet-adapters) — one adapter class per wallet (TronLinkAdapter, OkxWalletAdapter, etc.). Each implements the same abstract interface.
• React / Vue hooks (@tronweb3/tronwallet-adapter-react-hooks, -vue-hooks) — useWallet-style hooks that manage adapter state for you and expose connect, disconnect, address, connected, signTransaction, etc.
• UI components (@tronweb3/tronwallet-adapter-react-ui, -vue-ui) — drop-in WalletConnectButton, WalletSelectButton, modal dialogs, etc., styled and wired up to the hooks.

You can adopt any combination of layers — use just the adapters from your own UI, or use the hooks + UI components for a turnkey integration.

Why use an adapter

• One API across every wallet. Add or swap wallets without rewriting your integration. The adapter handles per-wallet quirks behind a uniform interface.
• Reactive state out of the box. The hooks manage connected, address, network changes, account switches, and disconnect events — no manual event-listener wiring.
• Ready-made UI. Connect button, wallet selector, and modal flows ship as React / Vue components. Match your design system or use as-is.
• Standard error model. A single WalletError hierarchy (WalletNotFoundError, WalletDisconnectedError, WalletConnectionError, etc.) — easy to handle in one onError callback.

Quick start

A minimal React DApp: install, wrap the app in WalletProvider, use useWallet to read state and trigger actions.

npm install @tronweb3/tronwallet-adapter-react-hooks \
            @tronweb3/tronwallet-abstract-adapter \
            @tronweb3/tronwallet-adapters

import { WalletProvider, useWallet } from '@tronweb3/tronwallet-adapter-react-hooks';
import { TronLinkAdapter } from '@tronweb3/tronwallet-adapters';
import { useMemo } from 'react';

function App() {
  const adapters = useMemo(() => [new TronLinkAdapter()], []);
  return (
    <WalletProvider adapters={adapters} onError={(e) => console.error(e)}>
      <Wallet />
    </WalletProvider>
  );
}

function Wallet() {
  const { connect, disconnect, connected, address, signMessage } = useWallet();
  return (
    <div>
      {connected
        ? <button onClick={disconnect}>Disconnect ({address})</button>
        : <button onClick={connect}>Connect TronLink</button>}
      <button disabled={!connected} onClick={() => signMessage('hello tron')}>
        Sign a message
      </button>
    </div>
  );
}

That's the complete loop: select a wallet, connect, read the address, sign. For multi-wallet selection, transaction signing, network-change handling, the styled WalletConnectButton, the Vue equivalent, and the full API surface, see walletadapter.org/docs.

Supported wallets

The adapter family ships out-of-the-box support for the following:

• TronLink — browser extension + mobile in-app
• OKX Wallet
• Bitget Wallet
• TokenPocket
• Bybit Wallet
• WalletConnect — for any wallet that supports the WalletConnect v2 protocol
• Ledger — hardware wallet via WebHID
• GateWallet / iToken / TronWeb-injected wallets

For the up-to-date list and per-wallet installation packages, see Supported wallets by adapter.

Where to learn more

The developer docs cover every package in the family: per-wallet adapter setup, full React / Vue hook API, every UI component prop, the error hierarchy, and event reference. Treat that as the source of truth; this page is just the entry point.

Related resources

• TronWeb — TRON JavaScript SDK used under the hood for signing and broadcasting
• DApp integration overview — Bigger picture of integrating a DApp with TRON
• Send your first transaction — Pure-TronWeb minimum transaction flow without the adapter layer