ErrorBoundary

Every example on this page is live, drawn by the library's Storybook, where you can also change its props and see the result.

Catches render errors thrown by its children and shows an error-variant Callout in their place, so one broken widget doesn't take the whole frame down with it.

Import

import { ErrorBoundary } from "~lib/feedback/error-boundary";

Props

Name	Type	Required	Default	Description
`children`	`ReactNode`	Yes	N/A	Content to render and monitor for errors
`title`	`string`	No	`"Something went wrong"`	Heading shown by the default fallback Callout
`fallback`	`(props: FallbackProps) => ReactNode`	No	N/A	Renders in place of the default Callout when an error is caught
`onError`	`(error: unknown, info: ErrorInfo) => void`	No	N/A	Called when a child throws
`onReset`	`() => void`	No	N/A	Called when the boundary resets, either via `resetKeys` or a fallback's `resetErrorBoundary()`
`resetKeys`	`unknown[]`	No	N/A	When any value changes, the boundary clears the error and re-renders `children`

Examples

Import​

Props​

Examples​

Default​

Custom Title​

No Error​

Custom Fallback​

See Also​

Import

Props

Examples

Default

Custom Title

No Error

Custom Fallback

See Also