Overview
- Complete provider setup for InterwovenKit with all required dependencies.
- Two variants: basic setup and AutoSign setup.
- Use the basic setup unless you need automatic signing for approved message
types.
Basic setup
For apps that don’t need AutoSign or embedded wallets.
This setup uses initiaPrivyWalletConnector as a wagmi connector option, but
does not require PrivyProvider at runtime.
'use client'
import { PropsWithChildren, useEffect } from 'react'
import { createConfig, http, WagmiProvider } from 'wagmi'
import { mainnet } from 'wagmi/chains'
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
import {
initiaPrivyWalletConnector,
injectStyles,
InterwovenKitProvider,
MAINNET,
} from '@initia/interwovenkit-react'
import interwovenKitStyles from '@initia/interwovenkit-react/styles.js'
const wagmiConfig = createConfig({
connectors: [initiaPrivyWalletConnector],
chains: [mainnet],
transports: { [mainnet.id]: http() },
})
const queryClient = new QueryClient()
export default function Providers({ children }: PropsWithChildren) {
useEffect(() => {
injectStyles(interwovenKitStyles)
}, [])
return (
<QueryClientProvider client={queryClient}>
<WagmiProvider config={wagmiConfig}>
<InterwovenKitProvider {...MAINNET}>{children}</InterwovenKitProvider>
</WagmiProvider>
</QueryClientProvider>
)
}
AutoSign setup
For apps that need AutoSign. Configure AutoSign directly on
InterwovenKitProvider.
'use client'
import { PropsWithChildren, useEffect } from 'react'
import { createConfig, http, WagmiProvider } from 'wagmi'
import { mainnet } from 'wagmi/chains'
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
import {
initiaPrivyWalletConnector,
injectStyles,
InterwovenKitProvider,
MAINNET,
} from '@initia/interwovenkit-react'
import interwovenKitStyles from '@initia/interwovenkit-react/styles.js'
const wagmiConfig = createConfig({
connectors: [initiaPrivyWalletConnector],
chains: [mainnet],
transports: { [mainnet.id]: http() },
})
const queryClient = new QueryClient()
export default function Providers({ children }: PropsWithChildren) {
useEffect(() => {
injectStyles(interwovenKitStyles)
}, [])
return (
<QueryClientProvider client={queryClient}>
<WagmiProvider config={wagmiConfig}>
<InterwovenKitProvider
{...MAINNET}
// Option 1: Use boolean to enable the default message type for the
// current default chain:
// - minievm: /minievm.evm.v1.MsgCall
// - miniwasm: /cosmwasm.wasm.v1.MsgExecuteContract
// - default: /initia.move.v1.MsgExecute
enableAutoSign={true}
// Option 2: Specify exact message types per chain
// enableAutoSign={{
// "interwoven-1": [
// "/cosmos.bank.v1beta1.MsgSend",
// "/cosmos.staking.v1beta1.MsgDelegate",
// ],
// }}
// Optional: tighten auto-sign fee selection per chain
// autoSignFeePolicy={{
// "interwoven-1": {
// gasMultiplier: 1.2,
// maxGasMultiplierFromSim: 1.5,
// allowedFeeDenoms: ["uinit"],
// },
// }}
>
{children}
</InterwovenKitProvider>
</WagmiProvider>
</QueryClientProvider>
)
}
Notes
- Call
injectStyles() once at app startup to avoid duplicate style tags.
- AutoSign derives its signing wallet from the connected wallet’s signature
flow. Configure it with
enableAutoSign on InterwovenKitProvider.
enableAutoSign configuration:
- Boolean (
true): Enables AutoSign with default message types based on
chain type:
minievm: /minievm.evm.v1.MsgCall
miniwasm: /cosmwasm.wasm.v1.MsgExecuteContract
default: /initia.move.v1.MsgExecute
- Record (
Record<string, string[]>): Per-chain allowlist of specific
message type URLs. Use this to control exactly which message types can be
auto-signed (e.g., MsgSend, MsgDelegate, MsgExecute).
- Use
autoSignFeePolicy when you need to restrict fee denoms or tune
gas-multiplier behavior for AutoSign.