Starknetkit Modal

Often times you want to use starknet-react, but you do not have a need to build a custom modal component from scratch. To make your life easier, we made the default Starknetkit modal available for import with starknet-react.

To get started, you need to first import the useStarknetkitConnectModal and useConnect components:

import { useStarknetkitConnectModal } from "starknetkit";
import { useConnect } from "@starknet-react/core";

After importing, you can now use the default modal in your app:

const { connect, connectors } = useConnect();
 
const connectWallet = async() => {
    const { starknetkitConnectModal } = useStarknetkitConnectModal({
      connectors: connectors
    })
 
    const { connector } = await starknetkitConnectModal()
    await connect({ connector })
  }