`@ckb-ccc/rei` integrates [REI Wallet](https://reiwallet.io/) into CCC, providing a native CKB `Signer` implementation. REI is a CKB-native browser extension wallet that supports direct Secp256k1-Blake160 signing — no cross-chain address derivation needed.

<Callout type="info">
  If you're using `@ckb-ccc/connector-react` or `@ckb-ccc/ccc`, REI is already included — no separate installation needed.
</Callout>

## Installation [#installation]

<PackageBadges pkg="@ckb-ccc/rei" />

<Tabs items="['npm', 'yarn', 'pnpm']">
  <Tab value="npm">
    ```bash
    npm install @ckb-ccc/rei
    ```
  </Tab>

  <Tab value="yarn">
    ```bash
    yarn add @ckb-ccc/rei
    ```
  </Tab>

  <Tab value="pnpm">
    ```bash
    pnpm add @ckb-ccc/rei
    ```
  </Tab>
</Tabs>

**Dependencies:**

| Package         | Description                                              |
| --------------- | -------------------------------------------------------- |
| `@ckb-ccc/core` | Base types — `Signer`, `Client`, `Transaction`, and more |

## Architecture [#architecture]

`@ckb-ccc/rei` directly extends `ccc.Signer` (not a cross-chain signer) since REI is a CKB-native wallet.

<Mermaid
  chart="graph TB
    subgraph &#x22;REI Package&#x22;
        GRS[&#x22;getReiSigners(client)&#x22;]
        RS[&#x22;ReiSigner (extends ccc.Signer)&#x22;]
    end

    subgraph &#x22;Provider&#x22;
        WR[&#x22;window.rei.ckb&#x22;]
    end

    subgraph &#x22;Core&#x22;
        CorePkg[&#x22;@ckb-ccc/core (Signer)&#x22;]
    end

    GRS -->|&#x22;detects&#x22;| WR
    GRS -->|&#x22;creates&#x22;| RS
    RS --> CorePkg
    RS -->|&#x22;calls&#x22;| WR"
/>

### Entry point: `getReiSigners` [#entry-point-getreisigners]

`getReiSigners(client)` checks for `window.rei.ckb` and returns a `SignerInfo[]` array — empty if the wallet isn't available:

<Mermaid
  chart="graph TD
    Start[&#x22;getReiSigners(client)&#x22;] --> Check[&#x22;window.rei.ckb exists?&#x22;]
    Check -->|No| Empty[&#x22;return []&#x22;]
    Check -->|Yes| Create[&#x22;new ReiSigner(client, window.rei.ckb)&#x22;]
    Create --> Array[&#x22;SignerInfo[] with name 'CKB'&#x22;]"
/>

## The `ReiSigner` class [#the-reisigner-class]

`ReiSigner` extends `ccc.Signer` directly and communicates with the REI extension via its injected provider.

### Signer properties [#signer-properties]

| Property   | Value                         |
| ---------- | ----------------------------- |
| `type`     | `SignerType.CKB`              |
| `signType` | `SignerSignType.CkbSecp256k1` |

### Key methods [#key-methods]

| Method                    | Description                                                             |
| ------------------------- | ----------------------------------------------------------------------- |
| `connect()`               | Switches REI to the correct network (mainnet/testnet) to match `client` |
| `isConnected()`           | Returns `true` if connected AND on the matching network                 |
| `getInternalAddress()`    | Calls `ckb_requestAccounts` to get the CKB address                      |
| `getIdentity()`           | Calls `ckb_getPublicKey` to get the public key                          |
| `signMessageRaw(message)` | Signs via `ckb_signMessage`                                             |
| `signOnlyTransaction(tx)` | Signs via `ckb_signTransaction`                                         |
| `prepareTransaction(tx)`  | Adds Secp256k1-Blake160 cell deps and prepares witnesses                |
| `onReplaced(listener)`    | Fires on `accountsChanged` or `chainChanged` events                     |

### Network auto-switching [#network-auto-switching]

On `connect()`, `ReiSigner` automatically switches the wallet to match the `client`'s network:

<Mermaid
  chart="sequenceDiagram
    participant App as Application
    participant Signer as ReiSigner
    participant Wallet as REI Extension

    App->>Signer: connect()
    Signer->>Signer: Check client.addressPrefix
    Signer->>Wallet: ckb_requestAccounts
    Wallet->>Signer: address
    Signer->>Signer: Parse address prefix
    alt Network mismatch
        Signer->>Wallet: ckb_switchNetwork(&#x22;mainnet&#x22; | &#x22;testnet&#x22;)
    end"
/>

### Transaction signing [#transaction-signing]

REI handles full transaction signing natively — no witness pre-computation needed on the CCC side:

<Mermaid
  chart="sequenceDiagram
    participant App as Application
    participant Signer as ReiSigner
    participant Wallet as REI Extension

    App->>Signer: sendTransaction(tx)
    Signer->>Signer: prepareTransaction(tx)
    Note over Signer: Add Secp256k1Blake160 CellDeps + prepare witness placeholders
    Signer->>Wallet: ckb_signTransaction(txSkeleton)
    Wallet->>Signer: signed Transaction
    Signer->>App: txHash"
/>

## Account change detection [#account-change-detection]

`ReiSigner` implements `onReplaced()` to keep state in sync:

* Listens for `"accountsChanged"` — user switched account
* Listens for `"chainChanged"` — user switched network

When either fires, the application callback is invoked and the listener is cleaned up.

## Provider interface [#provider-interface]

| Method                | Description                    |
| --------------------- | ------------------------------ |
| `ckb_requestAccounts` | Get the current CKB address    |
| `ckb_getPublicKey`    | Get the account's public key   |
| `ckb_signMessage`     | Sign an arbitrary message      |
| `ckb_signTransaction` | Sign a full CKB transaction    |
| `ckb_switchNetwork`   | Switch between mainnet/testnet |
| `isConnected()`       | Check wallet connection status |

## Integration pattern [#integration-pattern]

`@ckb-ccc/rei` follows the same integration contract as every other wallet package in CCC:

* **Factory function** — `getReiSigners` returns a `SignerInfo[]` array.
* **Provider detection** — checks for `window.rei.ckb` before creating signers.
* **Graceful degradation** — returns an empty array when the wallet is unavailable.


---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.ckbccc.com/llms.txt
> Use this file to discover all available pages before exploring further.