litzjs 0.0.0 → 0.1.0

package/dist/client.js

@@ -1,7 +1,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_chunk = require("./chunk-8l464Juk.js");
 const require_bindings = require("./bindings-B1P6pL93.js");
-const require_internal_transport = require("./internal-transport-DR0r68ff.js");
+const require_internal_transport = require("./internal-transport-Er_DZe-u.js");
 let react = require("react");
 react = require_chunk.__toESM(react);
 let virtual_litzjs_route_manifest = require("virtual:litzjs:route-manifest");
@@ -191,7 +191,7 @@ async function createViewResult(response, publicHeaders = createPublicResultHead
 	const node = await createFromReadableStream(response.body);
 	return {
 		kind: "view",
-		status: Number(response.headers.get("x-litz-status") ?? response.status),
+		status: Number(response.headers.get("x-litzjs-status") ?? response.status),
 		headers: publicHeaders,
 		stale: false,
 		node,
@@ -207,7 +207,7 @@ function isRedirectSignal(value) {
 	return typeof value === "object" && value !== null && "kind" in value && value.kind === "redirect";
 }
 function getRevalidateTargets(headers) {
-	const value = headers.get("x-litz-revalidate");
+	const value = headers.get("x-litzjs-revalidate");
 	if (!value) return [];
 	return value.split(",").map((entry) => entry.trim()).filter(Boolean);
 }
@@ -232,6 +232,207 @@ function createRedirectSignal(status, headers, body) {
 	};
 }
 //#endregion
+//#region src/client/route-runtime.tsx
+let routeLocationContext = null;
+let routeStatusContext = null;
+let routeDataContext = null;
+let routeActionsContext = null;
+const routeFormComponentCache = /* @__PURE__ */ new Map();
+function createRuntimeContext$1(name) {
+	const createContext = react.createContext;
+	if (!createContext) throw new Error(`${name} is not available in this environment.`);
+	return createContext(null);
+}
+function getRouteLocationContext() {
+	routeLocationContext ??= createRuntimeContext$1("Litz route location");
+	return routeLocationContext;
+}
+function getRouteStatusContext() {
+	routeStatusContext ??= createRuntimeContext$1("Litz route status");
+	return routeStatusContext;
+}
+function getRouteDataContext() {
+	routeDataContext ??= createRuntimeContext$1("Litz route data");
+	return routeDataContext;
+}
+function getRouteActionsContext() {
+	routeActionsContext ??= createRuntimeContext$1("Litz route actions");
+	return routeActionsContext;
+}
+function requireActiveRouteSlice(routeId, value) {
+	if (!value) throw new Error(`Route "${routeId}" is being used outside the Litz runtime.`);
+	if (value.id !== routeId) throw new Error(`Route "${routeId}" is not the active route. Active route is "${value.id}".`);
+	return value;
+}
+function RouteRuntimeProvider(props) {
+	const RouteLocationContext = getRouteLocationContext();
+	const RouteStatusContext = getRouteStatusContext();
+	const RouteDataContext = getRouteDataContext();
+	const RouteActionsContext = getRouteActionsContext();
+	const locationValue = react.useMemo(() => ({
+		id: props.value.id,
+		params: props.value.params,
+		search: props.value.search,
+		setSearch: props.value.setSearch
+	}), [
+		props.value.id,
+		props.value.params,
+		props.value.search,
+		props.value.setSearch
+	]);
+	const statusValue = react.useMemo(() => ({
+		id: props.value.id,
+		status: props.value.status,
+		pending: props.value.pending
+	}), [
+		props.value.id,
+		props.value.pending,
+		props.value.status
+	]);
+	const dataValue = react.useMemo(() => ({
+		id: props.value.id,
+		loaderResult: props.value.loaderResult,
+		actionResult: props.value.actionResult,
+		data: props.value.data,
+		view: props.value.view
+	}), [
+		props.value.actionResult,
+		props.value.data,
+		props.value.id,
+		props.value.loaderResult,
+		props.value.view
+	]);
+	const actionsValue = react.useMemo(() => ({
+		id: props.value.id,
+		submit: props.value.submit,
+		reload: props.value.reload,
+		retry: props.value.retry
+	}), [
+		props.value.id,
+		props.value.reload,
+		props.value.retry,
+		props.value.submit
+	]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RouteLocationContext.Provider, {
+		value: locationValue,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RouteStatusContext.Provider, {
+			value: statusValue,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RouteDataContext.Provider, {
+				value: dataValue,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RouteActionsContext.Provider, {
+					value: actionsValue,
+					children: props.children
+				})
+			})
+		})
+	});
+}
+function useRequiredRouteLocation(routeId) {
+	return requireActiveRouteSlice(routeId, react.useContext(getRouteLocationContext()));
+}
+function useRequiredRouteStatus(routeId) {
+	return requireActiveRouteSlice(routeId, react.useContext(getRouteStatusContext()));
+}
+function useRequiredRouteData(routeId) {
+	return requireActiveRouteSlice(routeId, react.useContext(getRouteDataContext()));
+}
+function useRequiredRouteActions(routeId) {
+	return requireActiveRouteSlice(routeId, react.useContext(getRouteActionsContext()));
+}
+function createRouteFormComponent(routeId) {
+	const cached = routeFormComponentCache.get(routeId);
+	if (cached) return cached;
+	const MemoizedLitzRouteForm = react.memo(function LitzRouteForm(props) {
+		const actions = useRequiredRouteActions(routeId);
+		const { children, onSubmit, replace, revalidate, ...rest } = props;
+		const submitRef = react.useRef((payload, options) => actions.submit(payload, options));
+		react.useEffect(() => {
+			submitRef.current = (payload, options) => actions.submit(payload, options);
+		}, [actions.submit]);
+		const action = react.useCallback(async (formData) => {
+			await submitRef.current(formData, {
+				replace,
+				revalidate
+			});
+		}, [replace, revalidate]);
+		return react.createElement("form", {
+			...rest,
+			action,
+			onSubmit
+		}, children);
+	});
+	MemoizedLitzRouteForm.displayName = `LitzRouteForm(${routeId})`;
+	routeFormComponentCache.set(routeId, MemoizedLitzRouteForm);
+	return MemoizedLitzRouteForm;
+}
+//#endregion
+//#region src/client/runtime.tsx
+async function fetchRouteLoader(path, request, target, signal) {
+	return parseLoaderResponse(await fetch("/_litzjs/route", {
+		method: "POST",
+		headers: {
+			"content-type": "application/json",
+			accept: require_internal_transport.LITZ_RESULT_ACCEPT
+		},
+		body: JSON.stringify({
+			path,
+			target,
+			operation: "loader",
+			request: normalizeRequest(request)
+		}),
+		signal
+	}));
+}
+async function fetchRouteAction(path, request, payload) {
+	const actionRequest = require_internal_transport.createInternalActionRequestInit({
+		path,
+		operation: "action",
+		request: normalizeRequest(request)
+	}, payload);
+	return parseActionResponse(await fetch("/_litzjs/action", {
+		method: "POST",
+		headers: actionRequest.headers,
+		body: actionRequest.body
+	}));
+}
+function normalizeRequest(request) {
+	return {
+		params: request.params ?? {},
+		search: request.search instanceof URLSearchParams ? Object.fromEntries(request.search.entries()) : request.search ?? {}
+	};
+}
+//#endregion
+//#region src/client/loader-fetch.ts
+async function fetchRouteLoadersInParallel(matches, context) {
+	return Promise.allSettled(matches.map((match) => fetchRouteLoader(context.routePath, context.baseRequest, match.id, context.signal).then((loaderResult) => ({
+		match,
+		loaderResult
+	}))));
+}
+function processLoaderResults(settled, matches, callbacks) {
+	for (const [index, result] of settled.entries()) {
+		if (callbacks.isCancelled?.()) return;
+		if (result.status === "rejected") {
+			const error = result.reason;
+			if (isRedirectSignal(error)) {
+				callbacks.onRedirect(error.location);
+				return;
+			}
+			if (isRouteLikeError(error)) {
+				callbacks.onRouteError(matches[index].id, error);
+				return;
+			}
+			throw error;
+		}
+		callbacks.onResult(result.value.match, result.value.loaderResult);
+	}
+}
+//#endregion
+//#region src/client/sort-record.ts
+function sortRecord(record) {
+	return Object.fromEntries(Object.entries(record).sort(([left], [right]) => left.localeCompare(right)));
+}
+//#endregion
 //#region src/client/resources.tsx
 const RESOURCE_STORE_LIMIT = 200;
 const resourceStore = /* @__PURE__ */ new Map();
@@ -241,25 +442,25 @@ let resourceLocationContext = null;
 let resourceStatusContext = null;
 let resourceDataContext = null;
 let resourceActionsContext = null;
-function createRuntimeContext$1(name) {
+function createRuntimeContext(name) {
 	const createContext = react.createContext;
 	if (!createContext) throw new Error(`${name} is not available in this environment.`);
 	return createContext(null);
 }
 function getResourceLocationContext() {
-	resourceLocationContext ??= createRuntimeContext$1("Litz resource location");
+	resourceLocationContext ??= createRuntimeContext("Litz resource location");
 	return resourceLocationContext;
 }
 function getResourceStatusContext() {
-	resourceStatusContext ??= createRuntimeContext$1("Litz resource status");
+	resourceStatusContext ??= createRuntimeContext("Litz resource status");
 	return resourceStatusContext;
 }
 function getResourceDataContext() {
-	resourceDataContext ??= createRuntimeContext$1("Litz resource data");
+	resourceDataContext ??= createRuntimeContext("Litz resource data");
 	return resourceDataContext;
 }
 function getResourceActionsContext() {
-	resourceActionsContext ??= createRuntimeContext$1("Litz resource actions");
+	resourceActionsContext ??= createRuntimeContext("Litz resource actions");
 	return resourceActionsContext;
 }
 function requireActiveResourceSlice(resourcePath, value) {
@@ -477,7 +678,7 @@ async function performPreparedResourceRequest(resourcePath, operation, preparedR
 	notify(entry);
 	entry.inFlight = (async () => {
 		try {
-			const response = operation === "action" ? await fetch("/_litz/resource", {
+			const response = operation === "action" ? await fetch("/_litzjs/resource", {
 				method: "POST",
 				...require_internal_transport.createInternalActionRequestInit({
 					path: resourcePath,
@@ -487,7 +688,7 @@ async function performPreparedResourceRequest(resourcePath, operation, preparedR
 						search: normalizedRequest.search
 					}
 				}, payload)
-			}) : await fetch("/_litz/resource", {
+			}) : await fetch("/_litzjs/resource", {
 				method: "POST",
 				headers: {
 					"content-type": "application/json",
@@ -594,19 +795,16 @@ function prepareResourceRequest(resourcePath, request) {
 function createResourceCacheKey(resourcePath, normalizedRequest) {
 	return JSON.stringify({
 		path: resourcePath,
-		params: sortRecord$1(normalizedRequest.params),
-		search: sortRecord$1(normalizedRequest.search)
+		params: sortRecord(normalizedRequest.params),
+		search: sortRecord(normalizedRequest.search)
 	});
 }
-function sortRecord$1(value) {
-	return Object.fromEntries(Object.entries(value).sort(([left], [right]) => left.localeCompare(right)));
-}
 function subscribe(key, listener) {
 	const entry = getEntry(key);
 	entry.listeners.add(listener);
 	return () => {
 		entry.listeners.delete(listener);
-		cleanupResourceEntry(key, entry);
+		deferredCleanupResourceEntry(key, entry);
 	};
 }
 function getInitialSnapshot() {
@@ -638,6 +836,13 @@ function cleanupResourceEntry(key, entry) {
 	if (entry.listeners.size > 0 || entry.inFlight || entry.snapshot.pending) return;
 	resourceStore.delete(key);
 }
+function deferredCleanupResourceEntry(key, entry) {
+	if (entry.listeners.size > 0 || entry.inFlight || entry.snapshot.pending) return;
+	queueMicrotask(() => {
+		if (entry.listeners.size > 0 || entry.inFlight || entry.snapshot.pending) return;
+		if (resourceStore.get(key) === entry) resourceStore.delete(key);
+	});
+}
 function pruneResourceStore() {
 	if (resourceStore.size <= RESOURCE_STORE_LIMIT) return;
 	for (const [key, entry] of resourceStore) {
@@ -758,175 +963,6 @@ function useResolvedRouteState(options) {
 	};
 }
 //#endregion
-//#region src/client/route-runtime.tsx
-let routeLocationContext = null;
-let routeStatusContext = null;
-let routeDataContext = null;
-let routeActionsContext = null;
-const routeFormComponentCache = /* @__PURE__ */ new Map();
-function createRuntimeContext(name) {
-	const createContext = react.createContext;
-	if (!createContext) throw new Error(`${name} is not available in this environment.`);
-	return createContext(null);
-}
-function getRouteLocationContext() {
-	routeLocationContext ??= createRuntimeContext("Litz route location");
-	return routeLocationContext;
-}
-function getRouteStatusContext() {
-	routeStatusContext ??= createRuntimeContext("Litz route status");
-	return routeStatusContext;
-}
-function getRouteDataContext() {
-	routeDataContext ??= createRuntimeContext("Litz route data");
-	return routeDataContext;
-}
-function getRouteActionsContext() {
-	routeActionsContext ??= createRuntimeContext("Litz route actions");
-	return routeActionsContext;
-}
-function requireActiveRouteSlice(routeId, value) {
-	if (!value) throw new Error(`Route "${routeId}" is being used outside the Litz runtime.`);
-	if (value.id !== routeId) throw new Error(`Route "${routeId}" is not the active route. Active route is "${value.id}".`);
-	return value;
-}
-function RouteRuntimeProvider(props) {
-	const RouteLocationContext = getRouteLocationContext();
-	const RouteStatusContext = getRouteStatusContext();
-	const RouteDataContext = getRouteDataContext();
-	const RouteActionsContext = getRouteActionsContext();
-	const locationValue = react.useMemo(() => ({
-		id: props.value.id,
-		params: props.value.params,
-		search: props.value.search,
-		setSearch: props.value.setSearch
-	}), [
-		props.value.id,
-		props.value.params,
-		props.value.search,
-		props.value.setSearch
-	]);
-	const statusValue = react.useMemo(() => ({
-		id: props.value.id,
-		status: props.value.status,
-		pending: props.value.pending
-	}), [
-		props.value.id,
-		props.value.pending,
-		props.value.status
-	]);
-	const dataValue = react.useMemo(() => ({
-		id: props.value.id,
-		loaderResult: props.value.loaderResult,
-		actionResult: props.value.actionResult,
-		data: props.value.data,
-		view: props.value.view
-	}), [
-		props.value.actionResult,
-		props.value.data,
-		props.value.id,
-		props.value.loaderResult,
-		props.value.view
-	]);
-	const actionsValue = react.useMemo(() => ({
-		id: props.value.id,
-		submit: props.value.submit,
-		reload: props.value.reload,
-		retry: props.value.retry
-	}), [
-		props.value.id,
-		props.value.reload,
-		props.value.retry,
-		props.value.submit
-	]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RouteLocationContext.Provider, {
-		value: locationValue,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RouteStatusContext.Provider, {
-			value: statusValue,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RouteDataContext.Provider, {
-				value: dataValue,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RouteActionsContext.Provider, {
-					value: actionsValue,
-					children: props.children
-				})
-			})
-		})
-	});
-}
-function useRequiredRouteLocation(routeId) {
-	return requireActiveRouteSlice(routeId, react.useContext(getRouteLocationContext()));
-}
-function useRequiredRouteStatus(routeId) {
-	return requireActiveRouteSlice(routeId, react.useContext(getRouteStatusContext()));
-}
-function useRequiredRouteData(routeId) {
-	return requireActiveRouteSlice(routeId, react.useContext(getRouteDataContext()));
-}
-function useRequiredRouteActions(routeId) {
-	return requireActiveRouteSlice(routeId, react.useContext(getRouteActionsContext()));
-}
-function createRouteFormComponent(routeId) {
-	const cached = routeFormComponentCache.get(routeId);
-	if (cached) return cached;
-	const MemoizedLitzRouteForm = react.memo(function LitzRouteForm(props) {
-		const actions = useRequiredRouteActions(routeId);
-		const { children, onSubmit, replace, revalidate, ...rest } = props;
-		const submitRef = react.useRef((payload, options) => actions.submit(payload, options));
-		react.useEffect(() => {
-			submitRef.current = (payload, options) => actions.submit(payload, options);
-		}, [actions.submit]);
-		const action = react.useCallback(async (formData) => {
-			await submitRef.current(formData, {
-				replace,
-				revalidate
-			});
-		}, [replace, revalidate]);
-		return react.createElement("form", {
-			...rest,
-			action,
-			onSubmit
-		}, children);
-	});
-	MemoizedLitzRouteForm.displayName = `LitzRouteForm(${routeId})`;
-	routeFormComponentCache.set(routeId, MemoizedLitzRouteForm);
-	return MemoizedLitzRouteForm;
-}
-//#endregion
-//#region src/client/runtime.tsx
-async function fetchRouteLoader(path, request, target) {
-	return parseLoaderResponse(await fetch("/_litz/route", {
-		method: "POST",
-		headers: {
-			"content-type": "application/json",
-			accept: require_internal_transport.LITZ_RESULT_ACCEPT
-		},
-		body: JSON.stringify({
-			path,
-			target,
-			operation: "loader",
-			request: normalizeRequest(request)
-		})
-	}));
-}
-async function fetchRouteAction(path, request, payload) {
-	const actionRequest = require_internal_transport.createInternalActionRequestInit({
-		path,
-		operation: "action",
-		request: normalizeRequest(request)
-	}, payload);
-	return parseActionResponse(await fetch("/_litz/action", {
-		method: "POST",
-		headers: actionRequest.headers,
-		body: actionRequest.body
-	}));
-}
-function normalizeRequest(request) {
-	return {
-		params: request.params ?? {},
-		search: request.search instanceof URLSearchParams ? Object.fromEntries(request.search.entries()) : request.search ?? {}
-	};
-}
-//#endregion
 //#region src/client/index.ts
 require_bindings.installClientBindings({
 	usePathname,
@@ -1087,12 +1123,12 @@ function RouteHost(props) {
 	]);
 	react.useEffect(() => {
 		if (!renderedRoute || !activeRouteState) return;
-		let cancelled = false;
+		const controller = new AbortController();
 		const { loaderMatches, baseRequest } = activeRouteState;
 		const finalLoaderMatchId = loaderMatches[loaderMatches.length - 1]?.id;
 		const reload = async (mode = "loading") => {
 			if (loaderMatches.length === 0) {
-				if (!cancelled) setPageState((current) => ({
+				if (!controller.signal.aborted) setPageState((current) => ({
 					...current,
 					status: "idle",
 					pending: false,
@@ -1102,33 +1138,33 @@ function RouteHost(props) {
 				return;
 			}
 			setPageState((current) => applyCachedLoaderStateToPageState(current, loaderMatches, mode));
-			for (const entry of loaderMatches) try {
-				const loaderResult = await fetchRouteLoader(renderedRoute.path, baseRequest, entry.id);
-				if (cancelled) return;
-				setCachedLoaderResult(entry.cacheKey, withLoaderStaleState(loaderResult, false));
-				setPageState((current) => withMatchLoaderResult(current, entry.id, renderedRoute.id, loaderResult, entry.id === finalLoaderMatchId ? "idle" : current.status, entry.id === finalLoaderMatchId ? false : current.pending));
-			} catch (error) {
-				if (cancelled) return;
-				if (isRedirectSignal(error)) {
-					navigate(error.location, true);
-					return;
-				}
-				if (isRouteLikeError(error)) {
+			processLoaderResults(await fetchRouteLoadersInParallel(loaderMatches, {
+				routePath: renderedRoute.path,
+				baseRequest,
+				signal: controller.signal
+			}), loaderMatches, {
+				isCancelled: () => controller.signal.aborted,
+				onResult(match, loaderResult) {
+					setCachedLoaderResult(match.cacheKey, withLoaderStaleState(loaderResult, false));
+					setPageState((current) => withMatchLoaderResult(current, match.id, renderedRoute.id, loaderResult, match.id === finalLoaderMatchId ? "idle" : current.status, match.id === finalLoaderMatchId ? false : current.pending));
+				},
+				onRedirect(location) {
+					navigate(location, true);
+				},
+				onRouteError(matchId, error) {
 					setPageState((current) => ({
 						...current,
 						status: "error",
 						pending: false,
 						errorInfo: error,
-						errorTargetId: entry.id
+						errorTargetId: matchId
 					}));
-					return;
 				}
-				throw error;
-			}
+			});
 		};
 		reload();
 		return () => {
-			cancelled = true;
+			controller.abort();
 		};
 	}, [
 		activeRouteState,
@@ -1318,27 +1354,30 @@ async function reloadCurrentRoute(options) {
 		params: extractRouteParams(options.route.path, options.pathname) ?? {},
 		search: options.search
 	};
-	for (const entry of loaderMatches) try {
-		const loaderResult = await fetchRouteLoader(options.route.path, baseRequest, entry.id);
-		setCachedLoaderResult(entry.cacheKey, withLoaderStaleState(loaderResult, false));
-		options.setPageState((current) => withMatchLoaderResult(current, entry.id, options.route.id, loaderResult, entry === loaderMatches[loaderMatches.length - 1] ? "idle" : current.status, entry === loaderMatches[loaderMatches.length - 1] ? false : current.pending));
-	} catch (error) {
-		if (isRedirectSignal(error)) {
-			options.navigate(error.location, true);
-			return;
-		}
-		if (isRouteLikeError(error)) {
+	const finalLoaderMatch = loaderMatches[loaderMatches.length - 1];
+	processLoaderResults(await fetchRouteLoadersInParallel(loaderMatches, {
+		routePath: options.route.path,
+		baseRequest,
+		signal: options.signal
+	}), loaderMatches, {
+		isCancelled: () => options.signal?.aborted === true,
+		onResult(match, loaderResult) {
+			setCachedLoaderResult(match.cacheKey, withLoaderStaleState(loaderResult, false));
+			options.setPageState((current) => withMatchLoaderResult(current, match.id, options.route.id, loaderResult, match === finalLoaderMatch ? "idle" : current.status, match === finalLoaderMatch ? false : current.pending));
+		},
+		onRedirect(location) {
+			options.navigate(location, true);
+		},
+		onRouteError(matchId, error) {
 			options.setPageState((current) => ({
 				...current,
 				status: "error",
 				pending: false,
 				errorInfo: error,
-				errorTargetId: entry.id
+				errorTargetId: matchId
 			}));
-			return;
 		}
-		throw error;
-	}
+	});
 }
 function renderMatchChain(route, matches, pageState, location, navigate, reloadImpl, setPageState) {
 	const errorBoundaryIndex = findErrorBoundaryIndex(matches, pageState);
@@ -1558,9 +1597,6 @@ function getPathParamNames(pathPattern) {
 	pathParamNamesCache.set(pathPattern, names);
 	return names;
 }
-function sortRecord(record) {
-	return Object.fromEntries(Object.entries(record).sort(([left], [right]) => left.localeCompare(right)));
-}
 function getCachedLoaderResult(key) {
 	const cached = routeCache.get(key);
 	if (!cached) return;