SDK Integration

If you are building a Starknet dApp and want users to connect with Keon, the @keon-wallet/sdk package handles everything: detecting the wallet, opening the connection prompt, getting the account, and signing transactions.

It works on the web (extension) and on mobile (WalletConnect), with the same API.

Install

1npm install @keon-wallet/sdk

If you are also using StarknetKit's modal (so users can pick from multiple wallets), the Keon SDK plugs into it as a connector.

The simplest possible flow

1import { detectKeonWallet, connect, getAccount } from '@keon-wallet/sdk'
2 
3// Is Keon installed?
4const wallet = await detectKeonWallet()
5if (!wallet) {
6  // Show the user a "Get Keon" link
7  return
8}
9 
10// Ask the user to connect
11const { address, chainId } = await connect()
12 
13// Get a starknet.js Account you can use to sign
14const account = getAccount()
15 
16// Send a transaction
17const result = await account.execute({
18  contractAddress: '0x...',
19  entrypoint: 'transfer',
20  calldata: ['0x...', '100', '0'],
21})

That is it for the basic case. The SDK takes care of detecting whether the user is on desktop (extension) or mobile (WalletConnect) and routes the request the right way.

Connectors for StarknetKit

If your dApp uses StarknetKit's connect modal, you can register Keon as one of the wallet options:

1import { InjectedConnector, KeonMobileConnector } from '@keon-wallet/sdk'
2import { StarknetConfig } from '@starknet-react/core'
3 
4const connectors = [
5  new InjectedConnector(),         // Desktop, browser extension
6  new KeonMobileConnector(),       // Mobile, WalletConnect
7]
8 
9<StarknetConfig connectors={connectors}>
10  {/* your app */}
11</StarknetConfig>

InjectedConnector looks for window.starknet_keon (the object Keon's content script injects). KeonMobileConnector opens a WalletConnect session, which works whether the user is on Keon's in-app browser or scanning a QR from a separate device.

Handling connection events

The SDK exposes a small event bus so you can react to changes:

1import { subscribeAll } from '@keon-wallet/sdk'
2 
3const unsubscribe = subscribeAll((event) => {
4  switch (event.type) {
5    case 'accountsChanged':
6      // User switched accounts in the wallet
7      break
8    case 'chainChanged':
9      // User switched networks
10      break
11    case 'disconnect':
12      // User disconnected from your dApp
13      break
14  }
15})

Call unsubscribe() when your component unmounts.

Handling errors

The SDK throws typed errors so you can show the right message:

A typical pattern:

1import { connect, WalletNotFoundError, UserRejectedError } from '@keon-wallet/sdk'
2 
3try {
4  await connect()
5} catch (err) {
6  if (err instanceof WalletNotFoundError) {
7    // Show install link
8  } else if (err instanceof UserRejectedError) {
9    // Quietly show "Connection cancelled"
10  } else {
11    // Generic failure
12  }
13}

Getting listed in the dApps hub

If you want users to find your dApp from inside Keon (and any other wallet that uses TokenKit's dApps directory), submit your project on tokenkithq.io. It takes a name, a logo, a description, and a URL. Once it is approved, it shows up in the in-wallet dApp browser.

Test your integration

The Keon team runs a public test dApp that exercises every method the wallet supports. Open it with the Keon extension installed (or scan the QR with the mobile app) to confirm your assumptions about how requests look from the wallet's side.