Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/ckb-devrel/ccc/llms.txt

Use this file to discover all available pages before exploring further.

CCC uses JavaScript’s Package Entry Points feature to enable tree shaking while still exporting everything on the ccc object.Ensure your tsconfig.json has moduleResolution set to one of:
tsconfig.json
{
  "compilerOptions": {
    "moduleResolution": "bundler"
  }
}
Accepted values are node16, nodenext, or bundler. Also make sure resolvePackageJsonExports is not disabled.See the TypeScript module resolution guide for more details.
CCC’s UI components only work on the client side. If you are using React Server Components, you must add the "use client" directive at the top of any file that uses ccc.Provider:
"use client";

import { ccc } from "@ckb-ccc/connector-react";

export function Providers({ children }) {
  return <ccc.Provider>{children}</ccc.Provider>;
}
This tells React to treat the file as a client-side component, where browser APIs like createContext are available.
Yes. While CCC is recommended for composing transactions, @ckb-ccc/lumos-patches adds CCC wallet support to Lumos, including:
  • JoyID Wallet
  • Nostr Wallet
  • Portal Wallet
Install the package:
npm install @ckb-ccc/lumos-patches
Then apply the patches before using Lumos:
import { generateDefaultScriptInfos } from "@ckb-ccc/lumos-patches";

// Call this before using Lumos. You don't need @ckb-lumos/joyid anymore.
registerCustomLockScriptInfos(generateDefaultScriptInfos());
CCC supports wallets across multiple ecosystems:
EcosystemWallets
EVMMetaMask, any EIP-6963 compatible wallet
BitcoinUniSat, OKX, UTXO Global, Xverse
CKBJoyID
NostrAny NIP-07 compatible extension
OtherREI, OKX
The unified ccc.Signer interface abstracts over all of these, so your application code stays the same regardless of which wallet the user connects.
Use setClient on the signer to switch networks at runtime:
// Switch to mainnet
await signer.setClient(new ccc.ClientPublicMainnet());

// Switch to testnet
await signer.setClient(new ccc.ClientPublicTestnet());
Or set the default client when initializing the Provider:
<ccc.Provider defaultClient={new ccc.ClientPublicMainnet()}>
  {children}
</ccc.Provider>
CCC has two export entry points:
ImportPurpose
ccc from @ckb-ccc/<package>Stable public API — use this for production applications
cccA from @ckb-ccc/<package>/advancedAdvanced internals — unstable, may change between versions
// Stable public API
import { ccc } from "@ckb-ccc/ccc";

// Advanced internals (unstable)
import { cccA } from "@ckb-ccc/ccc/advanced";
Unless you need to customize CCC deeply, always prefer the ccc import. The cccA export is intended for advanced developers who need access to lower-level primitives and accept the risk of breaking changes.

Build docs developers (and LLMs) love

Get started for freeTalk to us