@draftbase/renderer 0.5.4 → 0.5.5

package/dist/MDXErrorBoundary.d.ts

@@ -1,8 +1,8 @@
-import { Component, type ReactNode } from "react";
+import { Component, type ErrorInfo, type ReactNode } from "react";
 interface MDXErrorBoundaryProps {
     children: ReactNode;
     fallback: ReactNode;
-    onError?: (error: unknown) => void;
+    onError?: (error: unknown, errorInfo: ErrorInfo) => void;
 }
 interface MDXErrorBoundaryState {
     hasError: boolean;
@@ -12,7 +12,7 @@ export declare class MDXErrorBoundary extends Component<MDXErrorBoundaryProps, M
     static getDerivedStateFromError(): {
         hasError: boolean;
     };
-    componentDidCatch(error: unknown): void;
+    componentDidCatch(error: unknown, errorInfo: ErrorInfo): void;
     render(): ReactNode;
 }
 export {};

package/dist/MDXErrorBoundary.js

@@ -7,9 +7,9 @@ export class MDXErrorBoundary extends Component {
     static getDerivedStateFromError() {
         return { hasError: true };
     }
-    componentDidCatch(error) {
-        console.error("MDX content failed to render", error);
-        this.props.onError?.(error);
+    componentDidCatch(error, errorInfo) {
+        console.error("MDX content failed to render", error, errorInfo.componentStack);
+        this.props.onError?.(error, errorInfo);
     }
     render() {
         return this.state.hasError ? this.props.fallback : this.props.children;

package/dist/reactNative.js

@@ -27,7 +27,12 @@ export function createReactNativeRenderer(primitives, styleOptions) {
             tree = processor.parse(source);
         }
         catch (error) {
-            return { ok: false, error };
+            return {
+                ok: false,
+                error: new Error(`MDX parse failed (${source.length} chars): ${describeError(error)}`, {
+                    cause: error,
+                }),
+            };
         }
         // Reference-style links/images (`[text][ref]` + a `[ref]: url` definition anywhere in the
         // doc) resolve against whichever `definition` node shares their identifier — collect them
@@ -76,13 +81,27 @@ function renderNode(node, ctx, key) {
         return renderNodeUnsafe(node, ctx, key);
     }
     catch (error) {
-        console.error("MDX content failed to render a section, showing its raw source instead", error);
+        const label = node.name ? `<${node.name}>` : node.type;
+        const wrapped = new Error(`MDX node "${label}" failed to render: ${describeError(error)}`, {
+            cause: error,
+        });
+        console.error(wrapped.message, error);
         const raw = node.position
             ? ctx.source.slice(node.position.start.offset, node.position.end.offset)
-            : `<${node.name ?? node.type}>`;
-        return jsx(ctx.components.p, { children: raw }, key);
+            : `<${label}>`;
+        try {
+            return jsx(ctx.components.p, { children: raw }, key);
+        }
+        catch (fallbackError) {
+            throw new Error(`MDX node "${label}" failed to render and had no fallback component`, {
+                cause: fallbackError,
+            });
+        }
     }
 }
+function describeError(error) {
+    return error instanceof Error ? error.message : String(error);
+}
 function renderNodeUnsafe(node, ctx, key) {
     const { components } = ctx;
     switch (node.type) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@draftbase/renderer",
-  "version": "0.5.4",
+  "version": "0.5.5",
   "description": "Framework-agnostic MDX renderer for Draftbase content (React, Next.js RSC, React Native, Astro, Vite, Vue)",
   "keywords": [
     "draftbase",