Користувацький список гаманців

Настроювання списку гаманців

Ви можете імпортувати індивідуальні гаманці з '@rainbow-me/rainbowkit/wallets' разом з функцією connectorsForWallets, щоб створити власний список гаманців з необхідними підключеннями. Таким чином, ви матимете повний контроль над тим, які гаманці показувати, і в якому порядку.

Наприклад, ви можете обрати показ лише Rainbow разом з універсальними запасними гаманцями.

import { connectorsForWallets } from '@rainbow-me/rainbowkit';
import {
  rainbowWallet,
  walletConnectWallet,
} from '@rainbow-me/rainbowkit/wallets';

const connectors = connectorsForWallets(
  [
    {
      groupName: 'Recommended',
      wallets: [rainbowWallet, walletConnectWallet],
    },
  ],
  {
    appName: 'My RainbowKit App',
    projectId: 'YOUR_PROJECT_ID',
  }
);

Після цього ви можете передати свої підключення до createConfig Wagmi.

import { connectorsForWallets } from '@rainbow-me/rainbowkit';
import { createConfig } from 'wagmi';

const connectors = connectorsForWallets(/* ... */);

const config = createConfig({
  connectors,
  {/* Wagmi config */}
});

const queryClient = new QueryClient();

const App = () => (
  <WagmiProvider config={config}>
    <QueryClientProvider client={queryClient}>
      <RainbowKitProvider {...etc}>
        {/* Your App */}
      </RainbowKitProvider>
    </QueryClientProvider>
  </WagmiProvider>
);

Вбудовані гаманці

Наступні гаманці надаються через об'єкт wallet.

Універсальні гаманці

Наступні гаманці призначені для універсальних методів підключення, а не для конкретних додатків. В результаті, рекомендується завжди включати ці гаманці.

WalletConnect

Це запасний варіант гаманця, призначений для гаманців, які базуються на WalletConnect і не надані іншим гаманцем у списку.

Рекомендується завжди включати цей гаманець в список, щоб гарантувати підтримку всіх гаманців, що базуються на WalletConnect.

import { walletConnectWallet } from '@rainbow-me/rainbowkit/wallets';

Інжектований гаманець

Це запасний варіант гаманця, призначений для сценаріїв, коли window.ethereum існує, але не наданий іншим гаманцем у списку. Цей гаманець автоматично приховає себе зі списку, коли запасний варіант не потрібний або якщо відсутній інжектований гаманець.

Рекомендується завжди включати цей гаманець у список, щоб гарантувати підтримку всіх інжектованих гаманців.

import { injectedWallet } from '@rainbow-me/rainbowkit/wallets';

Безпечний гаманець

Для дАпп, які підтримують Safe Apps, щоб дозволити користувачам легко підключатися до свого Safe vault або мульти-підпису, включайте опцію safeWallet для автоматичних підключень. Опція Safe з'явиться тільки в середовищі браузера Safe Wallet.

import { safeWallet } from '@rainbow-me/rainbowkit/wallets';

Специфічні гаманці

Наступні гаманці надаються через об'єкт wallet (в алфавітному порядку).

1inch Гаманець

import { oneInchWallet } from '@rainbow-me/rainbowkit/wallets';

Анкоридж Діджитал

import { anchorageDigitalWallet } from '@rainbow-me/rainbowkit/wallets';

Рюкзак

import { backpackWallet } from '@rainbow-me/rainbowkit/wallets';

Base (колишній Coinbase Wallet)

Цей конектор гаманця підтримує Base, наступний етап розвитку Coinbase Smart Wallet. Забезпечує безперебійну автентифікацію та розширені функції, такі як підрахункові акаунти та дозвіл на витрати.

Параметри конфігурації відповідають документації Base SDK.

baseAccount та coinbaseWallet залишаються доступними як зворотно-сумісні псевдоніми.

import { base } from '@rainbow-me/rainbowkit/wallets';
import { base as baseChain } from 'wagmi/chains';

// Configure attribution (choose one approach)
base.preference = {
  attribution: { auto: true }, // Smart Wallet generates origin-based identifier
};

// Or use custom attribution
base.preference = {
  attribution: { dataSuffix: '0x1234567890abcdef' }, // 16-byte hex identifier
};

// Configure sub-accounts
base.subAccounts = {
  creation: 'on-connect', // or 'manual'
  defaultAccount: 'sub', // or 'universal'
  funding: 'spend-permissions', // or 'manual'
};

// Configure paymaster URLs for gasless transactions
base.paymasterUrls = {
  [baseChain.id]: 'https://api.developer.coinbase.com/rpc/v1/base/...',
};

BeraSig

import { berasigWallet } from '@rainbow-me/rainbowkit/wallets';

Найкращий гаманець

import { bestWallet } from '@rainbow-me/rainbowkit/wallets';

Гаманець Bifrost

import { bifrostWallet } from '@rainbow-me/rainbowkit/wallets';

Binance Web3 Гаманець

import { binanceWallet } from '@rainbow-me/rainbowkit/wallets';

Bitget

import { bitgetWallet } from '@rainbow-me/rainbowkit/wallets';

Bitski

import { bitskiWallet } from '@rainbow-me/rainbowkit/wallets';

Bitverse

import { bitverseWallet } from '@rainbow-me/rainbowkit/wallets';

Bloom Гаманець

import { bloomWallet } from '@rainbow-me/rainbowkit/wallets';

Brave Гаманець

import { braveWallet } from '@rainbow-me/rainbowkit/wallets';

Bybit Гаманець

import { bybitWallet } from '@rainbow-me/rainbowkit/wallets';

Coin98 Гаманець

import { coin98Wallet } from '@rainbow-me/rainbowkit/wallets';

Compass Гаманець

import { compassWallet } from '@rainbow-me/rainbowkit/compassWallet';

Core

import { coreWallet } from '@rainbow-me/rainbowkit/wallets';

CTRL Wallet

import { ctrlWallet } from '@rainbow-me/rainbowkit/wallets';

Dawn Гаманець

import { dawnWallet } from '@rainbow-me/rainbowkit/wallets';

Enkrypt Гаманець

import { enkryptWallet } from '@rainbow-me/rainbowkit/wallets';

FoxWallet

import { foxWallet } from '@rainbow-me/rainbowkit/wallets';

Frame Гаманець

import { frameWallet } from '@rainbow-me/rainbowkit/wallets';

Frontier Гаманець

import { frontierWallet } from '@rainbow-me/rainbowkit/wallets';

Gate Гаманець

import { gateWallet } from '@rainbow-me/rainbowkit/wallets';

Кам'янецький гаманець

Цей розумний конектор гаманця забезпечує безперешкодну аутентифікацію за допомогою ключів на keys.gemini.com - не потрібні завантаження, розширення або ключі API. Все працює одразу з коробки.

Параметр appName потрібний для ідентифікації вашого додатку dApp, а appIcon є необов'язковим для брендування вашого підключення.

import { geminiWallet } from '@rainbow-me/rainbowkit/wallets';

const gemini = geminiWallet({
  appName: 'My App',
  appIcon: 'https://my-app.com/logo.png', // Optional
});

imToken

import { imTokenWallet } from '@rainbow-me/rainbowkit/wallets';

ioPay Гаманець

import { iopayWallet } from '@rainbow-me/rainbowkit/wallets';

Kaia Гаманець

import { kaiaWallet } from '@rainbow-me/rainbowkit/wallets';

Kaikas

import { kaikasWallet } from '@rainbow-me/rainbowkit/wallets';

Kraken Гаманець

import { krakenWallet } from '@rainbow-me/rainbowkit/wallets';

Kresus Гаманець

import { kresusWallet } from '@rainbow-me/rainbowkit/wallets';

Ledger Live

import { ledgerWallet } from '@rainbow-me/rainbowkit/wallets';

Magic Eden Гаманець

import { magicEdenWallet } from '@rainbow-me/rainbowkit/wallets';

MetaMask

import { metaMaskWallet } from '@rainbow-me/rainbowkit/wallets';

MEW Гаманець

import { mewWallet } from '@rainbow-me/rainbowkit/wallets';

Гаманець MeCo

import { mecoWallet } from '@rainbow-me/rainbowkit/wallets';

Nova Гаманець

import { novaWallet } from '@rainbow-me/rainbowkit/wallets';

OKX Гаманець

import { okxWallet } from '@rainbow-me/rainbowkit/wallets';

Omni

import { omniWallet } from '@rainbow-me/rainbowkit/wallets';

OneKey

import { oneKeyWallet } from '@rainbow-me/rainbowkit/wallets';

ParaSwap

import { paraSwapWallet } from '@rainbow-me/rainbowkit/wallets';

Phantom

import { phantomWallet } from '@rainbow-me/rainbowkit/wallets';

Порто

import { portoWallet } from '@rainbow-me/rainbowkit/wallets';

Rabby Гаманець

import { rabbyWallet } from '@rainbow-me/rainbowkit/wallets';

Rainbow

import { rainbowWallet } from '@rainbow-me/rainbowkit/wallets';

Ramper Гаманець

import { ramperWallet } from '@rainbow-me/rainbowkit/wallets';

Готово

import { readyWallet } from '@rainbow-me/rainbowkit/wallets';

Ronin Гаманець

import { roninWallet } from '@rainbow-me/rainbowkit/wallets';

Safeheron

import { safeheronWallet } from '@rainbow-me/rainbowkit/wallets';

Taho

import { tahoWallet } from '@rainbow-me/rainbowkit/wallets';

Talisman

import { talismanWallet } from '@rainbow-me/rainbowkit/wallets';

Tokenary

import { tokenaryWallet } from '@rainbow-me/rainbowkit/wallets';

TokenPocket

import { tokenPocketWallet } from '@rainbow-me/rainbowkit/wallets';

Trust Гаманець

import { trustWallet } from '@rainbow-me/rainbowkit/wallets';

Uniswap Гаманець

import { uniswapWallet } from '@rainbow-me/rainbowkit/wallets';

Valora

import { valoraWallet } from '@rainbow-me/rainbowkit/wallets';

Wigwam

import { wigwamWallet } from '@rainbow-me/rainbowkit/wallets';

xPortal

import { xPortalWallet } from '@rainbow-me/rainbowkit/wallets';

Zerion

import { zerionWallet } from '@rainbow-me/rainbowkit/wallets';

ZilPay

import { zilPayWallet } from '@rainbow-me/rainbowkit/wallets';

Приклади

Порядок

Ось кілька прикладів відображення різних гаманців у різному порядку.

Показати MetaMask разом з універсальними запасними гаманцями.

import { connectorsForWallets } from '@rainbow-me/rainbowkit';
import {
  metaMaskWallet,
  walletConnectWallet,
} from '@rainbow-me/rainbowkit/wallets';

const connectors = connectorsForWallets(
  [
    {
      groupName: 'Recommended',
      wallets: [metaMaskWallet, walletConnectWallet],
    },
  ],
  { appName: 'RainbowKit App', projectId: 'YOUR_PROJECT_ID' },
);

Показати Rainbow, MetaMask та Base разом із загальними запасними гаманцями.

import { connectorsForWallets } from '@rainbow-me/rainbowkit';
import {
  rainbowWallet,
  metaMaskWallet,
  base,
  walletConnectWallet,
} from '@rainbow-me/rainbowkit/wallets';

const connectors = connectorsForWallets(
  [
    {
      groupName: 'Suggested',
      wallets: [
        rainbowWallet,
        metaMaskWallet,
        base,
        walletConnectWallet,
      ],
    },
  ],
  { appName: 'RainbowKit App', projectId: 'YOUR_PROJECT_ID' },
);

Нагадування: порядок масиву wallets визначає порядок, у якому гаманці будуть відображатися в інтерфейсі користувача.

Кілька груп

Ви можете використовувати ключ groupName для назви різних груп гаманців. Це корисно, якщо ви хочете спілкуватися з користувачами, які гаманці ви рекомендуєте, а також інші можливі гаманці.

Рекомендуємо Rainbow та MetaMask, але також пропонуємо Base разом із загальнодоступними гаманцями.

import { connectorsForWallets } from '@rainbow-me/rainbowkit';
import {
  rainbowWallet,
  metaMaskWallet,
  base,
  walletConnectWallet,
} from '@rainbow-me/rainbowkit/wallets';

const connectors = connectorsForWallets(
  [
    {
      groupName: 'Recommended',
      wallets: [rainbowWallet, metaMaskWallet],
    },
    {
      groupName: 'Others',
      wallets: [base, walletConnectWallet],
    },
  ],
  { appName: 'RainbowKit App', projectId: 'YOUR_PROJECT_ID' },
);

Огляд

Початок роботи

Розширені можливості