react-error-boundary 6.0.0 → 6.0.2

package/README.md

@@ -1,6 +1,6 @@
-# react-error-boundary
+<img src="https://react-error-boundary-lib.vercel.app/og.svg" alt="react-error-boundary logo" width="400" height="210" />
 
-Reusable React [error boundary](https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary) component. Supports all React renderers (including React DOM and React Native).
+`react-error-boundary`: Reusable React [error boundary](https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary) component. Supports all React renderers (including React DOM and React Native).
 
 ### If you like this project, 🎉 [become a sponsor](https://github.com/sponsors/bvaughn/) or ☕ [buy me a coffee](http://givebrian.coffee/)
 
@@ -17,171 +17,93 @@ pnpm add react-error-boundary
 yarn add react-error-boundary
 ```
 
-## API
-
-### `ErrorBoundary` component
-Wrap an `ErrorBoundary` component around other React components to "catch" errors and render a fallback UI. The component supports several ways to render a fallback (as shown below).
-
-> **Note** `ErrorBoundary` is a _client_ component. You can only pass props to it that are serializeable or use it in files that have a `"use client";` directive.
-
-#### `ErrorBoundary` with `fallback` prop
-The simplest way to render a default "something went wrong" type of error message.
-```js
-"use client";
-
-import { ErrorBoundary } from "react-error-boundary";
-
-<ErrorBoundary fallback={<div>Something went wrong</div>}>
-  <ExampleApplication />
-</ErrorBoundary>
-```
-#### `ErrorBoundary` with `fallbackRender` prop
-["Render prop"](https://react.dev/reference/react/Children#calling-a-render-prop-to-customize-rendering) function responsible for returning a fallback UI based on a thrown value.
-```js
-"use client";
-
-import { ErrorBoundary } from "react-error-boundary";
-
-function fallbackRender({ error, resetErrorBoundary }) {
-  // Call resetErrorBoundary() to reset the error boundary and retry the render.
-
-  return (
-    <div role="alert">
-      <p>Something went wrong:</p>
-      <pre style={{ color: "red" }}>{error.message}</pre>
-    </div>
-  );
-}
-
-<ErrorBoundary
-  fallbackRender={fallbackRender}
-  onReset={(details) => {
-    // Reset the state of your app so the error doesn't happen again
-  }}
->
-  <ExampleApplication />
-</ErrorBoundary>;
-```
-#### `ErrorBoundary` with `FallbackComponent` prop
-React component responsible for returning a fallback UI based on a thrown value.
-```js
-"use client";
-
-import { ErrorBoundary } from "react-error-boundary";
-
-function Fallback({ error, resetErrorBoundary }) {
-  // Call resetErrorBoundary() to reset the error boundary and retry the render.
-
-  return (
-    <div role="alert">
-      <p>Something went wrong:</p>
-      <pre style={{ color: "red" }}>{error.message}</pre>
-    </div>
-  );
-}
-
-<ErrorBoundary
-  FallbackComponent={Fallback}
-  onReset={(details) => {
-    // Reset the state of your app so the error doesn't happen again
-  }}
->
-  <ExampleApplication />
-</ErrorBoundary>;
-```
-
-#### Logging errors with `onError`
-
-```js
-"use client";
-
-import { ErrorBoundary } from "react-error-boundary";
-
-const logError = (error: Error, info: { componentStack: string }) => {
-  // Do something with the error, e.g. log to an external API
-};
-
-const ui = (
-  <ErrorBoundary FallbackComponent={ErrorFallback} onError={logError}>
-    <ExampleApplication />
-  </ErrorBoundary>
-);
-```
-
-### `useErrorBoundary` hook
-Convenience hook for imperatively showing or dismissing error boundaries.
-
-#### Show the nearest error boundary from an event handler
-
-React only handles errors thrown during render or during component lifecycle methods (e.g. effects and did-mount/did-update). Errors thrown in event handlers, or after async code has run, will not be caught.
+## FAQs
 
-This hook can be used to pass those errors to the nearest error boundary:
+Frequently asked questions can be found [here](https://react-error-boundary-lib.vercel.app/common-questions).
 
-```js
-"use client";
-
-import { useErrorBoundary } from "react-error-boundary";
-
-function Example() {
-  const { showBoundary } = useErrorBoundary();
-
-  useEffect(() => {
-    fetchGreeting(name).then(
-      response => {
-        // Set data in state and re-render
-      },
-      error => {
-        // Show error boundary
-        showBoundary(error);
-      }
-    );
-  });
-
-  // Render ...
-}
-```
-
-#### Dismiss the nearest error boundary
-A fallback component can use this hook to request the nearest error boundary retry the render that originally failed.
-
-```js
-"use client";
-
-import { useErrorBoundary } from "react-error-boundary";
-
-function ErrorFallback({ error }) {
-  const { resetBoundary } = useErrorBoundary();
-
-  return (
-    <div role="alert">
-      <p>Something went wrong:</p>
-      <pre style={{ color: "red" }}>{error.message}</pre>
-      <button onClick={resetBoundary}>Try again</button>
-    </div>
-  );
-}
-```
-
-### `withErrorBoundary` HOC
-This package can also be used as a [higher-order component](https://legacy.reactjs.org/docs/higher-order-components.html) that accepts all of the same props as above:
-
-```js
-"use client";
-
-import {withErrorBoundary} from 'react-error-boundary'
-
-const ComponentWithErrorBoundary = withErrorBoundary(ExampleComponent, {
-  fallback: <div>Something went wrong</div>,
-  onError(error, info) {
-    // Do something with the error
-    // E.g. log to an error logging client here
-  },
-})
-
-// Can be rendered as <ComponentWithErrorBoundary {...props} />
-```
+## API
 
----
+### ErrorBoundary
+
+<!-- ErrorBoundary:description:begin -->
+A reusable React [error boundary](https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary) component.
+Wrap this component around other React components to "catch" errors and render a fallback UI.
+
+This package is built on top of React [error boundaries](https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary),
+so it has all of the advantages and constraints of that API.
+This means that it can't catch errors during:
+- Server side rendering</li>
+- Event handlers
+- Asynchronous code (including effects)
+
+ℹ️ The component provides several ways to render a fallback: `fallback`, `fallbackRender`, and `FallbackComponent`.
+Refer to the documentation to determine which is best for your application.
+
+ℹ️ This is a **client component**. You can only pass props to it that are serializeable or use it in files that have a `"use client";` directive.
+<!-- ErrorBoundary:description:end -->
+
+#### Required props
+
+<!-- ErrorBoundary:required-props:begin -->
+None
+<!-- ErrorBoundary:required-props:end -->
+
+#### Optional props
+
+<!-- ErrorBoundary:optional-props:begin -->
+
+<table>
+  <thead>
+    <tr>
+      <th>Name</th>
+      <th>Description</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>onError</td>
+      <td><p>Optional callback to enable e.g. logging error information to a server.
+@param error Error that was thrown
+@param info React &quot;component stack&quot; identifying where the error was thrown</p>
+</td>
+    </tr>
+    <tr>
+      <td>onReset</td>
+      <td><p>Optional callback to to be notified when an error boundary is &quot;reset&quot; so React can retry the failed render.</p>
+</td>
+    </tr>
+    <tr>
+      <td>resetKeys</td>
+      <td><p>When changed, these keys will reset a triggered error boundary.
+This can be useful when an error condition may be tied to some specific state (that can be uniquely identified by key).
+See the the documentation for examples of how to use this prop.</p>
+</td>
+    </tr>
+    <tr>
+      <td>fallback</td>
+      <td><p>Static content to render in place of an error if one is thrown.</p>
+<pre><code class="language-tsx">&lt;ErrorBoundary fallback={&lt;div class=&quot;text-red&quot;&gt;Something went wrong&lt;/div&gt;} /&gt;
+</code></pre>
+</td>
+    </tr>
+    <tr>
+      <td>FallbackComponent</td>
+      <td><p>React component responsible for returning a fallback UI based on a thrown value.</p>
+<pre><code class="language-tsx">&lt;ErrorBoundary FallbackComponent={Fallback} /&gt;
+</code></pre>
+</td>
+    </tr>
+    <tr>
+      <td>fallbackRender</td>
+      <td><p><a href="https://react.dev/reference/react/Children#calling-a-render-prop-to-customize-rendering">Render prop</a> function responsible for returning a fallback UI based on a thrown value.</p>
+<pre><code class="language-tsx">&lt;ErrorBoundary fallbackRender={({ error, resetErrorBoundary }) =&gt; &lt;div&gt;...&lt;/div&gt;} /&gt;
+</code></pre>
+</td>
+    </tr>
+  </tbody>
+</table>
+
+<!-- ErrorBoundary:optional-props:end -->
 
 # FAQ
 ## `ErrorBoundary` cannot be used as a JSX component

package/dist/react-error-boundary.cjs

@@ -0,0 +1,2 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react"),c=s.createContext(null),u={didCatch:!1,error:null};class l extends s.Component{constructor(e){super(e),this.resetErrorBoundary=this.resetErrorBoundary.bind(this),this.state=u}static getDerivedStateFromError(e){return{didCatch:!0,error:e}}resetErrorBoundary(...e){const{error:t}=this.state;t!==null&&(this.props.onReset?.({args:e,reason:"imperative-api"}),this.setState(u))}componentDidCatch(e,t){this.props.onError?.(e,t)}componentDidUpdate(e,t){const{didCatch:o}=this.state,{resetKeys:n}=this.props;o&&t.error!==null&&y(e.resetKeys,n)&&(this.props.onReset?.({next:n,prev:e.resetKeys,reason:"keys"}),this.setState(u))}render(){const{children:e,fallbackRender:t,FallbackComponent:o,fallback:n}=this.props,{didCatch:a,error:i}=this.state;let d=e;if(a){const h={error:i,resetErrorBoundary:this.resetErrorBoundary};if(typeof t=="function")d=t(h);else if(o)d=s.createElement(o,h);else if(n!==void 0)d=n;else throw i}return s.createElement(c.Provider,{value:{didCatch:a,error:i,resetErrorBoundary:this.resetErrorBoundary}},d)}}function y(r=[],e=[]){return r.length!==e.length||r.some((t,o)=>!Object.is(t,e[o]))}function E(r){return r!==null&&typeof r=="object"&&"didCatch"in r&&typeof r.didCatch=="boolean"&&"error"in r&&"resetErrorBoundary"in r&&typeof r.resetErrorBoundary=="function"}function f(r){if(!E(r))throw new Error("ErrorBoundaryContext not found")}function p(){const r=s.useContext(c);f(r);const{error:e,resetErrorBoundary:t}=r,[o,n]=s.useState({error:null,hasError:!1}),a=s.useMemo(()=>({error:e,resetBoundary:()=>{t(),n({error:null,hasError:!1})},showBoundary:i=>n({error:i,hasError:!0})}),[e,t]);if(o.hasError)throw o.error;return a}function B(r,e){const t=s.forwardRef((n,a)=>s.createElement(l,e,s.createElement(r,{...n,ref:a}))),o=r.displayName||r.name||"Unknown";return t.displayName=`withErrorBoundary(${o})`,t}exports.ErrorBoundary=l;exports.ErrorBoundaryContext=c;exports.useErrorBoundary=p;exports.withErrorBoundary=B;
+//# sourceMappingURL=react-error-boundary.cjs.map

package/dist/react-error-boundary.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"react-error-boundary.cjs","sources":["../lib/context/ErrorBoundaryContext.ts","../lib/components/ErrorBoundary.tsx","../lib/utils/isErrorBoundaryContext.ts","../lib/utils/assertErrorBoundaryContext.ts","../lib/hooks/useErrorBoundary.ts","../lib/utils/withErrorBoundary.ts"],"sourcesContent":["import { createContext } from \"react\";\n\nexport type ErrorBoundaryContextType = {\n  didCatch: boolean;\n  error: Error | null;\n  resetErrorBoundary: (...args: unknown[]) => void;\n};\n\nexport const ErrorBoundaryContext =\n  createContext<ErrorBoundaryContextType | null>(null);\n","import { Component, createElement, type ErrorInfo } from \"react\";\nimport { ErrorBoundaryContext } from \"../context/ErrorBoundaryContext\";\nimport type { ErrorBoundaryProps, FallbackProps } from \"../types\";\n\nconst isDevelopment = import.meta.env.DEV;\n\ntype ErrorBoundaryState =\n  | {\n      didCatch: true;\n      error: Error;\n    }\n  | {\n      didCatch: false;\n      error: null;\n    };\n\nconst initialState: ErrorBoundaryState = {\n  didCatch: false,\n  error: null,\n};\n\n/**\n * A reusable React [error boundary](https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary) component.\n * Wrap this component around other React components to \"catch\" errors and render a fallback UI.\n *\n * This package is built on top of React [error boundaries](https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary),\n * so it has all of the advantages and constraints of that API.\n * This means that it can't catch errors during:\n * - Server side rendering</li>\n * - Event handlers\n * - Asynchronous code (including effects)\n *\n * ℹ️ The component provides several ways to render a fallback: `fallback`, `fallbackRender`, and `FallbackComponent`.\n * Refer to the documentation to determine which is best for your application.\n *\n * ℹ️ This is a **client component**. You can only pass props to it that are serializeable or use it in files that have a `\"use client\";` directive.\n */\nexport class ErrorBoundary extends Component<\n  ErrorBoundaryProps,\n  ErrorBoundaryState\n> {\n  constructor(props: ErrorBoundaryProps) {\n    super(props);\n\n    this.resetErrorBoundary = this.resetErrorBoundary.bind(this);\n    this.state = initialState;\n  }\n\n  static getDerivedStateFromError(error: Error) {\n    return { didCatch: true, error };\n  }\n\n  resetErrorBoundary(...args: unknown[]) {\n    const { error } = this.state;\n\n    if (error !== null) {\n      this.props.onReset?.({\n        args,\n        reason: \"imperative-api\",\n      });\n\n      this.setState(initialState);\n    }\n  }\n\n  componentDidCatch(error: Error, info: ErrorInfo) {\n    this.props.onError?.(error, info);\n  }\n\n  componentDidUpdate(\n    prevProps: ErrorBoundaryProps,\n    prevState: ErrorBoundaryState,\n  ) {\n    const { didCatch } = this.state;\n    const { resetKeys } = this.props;\n\n    // There's an edge case where if the thing that triggered the error happens to *also* be in the resetKeys array,\n    // we'd end up resetting the error boundary immediately.\n    // This would likely trigger a second error to be thrown.\n    // So we make sure that we don't check the resetKeys on the first call of cDU after the error is set.\n\n    if (\n      didCatch &&\n      prevState.error !== null &&\n      hasArrayChanged(prevProps.resetKeys, resetKeys)\n    ) {\n      this.props.onReset?.({\n        next: resetKeys,\n        prev: prevProps.resetKeys,\n        reason: \"keys\",\n      });\n\n      this.setState(initialState);\n    }\n  }\n\n  render() {\n    const { children, fallbackRender, FallbackComponent, fallback } =\n      this.props;\n    const { didCatch, error } = this.state;\n\n    let childToRender = children;\n\n    if (didCatch) {\n      const props: FallbackProps = {\n        error,\n        resetErrorBoundary: this.resetErrorBoundary,\n      };\n\n      if (typeof fallbackRender === \"function\") {\n        childToRender = fallbackRender(props);\n      } else if (FallbackComponent) {\n        childToRender = createElement(FallbackComponent, props);\n      } else if (fallback !== undefined) {\n        childToRender = fallback;\n      } else {\n        if (isDevelopment) {\n          console.error(\n            \"react-error-boundary requires either a fallback, fallbackRender, or FallbackComponent prop\",\n          );\n        }\n\n        throw error;\n      }\n    }\n\n    return createElement(\n      ErrorBoundaryContext.Provider,\n      {\n        value: {\n          didCatch,\n          error,\n          resetErrorBoundary: this.resetErrorBoundary,\n        },\n      },\n      childToRender,\n    );\n  }\n}\n\nfunction hasArrayChanged(a: unknown[] = [], b: unknown[] = []) {\n  return (\n    a.length !== b.length || a.some((item, index) => !Object.is(item, b[index]))\n  );\n}\n","import type { ErrorBoundaryContextType } from \"../context/ErrorBoundaryContext\";\n\nexport function isErrorBoundaryContext(\n  value: unknown,\n): value is ErrorBoundaryContextType {\n  return (\n    value !== null &&\n    typeof value === \"object\" &&\n    \"didCatch\" in value &&\n    typeof value.didCatch === \"boolean\" &&\n    \"error\" in value &&\n    \"resetErrorBoundary\" in value &&\n    typeof value.resetErrorBoundary === \"function\"\n  );\n}\n","import type { ErrorBoundaryContextType } from \"../context/ErrorBoundaryContext\";\nimport { isErrorBoundaryContext } from \"./isErrorBoundaryContext\";\n\nexport function assertErrorBoundaryContext(\n  value: unknown,\n): asserts value is ErrorBoundaryContextType {\n  if (!isErrorBoundaryContext(value)) {\n    throw new Error(\"ErrorBoundaryContext not found\");\n  }\n}\n","import { useContext, useMemo, useState } from \"react\";\nimport { ErrorBoundaryContext } from \"../context/ErrorBoundaryContext\";\nimport { assertErrorBoundaryContext } from \"../utils/assertErrorBoundaryContext\";\n\ntype UseErrorBoundaryState =\n  | { error: Error; hasError: true }\n  | { error: null; hasError: false };\n\nexport type UseErrorBoundaryApi = {\n  error: Error | null;\n  resetBoundary: () => void;\n  showBoundary: (error: Error) => void;\n};\n\n/**\n * Convenience hook for imperatively showing or dismissing error boundaries.\n *\n * ⚠️ This hook must only be used within an `ErrorBoundary` subtree.\n */\nexport function useErrorBoundary(): {\n  /**\n   * The currently visible `Error` (if one has been thrown).\n   */\n  error: Error | null;\n\n  /**\n   * Method to reset and retry the nearest active error boundary (if one is active).\n   */\n  resetBoundary: () => void;\n\n  /**\n   * Trigger the nearest error boundary to display the error provided.\n   *\n   * ℹ️ React only handles errors thrown during render or during component lifecycle methods (e.g. effects and did-mount/did-update).\n   * Errors thrown in event handlers, or after async code has run, will not be caught.\n   * This method is a way to imperatively trigger an error boundary during these phases.\n   */\n  showBoundary: (error: Error) => void;\n} {\n  const context = useContext(ErrorBoundaryContext);\n\n  assertErrorBoundaryContext(context);\n\n  const { error, resetErrorBoundary } = context;\n\n  const [state, setState] = useState<UseErrorBoundaryState>({\n    error: null,\n    hasError: false,\n  });\n\n  const memoized = useMemo(\n    () => ({\n      error,\n      resetBoundary: () => {\n        resetErrorBoundary();\n        setState({ error: null, hasError: false });\n      },\n      showBoundary: (error: Error) =>\n        setState({\n          error,\n          hasError: true,\n        }),\n    }),\n    [error, resetErrorBoundary],\n  );\n\n  if (state.hasError) {\n    throw state.error;\n  }\n\n  return memoized;\n}\n","import {\n  createElement,\n  forwardRef,\n  type ComponentClass,\n  type ComponentType,\n} from \"react\";\nimport { ErrorBoundary } from \"../components/ErrorBoundary\";\nimport type { ErrorBoundaryProps } from \"../types\";\n\nexport function withErrorBoundary<\n  Type extends ComponentClass<unknown>,\n  Props extends object,\n>(Component: ComponentType<Props>, errorBoundaryProps: ErrorBoundaryProps) {\n  const Wrapped = forwardRef<InstanceType<Type>, Props>((props, ref) =>\n    createElement(\n      ErrorBoundary,\n      errorBoundaryProps,\n      createElement(Component, { ...props, ref } as Props),\n    ),\n  );\n\n  // Format for display in DevTools\n  const name = Component.displayName || Component.name || \"Unknown\";\n  Wrapped.displayName = `withErrorBoundary(${name})`;\n\n  return Wrapped;\n}\n"],"names":["ErrorBoundaryContext","createContext","initialState","ErrorBoundary","Component","props","error","args","info","prevProps","prevState","didCatch","resetKeys","hasArrayChanged","children","fallbackRender","FallbackComponent","fallback","childToRender","createElement","a","b","item","index","isErrorBoundaryContext","value","assertErrorBoundaryContext","useErrorBoundary","context","useContext","resetErrorBoundary","state","setState","useState","memoized","useMemo","withErrorBoundary","errorBoundaryProps","Wrapped","forwardRef","ref","name"],"mappings":"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"}

package/dist/react-error-boundary.d.ts

@@ -1,2 +1,165 @@
-export * from "./declarations/src/index.js";
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmVhY3QtZXJyb3ItYm91bmRhcnkuZC50cyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4vZGVjbGFyYXRpb25zL3NyYy9pbmRleC5kLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBIn0=
+import { Component } from 'react';
+import { ComponentClass } from 'react';
+import { ComponentType } from 'react';
+import { Context } from 'react';
+import { ErrorInfo } from 'react';
+import { ForwardRefExoticComponent } from 'react';
+import { FunctionComponentElement } from 'react';
+import { PropsWithChildren } from 'react';
+import { PropsWithoutRef } from 'react';
+import { ProviderProps } from 'react';
+import { ReactNode } from 'react';
+import { RefAttributes } from 'react';
+
+/**
+ * A reusable React [error boundary](https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary) component.
+ * Wrap this component around other React components to "catch" errors and render a fallback UI.
+ *
+ * This package is built on top of React [error boundaries](https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary),
+ * so it has all of the advantages and constraints of that API.
+ * This means that it can't catch errors during:
+ * - Server side rendering</li>
+ * - Event handlers
+ * - Asynchronous code (including effects)
+ *
+ * ℹ️ The component provides several ways to render a fallback: `fallback`, `fallbackRender`, and `FallbackComponent`.
+ * Refer to the documentation to determine which is best for your application.
+ *
+ * ℹ️ This is a **client component**. You can only pass props to it that are serializeable or use it in files that have a `"use client";` directive.
+ */
+export declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
+    constructor(props: ErrorBoundaryProps);
+    static getDerivedStateFromError(error: Error): {
+        didCatch: boolean;
+        error: Error;
+    };
+    resetErrorBoundary(...args: unknown[]): void;
+    componentDidCatch(error: Error, info: ErrorInfo): void;
+    componentDidUpdate(prevProps: ErrorBoundaryProps, prevState: ErrorBoundaryState): void;
+    render(): FunctionComponentElement<ProviderProps<ErrorBoundaryContextType | null>>;
+}
+
+export declare const ErrorBoundaryContext: Context<ErrorBoundaryContextType | null>;
+
+export declare type ErrorBoundaryContextType = {
+    didCatch: boolean;
+    error: Error | null;
+    resetErrorBoundary: (...args: unknown[]) => void;
+};
+
+export declare type ErrorBoundaryProps = ErrorBoundaryPropsWithFallback | ErrorBoundaryPropsWithComponent | ErrorBoundaryPropsWithRender;
+
+export declare type ErrorBoundaryPropsWithComponent = ErrorBoundarySharedProps & {
+    fallback?: never;
+    /**
+     * React component responsible for returning a fallback UI based on a thrown value.
+     *
+     * ```tsx
+     * <ErrorBoundary FallbackComponent={Fallback} />
+     * ```
+     */
+    FallbackComponent: ComponentType<FallbackProps>;
+    fallbackRender?: never;
+};
+
+export declare type ErrorBoundaryPropsWithFallback = ErrorBoundarySharedProps & {
+    /**
+     * Static content to render in place of an error if one is thrown.
+     *
+     * ```tsx
+     * <ErrorBoundary fallback={<div class="text-red">Something went wrong</div>} />
+     * ```
+     */
+    fallback: ReactNode;
+    FallbackComponent?: never;
+    fallbackRender?: never;
+};
+
+export declare type ErrorBoundaryPropsWithRender = ErrorBoundarySharedProps & {
+    fallback?: never;
+    FallbackComponent?: never;
+    /**
+     * [Render prop](https://react.dev/reference/react/Children#calling-a-render-prop-to-customize-rendering) function responsible for returning a fallback UI based on a thrown value.
+     *
+     * ```tsx
+     * <ErrorBoundary fallbackRender={({ error, resetErrorBoundary }) => <div>...</div>} />
+     * ```
+     */
+    fallbackRender: (props: FallbackProps) => ReactNode;
+};
+
+declare type ErrorBoundarySharedProps = PropsWithChildren<{
+    /**
+     * Optional callback to enable e.g. logging error information to a server.
+     *
+     * @param error Error that was thrown
+     * @param info React "component stack" identifying where the error was thrown
+     */
+    onError?: (error: Error, info: ErrorInfo) => void;
+    /**
+     * Optional callback to to be notified when an error boundary is "reset" so React can retry the failed render.
+     */
+    onReset?: (details: {
+        reason: "imperative-api";
+        args: unknown[];
+    } | {
+        reason: "keys";
+        prev: unknown[] | undefined;
+        next: unknown[] | undefined;
+    }) => void;
+    /**
+     * When changed, these keys will reset a triggered error boundary.
+     * This can be useful when an error condition may be tied to some specific state (that can be uniquely identified by key).
+     * See the the documentation for examples of how to use this prop.
+     */
+    resetKeys?: unknown[];
+}>;
+
+declare type ErrorBoundaryState = {
+    didCatch: true;
+    error: Error;
+} | {
+    didCatch: false;
+    error: null;
+};
+
+export declare type FallbackProps = {
+    error: Error;
+    resetErrorBoundary: (...args: unknown[]) => void;
+};
+
+export declare type OnErrorCallback = (error: Error, info: ErrorInfo) => void;
+
+/**
+ * Convenience hook for imperatively showing or dismissing error boundaries.
+ *
+ * ⚠️ This hook must only be used within an `ErrorBoundary` subtree.
+ */
+export declare function useErrorBoundary(): {
+    /**
+     * The currently visible `Error` (if one has been thrown).
+     */
+    error: Error | null;
+    /**
+     * Method to reset and retry the nearest active error boundary (if one is active).
+     */
+    resetBoundary: () => void;
+    /**
+     * Trigger the nearest error boundary to display the error provided.
+     *
+     * ℹ️ React only handles errors thrown during render or during component lifecycle methods (e.g. effects and did-mount/did-update).
+     * Errors thrown in event handlers, or after async code has run, will not be caught.
+     * This method is a way to imperatively trigger an error boundary during these phases.
+     */
+    showBoundary: (error: Error) => void;
+};
+
+export declare type UseErrorBoundaryApi = {
+    error: Error | null;
+    resetBoundary: () => void;
+    showBoundary: (error: Error) => void;
+};
+
+export declare function withErrorBoundary<Type extends ComponentClass<unknown>, Props extends object>(Component: ComponentType<Props>, errorBoundaryProps: ErrorBoundaryProps): ForwardRefExoticComponent<PropsWithoutRef<Props> & RefAttributes<InstanceType<Type>>>;
+
+export { }

package/dist/react-error-boundary.js

@@ -1,151 +1,111 @@
-'use client';
-import { createContext, Component, createElement, useContext, useState, useMemo, forwardRef } from 'react';
-
-const ErrorBoundaryContext = createContext(null);
-
-const initialState = {
-  didCatch: false,
+"use client";
+import { createContext as l, Component as y, createElement as d, useContext as f, useState as p, useMemo as E, forwardRef as B } from "react";
+const h = l(null), c = {
+  didCatch: !1,
   error: null
 };
-class ErrorBoundary extends Component {
-  constructor(props) {
-    super(props);
-    this.resetErrorBoundary = this.resetErrorBoundary.bind(this);
-    this.state = initialState;
+class m extends y {
+  constructor(t) {
+    super(t), this.resetErrorBoundary = this.resetErrorBoundary.bind(this), this.state = c;
   }
-  static getDerivedStateFromError(error) {
-    return {
-      didCatch: true,
-      error
-    };
+  static getDerivedStateFromError(t) {
+    return { didCatch: !0, error: t };
   }
-  resetErrorBoundary() {
-    const {
-      error
-    } = this.state;
-    if (error !== null) {
-      var _this$props$onReset, _this$props;
-      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-        args[_key] = arguments[_key];
-      }
-      (_this$props$onReset = (_this$props = this.props).onReset) === null || _this$props$onReset === void 0 ? void 0 : _this$props$onReset.call(_this$props, {
-        args,
-        reason: "imperative-api"
-      });
-      this.setState(initialState);
-    }
+  resetErrorBoundary(...t) {
+    const { error: e } = this.state;
+    e !== null && (this.props.onReset?.({
+      args: t,
+      reason: "imperative-api"
+    }), this.setState(c));
   }
-  componentDidCatch(error, info) {
-    var _this$props$onError, _this$props2;
-    (_this$props$onError = (_this$props2 = this.props).onError) === null || _this$props$onError === void 0 ? void 0 : _this$props$onError.call(_this$props2, error, info);
+  componentDidCatch(t, e) {
+    this.props.onError?.(t, e);
   }
-  componentDidUpdate(prevProps, prevState) {
-    const {
-      didCatch
-    } = this.state;
-    const {
-      resetKeys
-    } = this.props;
-
-    // There's an edge case where if the thing that triggered the error happens to *also* be in the resetKeys array,
-    // we'd end up resetting the error boundary immediately.
-    // This would likely trigger a second error to be thrown.
-    // So we make sure that we don't check the resetKeys on the first call of cDU after the error is set.
-
-    if (didCatch && prevState.error !== null && hasArrayChanged(prevProps.resetKeys, resetKeys)) {
-      var _this$props$onReset2, _this$props3;
-      (_this$props$onReset2 = (_this$props3 = this.props).onReset) === null || _this$props$onReset2 === void 0 ? void 0 : _this$props$onReset2.call(_this$props3, {
-        next: resetKeys,
-        prev: prevProps.resetKeys,
-        reason: "keys"
-      });
-      this.setState(initialState);
-    }
+  componentDidUpdate(t, e) {
+    const { didCatch: o } = this.state, { resetKeys: n } = this.props;
+    o && e.error !== null && C(t.resetKeys, n) && (this.props.onReset?.({
+      next: n,
+      prev: t.resetKeys,
+      reason: "keys"
+    }), this.setState(c));
   }
   render() {
-    const {
-      children,
-      fallbackRender,
-      FallbackComponent,
-      fallback
-    } = this.props;
-    const {
-      didCatch,
-      error
-    } = this.state;
-    let childToRender = children;
-    if (didCatch) {
-      const props = {
-        error,
+    const { children: t, fallbackRender: e, FallbackComponent: o, fallback: n } = this.props, { didCatch: s, error: a } = this.state;
+    let i = t;
+    if (s) {
+      const u = {
+        error: a,
         resetErrorBoundary: this.resetErrorBoundary
       };
-      if (typeof fallbackRender === "function") {
-        childToRender = fallbackRender(props);
-      } else if (FallbackComponent) {
-        childToRender = createElement(FallbackComponent, props);
-      } else if (fallback !== undefined) {
-        childToRender = fallback;
-      } else {
-        throw error;
-      }
+      if (typeof e == "function")
+        i = e(u);
+      else if (o)
+        i = d(o, u);
+      else if (n !== void 0)
+        i = n;
+      else
+        throw a;
     }
-    return createElement(ErrorBoundaryContext.Provider, {
-      value: {
-        didCatch,
-        error,
-        resetErrorBoundary: this.resetErrorBoundary
-      }
-    }, childToRender);
+    return d(
+      h.Provider,
+      {
+        value: {
+          didCatch: s,
+          error: a,
+          resetErrorBoundary: this.resetErrorBoundary
+        }
+      },
+      i
+    );
   }
 }
-function hasArrayChanged() {
-  let a = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-  let b = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
-  return a.length !== b.length || a.some((item, index) => !Object.is(item, b[index]));
+function C(r = [], t = []) {
+  return r.length !== t.length || r.some((e, o) => !Object.is(e, t[o]));
+}
+function x(r) {
+  return r !== null && typeof r == "object" && "didCatch" in r && typeof r.didCatch == "boolean" && "error" in r && "resetErrorBoundary" in r && typeof r.resetErrorBoundary == "function";
 }
-
-function assertErrorBoundaryContext(value) {
-  if (value == null || typeof value.didCatch !== "boolean" || typeof value.resetErrorBoundary !== "function") {
+function w(r) {
+  if (!x(r))
     throw new Error("ErrorBoundaryContext not found");
-  }
 }
-
-function useErrorBoundary() {
-  const context = useContext(ErrorBoundaryContext);
-  assertErrorBoundaryContext(context);
-  const [state, setState] = useState({
+function S() {
+  const r = f(h);
+  w(r);
+  const { error: t, resetErrorBoundary: e } = r, [o, n] = p({
     error: null,
-    hasError: false
-  });
-  const memoized = useMemo(() => ({
-    resetBoundary: () => {
-      context.resetErrorBoundary();
-      setState({
-        error: null,
-        hasError: false
-      });
-    },
-    showBoundary: error => setState({
-      error,
-      hasError: true
-    })
-  }), [context.resetErrorBoundary]);
-  if (state.hasError) {
-    throw state.error;
-  }
-  return memoized;
+    hasError: !1
+  }), s = E(
+    () => ({
+      error: t,
+      resetBoundary: () => {
+        e(), n({ error: null, hasError: !1 });
+      },
+      showBoundary: (a) => n({
+        error: a,
+        hasError: !0
+      })
+    }),
+    [t, e]
+  );
+  if (o.hasError)
+    throw o.error;
+  return s;
 }
-
-function withErrorBoundary(component, errorBoundaryProps) {
-  const Wrapped = forwardRef((props, ref) => createElement(ErrorBoundary, errorBoundaryProps, createElement(component, {
-    ...props,
-    ref
-  })));
-
-  // Format for display in DevTools
-  const name = component.displayName || component.name || "Unknown";
-  Wrapped.displayName = "withErrorBoundary(".concat(name, ")");
-  return Wrapped;
+function k(r, t) {
+  const e = B(
+    (n, s) => d(
+      m,
+      t,
+      d(r, { ...n, ref: s })
+    )
+  ), o = r.displayName || r.name || "Unknown";
+  return e.displayName = `withErrorBoundary(${o})`, e;
 }
-
-export { ErrorBoundary, ErrorBoundaryContext, useErrorBoundary, withErrorBoundary };
+export {
+  m as ErrorBoundary,
+  h as ErrorBoundaryContext,
+  S as useErrorBoundary,
+  k as withErrorBoundary
+};
+//# sourceMappingURL=react-error-boundary.js.map

package/dist/react-error-boundary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"react-error-boundary.js","sources":["../lib/context/ErrorBoundaryContext.ts","../lib/components/ErrorBoundary.tsx","../lib/utils/isErrorBoundaryContext.ts","../lib/utils/assertErrorBoundaryContext.ts","../lib/hooks/useErrorBoundary.ts","../lib/utils/withErrorBoundary.ts"],"sourcesContent":["import { createContext } from \"react\";\n\nexport type ErrorBoundaryContextType = {\n  didCatch: boolean;\n  error: Error | null;\n  resetErrorBoundary: (...args: unknown[]) => void;\n};\n\nexport const ErrorBoundaryContext =\n  createContext<ErrorBoundaryContextType | null>(null);\n","import { Component, createElement, type ErrorInfo } from \"react\";\nimport { ErrorBoundaryContext } from \"../context/ErrorBoundaryContext\";\nimport type { ErrorBoundaryProps, FallbackProps } from \"../types\";\n\nconst isDevelopment = import.meta.env.DEV;\n\ntype ErrorBoundaryState =\n  | {\n      didCatch: true;\n      error: Error;\n    }\n  | {\n      didCatch: false;\n      error: null;\n    };\n\nconst initialState: ErrorBoundaryState = {\n  didCatch: false,\n  error: null,\n};\n\n/**\n * A reusable React [error boundary](https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary) component.\n * Wrap this component around other React components to \"catch\" errors and render a fallback UI.\n *\n * This package is built on top of React [error boundaries](https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary),\n * so it has all of the advantages and constraints of that API.\n * This means that it can't catch errors during:\n * - Server side rendering</li>\n * - Event handlers\n * - Asynchronous code (including effects)\n *\n * ℹ️ The component provides several ways to render a fallback: `fallback`, `fallbackRender`, and `FallbackComponent`.\n * Refer to the documentation to determine which is best for your application.\n *\n * ℹ️ This is a **client component**. You can only pass props to it that are serializeable or use it in files that have a `\"use client\";` directive.\n */\nexport class ErrorBoundary extends Component<\n  ErrorBoundaryProps,\n  ErrorBoundaryState\n> {\n  constructor(props: ErrorBoundaryProps) {\n    super(props);\n\n    this.resetErrorBoundary = this.resetErrorBoundary.bind(this);\n    this.state = initialState;\n  }\n\n  static getDerivedStateFromError(error: Error) {\n    return { didCatch: true, error };\n  }\n\n  resetErrorBoundary(...args: unknown[]) {\n    const { error } = this.state;\n\n    if (error !== null) {\n      this.props.onReset?.({\n        args,\n        reason: \"imperative-api\",\n      });\n\n      this.setState(initialState);\n    }\n  }\n\n  componentDidCatch(error: Error, info: ErrorInfo) {\n    this.props.onError?.(error, info);\n  }\n\n  componentDidUpdate(\n    prevProps: ErrorBoundaryProps,\n    prevState: ErrorBoundaryState,\n  ) {\n    const { didCatch } = this.state;\n    const { resetKeys } = this.props;\n\n    // There's an edge case where if the thing that triggered the error happens to *also* be in the resetKeys array,\n    // we'd end up resetting the error boundary immediately.\n    // This would likely trigger a second error to be thrown.\n    // So we make sure that we don't check the resetKeys on the first call of cDU after the error is set.\n\n    if (\n      didCatch &&\n      prevState.error !== null &&\n      hasArrayChanged(prevProps.resetKeys, resetKeys)\n    ) {\n      this.props.onReset?.({\n        next: resetKeys,\n        prev: prevProps.resetKeys,\n        reason: \"keys\",\n      });\n\n      this.setState(initialState);\n    }\n  }\n\n  render() {\n    const { children, fallbackRender, FallbackComponent, fallback } =\n      this.props;\n    const { didCatch, error } = this.state;\n\n    let childToRender = children;\n\n    if (didCatch) {\n      const props: FallbackProps = {\n        error,\n        resetErrorBoundary: this.resetErrorBoundary,\n      };\n\n      if (typeof fallbackRender === \"function\") {\n        childToRender = fallbackRender(props);\n      } else if (FallbackComponent) {\n        childToRender = createElement(FallbackComponent, props);\n      } else if (fallback !== undefined) {\n        childToRender = fallback;\n      } else {\n        if (isDevelopment) {\n          console.error(\n            \"react-error-boundary requires either a fallback, fallbackRender, or FallbackComponent prop\",\n          );\n        }\n\n        throw error;\n      }\n    }\n\n    return createElement(\n      ErrorBoundaryContext.Provider,\n      {\n        value: {\n          didCatch,\n          error,\n          resetErrorBoundary: this.resetErrorBoundary,\n        },\n      },\n      childToRender,\n    );\n  }\n}\n\nfunction hasArrayChanged(a: unknown[] = [], b: unknown[] = []) {\n  return (\n    a.length !== b.length || a.some((item, index) => !Object.is(item, b[index]))\n  );\n}\n","import type { ErrorBoundaryContextType } from \"../context/ErrorBoundaryContext\";\n\nexport function isErrorBoundaryContext(\n  value: unknown,\n): value is ErrorBoundaryContextType {\n  return (\n    value !== null &&\n    typeof value === \"object\" &&\n    \"didCatch\" in value &&\n    typeof value.didCatch === \"boolean\" &&\n    \"error\" in value &&\n    \"resetErrorBoundary\" in value &&\n    typeof value.resetErrorBoundary === \"function\"\n  );\n}\n","import type { ErrorBoundaryContextType } from \"../context/ErrorBoundaryContext\";\nimport { isErrorBoundaryContext } from \"./isErrorBoundaryContext\";\n\nexport function assertErrorBoundaryContext(\n  value: unknown,\n): asserts value is ErrorBoundaryContextType {\n  if (!isErrorBoundaryContext(value)) {\n    throw new Error(\"ErrorBoundaryContext not found\");\n  }\n}\n","import { useContext, useMemo, useState } from \"react\";\nimport { ErrorBoundaryContext } from \"../context/ErrorBoundaryContext\";\nimport { assertErrorBoundaryContext } from \"../utils/assertErrorBoundaryContext\";\n\ntype UseErrorBoundaryState =\n  | { error: Error; hasError: true }\n  | { error: null; hasError: false };\n\nexport type UseErrorBoundaryApi = {\n  error: Error | null;\n  resetBoundary: () => void;\n  showBoundary: (error: Error) => void;\n};\n\n/**\n * Convenience hook for imperatively showing or dismissing error boundaries.\n *\n * ⚠️ This hook must only be used within an `ErrorBoundary` subtree.\n */\nexport function useErrorBoundary(): {\n  /**\n   * The currently visible `Error` (if one has been thrown).\n   */\n  error: Error | null;\n\n  /**\n   * Method to reset and retry the nearest active error boundary (if one is active).\n   */\n  resetBoundary: () => void;\n\n  /**\n   * Trigger the nearest error boundary to display the error provided.\n   *\n   * ℹ️ React only handles errors thrown during render or during component lifecycle methods (e.g. effects and did-mount/did-update).\n   * Errors thrown in event handlers, or after async code has run, will not be caught.\n   * This method is a way to imperatively trigger an error boundary during these phases.\n   */\n  showBoundary: (error: Error) => void;\n} {\n  const context = useContext(ErrorBoundaryContext);\n\n  assertErrorBoundaryContext(context);\n\n  const { error, resetErrorBoundary } = context;\n\n  const [state, setState] = useState<UseErrorBoundaryState>({\n    error: null,\n    hasError: false,\n  });\n\n  const memoized = useMemo(\n    () => ({\n      error,\n      resetBoundary: () => {\n        resetErrorBoundary();\n        setState({ error: null, hasError: false });\n      },\n      showBoundary: (error: Error) =>\n        setState({\n          error,\n          hasError: true,\n        }),\n    }),\n    [error, resetErrorBoundary],\n  );\n\n  if (state.hasError) {\n    throw state.error;\n  }\n\n  return memoized;\n}\n","import {\n  createElement,\n  forwardRef,\n  type ComponentClass,\n  type ComponentType,\n} from \"react\";\nimport { ErrorBoundary } from \"../components/ErrorBoundary\";\nimport type { ErrorBoundaryProps } from \"../types\";\n\nexport function withErrorBoundary<\n  Type extends ComponentClass<unknown>,\n  Props extends object,\n>(Component: ComponentType<Props>, errorBoundaryProps: ErrorBoundaryProps) {\n  const Wrapped = forwardRef<InstanceType<Type>, Props>((props, ref) =>\n    createElement(\n      ErrorBoundary,\n      errorBoundaryProps,\n      createElement(Component, { ...props, ref } as Props),\n    ),\n  );\n\n  // Format for display in DevTools\n  const name = Component.displayName || Component.name || \"Unknown\";\n  Wrapped.displayName = `withErrorBoundary(${name})`;\n\n  return Wrapped;\n}\n"],"names":["ErrorBoundaryContext","createContext","initialState","ErrorBoundary","Component","props","error","args","info","prevProps","prevState","didCatch","resetKeys","hasArrayChanged","children","fallbackRender","FallbackComponent","fallback","childToRender","createElement","a","b","item","index","isErrorBoundaryContext","value","assertErrorBoundaryContext","useErrorBoundary","context","useContext","resetErrorBoundary","state","setState","useState","memoized","useMemo","withErrorBoundary","errorBoundaryProps","Wrapped","forwardRef","ref","name"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-error-boundary",
-  "version": "6.0.0",
+  "version": "6.0.2",
   "type": "module",
   "description": "Simple reusable React error boundary component",
   "author": "Brian Vaughn <brian.david.vaughn@gmail.com>",
@@ -9,73 +9,117 @@
     "type": "git",
     "url": "https://github.com/bvaughn/react-error-boundary"
   },
-  "exports": {
-    ".": {
-      "types": "./dist/react-error-boundary.js",
-      "development": "./dist/react-error-boundary.development.js",
-      "default": "./dist/react-error-boundary.js"
-    },
-    "./package.json": "./package.json"
-  },
-  "imports": {
-    "#is-development": {
-      "development": "./src/env-conditions/development.ts",
-      "default": "./src/env-conditions/production.ts"
-    }
-  },
+  "contributors": [
+    "Brian Vaughn <brian.david.vaughn@gmail.com> (https://github.com/bvaughn/)"
+  ],
+  "homepage": "https://react-error-boundary-lib.vercel.app/",
+  "keywords": [
+    "react",
+    "reactjs",
+    "virtual",
+    "window",
+    "windowed",
+    "list",
+    "scrolling",
+    "infinite",
+    "virtualized",
+    "table",
+    "grid",
+    "spreadsheet"
+  ],
+  "main": "dist/react-error-boundary.cjs",
+  "module": "dist/react-error-boundary.js",
   "types": "dist/react-error-boundary.d.ts",
   "files": [
     "dist"
   ],
-  "sideEffects": false,
-  "dependencies": {
-    "@babel/runtime": "^7.12.5"
+  "scripts": {
+    "dev": "vite",
+    "dev:integrations": "pnpm -C integrations/vite/ run dev",
+    "build": "pnpm run build:lib && pnpm run build:docs",
+    "build:docs": "TARGET=docs vite build",
+    "build:lib": "TARGET=lib vite build",
+    "compile": "pnpm run compile:docs && pnpm run compile:examples",
+    "compile:docs": "tsx ./scripts/compile-docs",
+    "compile:examples": "tsx ./scripts/compile-examples",
+    "compress:og-image": "tsx ./scripts/compress-og-image",
+    "lint": "eslint .",
+    "prerelease": "rm -rf dist && pnpm run build:lib",
+    "prettier": "prettier --write \"**/*.{css,html,js,json,jsx,ts,tsx}\"",
+    "prettier:ci": "prettier --check \"**/*.{css,html,js,json,jsx,ts,tsx}\"",
+    "preview": "vite preview",
+    "test": "vitest",
+    "test:ci": "vitest run",
+    "test:debug": "vitest --inspect-brk=127.0.0.1:3000 --no-file-parallelism",
+    "tsc": "tsc -b"
   },
-  "devDependencies": {
-    "@babel/preset-env": "^7.22.5",
-    "@babel/preset-typescript": "^7.21.5",
-    "@preconstruct/cli": "^2.8.12",
-    "@types/assert": "^1.5.10",
-    "@types/react": "^18.3.17",
-    "@types/react-dom": "^18",
-    "assert": "^2.0.0",
-    "eslint": "^9.13.0",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-import": "^2.25.2",
-    "eslint-plugin-prettier": "^5.2.1",
-    "eslint-plugin-react": "^7.37.2",
-    "globals": "^15.11.0",
-    "prettier": "^3.0.1",
-    "react": "^18",
-    "react-dom": "^18",
-    "rimraf": "^6.0.1",
-    "vitest": "^3.1.2",
-    "typescript": "^5.8.3",
-    "typescript-eslint": "^8.18.0"
+  "lint-staged": {
+    "**/*": "prettier --write --ignore-unknown"
   },
   "peerDependencies": {
-    "react": ">=16.13.1"
-  },
-  "preconstruct": {
-    "exports": {
-      "importConditionDefaultExport": "default"
-    },
-    "___experimentalFlags_WILL_CHANGE_IN_PATCH": {
-      "distInRoot": true,
-      "importsConditions": true,
-      "typeModule": true
-    }
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
   },
-  "scripts": {
-    "clear": "pnpm clear:builds & pnpm clear:node_modules",
-    "clear:builds": "rimraf ./dist",
-    "clear:node_modules": "rimraf ./node_modules",
-    "prerelease": "preconstruct build",
-    "lint": "eslint .",
-    "lint:fix": "eslint . --fix",
-    "test": "vitest --environment=jsdom --watch=false",
-    "test:watch": "vitest --environment=jsdom --watch",
-    "typescript": "tsc --noEmit",
-    "typescript:watch": "tsc --noEmit --watch"
+  "devDependencies": {
+    "@csstools/postcss-oklab-function": "^4.0.11",
+    "@eslint/js": "^9.30.1",
+    "@headlessui/react": "^2.2.4",
+    "@headlessui/tailwindcss": "^0.2.2",
+    "@heroicons/react": "^2.2.0",
+    "@tailwindcss/vite": "^4.1.11",
+    "@tailwindplus/elements": "^1.0.5",
+    "@testing-library/jest-dom": "^6.6.4",
+    "@testing-library/react": "^16.3.0",
+    "@testing-library/user-event": "^14.6.1",
+    "@types/bytes": "^3.1.5",
+    "@types/compression": "^1.8.1",
+    "@types/markdown-it": "^14.1.2",
+    "@types/node": "^24.2.0",
+    "@types/react": "^19.1.8",
+    "@types/react-dom": "^19.2.3",
+    "@types/sharp": "^0.32.0",
+    "@vitejs/plugin-react-swc": "^3.10.2",
+    "bytes": "^3.1.2",
+    "clsx": "^2.1.1",
+    "compression": "^1.8.1",
+    "csstype": "^3.1.3",
+    "eslint": "^9.30.1",
+    "eslint-plugin-react-hooks": "^5.2.0",
+    "eslint-plugin-react-refresh": "^0.4.20",
+    "globals": "^16.3.0",
+    "husky": "^9.1.7",
+    "jsdom": "^26.1.0",
+    "lint-staged": "^16.1.4",
+    "markdown-it": "^14.1.0",
+    "marked": "^16.4.1",
+    "postcss": "^8.5.6",
+    "prettier": "3.6.2",
+    "prettier-plugin-tailwindcss": "^0.7.1",
+    "react": "^19.2.3",
+    "react-docgen-typescript": "^2.4.0",
+    "react-dom": "^19.2.3",
+    "react-error-boundary": "^6.0.0",
+    "react-lib-tools": "^0.0.30",
+    "react-router-dom": "^7.6.3",
+    "rollup-plugin-terser": "^7.0.2",
+    "rollup-plugin-visualizer": "^6.0.3",
+    "rollup-preserve-directives": "^1.1.3",
+    "sharp": "^0.34.5",
+    "sirv": "^3.0.2",
+    "tailwind-merge": "^3.3.1",
+    "tailwindcss": "^4.1.11",
+    "terser": "^5.43.1",
+    "ts-blank-space": "^0.6.2",
+    "ts-node": "^10.9.2",
+    "tsx": "^4.21.0",
+    "typescript": "~5.8.3",
+    "typescript-eslint": "^8.35.1",
+    "typescript-json-schema": "^0.65.1",
+    "vite": "^7.0.4",
+    "vite-plugin-dts": "^4.5.4",
+    "vite-plugin-svgr": "^4.3.0",
+    "vitest": "^3.2.4",
+    "vitest-fail-on-console": "^0.10.1",
+    "zustand": "^5.0.7"
   }
-}
+}

package/dist/declarations/src/ErrorBoundary.d.ts

@@ -1,21 +0,0 @@
-import { Component, ErrorInfo } from "react";
-import { ErrorBoundaryProps } from "./types.js";
-type ErrorBoundaryState = {
-    didCatch: true;
-    error: any;
-} | {
-    didCatch: false;
-    error: null;
-};
-export declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
-    constructor(props: ErrorBoundaryProps);
-    static getDerivedStateFromError(error: Error): {
-        didCatch: boolean;
-        error: Error;
-    };
-    resetErrorBoundary(...args: any[]): void;
-    componentDidCatch(error: Error, info: ErrorInfo): void;
-    componentDidUpdate(prevProps: ErrorBoundaryProps, prevState: ErrorBoundaryState): void;
-    render(): import("react").FunctionComponentElement<import("react").ProviderProps<import("./ErrorBoundaryContext.js").ErrorBoundaryContextType | null>>;
-}
-export {};

package/dist/declarations/src/ErrorBoundaryContext.d.ts

@@ -1,6 +0,0 @@
-export type ErrorBoundaryContextType = {
-    didCatch: boolean;
-    error: any;
-    resetErrorBoundary: (...args: any[]) => void;
-};
-export declare const ErrorBoundaryContext: import("react").Context<ErrorBoundaryContextType | null>;

package/dist/declarations/src/index.d.ts

@@ -1,5 +0,0 @@
-export * from "./ErrorBoundary.js";
-export * from "./ErrorBoundaryContext.js";
-export * from "./useErrorBoundary.js";
-export * from "./withErrorBoundary.js";
-export * from "./types.js";

package/dist/declarations/src/types.d.ts

@@ -1,34 +0,0 @@
-import { ComponentType, ErrorInfo, PropsWithChildren, ReactNode } from "react";
-export type FallbackProps = {
-    error: any;
-    resetErrorBoundary: (...args: any[]) => void;
-};
-type ErrorBoundarySharedProps = PropsWithChildren<{
-    onError?: (error: Error, info: ErrorInfo) => void;
-    onReset?: (details: {
-        reason: "imperative-api";
-        args: any[];
-    } | {
-        reason: "keys";
-        prev: any[] | undefined;
-        next: any[] | undefined;
-    }) => void;
-    resetKeys?: any[];
-}>;
-export type ErrorBoundaryPropsWithComponent = ErrorBoundarySharedProps & {
-    fallback?: never;
-    FallbackComponent: ComponentType<FallbackProps>;
-    fallbackRender?: never;
-};
-export type ErrorBoundaryPropsWithRender = ErrorBoundarySharedProps & {
-    fallback?: never;
-    FallbackComponent?: never;
-    fallbackRender: (props: FallbackProps) => ReactNode;
-};
-export type ErrorBoundaryPropsWithFallback = ErrorBoundarySharedProps & {
-    fallback: ReactNode;
-    FallbackComponent?: never;
-    fallbackRender?: never;
-};
-export type ErrorBoundaryProps = ErrorBoundaryPropsWithFallback | ErrorBoundaryPropsWithComponent | ErrorBoundaryPropsWithRender;
-export {};

package/dist/declarations/src/useErrorBoundary.d.ts

@@ -1,5 +0,0 @@
-export type UseErrorBoundaryApi<TError> = {
-    resetBoundary: () => void;
-    showBoundary: (error: TError) => void;
-};
-export declare function useErrorBoundary<TError = any>(): UseErrorBoundaryApi<TError>;

package/dist/declarations/src/withErrorBoundary.d.ts

@@ -1,3 +0,0 @@
-import { RefAttributes, ForwardRefExoticComponent, PropsWithoutRef, ComponentType, ComponentRef, ComponentProps } from "react";
-import { ErrorBoundaryProps } from "./types.js";
-export declare function withErrorBoundary<T extends ComponentType<any>>(component: T, errorBoundaryProps: ErrorBoundaryProps): ForwardRefExoticComponent<PropsWithoutRef<ComponentProps<T>> & RefAttributes<ComponentRef<T>>>;

package/dist/react-error-boundary.development.js

@@ -1,154 +0,0 @@
-'use client';
-import { createContext, Component, createElement, useContext, useState, useMemo, forwardRef } from 'react';
-
-const ErrorBoundaryContext = createContext(null);
-
-const initialState = {
-  didCatch: false,
-  error: null
-};
-class ErrorBoundary extends Component {
-  constructor(props) {
-    super(props);
-    this.resetErrorBoundary = this.resetErrorBoundary.bind(this);
-    this.state = initialState;
-  }
-  static getDerivedStateFromError(error) {
-    return {
-      didCatch: true,
-      error
-    };
-  }
-  resetErrorBoundary() {
-    const {
-      error
-    } = this.state;
-    if (error !== null) {
-      var _this$props$onReset, _this$props;
-      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-        args[_key] = arguments[_key];
-      }
-      (_this$props$onReset = (_this$props = this.props).onReset) === null || _this$props$onReset === void 0 ? void 0 : _this$props$onReset.call(_this$props, {
-        args,
-        reason: "imperative-api"
-      });
-      this.setState(initialState);
-    }
-  }
-  componentDidCatch(error, info) {
-    var _this$props$onError, _this$props2;
-    (_this$props$onError = (_this$props2 = this.props).onError) === null || _this$props$onError === void 0 ? void 0 : _this$props$onError.call(_this$props2, error, info);
-  }
-  componentDidUpdate(prevProps, prevState) {
-    const {
-      didCatch
-    } = this.state;
-    const {
-      resetKeys
-    } = this.props;
-
-    // There's an edge case where if the thing that triggered the error happens to *also* be in the resetKeys array,
-    // we'd end up resetting the error boundary immediately.
-    // This would likely trigger a second error to be thrown.
-    // So we make sure that we don't check the resetKeys on the first call of cDU after the error is set.
-
-    if (didCatch && prevState.error !== null && hasArrayChanged(prevProps.resetKeys, resetKeys)) {
-      var _this$props$onReset2, _this$props3;
-      (_this$props$onReset2 = (_this$props3 = this.props).onReset) === null || _this$props$onReset2 === void 0 ? void 0 : _this$props$onReset2.call(_this$props3, {
-        next: resetKeys,
-        prev: prevProps.resetKeys,
-        reason: "keys"
-      });
-      this.setState(initialState);
-    }
-  }
-  render() {
-    const {
-      children,
-      fallbackRender,
-      FallbackComponent,
-      fallback
-    } = this.props;
-    const {
-      didCatch,
-      error
-    } = this.state;
-    let childToRender = children;
-    if (didCatch) {
-      const props = {
-        error,
-        resetErrorBoundary: this.resetErrorBoundary
-      };
-      if (typeof fallbackRender === "function") {
-        childToRender = fallbackRender(props);
-      } else if (FallbackComponent) {
-        childToRender = createElement(FallbackComponent, props);
-      } else if (fallback !== undefined) {
-        childToRender = fallback;
-      } else {
-        {
-          console.error("react-error-boundary requires either a fallback, fallbackRender, or FallbackComponent prop");
-        }
-        throw error;
-      }
-    }
-    return createElement(ErrorBoundaryContext.Provider, {
-      value: {
-        didCatch,
-        error,
-        resetErrorBoundary: this.resetErrorBoundary
-      }
-    }, childToRender);
-  }
-}
-function hasArrayChanged() {
-  let a = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-  let b = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
-  return a.length !== b.length || a.some((item, index) => !Object.is(item, b[index]));
-}
-
-function assertErrorBoundaryContext(value) {
-  if (value == null || typeof value.didCatch !== "boolean" || typeof value.resetErrorBoundary !== "function") {
-    throw new Error("ErrorBoundaryContext not found");
-  }
-}
-
-function useErrorBoundary() {
-  const context = useContext(ErrorBoundaryContext);
-  assertErrorBoundaryContext(context);
-  const [state, setState] = useState({
-    error: null,
-    hasError: false
-  });
-  const memoized = useMemo(() => ({
-    resetBoundary: () => {
-      context.resetErrorBoundary();
-      setState({
-        error: null,
-        hasError: false
-      });
-    },
-    showBoundary: error => setState({
-      error,
-      hasError: true
-    })
-  }), [context.resetErrorBoundary]);
-  if (state.hasError) {
-    throw state.error;
-  }
-  return memoized;
-}
-
-function withErrorBoundary(component, errorBoundaryProps) {
-  const Wrapped = forwardRef((props, ref) => createElement(ErrorBoundary, errorBoundaryProps, createElement(component, {
-    ...props,
-    ref
-  })));
-
-  // Format for display in DevTools
-  const name = component.displayName || component.name || "Unknown";
-  Wrapped.displayName = "withErrorBoundary(".concat(name, ")");
-  return Wrapped;
-}
-
-export { ErrorBoundary, ErrorBoundaryContext, useErrorBoundary, withErrorBoundary };