ErrorBoundary

A React error boundary that catches render errors in its subtree and shows a friendly fallback — an icon, message, and a "Try again" button that resets the boundary. Override the copy with labels, supply a fully custom fallback, or hook into onError for logging.

Import

import { ErrorBoundary } from "@yuhuanowo/yunui/patterns";

Basic

Wrap any subtree. While no error is thrown, it renders its children transparently.

Custom labels

Pass labels to localize the fallback's title, message, and retry button.

<ErrorBoundary
  labels={{ title: "Something broke", message: "Please try again.", retry: "Reload" }}
  onError={(error, info) => logToService(error, info)}
>
  <Dashboard />
</ErrorBoundary>

Props