@leapwallet/elements

Leap Elements SDK

How to use

Install

npm install @leapwallet/elements

Usage

import {
  LiquidityView,
  ThemeContextProvider,
  WalletClientContextProvider,
  defaultBorderRadii,
  defaultBlurs,
} from '@leapwallet/elements'
import '@leapwallet/elements/styles.css'

const customElementsTheme: ThemeDefinition = {
  colors: {
    primary: '#AC4BFF',
    // other color definitions
  },
  borderRadii: defaultBorderRadii,
  blurs: defaultBlurs,
  fontFamily: 'Inter',
}

const YourDapp = () => {
  const walletClient = useWalletClient()

  const walletConfig = {
    walletClient,
    connectWallet,
    userAddress
  }

  return (
    <div>
      <ThemeContextProvider theme={customElementsTheme}>
        <WalletClientContextProvider value={walletClientConfig}>
          <LiquidityView />
        </WalletClientContextProvider>
      </ThemeContextProvider>
    </div>
  )
}

Development

Install

yarn install

Run Development Builds

Run the following two commands in separate terminals:

yarn workspace @leapwallet/elements dev

yarn workspace @leapwallet/elements-demo dev

Go to http://localhost:5173/dev to see the development page.