Adapters

Auth Modal ships official BYOK adapters. Labels and logos are SDK-locked from the provider catalog — hosts cannot rebrand Web3Auth / Magic / etc. inside the modal.

Each adapter package is a working modal SDK entry: pass the factory into AuthModalProvider adapters, then the Connect Modal lists that provider and every social method you enable (subset of the provider’s full set below).

Capability matrix

Only Web3Auth enables Connect Modal Bitcoin derivation and the solo @web5nexus/authmodal-bitcoin package (dashboard key export must be enabled).

Social methods per provider

Full method sets from the Auth Modal core catalog (PROVIDER_SOCIAL_METHODS). Pass a subset via each factory’s socialMethods option; omit to use the adapter default.

Web3Auth@web5nexus/authmodal-web3auth@0.2.5

Key export: Yes · Bitcoin: Yes

GoogleAppleEmailPhoneDiscordX / TwitterGitHubFacebookLinkedInTwitchPasskeyJWT

Magic@web5nexus/authmodal-magic@0.2.3

Key export: No · Bitcoin: No

EmailGoogleAppleGitHubFacebookX / TwitterDiscordLinkedInTwitch

Privy@web5nexus/authmodal-privy@0.1.3

Key export: No · Bitcoin: No

EmailGoogleAppleDiscordX / TwitterGitHubLinkedInTwitch

Particle@web5nexus/authmodal-particle@0.1.4

Key export: No · Bitcoin: No

EmailGoogleAppleDiscordX / TwitterGitHubFacebookLinkedInTwitch

Para@web5nexus/authmodal-para@0.1.3

Key export: No · Bitcoin: No

EmailGoogleAppleDiscordFacebookX / Twitter

Factories

import { web3auth } from '@web5nexus/authmodal-web3auth'
import { magic } from '@web5nexus/authmodal-magic'
import { privy } from '@web5nexus/authmodal-privy'
import { particle } from '@web5nexus/authmodal-particle'
import { para } from '@web5nexus/authmodal-para'
 
const adapters = [
  web3auth({
    clientId: process.env.NEXT_PUBLIC_W3A_CLIENT_ID!,
    network: 'sapphire_devnet',
    socialMethods: ['google', 'apple', 'email', 'discord', 'twitter', 'github'],
  }),
  magic({
    apiKey: process.env.NEXT_PUBLIC_MAGIC_API_KEY!,
    network: 'mainnet',
    socialMethods: ['email', 'google', 'apple'],
  }),
  privy({
    appId: process.env.NEXT_PUBLIC_PRIVY_APP_ID!,
    socialMethods: ['email', 'google', 'apple', 'discord'],
  }),
  particle({
    projectId: process.env.NEXT_PUBLIC_PARTICLE_PROJECT_ID!,
    clientKey: process.env.NEXT_PUBLIC_PARTICLE_CLIENT_KEY!,
    appId: process.env.NEXT_PUBLIC_PARTICLE_APP_ID!,
    socialMethods: ['email', 'google', 'apple'],
  }),
  para({
    apiKey: process.env.NEXT_PUBLIC_PARA_API_KEY!,
    socialMethods: ['email', 'google', 'apple'],
  }),
]

Pass preferredAdapters={['web3auth', 'magic', …]} on AuthModalProvider to control order in the Connect Modal.

Layout tip

• 1 provider + layout: 'auto' → solo (email + social icon row)
• 2+ providers + layout: 'auto' → wide (desktop) or compact (narrow viewport)
• Force solo | wide | compact and size: 'sm' | 'md' | 'lg' via theme

Preview every combination in the Playground.

Vite

Each adapter exports helpers from @web5nexus/authmodal-<name>/vite. Web3Auth also requires:

import '@web5nexus/authmodal-web3auth/polyfill' // before other imports

Particle may need its WASM plugin (particleWasmPlugin). See the Auth Modal demo Vite config for a full merge example.

Next

• Headless / custom UI — connect without the modal, per provider + social
• Auth Modal — provider + theme + hooks
• Bitcoin Wallet — solo BTC (Web3Auth only)
• Playground — interactive labs