Documentation
Components
Obvious Embed Provider

Embed Account Button

This is the main provider responsible for sharing context and exposing state via hooks.

Provides state and data to various components. Wrap ObviousEmbedProvider around your React dApp

import { ObviousEmbedProvider } from '@itsobvioustech/embed';
 
// Ideally in the root of your dApp
export const Web3Provider = ({ children }) => {
  return (
    // Always wrap this with Wagmi and QueryClient providers
    <ObviousEmbedProvider embedKey="YOUR_OBVIOUS_EMBED_WALLET_KEY" settings={{}}>
      {children}
    </ObviousEmbedProvider>
  )
}
Props

  • embedKey *required

    string
    Reach out to us on telegram or discord for your key (Dashboard soon)

  • settings

    object
    Configure the settings of the embed modal. Eg: theme, radius, buttonLabel, etc.

    • You can customize the settings of Embedkit by passing an object to the settings prop.

    Settings

  • theme

    "light" | "dark"
    Default: light
    change between light and dark themes

  • radius

    "none" | "small" | "medium" | "large"
    Default: medium
    set a custom border radius

  • buttonLabel

    string
    Default: Sign In
    set a custom label for connect/login button

  • hideReceive

    boolean
    Default: false
    hide the receive section

  • hideBuy

    boolean
    Default: false
    hide the onramp section

  • hideSend

    boolean
    Default: false
    hide the send tab

  • hideSwap

    boolean
    Default: false
    hide the swap tab

  • hideBridge

    boolean
    Default: false
    hide the bridge tab

  • hideTokens

    boolean
    Default: false
    hide the tokens tab

  • hideNFTs

    boolean
    Default: false
    hide the NFTs tab

  • hideTransactions

    boolean
    Default: false
    hide the transactions tab

  • disableSwitchChain

    boolean
    Default: false
    disable the switching chain functionality

  • defaultTab

    "tokens" | "nfts" | "txns"
    Default: tokens
    set the default tab
    •  
export const Web3Provider = ({ children }) => {
  return (
    // Always wrap this with Wagmi and QueryClient providers
    <ObviousEmbedProvider
      embedKey="YOUR_OBVIOUS_EMBED_WALLET_KEY"
      settings={{ 
        // All settings are optional
        theme: "light",
        radius: "medium",
        buttonLabel: "Sign In",
        hideReceive: false,
        hideBuy: false,
        hideSend: false,
        hideSwap: false,
        hideBridge: false,
        hideTokens: false,
        hideNFTs: false,
        hideTransactions: false,
        disableSwitchChain: false,
        defaultTab: "tokens",
      }}
    >
      {children}
    </ObviousEmbedProvider>
  )
}
    InstallationEmbed Account Button