"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ComponentNotFound = exports.createErrorFallback = exports.ErrorBoundary = void 0;
const tslib_1 = require("tslib");
const cals_1 = require("@cloudbase/cals");
const react_1 = tslib_1.__importDefault(require("react"));
class ErrorBoundary extends react_1.default.Component {
    constructor() {
        super(...arguments);
        this.state = { error: null };
    }
    // capture error
    static getDerivedStateFromError(error) {
        return { error };
    }
    componentDidCatch(error, info) {
        var _a, _b;
        console.error('组件边界错误', error);
        (_b = (_a = this.props).onError) === null || _b === void 0 ? void 0 : _b.call(_a, error, info);
    }
    render() {
        const { error } = this.state;
        // @ts-expect-error ts(2339) (at least one of these will be defined though, and we check for their existence)
        const { fallbackRender, FallbackComponent, fallback } = this.props;
        if (error !== null) {
            const props = {
                error,
            };
            if (react_1.default.isValidElement(fallback)) {
                return fallback;
            }
            if (typeof fallbackRender === 'function') {
                return fallbackRender(props);
            }
            if (FallbackComponent) {
                return react_1.default.createElement(FallbackComponent, Object.assign({}, props));
            }
            return `Error Render: ${error === null || error === void 0 ? void 0 : error.message}`;
        }
        return this.props.children;
    }
}
exports.ErrorBoundary = ErrorBoundary;
function createErrorFallback(cmpKey, id) {
    return function ComponentErrorFallback(props) {
        let isComponentError = true;
        let tipsContent = '组件错误';
        return (react_1.default.createElement("div", { className: `component-error-box`, style: {
                width: 169,
                height: 91,
                background: 'rgb(241, 242, 245)',
                display: 'flex',
                justifyContent: 'center',
                alignItems: 'center',
                margin: '6px',
            }, title: isComponentError
                ? `组件${cmpKey} ${id}发生了错误，请确保您使用正确的组件库或联系组件作者错误信息：${props.error}`
                : tipsContent },
            react_1.default.createElement("div", { className: "component-error-box-icon", style: {
                    height: 32,
                    width: 32,
                    backgroundSize: '100% 100%',
                    backgroundRepeat: 'no-repeat',
                    backgroundImage: 'url(https://imgcache.qq.com/qcloud/lowcode/static/ide/component-fail.svg)',
                } })));
    };
}
exports.createErrorFallback = createErrorFallback;
function ComponentNotFound({ module = cals_1.OFFICIAL_LIB_KEY, component }) {
    return (react_1.default.createElement("div", { style: { color: 'red' } },
        "\u7EC4\u4EF6",
        react_1.default.createElement("em", null, `${module}:${component}`),
        "\u672A\u627E\u5230"));
}
exports.ComponentNotFound = ComponentNotFound;
//# sourceMappingURL=error.js.map