To integrate Sophon Account with Wagmi, you need to install the @sophon-labs/account-connector package.
npm install @sophon-labs/account-connector
Then, you need to create a new connector:
import { sophon, sophonTestnet } from "viem/chains";
import { createConfig, http, WagmiProvider } from "wagmi";

// Wagmi config
const wagmiConfig = createConfig({
  chains: [sophonTestnet],
  connectors: [sophonSsoConnector("testnet")], // or 'mainnet'
  transports: {
    [sophon.id]: http(),
    [sophonTestnet.id]: http(),
  },
});
And that’s it, you can now use wagmi hooks and componentes to interact with Sophon Account.

Signin Messages

Simple message signature is supported:
import { useSignMessage } from "wagmi";

// ...
const { signMessage } = useSignMessage();

// ...
signMessage({
  message: "Hello from Sophon SSO!",
});

Signin Types Messages

Typed data signature is supported:
import { useSignTypedData } from "wagmi";

// ...
const { signMessage } = useSignTypedData();

// ...
signTypedData({
  domain: {
    name: "Sophon SSO",
    version: "1",
    chainId: sophonTestnet.id,
  },
  types: {
    Message: [
      { name: "content", type: "string" },
      { name: "from", type: "address" },
      { name: "timestamp", type: "uint256" },
    ],
  },
  primaryType: "Message",
  message: {
    content: `Hello from Sophon SSO!\n\nThis message confirms you control this wallet.`,
    from: address as `0x${string}`,
    timestamp: BigInt(Math.floor(Date.now() / 1000)),
  },
});

Wagmi Connector Example

You can check an example of using a custom Wagmi connector with Sophon Account.