NFID IdentityKit Docs - Advanced Options

IdentityKitProvider also allows to set some advanced props listed below:

signerClientOptions

import { IdentityKitProvider } from "@nfid/identitykit/react"
 
export const YourApp = () => {
  return (
    <IdentityKitProvider signerClientOptions={{}}>
      <ConnectWallet />
    </IdentityKitProvider>
  )
}

idleOptions

Customize idle

import { IdentityKitProvider } from "@nfid/identitykit/react"
 
export const YourApp = () => {
  return (
    <IdentityKitProvider
      signerClientOptions={{
        idleOptions: {},
      }}
    >
      <ConnectWallet />
    </IdentityKitProvider>
  )
}

idleTimeout

number

Idle timeout in milliseconds, optional, 600_000 (30min) by default

agent

By default @nfid/identitykit uses dfinity HttpAgent with host https://icp-api.io/ (opens in a new tab) to interact with global network, it's possible to use your own agent and pass it via props, as a result you will receive your agent with predefined connected account from useIdentityKit() hook. For example to interact with local replica:

import { useState } from "react"
import { HttpAgent } from "@dfinity/agent"
import { IdentityKitProvider } from "@nfid/identitykit/react"
 
export const YourApp = () => {
  const [localAgent, setLocalAgent] = useState<HttpAgent | undefined>()
 
  useEffect(() => {
    HttpAgent.create({ host: "http://localhost:{your_dfx_local_replica_port}" }).then(setLocalAgent)
  }, [])
 
  return localAgent && (
    <IdentityKitProvider
      agent={localAgent}
    >
      <ConnectWallet />
    </IdentityKitProvider>
  )
}

Theming Removing Wallet Pop-ups