import { Component } from "@wordpress/element"; import { __ } from "@wordpress/i18n"; /** * Error Boundary Component * Catches JavaScript errors anywhere in the child component tree */ class ErrorBoundary extends Component { constructor(props) { super(props); this.state = { hasError: false, error: null, errorInfo: null }; } static getDerivedStateFromError(error) { // Update state so the next render will show the fallback UI return { hasError: true }; } componentDidCatch(error, errorInfo) { // Log error details console.error("Smart Design Library Error:", error, errorInfo); this.setState({ error: error, errorInfo: errorInfo, }); // Optional: Send error to logging service if (this.props.onError) { this.props.onError(error, errorInfo); } } render() { if (this.state.hasError) { // Fallback UI return (

{__("Something went wrong", "easy-accordion-free")}

{__( "We're sorry, but something went wrong while loading the design library.", "easy-accordion-free" )}

{this.props.showDetails && this.state.error && (
{__("Error Details", "easy-accordion-free")} 
{this.state.error.toString()}
{this.state.errorInfo && 
{this.state.errorInfo.componentStack}
}
)}
); } return this.props.children; } } export default ErrorBoundary;