anza-xyz_wallet-adapter/packages/ui/ant-design

@solana/wallet-adapter-ant-design

Quick Setup (using Create-React-App with craco-less)

See the example package for more usage.

Install

1. Set up craco if you haven't already using the following guide.
2. Add craco-less into the project npm install --save craco-less.

   1. Add it to the craco.config.js file

      const CracoLessPlugin = require('craco-less');
      module.exports = {
          plugins: [
              {
                  plugin: CracoLessPlugin,
                  options: {
                      lessLoaderOptions: {
                          lessOptions: {
                              modifyVars: { '@primary-color': '#512da8' },
                              javascriptEnabled: true,
                          },
                      },
                  },
              },
          ],
      };
      

3. Install these peer dependencies (or skip this if you have them already):

   npm install --save \
   antd \
   @ant-design/icons \
   @solana/web3.js \
   react
   

4. Install these dependencies:

   npm install --save \
   @solana/wallet-adapter-wallets \
   @solana/wallet-adapter-react \
   @solana/wallet-adapter-ant-design \
   @solana/wallet-adapter-base
   

Usage

Check out usage in the example package.

Overrides

You can override the following elements from the stylesheet:

.wallet-adapter-icon
.wallet-adapter-modal-menu
.wallet-adapter-modal-menu-item
.wallet-adapter-modal-menu-button
.wallet-adapter-modal-menu-button-icon
.wallet-adapter-multi-button-menu
.wallet-adapter-multi-button-menu-item
.wallet-adapter-multi-button-menu-button
.wallet-adapter-multi-button-icon
.wallet-adapter-multi-button-item