Portefeuilles personnalisés

Créer un portefeuille personnalisé

Note : Cette API est instable et susceptible de changer dans un futur proche. Nous ajouterons plus de portefeuilles intégrés avec le temps. Faites-nous savoir s'il y a des portefeuilles particuliers qui vous intéressent.

Le type de fonction Wallet est fourni pour vous aider à définir vos propres portefeuilles personnalisés. Les propriétés suivantes peuvent être configurées sur la valeur de retour de votre fonction Wallet :

Propriétés du portefeuille

Prop	Type	Default
`id*`	`string`	–
`name*`	`string`	–
`rdns`	`string`	–
`shortName`	`string \| undefined`	–
`iconUrl*`	`string \| (() => Promise<string>)`	–
`iconAccent`	`string`	–
`iconBackground*`	`string`	–
`installed`	`boolean \| undefined`	–
`downloadUrls`	`DownloadUrls \| undefined`	–
`hidden`	`(args) => boolean \| undefined`	–
`createConnector*`	`RainbowKitConnector`	–
`mobile`	`object`	–
`desktop`	`object`	–
`qrCode`	`object`	–
`extension`	`object`	–
`createConnector*`	`(details: WalletDetailsParams) => CreateConnectorFn`	–

Propriétés de DownloadUrls

Prop	Type	Default
`android`	`string`	–
`ios`	`string`	–
`mobile`	`string`	–
`qrCode`	`string`	–
`chrome`	`string`	–
`edge`	`string`	–
`firefox`	`string`	–
`opera`	`string`	–
`safari`	`string`	–
`browserExtension`	`string`	–

Exemples

Par exemple, pour créer un portefeuille personnalisé en utilisant WalletConnect :

import { Wallet, getWalletConnectConnector } from '@rainbow-me/rainbowkit';

export interface MyWalletOptions {
  projectId: string;
}

export const rainbow = ({ projectId }: MyWalletOptions): Wallet => ({
  id: 'my-wallet',
  name: 'My Wallet',
  iconUrl: 'https://my-image.xyz',
  iconBackground: '#0c2f78',
  downloadUrls: {
    android: 'https://play.google.com/store/apps/details?id=my.wallet',
    ios: 'https://apps.apple.com/us/app/my-wallet',
    chrome: 'https://chrome.google.com/webstore/detail/my-wallet',
    qrCode: 'https://my-wallet/qr',
  },
  mobile: {
    getUri: (uri: string) => uri,
  },
  qrCode: {
    getUri: (uri: string) => uri,
    instructions: {
      learnMoreUrl: 'https://my-wallet/learn-more',
      steps: [
        {
          description:
            'We recommend putting My Wallet on your home screen for faster access to your wallet.',
          step: 'install',
          title: 'Open the My Wallet app',
        },
        {
          description:
            'After you scan, a connection prompt will appear for you to connect your wallet.',
          step: 'scan',
          title: 'Tap the scan button',
        },
      ],
    },
  },
  extension: {
    instructions: {
      learnMoreUrl: 'https://my-wallet/learn-more',
      steps: [
        {
          description:
            'We recommend pinning My Wallet to your taskbar for quicker access to your wallet.',
          step: 'install',
          title: 'Install the My Wallet extension',
        },
        {
          description:
            'Be sure to back up your wallet using a secure method. Never share your secret phrase with anyone.',
          step: 'create',
          title: 'Create or Import a Wallet',
        },
        {
          description:
            'Once you set up your wallet, click below to refresh the browser and load up the extension.',
          step: 'refresh',
          title: 'Refresh your browser',
        },
      ],
    },
  },
  createConnector: getWalletConnectConnector({ projectId }),
});

Vous pouvez ensuite ajouter votre portefeuille personnalisé dans la liste de portefeuilles.

Aperçu

Prise en main

Avancé

Portefeuilles personnalisés

Créer un portefeuille personnalisé

Propriétés du portefeuille

Propriétés de DownloadUrls

Exemples