Skip to main content

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.