---
title: "@playstack/errors-react"
description: "React context and resettable error boundaries for an existing Playstack error reporter."
tags: ["package","foundation","errors","react","free"]
---

{/* package-access:start */}

> **Free.** MIT licensed. Check preview availability before installing. See [package access](/docs/packages#access-policy).

{/* package-access:end */}

`@playstack/errors-react` connects an application-owned `@playstack/errors` reporter to React component trees.

## Install

```sh
npm install @playstack/core @playstack/errors @playstack/errors-react react
```

## Compose it at the React root

```tsx
import { ErrorsBoundary, ErrorsProvider } from '@playstack/errors-react'

export function ApplicationRoot() {
  return (
    <ErrorsProvider errors={errors}>
      <ErrorsBoundary
        fallback={({ error, reset }) => (
          <ErrorScreen error={error} onRetry={reset} />
        )}
        resetKey={router.location.key}
        development={import.meta.env.DEV}
        captureOptions={{ tags: { boundary: 'application-root' } }}
        onReset={() => queryClient.clear()}
      >
        <App />
      </ErrorsBoundary>
    </ErrorsProvider>
  )
}
```

`useErrors()` returns the exact reporter supplied to the closest provider, so event handlers and effects use the same capture policy as render boundaries.

## Provider properties

| Property | Type | Required | Purpose |
| --- | --- | --- | --- |
| `errors` | `ErrorReporter` | Yes | Existing reporter created by `configureErrors`. |
| `children` | `ReactNode` | No | The subtree that can call `useErrors` or render a boundary. |

## Boundary properties

| Property | Type | Required | Purpose |
| --- | --- | --- | --- |
| `fallback` | `ReactNode \| ({ error, reset }) => ReactNode` | Yes | Application-owned recovery UI. |
| `captureOptions` | `ErrorCaptureOptions` | No | Severity, tags, context, identity, fingerprint, or trace metadata. |
| `development` | `boolean` | No | Rethrow after capture so a development overlay or parent boundary sees the error. |
| `resetKey` | `unknown` | No | Reset the boundary when its value changes according to `Object.is`. |
| `onError` | `(error, info) => void` | No | Isolated diagnostic observer after capture. |
| `onReset` | `() => void` | No | Isolated observer invoked when the boundary resets. |
| `children` | `ReactNode` | No | Protected component subtree. |

Observer failures cannot replace the original render error or strand the fallback. A manual `reset()` and a `resetKey` change use the same recovery path.

## Bridge boundary

This adapter has no separate persistence or transport bridge. Its only outside-in dependency is the `ErrorReporter` passed to `ErrorsProvider`; the fallback and reset behavior remain application components and callbacks.

The package does not configure drivers, initialize vendor SDKs, read ambient environment variables, or import a router. React 18 or 19 and all `@playstack/*` peers stay application-owned at the same fixed version.

{/* package-reference:start */}

## API entry points and requirements

Reference snapshot: `@playstack/errors-react@0.1.0-beta.1`. Import only the entry point your runtime needs. Paths below are relative to the installed package; use **Go to Definition** in your editor to inspect exact parameters, return types and overloads. Do not import the declaration-file paths directly.

| Public entry point | Declaration file |
| --- | --- |
| `@playstack/errors-react` | `./dist/index.d.ts` |
| `@playstack/errors-react/errors` | `./dist/errors.d.ts` |
| `@playstack/errors-react/package.json` | No TypeScript declaration (asset or metadata export). |

Node.js engine requirement: `>=20`. This is not a claim that every entry point works in browsers or Workers.

### Peer dependencies

Keep existing framework versions that satisfy these ranges. Install optional peers only when using the corresponding adapter. The package manager resolves ordinary dependencies separately.

| Peer | Compatible range | When needed |
| --- | --- | --- |
| `@playstack/core` | `0.1.0-beta.1` | Required by the package. |
| `@playstack/errors` | `0.1.0-beta.1` | Required by the package. |
| `react` | `^18.2.0 \|\| ^19.0.0` | Required by the package. |

For a complete first program, start with [Getting started](/docs/getting-started). For API lookup and partial-example conventions, see [Reading the reference](/docs/packages#reading-the-reference). Provider failures, lifecycle requirements and application responsibilities remain described in the guide above; types alone do not establish production safety.

{/* package-reference:end */}