Appearance

Documentation / react-auth / PrivyClientConfig

Interface: PrivyClientConfig ​

Properties ​

additionalChains? ​

additionalChains?: Chain[]

Deprecated ​

use supportedChains instead.

appearance? ​

appearance?: Object

All UI and theme related configuration

Type declaration ​

accentColor? ​

accentColor?: `#${string}`

Accent color for the privy UI. Used for buttons, active borders, etc. This will generate light and dark variants. This overrides the server setting accent_color.

landingHeader? ​

landingHeader?: string

Header text for the landing screen of the Privy login modal. We strongly recommend using a string of length 35 or less. Strings longer than the width of the login modal will be ellipsified.

Defaults to 'Log in or sign up'.

loginMessage? ​

loginMessage?: string

Subtitle text for the landing screen of the Privy login modal.

This text will renders below the logo and will be capped at 100 characters.

Defaults to undefined.

logo?: string | ReactElement<any, string | JSXElementConstructor<any>>

Logo for the main privy modal screen. This can be a string (url) or an img / svg react element. If passing an element, Privy will overwrite the style props, to ensure proper rendering. This overrides the server setting logo_url

showWalletLoginFirst? ​

showWalletLoginFirst?: boolean

Determines the order of the login options in the privy modal. If true, the wallet login will render above social and email / sms login options. This overrides the server setting show_wallet_login_first

theme? ​

theme?: "light" | "dark" | `#${string}`

Primary theme for the privy UI. This dictates the foreground and background colors within the UI.

'light' (default): The privy default light UI. 'dark': The privy default dark UI. custom hex code (i.e. '#13152F'): A custom background. This will generate the remainder of the foreground and background colors for the UI by modulating the luminance of the passed color. This value should be either dark or light (<20% or > 80% luminance), for accessibility.

walletChainType? ​

walletChainType?: "ethereum-and-solana" | "ethereum-only" | "solana-only"

Determines which external wallet types to show in the modal. By default, only Ethereum external wallets are shown. If you want to show Solana wallets, set this to 'solana-only' or 'ethereum-and-solana'.

When 'ethereum-and-solana' is set, Solana wallets will have a badge indicating that they are Solana wallets.

Defaults ​

'ethereum-only'

walletList? ​

walletList?: WalletListEntry[]

An array of wallet names to configure the wallet buttons shown within the login, connectWallet, and linkWallet modals. Privy will show buttons for each option present in the list, in the order in which they are configured.

On 'detected_wallets':

  • This option serves as a fallback to include all wallets that detected by Privy, that might not be individually configured in the walletList. Browser extension wallets that are not explicitly configured in the walletList will fall into this category.
  • If Privy detects a wallet, and that wallet is configured within the walletList (e.g. 'metamask'), the order of the wallet's explicit name (e.g. 'metamask') in the walletList will take priority over the order of 'detected_wallets'.

Defaults to ['detected_wallets', 'metamask', 'coinbase_wallet', 'rainbow', 'wallet_connect']

Default ​
ts
['detected_wallets', 'metamask', 'coinbase_wallet', 'rainbow', 'wallet_connect']

captchaEnabled? ​

captchaEnabled?: boolean

customAuth? ​

customAuth?: Object

This property is only required for apps that use a third-party authentication provider.

Type declaration ​

enabled? ​

enabled?: boolean

If true, enable custom authentication integration. This enables a JWT from a custom auth provider to be used to authenticate Privy embedded wallets. Defaults to true.

Default ​
ts
true
getCustomAccessToken ​

getCustomAccessToken: () => Promise<undefined | string>

A callback that returns the user's custom auth provider's access token as a string. Can be left blank if using cookies to store and send access tokens

Returns ​

Promise<undefined | string>

Example ​
ts
const {getAccessTokenSilently} = useAuth();

<PrivyProvider
  {...props}
  config={{
    customAuth: {
      getCustomAccessToken: getAccessTokenSilently
    },
  }}
/>
isLoading ​

isLoading: boolean

Custom auth providers loading state

Example ​
ts
const {isLoading} = useAuth();

<PrivyProvider
  {...props}
  config={{
    customAuth: {
      isLoading,
    },
  }}
/>

defaultChain? ​

defaultChain?: Chain

When supplied, the defaultChain will be the default chain used throughout the application.

For external wallets, it will be used if the user's wallet it not within the supportedChains (or default chains) list.

For embedded wallets, it will be used upon initialization, when the user hasn't switched to another supported chain.

embeddedWallets? ​

embeddedWallets?: Object

All embedded wallets configuration

Type declaration ​

createOnLogin? ​

createOnLogin?: EmbeddedWalletCreateOnLoginConfig

Whether an embedded wallet should be created for the user on login. This overrides the deprecated createPrivyWalletOnLogin.

For all-users, the user will be prompted to create a Privy wallet after successfully logging in. If they cancel or are visiting after this flag was put in place, they will be prompted to create a wallet on their next login.

For users-without-wallets, the user will be prompted to create a Privy wallet after
successfully logging in, only if they do not currently have any wallet associated with their user object - for example if they have linked an external wallet.

For off, an embedded wallet is not created during login. You can always prompt the user to create one manually with your app.

Defaults to 'off'.

extendedCalldataDecoding? ​

extendedCalldataDecoding?: boolean

If true, Privy will attempt to additional decoding calldata for 721 and 1155 appoval, transfer, and mint sendTransaction calls, in addition to the default ERC20 transfer and approve decoding. If false, Privy will only decode transfer and approve calldata for ERC20 tokens.

Default ​
ts
false
@experimental This is an experimental config that is subject to breaking changes without a major version bump of the SDK.
noPromptOnSignature? ​

noPromptOnSignature?: boolean

@deprecated. Instead, use the server-driven configuration found in the Privy console: https://dashboard.privy.io/apps/YOUR_APP_ID/embedded. or the client-side 'embeddedWallets.showWalletUIs' configuration. If true, Privy will not prompt or instantiate any UI for embedded wallet signatures and transactions. If false, embedded wallet actions will raise a modal and require user confirmation to proceed.

Defaults to false.

priceDisplay? ​

priceDisplay?: PriceDisplayOptions

Options to customize the display of transaction prices in the embedded wallet's transaction prompt. You may configure a primary currency to emphasize, and a secondary currency to show as subtext. Defaults to emphasizing the price in fiat currency, and showing the price in the native token as subtext.

You may either set:

  • {primary: 'fiat-currency', secondary: 'native-token'} to emphasize fiat currency prices, showing native token prices as subtext. This is the default.
  • {secondary: 'native-token', secondary: null} to show native token prices only, with no subtext.

Privy does not currently support:

  • emphasizing native token prices over fiat currency prices
  • showing prices only in fiat currency, without native token prices
requireUserPasswordOnCreate? ​

requireUserPasswordOnCreate?: boolean

@deprecated. Instead, use the server-driven configuration found in the Privy console: https://dashboard.privy.io/apps/YOUR_APP_ID/embedded. This client-side setting is currently honored, but will be fully removed in a future release.

If true, Privy will prompt users to create a password for their Privy embedded wallet. If false, embedded wallets will be created without the need of password.

Defaults to false.

showWalletUIs? ​

showWalletUIs?: boolean

Override any settings for the embedded wallet's UI to show or hide the wallet UIs.

If true, wallet UIs will always be shown. If false, wallet UIs will always be hidden.

If not set, the default behavior will match the server configuration.

waitForTransactionConfirmation? ​

waitForTransactionConfirmation?: boolean

This setting is only honored when using the EIP-1193 Ethereum Provider to interface with the embedded wallet, i.e. using getEthereumProvider or getEthersProvider. This setting is only honored when used alongside showWalletUIs: false

If true, calls to sendTransaction will wait for the transaction to be confirmed before resolving. If false, calls to sendTransaction will resolve once the transaction has been submitted.

Defaults to true.

Example ​
ts
<PrivyProvider
  config={{
    embeddedWallets: {
      showWalletUIs: false,
      waitForTransactionConfirmation: false,
    },
  }}
>
  {children}
</PrivyProvider>

externalWallets? ​

externalWallets?: ExternalWalletsConfig

Options for connecting to external wallets like Coinbase Wallet, MetaMask, etc.

This is an experimental config that is subject to breaking changes without a major version bump of the SDK.

fiatOnRamp? ​

fiatOnRamp?: Object

@deprecated. Use fundingMethodConfigurations -> moonpay -> useSandbox instead. Setting associated with fiat-on-ramp flows

Type declaration ​

useSandbox? ​

useSandbox?: boolean

Determines whether to use the sandbox flow.

Defaults to false.

fundingMethodConfig? ​

fundingMethodConfig?: Object

Settings associated with funding methods

Type declaration ​

moonpay ​

moonpay: Object

moonpay.paymentMethod? ​

moonpay.paymentMethod?: MoonpayPaymentMethod

Determines the payment method for each Moonpay transaction.

Defaults to Moonpay's default.

moonpay.uiConfig? ​

moonpay.uiConfig?: MoonpayUiConfig

Determines the UI settings for each Moonpay transaction.

Defaults to Moonpay's default.

moonpay.useSandbox? ​

moonpay.useSandbox?: boolean

Determines whether to use the Moonpay sandbox flow.

Defaults to false.

intl? ​

intl?: Object

Options for internationalization of the privy modal

Type declaration ​

defaultCountry ​

defaultCountry: CountryCode

This property is used to configure formatting and validation for the phone number input used when phone is enabled as a login method. Must be a valid two-leter ISO country code (e.g. 'US'). Defaults to 'US'.

Default ​
ts
'US'

legal?: Object

All legal configuration

Type declaration ​

privacyPolicyUrl? ​

privacyPolicyUrl?: null | string

URL to the privacy policy page for your application. Rendered as a link in the privy modal footer. This overrides the server setting privacy_policy_url

termsAndConditionsUrl? ​

termsAndConditionsUrl?: null | string

URL to the terms and conditions page for your application. Rendered as a link in the privy modal footer. This overrides the server setting terms_and_conditions_url

loginMethods? ​

loginMethods?: ("sms" | "google" | "discord" | "twitter" | "github" | "spotify" | "instagram" | "tiktok" | "linkedin" | "apple" | "email" | "farcaster" | "telegram" | "wallet")[]

Login methods for the privy modal.

This parameter enables you to display a subset of the login methods specified in the developer dashboard. loginMethods cannot be an empty array if specified. The order of this array does not dictate order of the login methods in the UI.

Note that any login method included in this parameter must also be enabled as a login method in the developer dashboard.

If both loginMethodsAndOrder and loginMethods are defined, loginMethodsAndOrder will take precedence.

loginMethodsAndOrder? ​

loginMethodsAndOrder?: Object

Login methods for the Privy modal. This will override carefully designed defaults and should be used with caution.

This parameter enables you to display a subset of the login methods specified in the developer dashboard. Login methods will be rendered in the order they appear in the array. The first 4 options specified in the primary list will render on the default screen of the login experience. Options in the overflow list will appear on the following screen.

Note that any login method included in this parameter must also be enabled as a login method in the developer dashboard.

If both loginMethodsAndOrder and loginMethods are defined, loginMethodsAndOrder will take precedence.

Type declaration ​

overflow? ​

overflow?: LoginMethodOrderOption[]

primary ​

primary: NonEmptyArray<LoginMethodOrderOption>

mfa? ​

mfa?: Object

All multi-factor authentication configuration

Type declaration ​

noPromptOnMfaRequired? ​

noPromptOnMfaRequired?: boolean

If true, Privy will not prompt or instantiate any UI for MFA Verification. The developer must handle MFA verification themselves. If false, any action that requires MFA will raise a modal and require user to verify MFA before proceeding.

Defaults to false.

rpcConfig? ​

rpcConfig?: RpcConfig

Deprecated ​

use supportedChains[number].rpcUrls.privyWalletOverride instead.

RPC overrides to customize RPC URLs and timeout durations.

supportedChains? ​

supportedChains?: Chain[]

A list of supported chains, used to specify which chains should be used throughout the application.

Calling sendTransaction or switchChain on an unsupported network will throw an error.

For external wallets, if the wallet's current chain post-connection (during connect-only or siwe flows) is not within the supported chains list, the user will be prompted to switch to the defaultChain (if set) or first supplied. If the chain switching process does not fully succeed, the user will not be blocked from the application (and the wallet's current chainId can always be observed and acted upon accordingly).

For embedded wallets, the wallet will automatically default to the defaultChain (if set) or first supplied supportedChain.

walletConnectCloudProjectId? ​

walletConnectCloudProjectId?: string