react-error-boundary is a tiny, well-tested utility that makes React’s error boundaries practical and ergonomic for everyday apps. It wraps React’s error-handling primitives in a single <ErrorBoundary> component with a predictable API for rendering fallbacks when descendant components throw during render, lifecycle, or event handlers. The library emphasizes recovery, not just failure: you can reset the error state programmatically or when certain “reset keys” change, returning the subtree to a healthy state without a full page refresh. It supports both declarative fallbacks (elements) and a render-prop approach so you can tailor the UI to the error and provide retry buttons or diagnostics. Callbacks make it easy to log errors to your own telemetry, show toasts, or trigger side effects when boundaries trip or reset. A companion useErrorHandler hook lets you re-throw async errors from hooks or event handlers into the nearest boundary, unifying error flows across component styles.
Features
- ErrorBoundary component with customizable fallback UI
- Reset logic via resetKeys and programmatic resetErrorBoundary
- onError and onReset callbacks for logging and side effects
- Render-prop fallback (FallbackComponent/FallbackRender) for fully custom recovery UX
- useErrorHandler hook to surface async or event errors to the nearest boundary
- TypeScript typings and very small bundle footprint