# PeltierProvider

The context provider that must wrap any peltier components. Pass your **API URL** and your **publishable key** — that's it. The key's prefix (`pk_test_…` / `pk_live_…`) selects the environment for **every** widget below (test → testnet chains, live → mainnet), so you don't configure the network anywhere else. The same provider (one shared context, from `@peltier/react-core`) is re-exported by both `@peltier/react` (web, this section) and [`@peltier/react-native`](/docs/react-native.md) — the examples below apply to both.

```typescript
import { PeltierProvider } from '@peltier/react'

<PeltierProvider
  apiUrl="https://api.peltier.dev"
  publishableKey="pk_live_…"   // pk_test_… ⇒ testnet, pk_live_… ⇒ mainnet
>
  {children}
</PeltierProvider>
```

## Props

| Prop | Type | Required | Description |
| --- | --- | --- | --- |
| `apiUrl` | string | Yes | Base URL of the peltier backend API |
| `publishableKey` | string | **Yes** | Merchant publishable key (`pk_test_…` / `pk_live_…`). Its prefix **selects the environment** (test → testnet, live → mainnet) for every widget under this provider, and tags p2p requests with the owning merchant (they appear in `GET /v1/requests` + the dashboard **Requests** page). A per-widget `publishableKey` prop overrides it. |
| `implementationAddress` | `0x${string}` | No | PeltierDelegate contract address. Defaults to the canonical deployment (`0x33333A781cbe9aC82Ba510BfF7b26c47a8FDecD4`), which is the **same on every supported chain** (mainnet + testnet) — you normally don't set this. |
| `children` | ReactNode | Yes | Child components that consume the context |