Installation

Install LuxKit and its peer dependencies (@wagmi/core (opens in a new tab) and viem (opens in a new tab)).

npm i @luxwallet/luxkit @wagmi/core@1 viem@1

API Keys

  1. LuxKit utilises https://walletconnect.com/'s SDK to help with connecting wallets. WalletConnect 2.0 requires a projectId which you can create quickly and easily for free over at WalletConnect Cloud (opens in a new tab).
  2. wagmi (opens in a new tab) recommends using other provider packages such as Infura (opens in a new tab) or Alchemy (opens in a new tab) depending on the specific network requirements of your dApp. These providers offer reliable infrastructure and can be chosen based on your specific needs.

Config

create a config using wagmi's createConfig and create a LuxKit config;

app.ts
import { configureChains, createConfig } from "@wagmi/core";
import { mainnet, arbitrum, bsc, optimism, polygon } from "@wagmi/core/chains";
import { publicProvider } from "@wagmi/core/providers/public";
import { alchemyProvider } from "@wagmi/core/providers/alchemy";
import { infuraProvider } from "@wagmi/core/providers/infura";
import { createModal } from "@luxwallet/luxkit";
 
const { chains, publicClient, webSocketPublicClient } = configureChains(
  [mainnet, arbitrum, bsc, optimism, polygon],
  [
    alchemyProvider({ apiKey: "yourAlchemyApiKey" }),
    infuraProvider({ apiKey: "yourInfuraApiKey" }),
    publicProvider(),
  ]
);
 
const config = createConfig({
  autoConnect: true,
  publicClient,
  webSocketPublicClient,
});
 
export const luxKit = createModal({
  chains,
  wagmi: config,
  projectId: "yourProjectId",
  appName: "LuxKit",
});
 
luxkit.open();
 
console.log("current luxkit modal open status:", luxKit.getOpenState());
 
luxkit.close();