clear-react-router 2.0.6 → 2.0.7

package/dist/hooks/useLoaderState.d.ts

@@ -1,2 +1 @@
-import { LoaderState } from '../types';
-export declare const useLoaderState: <T>() => LoaderState<T>;
+export declare const useLoaderState: <T>() => import("../types").LoaderState<T>;

package/dist/index.js

@@ -226,7 +226,7 @@ var createNavigate = (routerState, revalidateCache) => {
 	let navigationSeq = 0;
 	let interval = 0;
 	let abortController = null;
-	const { loaderStateRef, scrollMapState, pendingState, contextState, loaderMap, routeItemDataState, isOptimisticLoading } = routerState;
+	const { loaderState, scrollMapState, pendingState, contextState, loaderMap, routeItemDataState, isOptimisticLoading } = routerState;
 	const navigationExecutor = createCommitState(routerState);
 	const isCacheItemFresh = createIsCacheItemFresh(loaderMap);
 	const createSignal = () => {
@@ -240,7 +240,7 @@ var createNavigate = (routerState, revalidateCache) => {
 		setContext: contextState.setState
 	});
 	const routeResolve = (location) => {
-		loaderStateRef.set(emptyLoaderState);
+		loaderState.setState(emptyLoaderState);
 		const nextItem = findRoute(location.pathname, true);
 		return {
 			nextItem,
@@ -257,12 +257,12 @@ var createNavigate = (routerState, revalidateCache) => {
 					redirect,
 					params
 				});
-				loaderStateRef.set((prev) => ({
+				loaderState.setState((prev) => ({
 					...prev,
 					beforeLoadError: null
 				}));
 			} catch (error) {
-				loaderStateRef.set((prev) => ({
+				loaderState.setState((prev) => ({
 					...prev,
 					beforeLoadError: error
 				}));
@@ -289,7 +289,7 @@ var createNavigate = (routerState, revalidateCache) => {
 			});
 			isOptimisticLoading.setState(true);
 			const currentLoaderState = loaderMap.get(path)?.state;
-			if (currentLoaderState) loaderStateRef.set(currentLoaderState);
+			if (currentLoaderState) loaderState.setState(currentLoaderState);
 		} else if (routeItem?.loader && !isCacheItemFresh(path)) commitNavigation(() => pendingState.setState({
 			routeItem,
 			location
@@ -314,12 +314,16 @@ var createNavigate = (routerState, revalidateCache) => {
 		if (!routeItem?.loader) return;
 		window.clearInterval(interval);
 		const signal = createSignal();
-		await Promise.all([revalidateCache({
+		const [result] = await Promise.all([revalidateCache({
 			routeItem,
 			pathname: nextLocation.pathname,
 			search: nextLocation.search,
 			signal
 		}), getLoaderDurationPromise(routeItem, nextLocation)]);
+		if (result) loaderState.setState((prev) => ({
+			...prev,
+			...result
+		}));
 		if (seq !== navigationSeq) return;
 		polling(routeItem, nextLocation);
 	};
@@ -351,7 +355,7 @@ var createNavigate = (routerState, revalidateCache) => {
 //#endregion
 //#region runtime/invalidate.ts
 var redirect = Promise.resolve;
-var createInvalidate = ({ routeItemDataState, loaderStateRef, loaderMap, currentLoaderState, contextState }, revalidateCache) => {
+var createInvalidate = ({ routeItemDataState, loaderState, loaderMap, contextState }, revalidateCache) => {
 	const invalidatePath = async (routeItem, pathname, options) => {
 		const routePathname = routeItemDataState.getState().location.pathname;
 		loaderMap.delete(pathname);
@@ -367,12 +371,12 @@ var createInvalidate = ({ routeItemDataState, loaderStateRef, loaderMap, current
 					setContext
 				});
 			}
-			loaderStateRef.set((prev) => ({
+			loaderState.setState((prev) => ({
 				...prev,
 				beforeLoadError: null
 			}));
 		} catch (error) {
-			loaderStateRef.set((prev) => ({
+			loaderState.setState((prev) => ({
 				...prev,
 				beforeLoadError: error
 			}));
@@ -381,7 +385,11 @@ var createInvalidate = ({ routeItemDataState, loaderStateRef, loaderMap, current
 			routeItem,
 			pathname
 		});
-		if (pathname === routePathname) currentLoaderState.setState(loaderStateRef.value);
+		if (result && pathname === routePathname) loaderState.setState({
+			data: result.data,
+			loaderError: result.error,
+			beforeLoadError: null
+		});
 		return {
 			path: pathname,
 			...result
@@ -436,7 +444,7 @@ var getRetry = (routeItem) => {
 	};
 };
 var createRevalidateCache = (routerState) => {
-	const { loaderStateRef, contextState, loaderMap, loadingPromises } = routerState;
+	const { contextState, loaderMap, loadingPromises } = routerState;
 	const evict = () => {
 		if (loaderMap.size <= routerConfig.maxCacheSize) return;
 		const oldestKey = loaderMap.keys().next().value;
@@ -460,8 +468,14 @@ var createRevalidateCache = (routerState) => {
 		}
 		if (isCacheItemFresh(path)) {
 			const item = moveItemToLastPosition(path);
-			if (item?.state) loaderStateRef.set(item.state);
-			return;
+			if (!item?.state) return void 0;
+			return item.state.loaderError ? {
+				data: null,
+				error: item.state.loaderError
+			} : {
+				data: item.state.data,
+				error: null
+			};
 		}
 		const promise = (async () => {
 			if (!routeItem?.loader) return;
@@ -478,13 +492,12 @@ var createRevalidateCache = (routerState) => {
 					searchParams,
 					signal: effectiveSignal
 				});
-				loaderStateRef.set((prev) => ({
-					...prev,
-					data: result,
-					loaderError: null
-				}));
 				loaderMap.set(path, {
-					state: loaderStateRef.value,
+					state: {
+						data: result,
+						beforeLoadError: null,
+						loaderError: null
+					},
 					timestamp: Date.now(),
 					staleTime: routeItem.staleTime
 				});
@@ -502,27 +515,16 @@ var createRevalidateCache = (routerState) => {
 				if (retry && retry.count > retried) {
 					loadingPromises.delete(path);
 					if (retry.delay) await sleep(retry.delay);
-					await revalidateCache({
+					return revalidateCache({
 						routeItem,
 						pathname,
 						search,
 						signal
 					}, retried + 1);
-					return {
-						data: null,
-						error
-					};
-				} else {
-					loaderStateRef.set((prev) => ({
-						...prev,
-						data: null,
-						loaderError: error
-					}));
-					return {
-						data: null,
-						error
-					};
-				}
+				} else return {
+					data: null,
+					error
+				};
 			} finally {
 				loadingPromises.delete(path);
 			}
@@ -533,20 +535,6 @@ var createRevalidateCache = (routerState) => {
 	return revalidateCache;
 };
 //#endregion
-//#region cell.ts
-var Cell = class {
-	constructor(_value) {
-		_defineProperty(this, "_value", void 0);
-		this._value = _value;
-	}
-	get value() {
-		return this._value;
-	}
-	set(action) {
-		this._value = typeof action === "function" ? action(this._value) : action;
-	}
-};
-//#endregion
 //#region utils/createRouterInstance.ts
 var createRouterInstance = () => {
 	const routerState = {
@@ -555,7 +543,6 @@ var createRouterInstance = () => {
 			location: {}
 		}),
 		pendingState: create(void 0),
-		currentLoaderState: create(emptyLoaderState),
 		scrollMapState: create({}),
 		contextState: create({}),
 		blockedRouteState: create({
@@ -563,7 +550,7 @@ var createRouterInstance = () => {
 			to: ""
 		}),
 		isOptimisticLoading: create(false),
-		loaderStateRef: new Cell(emptyLoaderState),
+		loaderState: create(emptyLoaderState),
 		loaderMap: /* @__PURE__ */ new Map(),
 		loadingPromises: /* @__PURE__ */ new Map()
 	};
@@ -604,6 +591,7 @@ var createRouterInstance = () => {
 			usePendingState: () => useGlobalState(routerState.pendingState),
 			useContextState: () => useGlobalState(routerState.contextState),
 			useOptimisticLoading: () => useGlobalState(routerState.isOptimisticLoading),
+			useLoaderState: () => useGlobalState(routerState.loaderState)[0],
 			useParams: () => getParamsObject(),
 			useNavigate: () => {
 				const { blockedRouteState } = routerState;
@@ -679,6 +667,9 @@ var useNavigation = () => {
 	}, [navigate]);
 };
 //#endregion
+//#region hooks/useLoaderState.ts
+var useLoaderState = router.hooks.useLoaderState;
+//#endregion
 //#region hooks/useApplyCustomAnimation.ts
 var useApplyCustomAnimation = (animationDuration) => {
 	useEffect(() => {
@@ -761,7 +752,7 @@ var Router = ({ routes, defaultBeforeLoad, defaultAfterLoad, animationDuration,
 	const [routeItemData] = useRouteItemData();
 	const [pendingRouteData] = usePendingState();
 	const [isOptimisticLoading] = useOptimisticLoading();
-	const loaderState = router.state.loaderStateRef.value;
+	const loaderState = useLoaderState();
 	const isLoading = Boolean(pendingRouteData);
 	useNavigation();
 	useSetRouterConfig({
@@ -929,9 +920,6 @@ var Form = ({ children, action, onSuccess, onError, autoReset = true }) => {
 //#region hooks/useParams.ts
 var useParams = router.hooks.useParams;
 //#endregion
-//#region hooks/useLoaderState.ts
-var useLoaderState = () => router.state.loaderStateRef.value;
-//#endregion
 //#region hooks/useInvalidate.ts
 var useInvalidate = () => router.runtime.invalidate;
 //#endregion

package/dist/runtime/invalidate.d.ts

@@ -1,2 +1,2 @@
 import { type InvalidateOptions, InvalidateResult, RevalidateCache, RouterState } from '../types';
-export declare const createInvalidate: ({ routeItemDataState, loaderStateRef, loaderMap, currentLoaderState, contextState }: RouterState, revalidateCache: RevalidateCache) => (pathList?: string | string[], options?: InvalidateOptions) => Promise<InvalidateResult[]>;
+export declare const createInvalidate: ({ routeItemDataState, loaderState, loaderMap, contextState }: RouterState, revalidateCache: RevalidateCache) => (pathList?: string | string[], options?: InvalidateOptions) => Promise<InvalidateResult[]>;

package/dist/types.d.ts

@@ -1,6 +1,5 @@
 import { ComponentType, type CSSProperties, Dispatch, MouseEvent, ReactElement, ReactNode, Ref, SetStateAction } from 'react';
 import { Store, useGlobalState } from './create';
-import { Cell } from './cell';
 export declare const LAZY_MARKER: unique symbol;
 export type LazyComponent = {
     readonly [LAZY_MARKER]: true;
@@ -118,7 +117,6 @@ export type LoadingPromise = Promise<{
 export type RouterState = {
     routeItemDataState: Store<RouteItemData>;
     pendingState: Store<RouteItemData | undefined>;
-    currentLoaderState: Store<LoaderState>;
     scrollMapState: Store<Record<string, number>>;
     contextState: Store<Record<string, unknown>>;
     blockedRouteState: Store<{
@@ -126,7 +124,7 @@ export type RouterState = {
         to: string;
     }>;
     isOptimisticLoading: Store<boolean>;
-    loaderStateRef: Cell<LoaderState>;
+    loaderState: Store<LoaderState>;
     loaderMap: Map<string, LoaderStateItem>;
     loadingPromises: Map<string, LoadingPromise>;
 };
@@ -147,6 +145,7 @@ export type RouterType = {
         usePendingState: () => ReturnType<typeof useGlobalState<RouteItemData | undefined>>;
         useContextState: () => ReturnType<typeof useGlobalState<Record<string, unknown>>>;
         useOptimisticLoading: () => ReturnType<typeof useGlobalState<boolean>>;
+        useLoaderState: <T>() => LoaderState<T>;
         useParams: <T>() => T;
         useNavigate: () => (arg: Location | string | -1) => Promise<void>;
         useGetAction: (actionKey: string) => {

package/dist/utils/revalidateCache.d.ts

@@ -1,8 +1,2 @@
-import { RevalidateCacheArgs, RouterState } from '../types';
-export declare const createRevalidateCache: (routerState: RouterState) => ({ routeItem, pathname, search, signal }: RevalidateCacheArgs, retried?: number) => Promise<{
-    data: unknown;
-    error: null;
-} | {
-    data: null;
-    error: unknown;
-} | undefined>;
+import { LoadingPromise, RevalidateCacheArgs, RouterState } from '../types';
+export declare const createRevalidateCache: (routerState: RouterState) => ({ routeItem, pathname, search, signal }: RevalidateCacheArgs, retried?: number) => LoadingPromise;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "clear-react-router",
-  "version": "2.0.6",
+  "version": "2.0.7",
   "description": "A lightweight, type-safe routing library for React applications",
   "author": "Andrew Bubnov",
   "scripts": {

package/dist/cell.d.ts

@@ -1,6 +0,0 @@
-export declare class Cell<T> {
-    private _value;
-    constructor(_value: T);
-    get value(): T;
-    set(action: T | ((prev: T) => T)): void;
-}