clear-react-router 1.8.0 → 1.8.1

package/README.md

@@ -38,23 +38,6 @@ It provides first-class support for:
 
 ## API
 
-### `createRouter(routes)`
-
-Normalizes route configuration. Handles wildcard `*` routes, extracts dynamic params, builds nested paths.
-
-| Property | Type | Description |
-|----------|------|-------------|
-| `path` | `string` | Route path, e.g., `/user/:userId` |
-| `element` | `ReactElement \| () => ReactElement \| LazyComponent` | Component to render |
-| `beforeLoad` | `({ params, context, redirect, setContext }) => Promise<unknown> \| undefined \| void` | Auth checks and redirects. Can update context via `setContext`. `redirect` is provided by the router |
-| `loader` | `({ params, context, setContext }) => Promise<unknown>` | Fetch data using route params and context. Can update context via `setContext` |
-| `afterLoad` | `({ params, context, setContext }) => Promise<void>` | Analytics, side effects after data is loaded. Can update context via `setContext` |
-| `fallback` | `ReactElement \| () => ReactElement` | Loading fallback (for lazy loading) |
-| `loaderFallback` | `ReactElement \| () => ReactElement` | Loading fallback for the route's `loader`. Overrides the global `defaultLoaderFallback` set in `Router` |
-| `errorElement` | `ReactElement \| () => ReactElement` | Error fallback for the route. Overrides the global `defaultErrorElement` set in `Router` |
-| `staleTime` | `number` | Time in ms before cached data is considered stale and re-fetched in the background. If not provided, data never expires (cached forever) |
-| `actions` | `({ params, context, invalidate, setContext }) => Record<string, (formData: FormData) => unknown \| Promise<unknown>>` | Defines route actions for data mutations. Actions receive `FormData`, can update context via `setContext`, and can refresh loader data using the router-provided `invalidate`. |
-
 ### `Router`
 
 | Prop | Type | Default | Description |
@@ -64,6 +47,7 @@ Normalizes route configuration. Handles wildcard `*` routes, extracts dynamic pa
 | `animationDuration` | `number` | `optional` | Animation duration in milliseconds (browser default is used if not set) |
 | `defaultLoaderFallback` | `ReactElement \| () => ReactElement` | `optional` | Default loading fallback for every route loader |
 | `defaultErrorElement` | `ReactElement \| () => ReactElement` | `optional` | Default error fallback for every route |
+| `defaultRetry` | `number \| { count: number; delay: number }` | `optional` | Default cache revalidation retry policy for all routes |
 | `beforeLoad` | `({ params, context, redirect, setContext }) => Promise<unknown> \| undefined \| void` | `undefined` | Runs before every navigation. Useful for authentication, analytics, or updating shared context.            |
 | `afterLoad`  | `({ params, context, setContext }) => Promise<void>`  | `undefined` | Runs after every successful navigation. Useful for analytics, page tracking, or other global side effects. |
 | `spinner` | `boolean \| undefined` | `true` | Show a small spinner in the corner while loading data (only when `isAnimated` is enabled) |
@@ -82,9 +66,26 @@ Normalizes route configuration. Handles wildcard `*` routes, extracts dynamic pa
   <Router routes={routes} spinner={false} isAnimated />  {/* disable the spinner */}
 </div>
 ```
-
 > **Note:** When `isAnimated` is enabled, `loaderFallback` is not shown. Instead, a small spinner appears (if `spinner={true}`). On the initial page load, however, the route's loaderFallback is rendered if available.
 
+### `createRouter(routes)`
+
+Normalizes route configuration. Handles wildcard `*` routes, extracts dynamic params, builds nested paths.
+
+| Property | Type | Description |
+|----------|------|-------------|
+| `path` | `string` | Route path, e.g., `/user/:userId` |
+| `element` | `ReactElement \| () => ReactElement \| LazyComponent` | Component to render |
+| `beforeLoad` | `({ params, context, redirect, setContext }) => Promise<unknown> \| undefined \| void` | Auth checks and redirects. Can update context via `setContext`. `redirect` is provided by the router |
+| `loader` | `({ params, context, setContext }) => Promise<unknown>` | Fetch data using route params and context. Can update context via `setContext` |
+| `afterLoad` | `({ params, context, setContext }) => Promise<void>` | Analytics, side effects after data is loaded. Can update context via `setContext` |
+| `fallback` | `ReactElement \| () => ReactElement` | Loading fallback (for lazy loading) |
+| `loaderFallback` | `ReactElement \| () => ReactElement` | Loading fallback for the route's `loader`. Overrides the global `defaultLoaderFallback` set in `Router` |
+| `retry` | `number \| { count: number; delay: number }` | `optional` | Overrides the global cache revalidation retry policy for this route |
+| `errorElement` | `ReactElement \| () => ReactElement` | Error fallback for the route. Overrides the global `defaultErrorElement` set in `Router` |
+| `staleTime` | `number` | Time in ms before cached data is considered stale and re-fetched in the background. If not provided, data never expires (cached forever) |
+| `actions` | `({ params, context, invalidate, setContext }) => Record<string, (formData: FormData) => unknown \| Promise<unknown>>` | Defines route actions for data mutations. Actions receive `FormData`, can update context via `setContext`, and can refresh loader data using the router-provided `invalidate`. |
+
 ### `Link`
 
 Component for client-side navigation with prefetch support.
@@ -125,6 +126,68 @@ import { Router, Link } from 'clear-react-router';
 ```
 **Important**: prefetch="render" should be used sparingly, as it preloads data immediately when the link is rendered, which may cause unnecessary network requests.
 
+## Retry
+
+Sometimes a request may fail because of a temporary network issue or a short-lived server problem. Instead of immediately rendering the error state, you can configure the router to automatically retry loading route data.
+
+### Route-level retry
+
+```tsx
+{
+  path: '/posts',
+  loader: loadPosts,
+  retry: 3,
+}
+```
+
+`retry: 3` means the router will make up to **3 additional attempts** after the initial failed request (up to **4 attempts** in total).
+
+You can also specify a delay between attempts:
+
+```tsx
+{
+  path: '/posts',
+  loader: loadPosts,
+  retry: {
+    count: 3,
+    delay: 500,
+  },
+}
+```
+
+### Global retry
+
+To apply the same retry policy to all routes, use `defaultRetry`:
+
+```tsx
+<Router routes={routes} defaultRetry={2} />
+```
+
+or with a delay:
+
+```tsx
+<Router routes={routes} defaultRetry={{ count: 2, delay: 500 }} />
+```
+
+A route-level `retry` always overrides `defaultRetry`.
+
+### How it works
+
+Unlike many routing libraries, retry is **not limited to the initial loader execution**.
+
+The retry policy is applied to the router's **cache revalidation mechanism**, so it automatically works for every operation that reloads route data, including:
+
+* Initial route loading
+* Cache revalidation
+* `invalidate()`
+* `prefetch()`
+
+This ensures consistent behavior regardless of how the data is being refreshed.
+
+### Why?
+
+The router treats the route loader as the single source of truth for route data. Since every data refresh goes through the same cache revalidation pipeline, retry is configured once and automatically applies everywhere without any additional code.
+
 ### `redirect`
 
 Function provided to `beforeLoad` for programmatic redirection.

package/dist/components/Router.d.ts

@@ -1,2 +1,2 @@
 import { RouterProps } from '../types';
-export declare const Router: ({ routes, beforeLoad, afterLoad, animationDuration, isAnimated, spinner, preserveScroll, showFallbackOnAnimation, prefetch, hoverPrefetchDelay, errorBoundary: ErrorBoundary, context: initialContext, defaultLoaderFallback, defaultErrorElement, }: RouterProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const Router: ({ routes, beforeLoad, afterLoad, animationDuration, isAnimated, spinner, preserveScroll, showFallbackOnAnimation, prefetch, hoverPrefetchDelay, errorBoundary: ErrorBoundary, context: initialContext, defaultLoaderFallback, defaultErrorElement, defaultRetry, }: RouterProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/config/routerConfig.d.ts

@@ -7,6 +7,7 @@ declare class RouterConfig {
     hoverPrefetchDelay: number;
     beforeLoad?: ClientRouteItem['beforeLoad'];
     afterLoad?: ClientRouteItem['afterLoad'];
+    defaultRetry?: RouterProps['defaultRetry'];
     configure(config: Partial<RouterConfig>): void;
 }
 export declare const routerConfig: RouterConfig;

package/dist/hooks/useAction.d.ts

@@ -1,6 +1 @@
-type Options = Partial<{
-    onSuccess: (args: unknown) => void;
-    onError: (args: unknown) => void;
-}> | undefined;
-export declare const useAction: (action: string, options?: Options) => (formData: FormData) => Promise<void>;
-export {};
+export declare const useAction: (action: string, options?: import("../types").Options) => (arg: FormData) => Promise<void>;

package/dist/hooks/useNavigate.d.ts

@@ -1,2 +1 @@
-import type { Location } from '../types';
-export declare const useNavigate: () => (arg: Location | string | -1) => Promise<void>;
+export declare const useNavigate: () => (arg: import("..").Location | string | -1) => Promise<void>;

package/dist/index.js

@@ -95,6 +95,7 @@ var RouterConfig = class {
 		_defineProperty(this, "hoverPrefetchDelay", 150);
 		_defineProperty(this, "beforeLoad", void 0);
 		_defineProperty(this, "afterLoad", void 0);
+		_defineProperty(this, "defaultRetry", void 0);
 	}
 	configure(config) {
 		Object.assign(this, config);
@@ -227,9 +228,9 @@ var findRoute = (pathname, includeAll) => {
 //#endregion
 //#region runtime/navigate.ts
 var navigationSeq = 0;
-var createNavigate = (routerSta, revalidateCache) => {
-	const { loaderStateRef, scrollMapState, prevPathnameRef, loaderFallbackState, isLoadingState, contextState, timestampMap } = routerSta;
-	const commitNavigation = createCommitNavigation(createCommitState(routerSta), prevPathnameRef);
+var createNavigate = (routerState, revalidateCache) => {
+	const { loaderStateRef, scrollMapState, prevPathnameRef, loaderFallbackState, isLoadingState, contextState, timestampMap } = routerState;
+	const commitNavigation = createCommitNavigation(createCommitState(routerState), prevPathnameRef);
 	const isCacheItemFresh = createIsCacheItemFresh(timestampMap);
 	const getContext = () => ({
 		context: contextState.getState(),
@@ -367,12 +368,11 @@ var createInvalidate = ({ routeItemDataState, loaderStateRef, timestampMap, curr
 			await Promise.all(childPathList.map((el) => invalidateItem(`${pathname}${el}`, true)));
 		}
 	};
-	async function invalidate(pathList, options) {
+	return async (pathList, options) => {
 		const routePathname = routeItemDataState.getState().location.pathname;
 		const pathnameList = Array.isArray(pathList) ? pathList : pathList ? [pathList] : [routePathname];
 		await Promise.all(pathnameList.map((pathname) => invalidateItem(pathname, options?.withChildren)));
-	}
-	return invalidate;
+	};
 };
 //#endregion
 //#region runtime/prefetch.ts
@@ -387,51 +387,80 @@ var createPrefetch = (revalidateCache) => async (pathname) => {
 //#region utils/revalidateCache.ts
 var loaderMapRef = {};
 var loadingPromises = /* @__PURE__ */ new Map();
-var createRevalidateCache = (routerState) => ({ routeItem, pathname }) => {
-	if (!routeItem?.loader) return;
-	const isCacheItemFresh = createIsCacheItemFresh(routerState.timestampMap);
-	const { loaderStateRef, timestampMap, contextState } = routerState;
-	if (loadingPromises.has(pathname)) return loadingPromises.get(pathname);
-	if (isCacheItemFresh({
-		routeItem,
-		pathname
-	})) {
-		loaderStateRef.set(loaderMapRef[pathname]);
-		return;
-	}
-	const promise = (async () => {
+var isObjectRetry = (arg) => typeof arg === "object";
+var createRetry = (arg) => {
+	if (arg === void 0) return null;
+	return {
+		count: isObjectRetry(arg) ? arg.count : arg,
+		delay: isObjectRetry(arg) ? arg.delay : 0
+	};
+};
+var getRetry = (routeItem) => {
+	const routeRetry = createRetry(routeItem?.retry);
+	const globalRetry = createRetry(routerConfig.defaultRetry);
+	if (!routeRetry && !globalRetry) return null;
+	return {
+		count: routeRetry ? routeRetry.count : globalRetry?.count || 0,
+		delay: routeRetry ? routeRetry.delay : globalRetry?.delay || 0
+	};
+};
+var sleep = async (ms) => new Promise((resolve) => setTimeout(resolve, ms));
+var createRevalidateCache = (routerState) => {
+	const revalidateCache = async ({ routeItem, pathname }, retried = 0) => {
 		if (!routeItem?.loader) return;
-		try {
-			const context = contextState.getState();
-			const setContext = contextState.setState;
-			const params = getParamsObject({
-				params: routeItem.params,
-				pathname
-			});
-			const result = await routeItem?.loader({
-				params,
-				context,
-				setContext
-			});
-			timestampMap.set(pathname, Date.now());
-			loaderStateRef.set((prev) => ({
-				...prev,
-				data: result,
-				loaderError: null
-			}));
-			loaderMapRef[pathname] = loaderStateRef.value;
-		} catch (error) {
-			loaderStateRef.set((prev) => ({
-				...prev,
-				data: null,
-				loaderError: error
-			}));
-		} finally {
-			loadingPromises.delete(pathname);
+		const isCacheItemFresh = createIsCacheItemFresh(routerState.timestampMap);
+		const { loaderStateRef, timestampMap, contextState } = routerState;
+		if (loadingPromises.has(pathname)) return loadingPromises.get(pathname);
+		if (isCacheItemFresh({
+			routeItem,
+			pathname
+		})) {
+			loaderStateRef.set(loaderMapRef[pathname]);
+			return;
 		}
-	})();
-	loadingPromises.set(pathname, promise);
-	return promise;
+		const promise = (async () => {
+			if (!routeItem?.loader) return;
+			try {
+				const context = contextState.getState();
+				const setContext = contextState.setState;
+				const params = getParamsObject({
+					params: routeItem.params,
+					pathname
+				});
+				const result = await routeItem?.loader({
+					params,
+					context,
+					setContext
+				});
+				timestampMap.set(pathname, Date.now());
+				loaderStateRef.set((prev) => ({
+					...prev,
+					data: result,
+					loaderError: null
+				}));
+				loaderMapRef[pathname] = loaderStateRef.value;
+			} catch (error) {
+				const retry = getRetry(routeItem);
+				if (retry && retry.count > retried) {
+					loadingPromises.delete(pathname);
+					if (retry.delay) await sleep(retry.delay);
+					await revalidateCache({
+						routeItem,
+						pathname
+					}, retried + 1);
+				} else loaderStateRef.set((prev) => ({
+					...prev,
+					data: null,
+					loaderError: error
+				}));
+			} finally {
+				loadingPromises.delete(pathname);
+			}
+		})();
+		loadingPromises.set(pathname, promise);
+		return promise;
+	};
+	return revalidateCache;
 };
 //#endregion
 //#region cell.ts
@@ -471,6 +500,31 @@ var createRouterInstance = () => {
 		timestampMap: /* @__PURE__ */ new Map()
 	};
 	const revalidateCache = createRevalidateCache(routerState);
+	const navigate = createNavigate(routerState, revalidateCache);
+	const invalidate = createInvalidate(routerState, revalidateCache);
+	const prefetch = createPrefetch(revalidateCache);
+	const useGetAction = (actionKey) => {
+		const { routeItem, location } = routerState.routeItemDataState.getState();
+		const context = routerState.contextState.getState();
+		const setContext = routerState.contextState.setState;
+		const params = getParamsObject({
+			params: routeItem?.params,
+			pathname: location.pathname
+		});
+		if (!routeItem) throw new Error("Route not found");
+		if (!routeItem.actions) throw new Error("Route action creator not found");
+		const action = routeItem.actions({
+			context,
+			setContext,
+			params,
+			invalidate
+		})[actionKey];
+		if (!action) throw new Error(`Action "${actionKey}" not found`);
+		return {
+			currentAction: action,
+			invalidate
+		};
+	};
 	return {
 		state: {
 			isLoadingState: routerState.isLoadingState,
@@ -483,9 +537,9 @@ var createRouterInstance = () => {
 			prevPathnameRef: routerState.prevPathnameRef
 		},
 		runtime: {
-			navigate: createNavigate(routerState, revalidateCache),
-			invalidate: createInvalidate(routerState, revalidateCache),
-			prefetch: createPrefetch(revalidateCache)
+			navigate,
+			invalidate,
+			prefetch
 		},
 		hooks: {
 			useIsLoading: () => useGlobalState(routerState.isLoadingState),
@@ -494,7 +548,55 @@ var createRouterInstance = () => {
 			useRouteItemData: () => useGlobalState(routerState.routeItemDataState),
 			useCurrentLoaderState: () => useGlobalState(routerState.currentLoaderState),
 			useScrollMap: () => useGlobalState(routerState.scrollMapState),
-			useContextState: () => useGlobalState(routerState.contextState)
+			useContextState: () => useGlobalState(routerState.contextState),
+			useParams: () => {
+				const routeItemData = routerState.routeItemDataState.getState();
+				return getParamsObject({
+					params: routeItemData.routeItem?.params,
+					pathname: routeItemData.location.pathname
+				});
+			},
+			useNavigate: () => {
+				const { blockedRouteState } = routerState;
+				const { location } = routerState.routeItemDataState.getState();
+				return async (arg) => {
+					if (arg !== -1 && blockedRouteState.getState().from) {
+						const to = typeof arg === "object" ? arg.pathname : arg;
+						blockedRouteState.setState((prevState) => ({
+							...prevState,
+							to
+						}));
+						return;
+					}
+					if (arg === -1) return history.go(arg);
+					if (typeof arg === "string") {
+						if (arg !== location.pathname) await navigate({ pathname: arg });
+					} else if (JSON.stringify(arg) !== JSON.stringify(location)) await navigate(arg);
+				};
+			},
+			useRestoreScroll: () => {
+				const { pathname } = routerState.routeItemDataState.getState().location;
+				const scrollMap = routerState.scrollMapState.getState();
+				return () => {
+					if (scrollMap[pathname]) requestAnimationFrame(() => window.scrollTo({
+						top: scrollMap[pathname],
+						behavior: "smooth"
+					}));
+				};
+			},
+			useGetAction,
+			useAction: (action, options = {}) => {
+				const { currentAction, invalidate } = useGetAction(action);
+				return async (formData) => {
+					try {
+						const result = await currentAction(formData);
+						await invalidate();
+						options.onSuccess?.(result);
+					} catch (error) {
+						options.onError?.(error);
+					}
+				};
+			}
 		}
 	};
 };
@@ -567,21 +669,16 @@ var useApplyCustomAnimation = (animationDuration) => {
 	}, [animationDuration]);
 };
 //#endregion
+//#region hooks/useLocation.ts
+var useLocation = () => {
+	const [routeItemData] = router.hooks.useRouteItemData();
+	return routeItemData.location;
+};
+//#endregion
 //#region hooks/usePreserveScroll.ts
 var usePreserveScroll = (preserveScroll) => {
-	const { useRouteItemData, useScrollMap } = router.hooks;
-	const [routeItemData] = useRouteItemData();
-	const [scrollMap] = useScrollMap();
-	const { pathname } = routeItemData.location;
-	const restoreScroll = useCallback(() => {
-		if (!pathname || !scrollMap[pathname]) return;
-		requestAnimationFrame(() => {
-			window.scrollTo({
-				top: scrollMap[pathname],
-				behavior: "smooth"
-			});
-		});
-	}, [pathname, scrollMap]);
+	const restoreScroll = router.hooks.useRestoreScroll();
+	const { pathname } = useLocation();
 	useEffect(() => {
 		if (preserveScroll) restoreScroll();
 	}, [
@@ -615,7 +712,7 @@ var renderElement = (Component) => {
 //#endregion
 //#region components/Router.tsx
 var EmptyBoundary = ({ children }) => children;
-var Router = ({ routes, beforeLoad, afterLoad, animationDuration, isAnimated = false, spinner = true, preserveScroll = true, showFallbackOnAnimation = false, prefetch = "hover", hoverPrefetchDelay = 150, errorBoundary: ErrorBoundary = EmptyBoundary, context: initialContext, defaultLoaderFallback, defaultErrorElement }) => {
+var Router = ({ routes, beforeLoad, afterLoad, animationDuration, isAnimated = false, spinner = true, preserveScroll = true, showFallbackOnAnimation = false, prefetch = "hover", hoverPrefetchDelay = 150, errorBoundary: ErrorBoundary = EmptyBoundary, context: initialContext, defaultLoaderFallback, defaultErrorElement, defaultRetry }) => {
 	const { useIsLoading, useLoaderFallback, useRouteItemData, useCurrentLoaderState } = router.hooks;
 	const [isLoading] = useIsLoading();
 	const [currentLoaderFallback] = useLoaderFallback();
@@ -629,7 +726,8 @@ var Router = ({ routes, beforeLoad, afterLoad, animationDuration, isAnimated = f
 		hoverPrefetchDelay,
 		showFallbackOnAnimation,
 		beforeLoad,
-		afterLoad
+		afterLoad,
+		defaultRetry
 	});
 	useApplyCustomAnimation(animationDuration);
 	useSetInitialContext(initialContext);
@@ -648,45 +746,8 @@ var Router = ({ routes, beforeLoad, afterLoad, animationDuration, isAnimated = f
 	});
 };
 //#endregion
-//#region hooks/useLocation.ts
-var useLocation = () => {
-	const [routeItemData] = router.hooks.useRouteItemData();
-	return routeItemData.location;
-};
-//#endregion
-//#region hooks/useLatest.ts
-var useLatest = (value) => {
-	const ref = useRef(value);
-	useEffect(() => {
-		ref.current = value;
-	}, [value]);
-	return ref;
-};
-//#endregion
 //#region hooks/useNavigate.ts
-var useNavigate = () => {
-	const [blockedRoute, setBlockedRoute] = router.hooks.useBlockedRoute();
-	const locationRef = useLatest(useLocation());
-	const blockedRouteRef = useLatest(blockedRoute);
-	return useCallback(async (arg) => {
-		if (arg !== -1 && blockedRouteRef.current.from) {
-			const to = typeof arg === "object" ? arg.pathname : arg;
-			setBlockedRoute((prevState) => ({
-				...prevState,
-				to
-			}));
-			return;
-		}
-		if (arg === -1) return history.go(arg);
-		if (typeof arg === "string") {
-			if (arg !== locationRef.current.pathname) await router.runtime.navigate({ pathname: arg });
-		} else if (JSON.stringify(arg) !== JSON.stringify(locationRef.current)) await router.runtime.navigate(arg);
-	}, [
-		blockedRouteRef,
-		locationRef,
-		setBlockedRoute
-	]);
-};
+var useNavigate = router.hooks.useNavigate;
 //#endregion
 //#region components/Link.tsx
 var Link = ({ children, to, prefetch: prefetchLink, hoverPrefetchDelay }) => {
@@ -749,46 +810,9 @@ var FormProvider = ({ children, isSubmitting }) => /* @__PURE__ */ (0, import_js
 	children
 });
 //#endregion
-//#region hooks/useInvalidate.ts
-var useInvalidate = () => router.runtime.invalidate;
-//#endregion
-//#region hooks/useParams.ts
-var useParams = () => {
-	const [routeItemData] = router.hooks.useRouteItemData();
-	const { routeItem, location: { pathname } } = routeItemData;
-	return useMemo(() => routeItem ? getParamsObject({
-		params: routeItem?.params,
-		pathname
-	}) : void 0, [pathname, routeItem]);
-};
-//#endregion
-//#region hooks/useGetAction.ts
-var useGetAction = (actionKey) => {
-	const { useRouteItemData, useContextState } = router.hooks;
-	const invalidate = useInvalidate();
-	const [routeItemData] = useRouteItemData();
-	const [context, setContext] = useContextState();
-	const params = useParams();
-	const { routeItem } = routeItemData;
-	const latestContext = useLatest(context);
-	if (!routeItem) throw new Error("Route not found");
-	if (!routeItem.actions) throw new Error("Route action creator not found");
-	const action = routeItem.actions({
-		context: latestContext.current,
-		setContext,
-		params,
-		invalidate
-	})[actionKey];
-	if (!action) throw new Error(`Action "${actionKey}" not found`);
-	return {
-		currentAction: action,
-		invalidate
-	};
-};
-//#endregion
 //#region components/Form.tsx
 var Form = ({ children, action, onSuccess, onError, autoReset = true }) => {
-	const { currentAction, invalidate } = useGetAction(action);
+	const { currentAction, invalidate } = router.hooks.useGetAction(action);
 	const [isSubmitting, setIsSubmitting] = useState(false);
 	const onSubmit = async (evt) => {
 		evt.preventDefault();
@@ -813,12 +837,18 @@ var Form = ({ children, action, onSuccess, onError, autoReset = true }) => {
 	});
 };
 //#endregion
+//#region hooks/useParams.ts
+var useParams = router.hooks.useParams;
+//#endregion
 //#region hooks/useLoaderState.ts
 var useLoaderState = () => {
 	const [loaderState] = router.hooks.useCurrentLoaderState();
 	return loaderState;
 };
 //#endregion
+//#region hooks/useInvalidate.ts
+var useInvalidate = () => router.runtime.invalidate;
+//#endregion
 //#region hooks/useBlocker.ts
 var useBlocker = (blockerFn) => {
 	const { hooks: { useBlockedRoute, useRouteItemData }, runtime: { navigate } } = router;
@@ -864,25 +894,7 @@ var useBlocker = (blockerFn) => {
 };
 //#endregion
 //#region hooks/useAction.ts
-var useAction = (action, options = {}) => {
-	const { currentAction, invalidate } = useGetAction(action);
-	const latestOnSuccess = useLatest(options?.onSuccess);
-	const latestOnError = useLatest(options?.onError);
-	return useCallback(async (formData) => {
-		try {
-			const result = await currentAction(formData);
-			await invalidate();
-			latestOnSuccess.current?.(result);
-		} catch (error) {
-			latestOnError.current?.(error);
-		}
-	}, [
-		currentAction,
-		invalidate,
-		latestOnError,
-		latestOnSuccess
-	]);
-};
+var useAction = router.hooks.useAction;
 //#endregion
 //#region hooks/useRouterContext.ts
 var useRouterContext = () => {
@@ -922,6 +934,15 @@ var useSearch = () => {
 	return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
 };
 //#endregion
+//#region hooks/useLatest.ts
+var useLatest = (value) => {
+	const ref = useRef(value);
+	useEffect(() => {
+		ref.current = value;
+	}, [value]);
+	return ref;
+};
+//#endregion
 //#region hooks/useSearchParams.ts
 var useSearchParams = () => {
 	const search = useSearch();

package/dist/runtime/invalidate.d.ts

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

package/dist/runtime/navigate.d.ts

@@ -1,2 +1,2 @@
 import { Location, RevalidateCache, RouterState } from '../types';
-export declare const createNavigate: (routerSta: RouterState, revalidateCache: RevalidateCache) => (nextLocation: Location) => Promise<void>;
+export declare const createNavigate: (routerState: RouterState, revalidateCache: RevalidateCache) => (nextLocation: Location) => Promise<void>;

package/dist/types.d.ts

@@ -24,6 +24,7 @@ export type ClientRouteItem = {
     fallback?: RenderElement;
     children?: ClientRouteItem[];
     staleTime?: number;
+    retry?: Retry;
     beforeLoad?: BeforeLoad;
     afterLoad?: (arg: {
         context: Record<string, unknown>;
@@ -68,12 +69,18 @@ export type RouteItemData = {
     location: Location;
     routeItem: RouteItem | undefined;
 };
+type ObjectRetry = {
+    count: number;
+    delay: number;
+};
+export type Retry = number | ObjectRetry | undefined;
 export type RouterProps = {
     routes: RouteItem[];
     isAnimated?: boolean;
     animationDuration?: number;
     spinner?: boolean;
     preserveScroll?: boolean;
+    defaultRetry?: Retry;
     defaultLoaderFallback?: RenderElement;
     defaultErrorElement?: RenderElement;
     showFallbackOnAnimation?: boolean;
@@ -116,12 +123,25 @@ export type RouterType = {
         }>>;
         useLoaderFallback: () => ReturnType<typeof useGlobalState<RenderElement | undefined>>;
         useRouteItemData: () => ReturnType<typeof useGlobalState<RouteItemData>>;
-        useCurrentLoaderState: () => ReturnType<typeof useGlobalState<LoaderState<unknown>>>;
+        useCurrentLoaderState: () => ReturnType<typeof useGlobalState<LoaderState>>;
         useScrollMap: () => ReturnType<typeof useGlobalState<Record<string, number>>>;
         useContextState: () => ReturnType<typeof useGlobalState<Record<string, unknown>>>;
+        useParams: <T>() => T;
+        useNavigate: () => (arg: Location | string | -1) => Promise<void>;
+        useGetAction: (actionKey: string) => {
+            currentAction: (arg: FormData) => Promise<unknown> | Promise<void> | void | unknown;
+            invalidate: (pathList?: string | string[], options?: InvalidateOptions) => Promise<void>;
+        };
+        useRestoreScroll: () => () => void;
+        useAction: (action: string, options?: Options) => (arg: FormData) => Promise<void>;
     };
 };
 export type InvalidateOptions = {
     withChildren?: boolean;
 };
 export type RevalidateCache = ({ routeItem, pathname }: RevalidateCacheArgs) => Promise<unknown> | undefined;
+export type Options = Partial<{
+    onSuccess: (args: unknown) => void;
+    onError: (args: unknown) => void;
+}> | undefined;
+export {};

package/dist/utils/revalidateCache.d.ts

@@ -1,2 +1,2 @@
 import { RevalidateCacheArgs, RouterState } from '../types';
-export declare const createRevalidateCache: (routerState: RouterState) => ({ routeItem, pathname }: RevalidateCacheArgs) => any;
+export declare const createRevalidateCache: (routerState: RouterState) => ({ routeItem, pathname }: RevalidateCacheArgs, retried?: number) => Promise<any>;

package/package.json

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

package/dist/hooks/useGetAction.d.ts

@@ -1,4 +0,0 @@
-export declare const useGetAction: (actionKey: string) => {
-    currentAction: (arg: FormData) => Promise<unknown> | Promise<void> | void | unknown;
-    invalidate: (pathList?: string | string[], options?: import("../types").InvalidateOptions) => Promise<void>;
-};