A RainbowKit-style wallet connection kit for Canton

PartyLayer gives React applications on Canton a ready-made Connect Wallet button, wallet picker, account menu, themes and connection hooks. One installation includes supported wallet runtimes. CIP-0103 remains the wallet communication standard; PartyLayer adds application UI and state above that foundation.

Install the Canton React wallet kit

npm install @partylayer/react @tanstack/react-query

Use React 18+ and PartyLayer React 3.1.0+ / SDK 0.20.0+. The SDK and supported wallet runtimes are included. You do not install a PartyLayer package for each wallet or import a separate stylesheet.

// App.tsx — put this component in a 'use client' file in Next.js.
import { PartyLayerKit, ConnectButton } from '@partylayer/react';

export default function App() {
  return (
    <PartyLayerKit network="devnet" appName="My Canton dApp">
      <ConnectButton />
    </PartyLayerKit>
  );
}

The button opens wallet selection and becomes an account menu after connection. The default experience includes Powered by PartyLayer attribution. Follow the complete React and Next.js quick start for provider placement and troubleshooting.

Start a new application

npm create partylayer-app@latest my-dapp -- --template react-vite --pm npm
cd my-dapp
npm run dev

For Next.js App Router, select next-ssr instead of react-vite. Both React starters include the branded connection experience. See installation and framework requirements.

What carries over from RainbowKit

• Connection UI: use PartyLayerKit and ConnectButton for wallet selection, connection state and the account menu.
• Hooks: useAccount reports Canton party identity; useWallets, useConnect and useDisconnect manage the wallet journey.
• Themes: configure colors, light/dark mode and layout through the theme system.
• Authentication: connect a backend-issued challenge and independently verified signature through the authentication integration.
• Activity: use the transaction lifecycle to report submitted, confirmed, failed or unknown outcomes.

RainbowKit documents its own React, wagmi and viem setup in the official installation guide. For data-layer differences, read wagmi concepts on Canton.

Choose wallets and networks explicitly

The Canton wallet directory lists actual registry entries, networks and capabilities. Choose devnet, testnet or mainnet in your kit configuration. Send is Mainnet-only in the catalog; Vala is a Devnet beta opt-in using channel="beta". WalletConnect needs your project ID, and Bron needs your application-owned credentials. Hosted-wallet login and wallet approvals remain user actions.

Connection, sign-in, send and swap have different requirements

Canton uses party-scoped visibility, Daml contracts and choices. An EVM address, ABI, ENS name or Sign-In with Ethereum flow cannot be substituted for a Canton party or authorization decision.

A successful connection or message signature does not prove a token transfer or swap succeeded. Your application constructs valid token/protocol commands; the selected wallet must support the required operation, and the resulting ledger outcome must be verified. Read token transfers and the production checklist.

Build and verify your integration

Open the interactive wallet kit demo, follow the quick start, or use integration support with a minimal reproduction. Live wallet and ledger acceptance is recorded separately from automated checks; see the acceptance evidence.