thirdwebDocs
GitHub

inAppWallet

Creates an app scoped wallet for users based on various authentication methods. Full list of available authentication methods here .

Can also be configured to use Account Abstraction to directly connect to a ERC4337 smart account based on those authentication methods.

Example

Login with socials

import { inAppWallet } from "thirdweb/wallets";
 
const wallet = inAppWallet();
 
const account = await wallet.connect({
  client,
  chain,
  strategy: "google",
});

View all available social auth methods

Enable smart accounts and sponsor gas for your users:

import { inAppWallet } from "thirdweb/wallets";
import { sepolia } from "thirdweb/chains";
 
const wallet = inAppWallet({
  smartAccount: {
    chain: sepolia,
    sponsorGas: true,
  },
});
 
// account will be a smart account with sponsored gas enabled
const account = await wallet.connect({
  client,
  strategy: "google",
});

Login with email

import {
  inAppWallet,
  preAuthenticate,
} from "thirdweb/wallets/in-app";
 
const wallet = inAppWallet();
 
// sends a verification code to the provided email
await preAuthenticate({
  client,
  strategy: "email",
});
 
// login with the verification code
const account = await wallet.connect({
  client,
  chain,
  strategy: "email",
  verificationCode: "123456",
});

Login with SIWE

import { inAppWallet, createWallet } from "thirdweb/wallets";
 
const rabby = createWallet("io.rabby");
const inAppWallet = inAppWallet();
 
const account = await inAppWallet.connect({
  strategy: "wallet",
  chain: mainnet,
  wallet: rabby,
  client: MY_CLIENT,
});

Login with phone number

import {
  inAppWallet,
  preAuthenticate,
} from "thirdweb/wallets/in-app";
 
const wallet = inAppWallet();
 
// sends a verification code to the provided phone number
await preAuthenticate({
  client,
  strategy: "phone",
  phoneNumber: "+1234567890",
});
 
// login with the verification code
const account = await wallet.connect({
  client,
  chain,
  strategy: "phone",
  honeNumber: "+1234567890",
  verificationCode: "123456",
});

Login with passkey

import {
  inAppWallet,
  hasStoredPasskey,
} from "thirdweb/wallets/in-app";
 
const wallet = inAppWallet();
 
const wallet = inAppWallet();
const hasPasskey = await hasStoredPasskey(client);
await wallet.connect({
  client,
  strategy: "passkey",
  type: hasPasskey ? "sign-in" : "sign-up",
});

Connect to a guest account

import { inAppWallet } from "thirdweb/wallets";
 
const wallet = inAppWallet();
 
const account = await wallet.connect({
  client,
  strategy: "guest",
});

Connect with custom JWT (any OIDC provider)

You can use any OIDC provider to authenticate your users. Make sure to configure it in your dashboard under in-app wallet settings.

import { inAppWallet } from "thirdweb/wallets";
 
const wallet = inAppWallet();
 
const account = await wallet.connect({
  client,
  strategy: "jwt",
  jwt: "your_jwt_here",
});

Connect with custom endpoint

You can also use your own endpoint to authenticate your users. Make sure to configure it in your dashboard under in-app wallet settings.

import { inAppWallet } from "thirdweb/wallets";
 
const wallet = inAppWallet();
 
const account = await wallet.connect({
  client,
  strategy: "auth_endpoint",
  payload: "your_auth_payload_here",
});

Specify a logo for your login page (Connect UI)

import { inAppWallet } from "thirdweb/wallets";
const wallet = inAppWallet({
  metadata: {
    image: {
      src: "https://example.com/logo.png",
      alt: "My logo",
      width: 100,
      height: 100,
    },
  },
});

Hide the ability to export the private key within the Connect Modal UI

import { inAppWallet } from "thirdweb/wallets";
const wallet = inAppWallet({
  hidePrivateKeyExport: true,
});

Open the Oauth window in the same tab

By default, the Oauth window will open in a popup window. You can change this behavior by setting the auth.mode option to "redirect" .

import { inAppWallet } from "thirdweb/wallets";
const wallet = inAppWallet({
  auth: {
    mode: "redirect",
  },
});
function inAppWallet(
  createOptions?: InAppWalletCreationOptions,
): Wallet<"inApp">;

Parameters

configuration options Refer to InAppWalletCreationOptions to see the available options.

Type

let createOptions:
  | {
      auth?: {
        defaultSmsCountryCode?: SupportedSmsCountry;
        mode?: "popup" | "redirect" | "window";
        options: Array<InAppWalletAuth>;
        passkeyDomain?: string;
        redirectUrl?: string;
      };
      hidePrivateKeyExport?: boolean;
      metadata?: {
        image?: {
          alt?: string;
          height?: number;
          src: string;
          width?: number;
        };
      };
      partnerId?: string;
      smartAccount?: SmartWalletOptions;
    }
  | undefined;

Returns

let returnType: Wallet<"inApp">;

The created in-app wallet.