@tanstack/solid-router
Version:
Modern and scalable routing for Solid applications
366 lines (365 loc) • 15.7 kB
JavaScript
const require_runtime = require("./_virtual/_rolldown/runtime.cjs");
const require_CatchBoundary = require("./CatchBoundary.cjs");
const require_useRouter = require("./useRouter.cjs");
const require_matchContext = require("./matchContext.cjs");
const require_SafeFragment = require("./SafeFragment.cjs");
const require_not_found = require("./not-found.cjs");
const require_renderRouteNotFound = require("./renderRouteNotFound.cjs");
const require_scroll_restoration = require("./scroll-restoration.cjs");
let _tanstack_router_core = require("@tanstack/router-core");
let solid_js_web = require("solid-js/web");
let solid_js = require("solid-js");
solid_js = require_runtime.__toESM(solid_js);
let _tanstack_router_core_isServer = require("@tanstack/router-core/isServer");
//#region src/Match.tsx
var Match = (props) => {
const router = require_useRouter.useRouter();
const match = solid_js.createMemo(() => {
const id = props.matchId;
if (!id) return void 0;
return router.stores.activeMatchStoresById.get(id)?.state;
});
const rawMatchState = solid_js.createMemo(() => {
const currentMatch = match();
if (!currentMatch) return null;
const routeId = currentMatch.routeId;
const parentRouteId = router.routesById[routeId]?.parentRoute?.id;
return {
matchId: currentMatch.id,
routeId,
ssr: currentMatch.ssr,
_displayPending: currentMatch._displayPending,
parentRouteId
};
});
const nearestMatch = {
matchId: () => rawMatchState()?.matchId,
routeId: () => rawMatchState()?.routeId,
match,
hasPending: solid_js.createMemo(() => {
const currentRouteId = rawMatchState()?.routeId;
return currentRouteId ? Boolean(router.stores.pendingRouteIds.state[currentRouteId]) : false;
})
};
return (0, solid_js_web.createComponent)(solid_js.Show, {
get when() {
return rawMatchState();
},
children: (currentMatchState) => {
const route = () => router.routesById[currentMatchState().routeId];
const resolvePendingComponent = () => route().options.pendingComponent ?? router.options.defaultPendingComponent;
const routeErrorComponent = () => route().options.errorComponent ?? router.options.defaultErrorComponent;
const routeOnCatch = () => route().options.onCatch ?? router.options.defaultOnCatch;
const routeNotFoundComponent = () => route().isRoot ? route().options.notFoundComponent ?? router.options.notFoundRoute?.options.component : route().options.notFoundComponent;
const resolvedNoSsr = currentMatchState().ssr === false || currentMatchState().ssr === "data-only";
const ResolvedSuspenseBoundary = () => solid_js.Suspense;
const ResolvedCatchBoundary = () => routeErrorComponent() ? require_CatchBoundary.CatchBoundary : require_SafeFragment.SafeFragment;
const ResolvedNotFoundBoundary = () => routeNotFoundComponent() ? require_not_found.CatchNotFound : require_SafeFragment.SafeFragment;
return (0, solid_js_web.createComponent)(route().isRoot ? route().options.shellComponent ?? require_SafeFragment.SafeFragment : require_SafeFragment.SafeFragment, { get children() {
return [(0, solid_js_web.createComponent)(require_matchContext.nearestMatchContext.Provider, {
value: nearestMatch,
get children() {
return (0, solid_js_web.createComponent)(solid_js_web.Dynamic, {
get component() {
return ResolvedSuspenseBoundary();
},
get fallback() {
return (0, solid_js_web.memo)(() => !!((_tanstack_router_core_isServer.isServer ?? router.isServer) && resolvedNoSsr))() ? void 0 : (0, solid_js_web.createComponent)(solid_js_web.Dynamic, { get component() {
return resolvePendingComponent();
} });
},
get children() {
return (0, solid_js_web.createComponent)(solid_js_web.Dynamic, {
get component() {
return ResolvedCatchBoundary();
},
getResetKey: () => router.stores.loadedAt.state,
get errorComponent() {
return routeErrorComponent() || require_CatchBoundary.ErrorComponent;
},
onCatch: (error) => {
const notFoundError = require_not_found.getNotFound(error);
if (notFoundError) {
notFoundError.routeId ??= currentMatchState().routeId;
throw notFoundError;
}
if (process.env.NODE_ENV !== "production") console.warn(`Warning: Error in route match: ${currentMatchState().routeId}`);
routeOnCatch()?.(error);
},
get children() {
return (0, solid_js_web.createComponent)(solid_js_web.Dynamic, {
get component() {
return ResolvedNotFoundBoundary();
},
fallback: (error) => {
const notFoundError = require_not_found.getNotFound(error) ?? error;
notFoundError.routeId ??= currentMatchState().routeId;
if (!routeNotFoundComponent() || notFoundError.routeId && notFoundError.routeId !== currentMatchState().routeId || !notFoundError.routeId && !route().isRoot) throw notFoundError;
return (0, solid_js_web.createComponent)(solid_js_web.Dynamic, (0, solid_js_web.mergeProps)({ get component() {
return routeNotFoundComponent();
} }, notFoundError));
},
get children() {
return (0, solid_js_web.createComponent)(solid_js.Switch, { get children() {
return [(0, solid_js_web.createComponent)(solid_js.Match, {
when: resolvedNoSsr,
get children() {
return (0, solid_js_web.createComponent)(solid_js.Show, {
get when() {
return !(_tanstack_router_core_isServer.isServer ?? router.isServer);
},
get fallback() {
return (0, solid_js_web.createComponent)(solid_js_web.Dynamic, { get component() {
return resolvePendingComponent();
} });
},
get children() {
return (0, solid_js_web.createComponent)(MatchInner, {});
}
});
}
}), (0, solid_js_web.createComponent)(solid_js.Match, {
when: !resolvedNoSsr,
get children() {
return (0, solid_js_web.createComponent)(MatchInner, {});
}
})];
} });
}
});
}
});
}
});
}
}), (0, solid_js_web.memo)(() => (0, solid_js_web.memo)(() => currentMatchState().parentRouteId === _tanstack_router_core.rootRouteId)() ? [(0, solid_js_web.createComponent)(OnRendered, {}), (0, solid_js_web.memo)(() => (0, solid_js_web.memo)(() => !!(router.options.scrollRestoration && (_tanstack_router_core_isServer.isServer ?? router.isServer)))() ? (0, solid_js_web.createComponent)(require_scroll_restoration.ScrollRestoration, {}) : null)] : null)];
} });
}
});
};
function OnRendered() {
const router = require_useRouter.useRouter();
const location = solid_js.createMemo(() => router.stores.resolvedLocation.state?.state.__TSR_key);
solid_js.createEffect(solid_js.on([location], () => {
router.emit({
type: "onRendered",
...(0, _tanstack_router_core.getLocationChangeInfo)(router.stores.location.state, router.stores.resolvedLocation.state)
});
}));
return null;
}
var MatchInner = () => {
const router = require_useRouter.useRouter();
const match = solid_js.useContext(require_matchContext.nearestMatchContext).match;
const rawMatchState = solid_js.createMemo(() => {
const currentMatch = match();
if (!currentMatch) return null;
const routeId = currentMatch.routeId;
const remountDeps = (router.routesById[routeId].options.remountDeps ?? router.options.defaultRemountDeps)?.({
routeId,
loaderDeps: currentMatch.loaderDeps,
params: currentMatch._strictParams,
search: currentMatch._strictSearch
});
return {
key: remountDeps ? JSON.stringify(remountDeps) : void 0,
routeId,
match: {
id: currentMatch.id,
status: currentMatch.status,
error: currentMatch.error,
_forcePending: currentMatch._forcePending ?? false,
_displayPending: currentMatch._displayPending ?? false
}
};
});
return (0, solid_js_web.createComponent)(solid_js.Show, {
get when() {
return rawMatchState();
},
children: (currentMatchState) => {
const route = () => router.routesById[currentMatchState().routeId];
const currentMatch = () => currentMatchState().match;
const componentKey = () => currentMatchState().key ?? currentMatchState().match.id;
const out = () => {
const Comp = route().options.component ?? router.options.defaultComponent;
if (Comp) return (0, solid_js_web.createComponent)(Comp, {});
return (0, solid_js_web.createComponent)(Outlet, {});
};
const keyedOut = () => (0, solid_js_web.createComponent)(solid_js.Show, {
get when() {
return componentKey();
},
keyed: true,
children: (_key) => out()
});
return (0, solid_js_web.createComponent)(solid_js.Switch, { get children() {
return [
(0, solid_js_web.createComponent)(solid_js.Match, {
get when() {
return currentMatch()._displayPending;
},
children: (_) => {
const [displayPendingResult] = solid_js.createResource(() => router.getMatch(currentMatch().id)?._nonReactive.displayPendingPromise);
return (0, solid_js_web.memo)(displayPendingResult);
}
}),
(0, solid_js_web.createComponent)(solid_js.Match, {
get when() {
return currentMatch()._forcePending;
},
children: (_) => {
const [minPendingResult] = solid_js.createResource(() => router.getMatch(currentMatch().id)?._nonReactive.minPendingPromise);
return (0, solid_js_web.memo)(minPendingResult);
}
}),
(0, solid_js_web.createComponent)(solid_js.Match, {
get when() {
return currentMatch().status === "pending";
},
children: (_) => {
const pendingMinMs = route().options.pendingMinMs ?? router.options.defaultPendingMinMs;
if (pendingMinMs) {
const routerMatch = router.getMatch(currentMatch().id);
if (routerMatch && !routerMatch._nonReactive.minPendingPromise) {
if (!(_tanstack_router_core_isServer.isServer ?? router.isServer)) {
const minPendingPromise = (0, _tanstack_router_core.createControlledPromise)();
routerMatch._nonReactive.minPendingPromise = minPendingPromise;
setTimeout(() => {
minPendingPromise.resolve();
routerMatch._nonReactive.minPendingPromise = void 0;
}, pendingMinMs);
}
}
}
const [loaderResult] = solid_js.createResource(async () => {
await new Promise((r) => setTimeout(r, 0));
return router.getMatch(currentMatch().id)?._nonReactive.loadPromise;
});
const FallbackComponent = route().options.pendingComponent ?? router.options.defaultPendingComponent;
return [FallbackComponent && pendingMinMs > 0 ? (0, solid_js_web.createComponent)(solid_js_web.Dynamic, { component: FallbackComponent }) : null, (0, solid_js_web.memo)(loaderResult)];
}
}),
(0, solid_js_web.createComponent)(solid_js.Match, {
get when() {
return currentMatch().status === "notFound";
},
children: (_) => {
if (!(0, _tanstack_router_core.isNotFound)(currentMatch().error)) {
if (process.env.NODE_ENV !== "production") throw new Error("Invariant failed: Expected a notFound error");
(0, _tanstack_router_core.invariant)();
}
return (0, solid_js_web.createComponent)(solid_js.Show, {
get when() {
return currentMatchState().routeId;
},
keyed: true,
children: (_routeId) => require_renderRouteNotFound.renderRouteNotFound(router, route(), currentMatch().error)
});
}
}),
(0, solid_js_web.createComponent)(solid_js.Match, {
get when() {
return currentMatch().status === "redirected";
},
children: (_) => {
if (!(0, _tanstack_router_core.isRedirect)(currentMatch().error)) {
if (process.env.NODE_ENV !== "production") throw new Error("Invariant failed: Expected a redirect error");
(0, _tanstack_router_core.invariant)();
}
const [loaderResult] = solid_js.createResource(async () => {
await new Promise((r) => setTimeout(r, 0));
return router.getMatch(currentMatch().id)?._nonReactive.loadPromise;
});
return (0, solid_js_web.memo)(loaderResult);
}
}),
(0, solid_js_web.createComponent)(solid_js.Match, {
get when() {
return currentMatch().status === "error";
},
children: (_) => {
if (_tanstack_router_core_isServer.isServer ?? router.isServer) return (0, solid_js_web.createComponent)((route().options.errorComponent ?? router.options.defaultErrorComponent) || require_CatchBoundary.ErrorComponent, {
get error() {
return currentMatch().error;
},
info: { componentStack: "" }
});
throw currentMatch().error;
}
}),
(0, solid_js_web.createComponent)(solid_js.Match, {
get when() {
return currentMatch().status === "success";
},
get children() {
return keyedOut();
}
})
];
} });
}
});
};
var Outlet = () => {
const router = require_useRouter.useRouter();
const nearestParentMatch = solid_js.useContext(require_matchContext.nearestMatchContext);
const parentMatch = nearestParentMatch.match;
const routeId = nearestParentMatch.routeId;
const route = solid_js.createMemo(() => routeId() ? router.routesById[routeId()] : void 0);
const parentGlobalNotFound = solid_js.createMemo(() => parentMatch()?.globalNotFound ?? false);
const childMatchId = solid_js.createMemo(() => {
const currentRouteId = routeId();
return currentRouteId ? router.stores.childMatchIdByRouteId.state[currentRouteId] : void 0;
});
const childMatchStatus = solid_js.createMemo(() => {
const id = childMatchId();
if (!id) return void 0;
return router.stores.activeMatchStoresById.get(id)?.state.status;
});
const shouldShowNotFound = () => childMatchStatus() !== "redirected" && parentGlobalNotFound();
return (0, solid_js_web.createComponent)(solid_js.Show, {
get when() {
return (0, solid_js_web.memo)(() => !!!shouldShowNotFound())() && childMatchId();
},
get fallback() {
return (0, solid_js_web.createComponent)(solid_js.Show, {
get when() {
return (0, solid_js_web.memo)(() => !!shouldShowNotFound())() && route();
},
children: (resolvedRoute) => require_renderRouteNotFound.renderRouteNotFound(router, resolvedRoute(), void 0)
});
},
children: (childMatchIdAccessor) => {
const currentMatchId = solid_js.createMemo(() => childMatchIdAccessor());
return (0, solid_js_web.createComponent)(solid_js.Show, {
get when() {
return routeId() === _tanstack_router_core.rootRouteId;
},
get fallback() {
return (0, solid_js_web.createComponent)(Match, { get matchId() {
return currentMatchId();
} });
},
get children() {
return (0, solid_js_web.createComponent)(solid_js.Suspense, {
get fallback() {
return (0, solid_js_web.createComponent)(solid_js_web.Dynamic, { get component() {
return router.options.defaultPendingComponent;
} });
},
get children() {
return (0, solid_js_web.createComponent)(Match, { get matchId() {
return currentMatchId();
} });
}
});
}
});
}
});
};
//#endregion
exports.Match = Match;
exports.Outlet = Outlet;
//# sourceMappingURL=Match.cjs.map