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

# React Wallet Kit

> Integrate 0xkey Embedded Wallets into React and Next.js applications.

**`@0xkey-io/react-wallet-kit`** is the Embedded Wallet Kit (EWK): a React provider, modal UI, and hook API for authentication, wallet creation, signing, and optional transaction send flows — without requiring your own auth backend when used with the [Auth Proxy](/reference/auth-proxy).

## Install

```bash theme={"theme":{"light":"github-light","dark":"github-dark"}}
pnpm add @0xkey-io/react-wallet-kit
```

Import styles once in your root layout:

```tsx theme={"theme":{"light":"github-light","dark":"github-dark"}}
import "@0xkey-io/react-wallet-kit/styles.css";
```

## Quick example

```tsx theme={"theme":{"light":"github-light","dark":"github-dark"}}
"use client";

import { ZeroXKeyProvider, useZeroXKey } from "@0xkey-io/react-wallet-kit";

const config = {
  organizationId: process.env.NEXT_PUBLIC_ORGANIZATION_ID!,
  authProxyConfigId: process.env.NEXT_PUBLIC_AUTH_PROXY_CONFIG_ID!,
};

function LoginButton() {
  const { handleLogin } = useZeroXKey();
  return <button onClick={handleLogin}>Log in</button>;
}

export function App({ children }: { children: React.ReactNode }) {
  return (
    <ZeroXKeyProvider config={config}>
      {children}
      <LoginButton />
    </ZeroXKeyProvider>
  );
}
```

## Resources

* [Getting started](/sdks/react/getting-started) — Dashboard setup, env vars, local dev URLs
* [Embedded Wallet Kit reference](/reference/embedded-wallet-kit) — product overview
* [Auth Proxy](/reference/auth-proxy) — managed OTP/OAuth/signup backend
* [Example app](https://github.com/0xkey-io/sdk-js/tree/main/examples/react-wallet-kit) — full reference implementation
* [npm package](https://www.npmjs.com/package/@0xkey-io/react-wallet-kit)
