everything-dev/dist/ui/router-error.cjs

A consolidated product package for building Module Federation apps with oRPC APIs.

Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
let react_jsx_runtime = require("react/jsx-runtime");

//#region src/ui/router-error.tsx
/**
* Generic router error boundary component — shared by the client and SSR
* router factories. Dependency-free by design: the framework cannot import
* the app's UI kit, so primitives are plain markup + semantic tokens.
*/
function RouterError({ error, reset, messages }) {
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
		className: "flex min-h-96 flex-1 items-center justify-center bg-background px-4 py-16",
		role: "alert",
		"data-testid": "router-error",
		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
			className: "flex max-w-md flex-col items-center gap-6 text-center",
			children: [
				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
					className: "flex size-14 items-center justify-center rounded-full bg-destructive-muted text-destructive-muted-foreground",
					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
						className: "size-7",
						viewBox: "0 0 256 256",
						fill: "currentColor",
						"aria-hidden": "true",
						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M128 24a104 104 0 1 0 104 104A104.11 104.11 0 0 0 128 24Zm0 192a88 88 0 1 1 88-88 88.1 88.1 0 0 1-88 88Zm-8-80V80a8 8 0 0 1 16 0v56a8 8 0 0 1-16 0Zm20 36a12 12 0 1 1-12-12 12 12 0 0 1 12 12Z" })
					})
				}),
				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
					className: "flex flex-col gap-3",
					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h1", {
						className: "text-3xl font-semibold text-foreground",
						children: messages?.title ?? "This page didn’t load"
					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
						className: "text-base text-muted-foreground",
						children: messages?.body ?? "Something went wrong on our side. Try again, or head back home."
					})]
				}),
				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
					className: "flex flex-wrap justify-center gap-3",
					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
						href: "/",
						"data-testid": "router-error-home",
						className: "inline-flex h-9 items-center justify-center rounded-md bg-primary px-4 text-sm font-medium text-primary-foreground",
						children: messages?.home ?? "Back home"
					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
						type: "button",
						onClick: () => reset ? reset() : window.location.reload(),
						"data-testid": "router-error-retry",
						className: "inline-flex h-9 items-center justify-center rounded-md border border-border bg-background px-4 text-sm font-medium text-foreground",
						children: messages?.retry ?? "Try again"
					})]
				}),
				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("details", {
					className: "w-full text-left text-sm text-muted-foreground",
					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("summary", {
						className: "cursor-pointer text-center",
						children: "Error details"
					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("pre", {
						className: "mt-3 overflow-x-auto whitespace-pre-wrap rounded-lg bg-muted p-4 font-mono text-xs",
						children: error.message
					})]
				})
			]
		})
	});
}

//#endregion
exports.RouterError = RouterError;
//# sourceMappingURL=router-error.cjs.map