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

# SDKs

> Published TypeScript/React packages for the Relayer platform — what each one does and when to use it.

Relayer ships five public packages on npm. Pick the ones that match what you're building.

## At a glance

| Package                                              | Use it when                                                                               | Detail                        |
| ---------------------------------------------------- | ----------------------------------------------------------------------------------------- | ----------------------------- |
| [`@relayerfi/widget-kit-react`](#widget-kit-react)   | You're building a React app and want the prebuilt swap / transfer / bridge UI             | React component library       |
| [`@relayerfi/widget-kit-native`](#widget-kit-native) | Same, but for React Native                                                                | Native components             |
| [`@relayerfi/widget-kit-core`](#widget-kit-core)     | You're building a custom widget for a framework that isn't React                          | Framework-agnostic core logic |
| [`@relayerfi/action-kit`](#action-kit)               | You're generating widget action metadata server-side or want to validate metadata schemas | Metadata builder + validator  |
| [`@relayerfi/agent-sdk`](#agent-sdk)                 | You're running an AI agent that needs budget enforcement and x402 payments                | Agent runtime SDK             |

***

<h2 id="widget-kit-react">
  Widget Kit (React)
</h2>

The prebuilt React widget for end-user swap, transfer, and bridge flows. Renders the UI, manages wagmi connectivity, and orchestrates signing in both Metadata Mode (user's own wallet) and Passkey Signing Mode.

```bash theme={null}
npm install @relayerfi/widget-kit-react wagmi viem @tanstack/react-query framer-motion
```

See [Widget Kit → Installation](/widget/installation) and [Widget Kit → Integration](/widget/integration) for setup.

<h2 id="widget-kit-native">
  Widget Kit (Native)
</h2>

The same UI patterns as Widget Kit (React) but for React Native — drop into your mobile app.

```bash theme={null}
npm install @relayerfi/widget-kit-native
```

<h2 id="widget-kit-core">
  Widget Kit (Core)
</h2>

Framework-agnostic core logic shared by `widget-kit-react` and `widget-kit-native`. Use directly if you're building a custom widget for Vue, Svelte, or any other framework that isn't covered.

```bash theme={null}
npm install @relayerfi/widget-kit-core
```

<h2 id="action-kit">
  Action Kit
</h2>

TypeScript library for building and validating widget action metadata. Defines the action schema, validates payloads before submission, and provides template helpers for common parameter types (token amounts, chain selectors, recipient addresses).

```bash theme={null}
npm install @relayerfi/action-kit viem
```

See [Widget Kit → SDK reference](/widget/sdk) for the full API.

<h2 id="agent-sdk">
  Agent SDK
</h2>

The runtime SDK for AI agents you operate via Relayer. Handles three-layer budget enforcement (infra / tokens / payments), x402 payment execution, kill-switch polling, and event reporting. Mastra-compatible.

```bash theme={null}
npm install @relayerfi/agent-sdk
```

See [Agent Kit → Getting Started](/agent/getting-started) and [Agent Kit → SDK reference](/agent/sdk).

***

## Source code

All packages are open source under the relayerfi GitHub organization:

<CardGroup cols={2}>
  <Card title="Widget Kit packages" icon="github" href="https://github.com/relayerfi/relayer-widgets">
    Mono-repo for `@relayerfi/widget-kit-react`, `widget-kit-core`, `widget-kit-native`, and `action-kit`.
  </Card>

  <Card title="Agent SDK" icon="github" href="https://github.com/relayerfi/relayer">
    Source for `@relayerfi/agent-sdk` lives in `packages/` of the Relayer monorepo.
  </Card>
</CardGroup>