# @tronweb3/tronwallet-adapter-walletconnect > Wallet adapter for WalletConnect wallet. Latest version **3.1.0** (published 2026-09-04) · MIT license · 0 weekly downloads ## Install ```sh npm install @tronweb3/tronwallet-adapter-walletconnect pnpm add @tronweb3/tronwallet-adapter-walletconnect yarn add @tronweb3/tronwallet-adapter-walletconnect bun add @tronweb3/tronwallet-adapter-walletconnect ``` ## Health **Score 70/100 (B)** — status: active. Positive: has types; esm support; no vulnerabilities; recently updated; high maintenance score; high quality score. Warnings: low downloads. ## Facts | | | |---|---| | Version | 3.1.0 | | Published | 2026-09-04 | | First published | 2022-12-28 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | bundled | | Module format | ESM + CommonJS | | Node | >=20.18.0 | | Dependencies | 4 | | Unpacked size | 7 MB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 80 | | Author | tronweb3 | | Maintainers | troncore, tronwallet-adapter | | Keywords | TRON, TronWeb, walletconnect | ## Links - npm: https://www.npmjs.com/package/@tronweb3/tronwallet-adapter-walletconnect - Repository: https://github.com/tronweb3/tronwallet-adapter - Homepage: https://github.com/tronweb3/tronwallet-adapter#readme - Issues: https://github.com/tronweb3/tronwallet-adapter/issues - npm.io page: https://npm.io/package/@tronweb3/tronwallet-adapter-walletconnect ## Dependencies (4) - [@walletconnect/modal](https://npm.io/package/@walletconnect/modal.md) 2.6.2 - [@walletconnect/types](https://npm.io/package/@walletconnect/types.md) 2.23.9 - [@tronweb3/walletconnect-tron](https://npm.io/package/@tronweb3/walletconnect-tron.md) 4.0.3 - [@tronweb3/tronwallet-abstract-adapter](https://npm.io/package/@tronweb3/tronwallet-abstract-adapter.md) ^1.3.0 ## Recent versions - 3.1.0 (latest) — 2026-09-04 - 3.0.5 — 2026-07-10 - 3.0.4 — 2026-06-11 - 3.0.3 — 2026-03-11 - 3.0.2 — 2026-01-26 - 3.0.1 — 2025-12-26 - 3.0.0 — 2025-11-19 - 2.0.3 — 2025-03-25 - 2.0.2 — 2024-10-25 - 2.0.1 — 2024-09-24 - 2.0.0 — 2024-07-16 - 1.0.6 — 2024-03-21 - 1.0.5 — 2023-11-15 - 1.0.4 — 2023-06-20 - 1.0.3 — 2023-05-05 - … 3 more at https://npm.io/package/@tronweb3/tronwallet-adapter-walletconnect/versions ## README # `@tronweb3/tronwallet-adapter-walletconnect` This package provides an adapter to enable TRON DApps to connect to [WalletConnect](https://walletconnect.com/). ## Install ```shell npm i @tronweb3/tronwallet-adapter-walletconnect # yarn add @tronweb3/tronwallet-adapter-walletconnect ``` > If you are working in a typescript project, you must set `skipLibCheck: true` in `tsconfig.json`. ## Demo ```typescript import { WalletConnectAdapter } from '@tronweb3/tronwallet-adapter-walletconnect'; import TronWeb from 'tronweb'; const tronWeb = new TronWeb({ fullHost: 'https://api.trongrid.io', headers: { 'TRON-PRO-API-KEY': 'your api key' }, }); const adapter = new WalletConnectAdapter({ network: 'Nile', options: { relayUrl: 'wss://relay.walletconnect.com', // example walletconnect app project ID projectId: '', metadata: { name: 'Example App', description: 'Example App', url: 'https://yourdapp-url.com', icons: ['https://yourdapp-url.com/icon.png'], }, }, themeMode: 'dark', themeVariables: { '--w3m-z-index': 1000, }, }); // connect await adapter.connect(); // then you can get address console.log(adapter.address); // create a send TRX transaction const unSignedTransaction = await tronWeb.transactionBuilder.sendTrx(targetAddress, 100, adapter.address); // using adapter to sign the transaction const signedTransaction = await adapter.signTransaction(unSignedTransaction); // broadcast the transaction await tronWeb.trx.sendRawTransaction(signedTransaction); ``` ## Documentation ### API - `Constructor(config: WalletConnectAdapterConfig)` WalletAdapter will pass the config to [AppKit Modal](https://docs.reown.com/appkit/react/core/options). **Notice**: To keep backward compatibility WalletAdapter retains `web3ModalConfig`. However, only these configurations are currently available: - `web3ModalConfig.themeMode` - `web3ModalConfig.themeVariables`: - `--wcm-z-index` - `--wcm-font-family` - `web3ModalConfig.explorerRecommendedWalletIds` It's recommended to use `themeMode`, `themeVariables` and `featuredWalletIds`. ```typescript interface WalletConnectAdapterConfig { /** * Network to use, one of Mainnet, Shasta, Nile * Default: Nile */ network: 'Mainnet' | 'Shasta' | 'Nile'; /** * Options passed to WalletConnect client */ options: { projectId: ''; // optional parameters relayUrl: ''; metadata: { name: 'Wallet name'; description: 'A short description for your wallet'; url: ""; icons: [""]; }; }; /** * Theme mode configuration flag. By default themeMode option will be set to user system settings. * @default `system` * @type `dark` | `light` * @see https://docs.reown.com/appkit/react/core/theming */ themeMode?: `dark` | `light`; /** * Theme variable configuration object. * @default undefined */ themeVariables?: ThemeVariables; /** * Control the display of "All Wallets" button. * @default `HIDE` (recommended for Tron as most wallets don't support it) * @see https://docs.reown.com/appkit/react/core/options */ allWallets?: 'SHOW' | 'HIDE' | 'ONLY_MOBILE'; /** * List of featured wallet IDs to display first (in order). * @see https://walletguide.walletconnect.network/ to find wallet IDs */ featuredWalletIds?: string[]; /** * Whitelist of wallet IDs to include (if set, only these wallets will be shown). */ includeWalletIds?: string[]; /** * Blacklist of wallet IDs to exclude. */ excludeWalletIds?: string[]; /** * Custom wallets to add to the list. */ customWallets?: any[]; /** * Enable Reown cloud analytics. * @default true */ enableAnalytics?: boolean; /** * Enable debug logs. * @default false */ debug?: boolean; /** * Enable mobile deep linking optimization. * When enabled, automatically configures mobile wallet IDs and settings for better deep linking support. * @default true */ enableMobileDeepLink?: boolean; /** * Additional AppKit configuration options. * Any extra properties will be passed directly to createAppKit. */ [key: string]: any; } interface ThemeVariables { /** * Base font family. */ '--w3m-font-family'?: string; /** * Color used for buttons, icons, labels, etc. */ '--w3m-accent'?: string; /** * The color that blends in with the default colors. */ '--w3m-color-mix'?: string; /** * The percentage on how much “—w3m-color-mix” should blend in. */ '--w3m-color-mix-strength'?: number; /** * The base pixel size for fonts. */ '--w3m-font-size-master'?: string; /** * The base border radius in pixels. */ '--w3m-border-radius-master'?: string; /** * The z-index of the modal. */ '--w3m-z-index'?: number; /** * The color of the QRCode. */ '--w3m-qr-color'?: string; } ``` - `connect(options?: WalletConnectConnectOptions): Promise` Connect to WalletConnect with optional configuration for custom QR code rendering. ```typescript interface WalletConnectConnectOptions { /** * Callback to receive the WalletConnect URI for custom QR code rendering. * When provided, the AppKit modal will be skipped. */ onUri?: (uri: string) => void; } ``` **Example with custom QR code:** ```typescript await adapter.connect({ onUri: (uri) => { console.log('WalletConnect URI:', uri); // Display your custom QR code here // You can use libraries like qrcode to generate QR code from the URI }, }); ``` - `getConnectionStatus(): Promise<{ address: string }>`: Get current connection status. If WalletConnect is connected, the address will be a non-empty value. ### Caveates - `multiSign()` and `switchChain(chainId: string)` are not supported. - **Browser storage requirement.** WalletConnect (via `@walletconnect/core`) relies on browser storage (`localStorage`). Since `3.0.5`, the WalletConnect runtime is loaded lazily (only when `connect()` is called), so importing this package — or the aggregate [`@tronweb3/tronwallet-adapters`](https://github.com/tronweb3/tronwallet-adapter/tree/main/packages/adapters/adapters) — no longer crashes the page when cookies/storage are fully disabled. In that environment `connect()` will reject gracefully instead; other adapters keep working, so prompt the user to enable browser storage to use WalletConnect. For more information about wallet adapter, please refer to [`@tronweb3/tronwallet-adapters`](https://github.com/tronweb3/tronwallet-adapter/tree/main/packages/adapters/adapters). --- _Source: https://npm.io/package/@tronweb3/tronwallet-adapter-walletconnect · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._