DOCS

embeddedWallet

Defined in react/src/wallet/wallets/embeddedWallet/embeddedWallet.tsx#L135

A wallet configurator for Embedded Wallet which allows integrating the wallet with React.

It returns a WalletConfig object which can be used to connect the wallet to app via ConnectWallet component or useConnect hook.

Example

Usage with ConnectWallet

To allow users to connect to this wallet using the ConnectWallet component, you can add it to ThirdwebProvider 's supportedWallets prop.

<ThirdwebProvider supportedWallets={[embeddedWallet()]}>
  <App />
</ThirdwebProvider>;

Usage with useEmbeddedWallet

you can use the useConnect hook to programmatically connect to the wallet without using the ConnectWallet component.

The hook will return all the necessary functions you'll need to authenticate and connect to the embedded wallet.

Connect with Google/Facebook/Apple sign in

import { useEmbeddedWallet } from "@thirdweb-dev/react";

function App() {
  const { connect } = useEmbeddedWallet();

  async function handleConnect() {
    const wallet = await connect({
      strategy: "google", // or "facebook" or "apple"
    });

    console.log("connected to", wallet);
  }

  return <button onClick={handleConnect}> Connect </button>;
}

Connect with Email verification

function App() {
  const { connect, sendVerificationEmail } = useEmbeddedWallet();

  const preLogin = async (email: string) => {
    // send email verification code
    await sendVerificationEmail({ email });
  };

  const handleLogin = async (
    email: string,
    verificationCode: string,
  ) => {
    // verify email and connect
    await connect({
      strategy: "email_verification",
      email,
      verificationCode,
    });
  };

  return <div> ... </div>;
}

Connecting with Iframe

function App() {
  const { connect } = useEmbeddedWallet();

  const handleConnect = async () => {
    await connect({
      strategy: "iframe",
    });
  };

  return <div> ... </div>;
}

Connect with your own auth with JWT

function App() {
  const { connect } = useEmbeddedWallet();

  async function handleConnect() {
    const wallet = await connect({
      strategy: "jwt",
      jwt: "your_jwt_token",
    });

    console.log("connected to", wallet);
  }

  return <button onClick={handleConnect}> Connect </button>;
}

Parameters

Returns