Sign Typed Data in Ethereum/EVM

Use the Viem SignTypedData method for EIP-712 data.

React

import { useDynamicContext } from '@dynamic-labs/sdk-react-core';

const SignTypedDataButton = () => {
  const { primaryWallet } = useDynamicContext();

  const signTypedData = async () => {
    if (!primaryWallet) return;

    const domain = {
        name: 'Example Message',
        version: '1.0.0',
        chainId: 1,
        salt: '0',
        verifyingContract: '0xCcCCccccCCCCcCCCCCCcCcCccCcCCCcCcccccccC' as `0x${string}`,
    };

    const types = {
        Person: [
            {name: 'name', type: 'string'},
            {name: 'wallet', type: 'address'},
        ],
        Mail: [
            {name: 'from', type: 'Person'},
            {name: 'to', type: 'Person'},
            {name: 'contents', type: 'string'},
        ],
        EIP712Domain: [
            { name: 'name', type: 'string' },
            { name: 'version', type: 'string' },
            { name: 'chainId', type: 'uint256' },
            { name: 'salt', type: 'string' },
            { name: 'verifyingContract', type: 'string' },
        ],
    };

    const message = {
        from: {
            name: 'Cow',
            wallet: '0xCD2a3d9F938E13CD947Ec05AbC7FE734Df8DD826',
        },
        to: {
            name: 'Bob',
            wallet: '0xbBbBBBBbbBBBbbbBbbBbbbbBBbBbbbbBbBbbBBbB',
        },
        contents: 'Hello, Bob!',
    };

    const typedData = {primaryType: 'Mail', domain, types, message};
    const walletClient = await primaryWallet.getWalletClient();
    const signature = await walletClient.signTypedData(typedData);
    console.log('signature', signature);
  };

  return <button onClick={signTypedData}>Sign typed data</button>;
};

React Native

React Native

// Requires setting up the RN Viem extension
// See: /react-native/wallets/viem
import { dynamicClient } from '<path-to-your-dynamicClient>'; // extended with ViemExtension

export const signTypedData = async () => {
  const wallet = dynamicClient.wallets.primary;
  if (!wallet) return;

  const walletClient = dynamicClient.viem.createWalletClient({ wallet });

  const domain = {
    name: 'Example Message',
    version: '1.0.0',
    chainId: 1,
    salt: '0',
    verifyingContract: '0xCcCCccccCCCCcCCCCCCcCcCccCcCCCcCcccccccC' as `0x${string}`,
  };

  const types = {
    Person: [
      { name: 'name', type: 'string' },
      { name: 'wallet', type: 'address' },
    ],
    Mail: [
      { name: 'from', type: 'Person' },
      { name: 'to', type: 'Person' },
      { name: 'contents', type: 'string' },
    ],
    EIP712Domain: [
      { name: 'name', type: 'string' },
      { name: 'version', type: 'string' },
      { name: 'chainId', type: 'uint256' },
      { name: 'salt', type: 'string' },
      { name: 'verifyingContract', type: 'string' },
    ],
  };

  const message = {
    from: {
      name: 'Cow',
      wallet: '0xCD2a3d9F938E13CD947Ec05AbC7FE734Df8DD826',
    },
    to: {
      name: 'Bob',
      wallet: '0xbBbBBBBbbBBBbbbBbbBbbbbBBbBbbbbBbBbbBBbB',
    },
    contents: 'Hello, Bob!',
  };

  const typedData = { primaryType: 'Mail', domain, types, message } as const;
  const signature = await walletClient.signTypedData(typedData);
  console.log('signature', signature);
}