appkit Documentation

The full stack toolkit to build onchain app UX

5,453 stars TypeScript TypeScript 46 files ยท ~19,575 tokens #dapps#ethereum#integration#plugin#prod#react#team-appkit#wallet
RAW Doc

Docker & Self-Hosted Deployment Verified OCI

Deploy appkit on any server, homelab, or cloud container platform.

1-Click Terminal Command
bash (docker run) 
docker run -d --name appkit --restart always reown-com/appkit:latest

Technical Documentation: reown-com/appkit

โ„น๏ธ Provenance: Multi-Tier Ingestion ยท CodeWiki Reference

Overview (`README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

License and Use

This SDK is provided under the [Reown AppKit] Community License (โ€œCommunity Licenseโ€), that governs, among other things:

  • Permitted non-commercial use
  • RPC and MAU thresholds for commercial licensing
  • Required connection to Reown's proprietary infrastructure
  • Redistribution and attribution obligations
  • Ownership of modifications
  • Mandatory binding arbitration for disputes

Downloading, installation, integration and use of this SDK constitutes acceptance of the Reown AppKit Community License.

Overview (`.changeset/README.md`)

Changesets

Hello and welcome! This folder has been automatically generated by @changesets/cli, a build tool that works
with multi-package repos, or single-package repos to help you version and publish your code. You can
find the full documentation for it in our repository

We have a quick list of common questions to get you started engaging with this project in
our documentation

Overview (`apps/browser-extension/readme.md`)

Install project dependencies

bash
pnpm install

Copy .env.local.example into your own .env.local file in the root folder:

bash
cp .env.local

Make sure you have these variables:

bash
EIP155_PRIVATE_KEY=
SOLANA_PRIVATE_KEY=
BIP122_PRIVATE_KEY=
TON_PRIVATE_KEY=

Generate TON Key

To generate a TON private key, run:

bash
node generate-ton-key.js

This will output a TON_PRIVATE_KEY that you can add to your .env.local file.

Importing the extension

1. Build the extension

bash
pnpm build

2. Enable Developer Mode in Chrome

Go to chrome://extensions/ and enable Developer mode.

3. Import the extension

Click on Load unpacked and select the dist folder.

Development

1. Start the development build

bash
pnpm dev

2. Make changes to the code

Any changes to your code will trigger an update to the extension.

Supported Chains

This browser extension wallet supports:

  • EVM (Ethereum and compatible chains)
  • Solana
  • Bitcoin
  • TON (The Open Network)

TON Support

The extension implements a TonConnect-compatible wallet that can be detected by AppKit's TON adapter. For detailed TON setup and usage, see TON_SETUP.md.

Overview (`apps/demo/README.md`)

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Overview (`apps/pay-test-exchange/README.md`)

AppKit Pay Test Exchange

A testing environment for simulating payment exchange interactions with Reown AppKit Pay. This application provides a controlled environment to test payment flows, session management, and various payment scenarios during development.

๐ŸŽฏ Purpose

The Pay Test Exchange simulates a merchant/exchange interface that receives payment requests from AppKit Pay and allows developers to:

  • Test payment session flows (pending โ†’ success/error states)
  • Validate payment parameters (asset, amount, recipient)
  • Simulate both successful and failed payment scenarios
  • Debug payment integration issues in a controlled environment

โœจ Features

๐Ÿ”„ Session Management

  • Automatic session creation with pending status
  • Status transitions: pending โ†’ success or error
  • Session validation via URL parameters

๐Ÿ’ณ Payment Information Display

  • Asset parsing: Displays chain ID and token standard
  • Amount visualization: Shows payment amounts clearly
  • Recipient validation: Displays destination addresses

๐Ÿงช Testing Controls

  • Success simulation: Mark payments as successful
  • Error simulation: Trigger payment failures
  • Real-time updates: Immediate session status changes
  • Navigation handling: Automatic redirects to result pages

๐Ÿš€ Getting Started

Prerequisites

  • Node.js 18+
  • npm, yarn, pnpm, or bun
  • Access to the Reown AppKit ecosystem

Installation

  1. Install dependencies:
    bash
    npm install
# or
yarn install
# or
pnpm install
# or
bun install

Development

  1. Start the development server:

    bash
    npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

  2. Open the application:
    Visit http://localhost:4001 in your browser

Usage

Basic Payment Test

  1. Navigate with session parameters:

    text
    http://localhost:4001?sessionId=your-session-id&asset=eip155:1/erc20:0x123&amount=100&recipient=0xabc123

  2. Required parameters:

    • sessionId: Unique identifier for the payment session

  3. Optional parameters:

    • asset: Asset identifier (format: namespace:chainId/standard:address)
    • amount: Payment amount (in token units)
    • recipient: Destination wallet address

Testing Payment Flows

  1. Success Scenario:

    • Click "Complete Successfully" button
    • Session status updates to success
    • Redirected to success page

  2. Error Scenario:

    • Click "Trigger Error" button
    • Session status updates to error
    • Redirected to error page

๐Ÿ—๏ธ Architecture

Project Structure

text
apps/pay-test-exchange/
โ”œโ”€โ”€ app/
โ”‚   โ”œโ”€โ”€ api/          # API routes for session management
โ”‚   โ”œโ”€โ”€ error/        # Error result page
โ”‚   โ”œโ”€โ”€ success/      # Success result page
โ”‚   โ””โ”€โ”€ page.tsx      # Main exchange interface
โ”œโ”€โ”€ components/
โ”‚   โ”œโ”€โ”€ ui/           # Reusable UI components
โ”‚   โ”œโ”€โ”€ exchange-actions.tsx    # Main control interface
โ”‚   โ”œโ”€โ”€ payment-info.tsx       # Payment details display
โ”‚   โ””โ”€โ”€ error-screen.tsx       # Error state component
โ”œโ”€โ”€ lib/
โ”‚   โ”œโ”€โ”€ session-actions.ts     # Session management logic
โ”‚   โ””โ”€โ”€ types.ts               # TypeScript definitions
โ””โ”€โ”€ public/
    โ””โ”€โ”€ reown-logo.png         # Branding assets

API Endpoints

  • POST /api/update - Update session status
  • GET /api/status - Get session status

๐Ÿ”ง Configuration

Environment Setup

The application supports multiple deployment environments:

  • Development: npm run dev (port 4001)
  • Production: npm run build && npm run start
  • Cloudflare: npm run deploy

Amount Validation

Test various amount formats:

text
- 1000000000000000000    # 1 ETH (18 decimals)
- 1000000                # 1 USDC (6 decimals)
- 500000000              # 0.5 SOL (9 decimals)

Error Conditions

Test error scenarios:

text
- Missing sessionId      # Triggers error screen
- Invalid parameters     # Tests parameter validation
- Network failures       # Simulates API issues

๐Ÿš€ Deployment

Cloudflare Deployment

  1. Build for Cloudflare:

    bash
    npm run deploy

  2. Preview deployment:

    bash
    npm run preview

  3. Generate Cloudflare types:

    bash
    npm run cf-typegen

๐Ÿค Integration with AppKit Pay

This test exchange works in conjunction with:

  • AppKit Pay SDK: For payment initiation
  • Payment Controllers: For transaction handling
  • Wallet Adapters: For multi-chain support
  • Session Management: For state synchronization

๐Ÿ“‹ API Reference

Session Status Updates

typescript
// Update session status
POST /api/update?sessionId={id}
{
  "status": "success" | "error" | "pending"
}

// Get session status
GET /api/status?sessionId={id}

Payment Parameters

typescript
interface PaymentParams {
  sessionId: string // Required: Unique session identifier
  asset?: string // Optional: Asset identifier
  amount?: string // Optional: Payment amount
  recipient?: string // Optional: Destination address
}

๐Ÿ” Troubleshooting

Common Issues

  1. Missing sessionId: Ensure URL includes valid sessionId parameter
  2. Session not found: Check session creation in network tab
  3. Payment display issues: Verify asset format and parameters
  4. Navigation errors: Check success/error page routing

Debug Mode

Enable detailed logging by checking browser console and network requests.

๐Ÿ“„ License

This project is part of the Reown AppKit ecosystem. See the main repository for license details.

๐Ÿ†˜ Support

For issues and questions:

  • Check the main AppKit repository
  • Review integration documentation
  • Test with different parameter combinations
  • Verify session management flow

Overview (`examples/next-ak-basic-app-router/README.md`)

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Overview (`examples/next-ak-basic-sign-client-app-router/README.md`)

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Overview (`examples/next-ak-basic-up-app-router/README.md`)

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Overview (`examples/next-appkit-headless/README.md`)

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Overview (`examples/next-bitcoin-app-router/README.md`)

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Overview (`examples/next-ep-app-router/README.md`)

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Overview (`examples/next-ethers-app-router/README.md`)

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Overview (`examples/next-wagmi-app-router/README.md`)

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Overview (`examples/next-wagmi-solana-bitcoin-app-router/README.md`)

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Overview (`examples/nuxt-wagmi-solana-bitcoin/README.md`)

Nuxt Minimal Starter

Look at the Nuxt documentation to learn more.

Setup

Make sure to install dependencies:

bash
# npm
npm install

# pnpm
pnpm install

# yarn
yarn install

# bun
bun install

Development Server

Start the development server on http://localhost:3000:

bash
# npm
npm run dev

# pnpm
pnpm dev

# yarn
yarn dev

# bun
bun run dev

Production

Build the application for production:

bash
# npm
npm run build

# pnpm
pnpm build

# yarn
yarn build

# bun
bun run build

Locally preview production build:

bash
# npm
npm run preview

# pnpm
pnpm preview

# yarn
yarn preview

# bun
bun run preview

Check out the deployment documentation for more information.

Overview (`examples/nuxt-wagmi/README.md`)

Nuxt Minimal Starter

Look at the Nuxt documentation to learn more.

Setup

Make sure to install dependencies:

bash
# npm
npm install

# pnpm
pnpm install

# yarn
yarn install

# bun
bun install

Development Server

Start the development server on http://localhost:3000:

bash
# npm
npm run dev

# pnpm
pnpm dev

# yarn
yarn dev

# bun
bun run dev

Production

Build the application for production:

bash
# npm
npm run build

# pnpm
pnpm build

# yarn
yarn build

# bun
bun run build

Locally preview production build:

bash
# npm
npm run preview

# pnpm
pnpm preview

# yarn
yarn preview

# bun
bun run preview

Check out the deployment documentation for more information.

Overview (`examples/react-solana-kit/README.md`)

AppKit + `@solana/kit` integration example

Minimal example showing how a dApp developer integrates @solana/kit (web3.js 2.x) support in the Solana adapter.

This is separate from apps/laboratory (the internal QA harness, which exercises every connector and every legacy/versioned/solana-kit code path). This example is meant to read like documentation: the smallest possible integration, from a dApp's point of view.

What it demonstrates

  • provider.address: reading the connected account as a solana-kit Address alongside the existing provider.publicKey (PublicKey). Both describe the same account; address is purely additive.
  • Building and signing a @solana/kit transaction: constructing a transaction entirely with @solana/kit's pipeline (createTransactionMessage โ†’ setTransactionMessageFeePayer โ†’ setTransactionMessageLifetimeUsingBlockhash โ†’ appendTransactionMessageInstructions โ†’ compileTransaction), then passing it straight to the same signTransaction/signAndSendTransaction methods the adapter already exposed for legacy @solana/web3.js transactions. This example has no @solana/web3.js dependency at all: the transfer instruction is built with @solana-program/system's getTransferSolInstruction (the solana-kit-native successor to SystemProgram.transfer), and since AppKit hands off the actual signing to the connected wallet rather than holding a keypair, the instruction's signer account is a createNoopSigner(provider.address) (a signer object that carries the address without being able to sign itself, exactly meant for this "someone else provides the signature" case).

See src/components/SolanaKitDemo.tsx for the actual integration code.

Running it

bash
pnpm install
pnpm --filter @examples/react-solana-kit dev

Connect a wallet on Solana Devnet (the default network here) and click through the three buttons. The transaction is a 100-lamport self-transfer, so it's safe to actually sign and send.

Overview (`examples/sveltekit-4-wagmi/README.md`)

sv

Everything you need to build a Svelte project, powered by sv.

Creating a project

If you're seeing this, you've probably already done this step. Congrats!

bash
# create a new project in the current directory
npx sv create

# create a new project in my-app
npx sv create my-app

Developing

Once you've created a project and installed dependencies with npm install (or pnpm install or yarn), start a development server:

bash
npm run dev

# or start the server and open the app in a new browser tab
npm run dev -- --open

Building

To create a production version of your app:

bash
npm run build

You can preview the production build with npm run preview.

To deploy your app, you may need to install an adapter for your target environment.

Overview (`examples/sveltekit-ethers/README.md`)

sv

Everything you need to build a Svelte project, powered by sv.

Creating a project

If you're seeing this, you've probably already done this step. Congrats!

bash
# create a new project in the current directory
npx sv create

# create a new project in my-app
npx sv create my-app

Developing

Once you've created a project and installed dependencies with npm install (or pnpm install or yarn), start a development server:

bash
npm run dev

# or start the server and open the app in a new browser tab
npm run dev -- --open

Building

To create a production version of your app:

bash
npm run build

You can preview the production build with npm run preview.

To deploy your app, you may need to install an adapter for your target environment.

Overview (`examples/sveltekit-wagmi/README.md`)

sv

Everything you need to build a Svelte project, powered by sv.

Creating a project

If you're seeing this, you've probably already done this step. Congrats!

bash
# create a new project in the current directory
npx sv create

# create a new project in my-app
npx sv create my-app

Developing

Once you've created a project and installed dependencies with npm install (or pnpm install or yarn), start a development server:

bash
npm run dev

# or start the server and open the app in a new browser tab
npm run dev -- --open

Building

To create a production version of your app:

bash
npm run build

You can preview the production build with npm run preview.

To deploy your app, you may need to install an adapter for your target environment.

Overview (`packages/appkit-utils/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/appkit/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/cli/README.md`)

Reown AppKit CLI

AppKit CLI is a command-line tool to fast download a funcionaly boilerplate example for Reown Web AppKit SDK.

Installation

To install this CLI tool globally for development, you can link it locally using the following commands.

Prerequisites

  • Node.js (v14 or later)
  • npm (v6 or later)

Clone the Repository

First, clone this repository to your local machine:

bash
git clone https://github.com/reown-com/appkit-cli
cd appkit-cli

Local Installation

To test the CLI locally, use npm link. This allows you to run the CLI from any location on your machine.

bash
npm install
sudo npm link

Usage

Once linked, you can use the CLI globally by running:

bash
appkit-cli

Also you can run it directly:

bash
npx appkit-cli

Example Commands

Provide examples of some paramaeters:

bash
appkit-cli [project-name]

For example:

bash
appkit-cli my-app
appkit-cli

Linking/Unlinking for Local Development

Linking

If you want to work on the CLI and test it locally without publishing, use npm link:

  1. Navigate to the Project Directory:

    bash
    cd path/to/appkit-cli

  2. Run npm link:

    bash
    sudo npm link

Unlinking

To remove the symlink and unlink the CLI, use:

bash
sudo npm unlink -g

This will unregister the global command appkit-cli, but it wonโ€™t delete any files in your project directory.

Quick Demo

https://github.com/user-attachments/assets/6c4fbdc3-c0ca-4edd-a730-20cfee878c86

Overview (`packages/codemod/README.md`)

Reown AppKit Codemod

AppKit Codemod is a command-line tool designed to update dependencies across multiple package.json files in AppKit monorepo efficiently.

Codemod Features

The codemod tool allows you to update dependencies across multiple package.json files in your project. It supports:

  • Multiple Package Updates: Pass multiple package names to update them all at once.
  • Wildcard Patterns: Use patterns like @walletconnect/* to update all packages under a specific organization.
  • Version Constraint Preservation: Maintains version constraints like ">=4.x.x" when updating.

Usage

You can use the Codemod globally using npx/pnpx:

bash
pnpx @reown/appkit-codemod <process> <args...>

Options

  • upgrade: Updates dependencies to their latest versions across the monorepo.
    • Arguments: One or more package names to upgrade, separated by spaces. Supports wildcards like @org/*.

Or you can use the predefined scripts for local usage in the root of the monorepo:

bash
pnpm codemod:wc # This will upgrade all the @walletconnect/* dependencies

Example Commands

To update dependencies using the codemod:

bash
npx appkit-codemod wagmi @wagmi/core @walletconnect/utils
npx appkit-codemod @walletconnect/*

Overview (`packages/common/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/controllers/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/core-legacy/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/experimental/README.md`)

๐Ÿ“š [Documentation](https://docs.reown.com/2.0/appkit/about)

๐Ÿ”— [Website](https://reown.com/appkit)

AppKit Experimental (@reown/appkit-experimental)

The @reown/appkit-experimental package provides a set of cutting-edge, experimental features for Web3 developers. This package serves as a testing ground for innovative concepts and implementations that are not yet widely adopted or standardized in the blockchain ecosystem.

Key Characteristics

  • Experimental Nature: Features in this package are considered experimental and may undergo significant changes.
  • EIP Implementation: Includes implementations of non-finalized Ethereum Improvement Proposals (EIPs).
  • Ecosystem Exploration: Offers functionalities that are not yet widely adopted in the broader Web3 ecosystem.

Installation

bash
npm install @reown/appkit-experimental

Smart Session

The @reown/appkit-experimental/smart-session allows developers to easily integrate session-based permission handling within their dApps. Using the grantPermissions method, dApps can send permission requests to connected wallets.

Overview (`packages/polyfills/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/scaffold-ui/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/siwe/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๏ฟฝ Demo ใƒป๐Ÿงช Laboratory ใƒป๏ฟฝ๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/siwx/README.md`)

๐Ÿ“š [Documentation](https://docs.reown.com/2.0/appkit/about)

๐Ÿ”— [Website](https://reown.com/appkit)

AppKit SIWX

The chain agnostic tool to enable authentication for AppKit applications.

[!WARNING]
This package is still in development and should not be used in production.

Overview (`packages/testing/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/ui/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๏ฟฝ Demo ใƒป๐Ÿงช Laboratory ใƒป๏ฟฝ๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/universal-connector/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/wallet/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`services/id-allocation-service/README.md`)

text
npm install
npm run dev
text
npm run deploy

Overview (`apps/laboratory/tests/README.md`)

Functional Tests

We use Playwright as our functional test runner. It's configured to try multiple permutations:

  • Browsers: Chromium/Firefox
  • Modal flavors: default/SIWE/email

Setup

  • Make sure your .env.local is set up (see .env.example for reference)
  • Run pnpm playwright:install to install the browsers required to run the tests
  • Build AppKit & the Lab by running pnpm build:laboratory in the root directory

Running Tests

  • pnpm playwright:test to run in default mode.
  • pnpm playwright:debug to step by step see what the tests are doing

Debugging

For scenarios when tests pass locally but not remotely you can await this.page.screenshot({ path: './screenshots/wallet.png' }) and the screenshot will be uploaded to GitHub Actions.

Running from GitHub Actions

These tests can be run from GitHub Actions both from this and other repositories.

You can tweak what's under test by setting the BASE_URL (default 'http://localhost:3000/') and WALLET_URL (default 'https://react-wallet.walletconnect.com/') environment variables.

Overview (`packages/adapters/bitcoin/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๏ฟฝ Demo ใƒป๐Ÿงช Laboratory ใƒป๏ฟฝ๐Ÿ“š Documentation ใƒป๏ฟฝ AppKit Web Examples ใƒป๏ฟฝ๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/adapters/ethers/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๏ฟฝ Demo ใƒป๐Ÿงช Laboratory ใƒป๏ฟฝ๐Ÿ“š Documentation ใƒป๏ฟฝ AppKit Web Examples ใƒป๏ฟฝ๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/adapters/ethers5/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/adapters/polkadot/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/adapters/solana/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/adapters/ton/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/adapters/tron/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๏ฟฝ Demo ใƒป๐Ÿงช Laboratory ใƒป๏ฟฝ๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

Overview (`packages/adapters/wagmi/README.md`)

AppKit

The full stack toolkit to build onchain app UX.

Onboard millions of users to your app in minutes with social & email embedded wallets, web3 wallet login, crypto swaps, on-ramp and more.

๐Ÿ› Demo ใƒป๐Ÿงช Laboratory ใƒป๐Ÿ“š Documentation ใƒป๐Ÿ’ป AppKit Web Examples ใƒป๐Ÿ”— Website ใƒป๐Ÿ›Ÿ Contact us on Discord

Features

Refer to the "Features" section of the AppKit docs.

  • Swaps
  • On-Ramp
  • Multi Chain
  • Multi Wallets
  • Smart Accounts
  • Telegram Mini Apps
  • Sponsored Transactions
  • Networks: EVM Chains, Solana, Bitcoin
  • AppKit Core: Chain Agnostic
  • Authentication: Email & Social Login, One-Click Auth & Sign with X (SIWX)

AppKit Available SDKs

[!NOTE]
If you are using Web3Modal v1โ€“v5, please use our migration guides.

--- METRICS ---

Explore Related Technologies & Topics

View All 9,111+ Repositories โ†’

Discover similar high-velocity repositories, agent skills, and OpenAPI specifications across the ecosystem.

#dapps Browse dapps catalog โ†’ #ethereum Browse ethereum catalog โ†’ #integration Browse integration catalog โ†’ #plugin Browse plugin catalog โ†’ #prod Browse prod catalog โ†’ #react Browse react catalog โ†’ โšก MCP Servers Model Context Protocol โ†’ ๐Ÿง  Agent Skills Prompt & rule files โ†’ ๐Ÿ”Œ OpenAPI Specs REST & Swagger schemas โ†’