101 lines
2.8 KiB
JavaScript
101 lines
2.8 KiB
JavaScript
"use client";
|
|
const require_runtime = require("./_virtual/_rolldown/runtime.cjs");
|
|
let react = require("react");
|
|
react = require_runtime.__toESM(react);
|
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
//#region src/CatchBoundary.tsx
|
|
function CatchBoundary(props) {
|
|
const errorComponent = props.errorComponent ?? ErrorComponent;
|
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CatchBoundaryImpl, {
|
|
getResetKey: props.getResetKey,
|
|
onCatch: props.onCatch,
|
|
children: ({ error, reset }) => {
|
|
if (error) return react.createElement(errorComponent, {
|
|
error,
|
|
reset
|
|
});
|
|
return props.children;
|
|
}
|
|
});
|
|
}
|
|
var CatchBoundaryImpl = class extends react.Component {
|
|
constructor(..._args) {
|
|
super(..._args);
|
|
this.state = { error: null };
|
|
}
|
|
static getDerivedStateFromProps(props, state) {
|
|
const resetKey = props.getResetKey();
|
|
if (state.error && state.resetKey !== resetKey) return {
|
|
resetKey,
|
|
error: null
|
|
};
|
|
return { resetKey };
|
|
}
|
|
static getDerivedStateFromError(error) {
|
|
return { error };
|
|
}
|
|
reset() {
|
|
this.setState({ error: null });
|
|
}
|
|
componentDidCatch(error, errorInfo) {
|
|
if (this.props.onCatch) this.props.onCatch(error, errorInfo);
|
|
}
|
|
render() {
|
|
return this.props.children({
|
|
error: this.state.error,
|
|
reset: () => {
|
|
this.reset();
|
|
}
|
|
});
|
|
}
|
|
};
|
|
function ErrorComponent({ error }) {
|
|
const [show, setShow] = react.useState(process.env.NODE_ENV !== "production");
|
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
style: {
|
|
padding: ".5rem",
|
|
maxWidth: "100%"
|
|
},
|
|
children: [
|
|
/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
style: {
|
|
display: "flex",
|
|
alignItems: "center",
|
|
gap: ".5rem"
|
|
},
|
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("strong", {
|
|
style: { fontSize: "1rem" },
|
|
children: "Something went wrong!"
|
|
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
|
|
style: {
|
|
appearance: "none",
|
|
fontSize: ".6em",
|
|
border: "1px solid currentColor",
|
|
padding: ".1rem .2rem",
|
|
fontWeight: "bold",
|
|
borderRadius: ".25rem"
|
|
},
|
|
onClick: () => setShow((d) => !d),
|
|
children: show ? "Hide Error" : "Show Error"
|
|
})]
|
|
}),
|
|
/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { style: { height: ".25rem" } }),
|
|
show ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("pre", {
|
|
style: {
|
|
fontSize: ".7em",
|
|
border: "1px solid red",
|
|
borderRadius: ".25rem",
|
|
padding: ".3rem",
|
|
color: "red",
|
|
overflow: "auto"
|
|
},
|
|
children: error.message ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("code", { children: error.message }) : null
|
|
}) }) : null
|
|
]
|
|
});
|
|
}
|
|
//#endregion
|
|
exports.CatchBoundary = CatchBoundary;
|
|
exports.ErrorComponent = ErrorComponent;
|
|
|
|
//# sourceMappingURL=CatchBoundary.cjs.map
|