@tanstack/solid-router/dist/esm/Matches.js

Modern and scalable routing for Solid applications

import { renderInNonRouteComponentContext } from "./nonRouteComponentContext.js";
import { CatchBoundary, ErrorComponent } from "./CatchBoundary.js";
import { useRouter } from "./useRouter.js";
import { nearestMatchContext } from "./matchContext.js";
import { Rendered, Transitioner } from "./Transitioner.js";
import { SafeFragment } from "./SafeFragment.js";
import { Match } from "./Match.js";
import { replaceEqualDeep, rootRouteId } from "@tanstack/router-core";
import { createComponent, memo } from "solid-js/web";
import * as Solid from "solid-js";
import { isServer } from "@tanstack/router-core/isServer";
//#region src/Matches.tsx
function Matches() {
	const router = useRouter();
	const ResolvedSuspense = (isServer ?? router.isServer) || typeof document !== "undefined" && router.ssr ? SafeFragment : Solid.Suspense;
	const rootRoute = () => router.routesById[rootRouteId];
	const PendingComponent = rootRoute().options.pendingComponent ?? router.options.defaultPendingComponent;
	return createComponent(router.options.InnerWrap || SafeFragment, { get children() {
		return createComponent(ResolvedSuspense, {
			get fallback() {
				return PendingComponent ? (() => {
					if (process.env.NODE_ENV !== "production") return renderInNonRouteComponentContext(() => createComponent(PendingComponent, {}), "pendingComponent");
					return createComponent(PendingComponent, {});
				})() : null;
			},
			get children() {
				return [
					createComponent(Transitioner, {}),
					createComponent(MatchesInner, {}),
					createComponent(Rendered, {})
				];
			}
		});
	} });
}
function MatchesInner() {
	const router = useRouter();
	const routeId = () => router.stores.ids.get()[0];
	const match = () => routeId() ? router.stores.byRoute.get(routeId())?.get() : void 0;
	const nearestMatch = [routeId, match];
	const matchComponent = () => {
		return createComponent(Solid.Show, {
			get when() {
				return routeId();
			},
			get children() {
				return createComponent(Match, { get routeId() {
					return routeId();
				} });
			}
		});
	};
	return createComponent(nearestMatchContext.Provider, {
		value: nearestMatch,
		get children() {
			return memo(() => !!router.options.disableGlobalCatchBoundary)() ? matchComponent() : createComponent(CatchBoundary, {
				getResetKey: match,
				errorComponent: ErrorComponent,
				get onCatch() {
					return process.env.NODE_ENV !== "production" ? (error) => {
						console.warn(`Warning: The following error wasn't caught by any route! At the very least, consider setting an 'errorComponent' in your RootRoute!`);
						console.warn(`Warning: ${error.message || error.toString()}`);
					} : void 0;
				},
				get children() {
					return matchComponent();
				}
			});
		}
	});
}
function useMatchRoute() {
	const router = useRouter();
	return (opts) => {
		return Solid.createMemo(() => {
			const { pending, caseSensitive, fuzzy, includeSearch, ...rest } = opts;
			router.stores.location.get();
			router.stores.resolvedLocation.get();
			router.stores.status.get();
			return router.matchRoute(rest, {
				pending,
				caseSensitive,
				fuzzy,
				includeSearch
			});
		});
	};
}
function MatchRoute(props) {
	const params = useMatchRoute()(props);
	return memo(Solid.createMemo(() => {
		const matchedParams = params();
		const child = props.children;
		if (typeof child === "function") return child(matchedParams);
		return matchedParams ? child : null;
	}));
}
function useMatches(opts) {
	const router = useRouter();
	return Solid.createMemo((prev) => {
		const matches = router.stores.matches.get();
		const res = opts?.select ? opts.select(matches) : matches;
		if (prev === void 0) return res;
		return replaceEqualDeep(prev, res);
	});
}
function useParentMatches(opts) {
	const contextRouteId = Solid.useContext(nearestMatchContext)[0];
	return useMatches({ select: (matches) => {
		matches = matches.slice(0, matches.findIndex((d) => d.routeId === contextRouteId()));
		return opts?.select ? opts.select(matches) : matches;
	} });
}
function useChildMatches(opts) {
	const contextRouteId = Solid.useContext(nearestMatchContext)[0];
	return useMatches({ select: (matches) => {
		matches = matches.slice(matches.findIndex((d) => d.routeId === contextRouteId()) + 1);
		return opts?.select ? opts.select(matches) : matches;
	} });
}
//#endregion
export { MatchRoute, Matches, useChildMatches, useMatchRoute, useMatches, useParentMatches };

//# sourceMappingURL=Matches.js.map