Create a Wallet

Onboard your user with a few lines of code

Install

npm

npm i @cometh/connect-sdk-4337 @viem

yarn

Create a new wallet

TS

import { createSafeSmartAccount, 
  createSmartAccountClient } from "@cometh/connect-sdk-4337";
import { http } from "viem"

const apiKey = process.env.COMETH_API_KEY;
const bundlerUrl = process.env.4337_BUNDLER_URL;
const publicClient = createPublicClient({
    chain,
    transport: http(),
    cacheTime: 60_000,
    batch: {
        multicall: { wait: 50 },
    },
});


const smartAccount = await createSafeSmartAccount({
    apiKey,
    publicClient,
    chain,
 });
 
const walletAddress = smartAccount.address

const smartAccountClient = createSmartAccountClient({
    account: smartAccount,
    chain,
    bundlerTransport: http(bundlerUrl),
})

You'll be prompted to create a passKey for your current domain. Depending on the user's device, the UX might be different.

Thanks to these credentials, your wallet address will be predicted and can already be used to receive funds.

However, note that at this point the wallet has not been created on-chain yet: the Safe is deployed on the first transaction of the wallet.

To get the address of the created wallet, you'll have to call:

const address = smartAccount.address

You must store the wallet address of your user. Not saving this address will prevent your user from accessing the wallet it in the future.

It is recommended to store the wallet address in your backend, linked to your user. For a quick demo or Proof of Concept (POC), you may use local storage.

Connect to an existing connect wallet

When you already have created your user's wallet through Cometh Connect, just pass the wallet address to the connect method in order to instantiate it.

TS

import { createSafeSmartAccount, 
  createSmartAccountClient } from "@cometh/connect-sdk-4337";

const apiKey = process.env.COMETH_API_KEY;
const bundlerUrl = process.env.4337_BUNDLER_URL;
const publicClient = createPublicClient({
    chain,
    transport: http(),
    cacheTime: 60_000,
    batch: {
        multicall: { wait: 50 },
    },
});


const smartAccount = await createSafeSmartAccount({
    apiKey,
    publicClient,
    chain: arbitrumSepolia,
    smartAccountAddress: WALLET_ADDRESS,
 });
        

const smartAccountClient = createSmartAccountClient({
    account: smartAccount,
    chain,
    bundlerTransport: http(bundlerUrl)
})

Advanced signer configuration

When instantiating the sdk, you are able to configure some optional parameters:

• webAuthnOptions: Allows you to customize your webAuthn credentials (authenticatorSelection, extensions...). By default we use platform authentication, but you can customize it the way you like.

• disableEoaFallback: By default we provide a local wallet solution in the rare case of browser not fully supports platform authentication. You have the ability to disable that feature using this boolean.

• passKeyName: Allows to name the webAuthn credential that you create through cometh connect.

• sessionKeysEnabled: Allows to use sessionkeys for your project.

TS

import { 
createSafeSmartAccount, 
createSmartAccountClient,
webAuthnOptions
} from "@cometh/connect-sdk-4337";

const publicClient = createPublicClient({
    chain,
    transport: http(),
    cacheTime: 60_000,
    batch: {
        multicall: { wait: 50 },
    },
});

const comethSignerConfig = {
// These are the default values we use
    webAuthnOptions: webAuthnOptions = {
    authenticatorSelection: {
      authenticatorAttachment:"platform",
      residentKey: "preferred",
      userVerification: "preferred",
    },
    }
    passKeyName: "Cometh Connect",
    disableEoaFallback: false
}

const sessionKeysEnabled = true
  
const smartAccount = await createSafeSmartAccount({
    apiKey,
    publicClient,
    chain,
    comethSignerConfig,
    sessionKeysEnabled
 });
        

const smartAccountClient = createSmartAccountClient({
    account: smartAccount,
    chain,
    bundlerTransport: http(bundlerUrl),
    publicClient,
})