clear-react-router 1.9.0 → 1.9.1

package/README.md

@@ -645,122 +645,6 @@ useEffect(() => {
 }, [state, process, reset]);
 ```
 
-### `useQueryParam()`
-
-A flexible hook for working with typed query parameters. You provide an adapter object with `parse` and `serialize` functions, and it returns the parsed value and a setter.
-
-```tsx
-import { useQueryParam, adapter } from 'clear-react-router';
-
-const ProductPage = () => {
-  // String parameter
-  const [brand, setBrand] = useQueryParam('brand', adapter.string, 'nike');
-
-  // Number parameter
-  const [page, setPage] = useQueryParam('page', adapter.integer, 1);
-
-  // Date parameter
-  const [date, setDate] = useQueryParam('date', adapter.date, new Date());
-
-  // Array of numbers
-  const [prices, setPrices] = useQueryParam('prices', adapter.floatArray);
-
-  return (
-    <div>
-      <p>Brand: {brand}</p>
-      <p>Page: {page}</p>
-      <button onClick={() => setPage(page + 1)}>Next</button>
-    </div>
-  );
-}
-```
-type Adapter<T> = {
-	parse: (params: string[]) => T;
-	serialize?: (params: T) => string | string[];
-}
-
-**Signature:** `useQueryParam<T>(field: string, adapter: Adapter<T>, defaultValue?: T): [T, (arg: T | null) => void]`
-
-| Argument | Type | Description |
-|----------|------|-------------|
-| `field` | `string` | The query parameter key (e.g., `'page'`, `'brand'`) |
-| `adapter` | `Adapter<T>` | Parser and optional serializer for params (serializer String is used in case of serializer not passed) |
-| `defaultValue` | `T` (optional) | Default value returned when the parameter is missing or empty |
-
-**Returns:**
-
-| Element | Type | Description |
-|---------|------|-------------|
-| `value` | `T` | The parsed value from the query parameter |
-| `setValue` | `(arg: T \| null) => void` | Function to update the query parameter. Null is passed to remove the parameter. |
-
-### Built-in Adapters
-
-| Adapter | Input | Output | Description |
-|---------|-------|--------|-------------|
-| `adapter.string` | `string[]` | `string` | First value or empty string |
-| `adapter.stringArray` | `string[]` | `string[]` | All values as array |
-| `adapter.integer` | `string[]` | `number` | First value parsed as integer (default: `0`) |
-| `adapter.integerArray` | `string[]` | `number[]` | All values parsed as integers |
-| `adapter.float` | `string[]` | `number` | First value parsed as float (default: `0`) |
-| `adapter.floatArray` | `string[]` | `number[]` | All values parsed as floats |
-| `adapter.boolean` | `string[]` | `boolean` | First value parsed as boolean (`'true'` → `true`) |
-| `adapter.booleanArray` | `string[]` | `boolean[]` | All values parsed as booleans |
-| `adapter.date` | `string[]` | `Date` | First value parsed as Date from timestamp |
-| `adapter.dateArray` | `string[]` | `Date[]` | All values parsed as Dates from timestamps |
-| `adapter.zodSchema` | `string[]` | `T` | Validates JSON string against Zod schema |
-
-### Using Zod Schemas
-`useQueryParam` works seamlessly with Zod for complex validation:
-
-```tsx
-import { z } from 'zod';
-import { useQueryParam, adapter } from 'clear-react-router';
-
-const filterSchema = z.object({
-  name: z.string(),
-  age: z.number().min(0),
-  active: z.boolean().optional(),
-});
-
-function ProductFilter() {
-  const [filter, setFilter] = useQueryParam(
-    'filter',
-    adapter.zodSchema(filterSchema),
-    { name: '', age: 0 }
-  );
-
-  return (
-    <div>
-      <p>Name: {filter.name}</p>
-      <p>Age: {filter.age}</p>
-      <button onClick={() => setFilter({ ...filter, age: filter.age + 1 })}>
-        Increment Age
-      </button>
-    </div>
-  );
-}
-```
-
-### Custom Adapters
-You can write your own adapter for any format:
-
-```tsx
-// Custom adapter for comma-separated values
-const csvAdapter = {
-  parse: (params: string[]): string[] => {
-    const value = params[0] || '';
-    return value ? value.split(',').map(v => v.trim()) : [];
-  },
-  serialize: (value: string[]): string[] => value
-}
-
-const TagsFilter() {
-  const [tags, setTags] = useQueryParam('tags', csvAdapter, []);
-  // tags: string[]
-}
-```
-
 ### `useRouterContext()`
 
 Returns the router context object and a function to update it. Useful for accessing or modifying global state (like user authentication, theme, etc.) from anywhere in your app.

package/dist/cell.d.ts

@@ -4,6 +4,3 @@ export declare class Cell<T> {
     get value(): T;
     set(action: T | ((prev: T) => T)): void;
 }
-export declare const loaderStateRef: Cell<import("./types").LoaderState>;
-export declare const prevPathnameRef: Cell<string>;
-export declare const timestampMap: Map<string, number>;

package/dist/config/routerConfig.d.ts

@@ -3,7 +3,6 @@ declare class RouterConfig {
     routes: RouterProps['routes'];
     prefetch: RouterProps['prefetch'];
     isAnimated: RouterProps['isAnimated'];
-    showFallbackOnAnimation: RouterProps['showFallbackOnAnimation'];
     hoverPrefetchDelay: number;
     beforeLoad?: ClientRouteItem['beforeLoad'];
     afterLoad?: ClientRouteItem['afterLoad'];

package/dist/index.d.ts

@@ -9,9 +9,7 @@ export { useInvalidate } from './hooks/useInvalidate';
 export { useBlocker } from './hooks/useBlocker';
 export { useAction } from './hooks/useAction';
 export { useRouterContext } from './hooks/useRouterContext';
-export { useQueryParam } from './hooks/useQueryParam';
 export { useSearchParams } from './hooks/useSearchParams';
 export { useFormContext } from './hooks/useFormContext';
-export { adapter } from './utils/adapter';
 export { createRouter } from './utils/utils';
-export type { RouteItem, BlockerState, Location, Adapter, RouterProps } from './types';
+export type { RouteItem, BlockerState, Location, RouterProps } from './types';

package/dist/index.js

@@ -30,15 +30,12 @@ var useGlobalState = ({ subscribe, getState, setState }) => {
 };
 //#endregion
 //#region utils/commitState.ts
-var createCommitState = ({ isLoadingState, routeItemDataState, loaderFallbackState, currentLoaderState, prevPathnameRef, loaderStateRef }) => (nextLocation, routeItem) => {
+var createCommitState = ({ routeItemDataState, pendingState }) => (nextLocation, routeItem) => {
 	routeItemDataState.setState({
 		routeItem,
 		location: nextLocation
 	});
-	currentLoaderState.setState(loaderStateRef.value);
-	isLoadingState.setState(false);
-	loaderFallbackState.setState(void 0);
-	prevPathnameRef.set(nextLocation.pathname);
+	pendingState.setState(void 0);
 	const fullPath = nextLocation.search ? `${nextLocation.pathname}${nextLocation.search}` : nextLocation.pathname;
 	if (fullPath === window.location.pathname + window.location.search) return;
 	history.pushState(null, "", fullPath);
@@ -91,7 +88,6 @@ var RouterConfig = class {
 		_defineProperty(this, "routes", []);
 		_defineProperty(this, "prefetch", "hover");
 		_defineProperty(this, "isAnimated", false);
-		_defineProperty(this, "showFallbackOnAnimation", false);
 		_defineProperty(this, "hoverPrefetchDelay", 150);
 		_defineProperty(this, "beforeLoad", void 0);
 		_defineProperty(this, "afterLoad", void 0);
@@ -106,12 +102,9 @@ var RouterConfig = class {
 var routerConfig = new RouterConfig();
 //#endregion
 //#region utils/commitNavigation.ts
-var createCommitNavigation = (navigationExecutor, prevPathnameRef) => (nextLocation, routeItem) => {
-	const { isAnimated } = routerConfig;
-	if (!isAnimated || !prevPathnameRef.value) {
-		navigationExecutor(nextLocation, routeItem);
-		return;
-	}
+var createCommitNavigation = (navigationExecutor, routeItemDataState) => (nextLocation, routeItem) => {
+	const isFirstLoad = !routeItemDataState.getState().location.pathname;
+	if (!routerConfig.isAnimated || isFirstLoad) return navigationExecutor(nextLocation, routeItem);
 	try {
 		document.startViewTransition(() => navigationExecutor(nextLocation, routeItem));
 	} catch {
@@ -223,8 +216,8 @@ var findRoute = (pathname, includeAll) => {
 var navigationSeq = 0;
 var interval = 0;
 var createNavigate = (routerState, revalidateCache) => {
-	const { loaderStateRef, scrollMapState, prevPathnameRef, loaderFallbackState, isLoadingState, contextState, timestampMap, pendingPathRef, routeItemDataState } = routerState;
-	const commitNavigation = createCommitNavigation(createCommitState(routerState), prevPathnameRef);
+	const { loaderStateRef, scrollMapState, pendingState, contextState, timestampMap, routeItemDataState } = routerState;
+	const commitNavigation = createCommitNavigation(createCommitState(routerState), routeItemDataState);
 	const isCacheItemFresh = createIsCacheItemFresh(timestampMap);
 	const getContext = () => ({
 		context: contextState.getState(),
@@ -263,27 +256,25 @@ var createNavigate = (routerState, revalidateCache) => {
 		if (routeItem?.beforeLoad) await runBeforeLoad(routeItem?.beforeLoad);
 	};
 	const prepareNavigation = (routeItem, location) => {
-		const { isAnimated, showFallbackOnAnimation: showFallback } = routerConfig;
 		scrollMapState.setState((prevState) => {
 			const scrollPosition = document.scrollingElement?.scrollTop ?? 0;
-			if (!scrollPosition || prevState[prevPathnameRef.value] === scrollPosition) return prevState;
+			const prevPathname = routeItemDataState.getState().location.pathname;
+			if (!scrollPosition || prevState[prevPathname] === scrollPosition) return prevState;
 			return {
 				...prevState,
-				[prevPathnameRef.value]: scrollPosition
+				[prevPathname]: scrollPosition
 			};
 		});
-		loaderFallbackState.setState(isCacheItemFresh({
+		const pendingShouldExist = routeItem?.loader && !isCacheItemFresh({
 			routeItem,
 			pathname: location.pathname
-		}) || isAnimated && !showFallback ? void 0 : routeItem?.loaderFallback);
-	};
-	const beforeEachLoad = (location) => {
-		window.clearInterval(interval);
-		if (routeItemDataState.getState().location.pathname !== location.pathname) isLoadingState.setState(true);
-		pendingPathRef.set(location.pathname);
+		});
+		pendingState.setState(pendingShouldExist ? {
+			routeItem,
+			location
+		} : void 0);
 	};
 	const afterEachLoad = (routeItem) => {
-		pendingPathRef.set("");
 		if (!routeItem?.pollingInterval) return;
 		interval = window.setInterval(() => revalidateCache({
 			routeItem,
@@ -292,7 +283,7 @@ var createNavigate = (routerState, revalidateCache) => {
 	};
 	const loader = async (routeItem, location) => {
 		if (!routeItem?.loader) return;
-		beforeEachLoad(location);
+		window.clearInterval(interval);
 		await revalidateCache({
 			routeItem,
 			pathname: location.pathname,
@@ -498,18 +489,15 @@ var Cell = class {
 		this._value = typeof action === "function" ? action(this._value) : action;
 	}
 };
-new Cell(emptyLoaderState);
-new Cell("");
 //#endregion
 //#region utils/createRouterInstance.ts
 var createRouterInstance = () => {
 	const routerState = {
-		isLoadingState: create(false),
-		loaderFallbackState: create(void 0),
 		routeItemDataState: create({
 			routeItem: void 0,
 			location: {}
 		}),
+		pendingState: create(void 0),
 		currentLoaderState: create(emptyLoaderState),
 		scrollMapState: create({}),
 		contextState: create({}),
@@ -518,8 +506,6 @@ var createRouterInstance = () => {
 			to: ""
 		}),
 		loaderStateRef: new Cell(emptyLoaderState),
-		prevPathnameRef: new Cell(""),
-		pendingPathRef: new Cell(""),
 		timestampMap: /* @__PURE__ */ new Map()
 	};
 	const revalidateCache = createRevalidateCache(routerState);
@@ -546,29 +532,17 @@ var createRouterInstance = () => {
 		};
 	};
 	return {
-		state: {
-			isLoadingState: routerState.isLoadingState,
-			loaderFallbackState: routerState.loaderFallbackState,
-			routeItemDataState: routerState.routeItemDataState,
-			currentLoaderState: routerState.currentLoaderState,
-			scrollMapState: routerState.scrollMapState,
-			contextState: routerState.contextState,
-			blockedRouteState: routerState.blockedRouteState,
-			prevPathnameRef: routerState.prevPathnameRef,
-			pendingPathRef: routerState.pendingPathRef
-		},
+		state: routerState,
 		runtime: {
 			navigate,
 			invalidate,
 			prefetch
 		},
 		hooks: {
-			useIsLoading: () => useGlobalState(routerState.isLoadingState),
 			useBlockedRoute: () => useGlobalState(routerState.blockedRouteState),
-			useLoaderFallback: () => useGlobalState(routerState.loaderFallbackState),
 			useRouteItemData: () => useGlobalState(routerState.routeItemDataState),
-			useCurrentLoaderState: () => useGlobalState(routerState.currentLoaderState),
 			useScrollMap: () => useGlobalState(routerState.scrollMapState),
+			usePendingState: () => useGlobalState(routerState.pendingState),
 			useContextState: () => useGlobalState(routerState.contextState),
 			useParams: () => getParamsObject(),
 			useNavigate: () => {
@@ -621,16 +595,16 @@ var router = createRouterInstance();
 //#endregion
 //#region hooks/useNavigation.ts
 var useNavigation = () => {
-	const { state: { prevPathnameRef, blockedRouteState }, runtime: { navigate } } = router;
+	const { state: { routeItemDataState, blockedRouteState }, runtime: { navigate } } = router;
 	useEffect(() => {
 		const handler = async (event) => {
 			const newLocation = parseWindowLocation(event.target.location);
-			if (prevPathnameRef.value === blockedRouteState.getState().from) {
+			if (routeItemDataState.getState().location.pathname === blockedRouteState.getState().from) {
 				blockedRouteState.setState({
-					from: prevPathnameRef.value,
+					from: routeItemDataState.getState().location.pathname,
 					to: newLocation.pathname
 				});
-				history.pushState(null, "", prevPathnameRef.value);
+				history.pushState(null, "", routeItemDataState.getState().location.pathname);
 			} else navigate(newLocation);
 		};
 		window.addEventListener("popstate", handler);
@@ -638,13 +612,11 @@ var useNavigation = () => {
 	}, [
 		blockedRouteState,
 		navigate,
-		prevPathnameRef.value
+		routeItemDataState
 	]);
 	useEffect(() => {
-		const currentLocation = parseWindowLocation(window.location);
-		navigate(currentLocation);
-		prevPathnameRef.set(currentLocation.pathname);
-	}, [navigate, prevPathnameRef]);
+		navigate(parseWindowLocation(window.location));
+	}, [navigate]);
 };
 //#endregion
 //#region hooks/useApplyCustomAnimation.ts
@@ -722,18 +694,17 @@ var renderElement = (Component) => {
 //#region components/Router.tsx
 var EmptyBoundary = ({ children }) => children;
 var Router = ({ routes, beforeLoad, afterLoad, animationDuration, isAnimated = false, spinner = true, defaultPreserveScroll = true, showFallbackOnAnimation = false, prefetch = "hover", hoverPrefetchDelay = 150, errorBoundary: ErrorBoundary = EmptyBoundary, context: initialContext, defaultLoaderFallback, defaultErrorElement, defaultRetry, defaultStaleTime }) => {
-	const { useIsLoading, useLoaderFallback, useRouteItemData, useCurrentLoaderState } = router.hooks;
-	const [isLoading] = useIsLoading();
-	const [currentLoaderFallback] = useLoaderFallback();
+	const { useRouteItemData, usePendingState } = router.hooks;
 	const [routeItemData] = useRouteItemData();
-	const [loaderState] = useCurrentLoaderState();
+	const [pendingState] = usePendingState();
+	const loaderState = router.state.loaderStateRef.value;
+	const isLoading = Boolean(pendingState);
 	useNavigation();
 	useSetRouterConfig({
 		routes,
 		isAnimated,
 		prefetch,
 		hoverPrefetchDelay,
-		showFallbackOnAnimation,
 		beforeLoad,
 		afterLoad,
 		defaultRetry,
@@ -747,7 +718,7 @@ var Router = ({ routes, beforeLoad, afterLoad, animationDuration, isAnimated = f
 	const showErrorElement = !isLoading && Boolean(loaderState.loaderError || loaderState.beforeLoadError);
 	const showSpinner = spinner && isAnimated && isLoading;
 	const loadingContent = !showErrorElement && isLoading;
-	if ((showFallbackOnAnimation || !isAnimated) && loadingContent) return renderElement(currentLoaderFallback || defaultLoaderFallback);
+	if ((showFallbackOnAnimation || !isAnimated) && loadingContent) return renderElement(pendingState?.routeItem?.loaderFallback || defaultLoaderFallback);
 	if (!showFallbackOnAnimation && isAnimated && loadingContent) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Spinner, {});
 	if (!routeItem) return null;
 	if (showErrorElement) return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [renderElement(routeItem.errorElement || defaultErrorElement), showSpinner && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Spinner, {})] });
@@ -759,9 +730,9 @@ var Router = ({ routes, beforeLoad, afterLoad, animationDuration, isAnimated = f
 //#endregion
 //#region hooks/useIsRoutePending.ts
 var useIsRoutePending = (routePath) => {
-	const { hooks: { useIsLoading }, state: { pendingPathRef } } = router;
-	const [isPending] = useIsLoading();
-	return isPending && pendingPathRef.value === routePath;
+	const { usePendingState } = router.hooks;
+	const [pendingState] = usePendingState();
+	return pendingState?.location.pathname === routePath;
 };
 //#endregion
 //#region hooks/useNavigate.ts
@@ -888,10 +859,7 @@ var Form = ({ children, action, onSuccess, onError, autoReset = true }) => {
 var useParams = router.hooks.useParams;
 //#endregion
 //#region hooks/useLoaderState.ts
-var useLoaderState = () => {
-	const [loaderState] = router.hooks.useCurrentLoaderState();
-	return loaderState;
-};
+var useLoaderState = () => router.state.loaderStateRef.value;
 //#endregion
 //#region hooks/useInvalidate.ts
 var useInvalidate = () => router.runtime.invalidate;
@@ -981,19 +949,9 @@ 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();
-	const searchRef = useLatest(search);
 	const searchString = search ? search.replace("?", "") : window.location.pathname.split("?")?.[1] ?? "";
 	const searchParams = useMemo(() => new URLSearchParams(searchString), [searchString]);
 	const getSearchParams = useCallback((param) => {
@@ -1010,105 +968,18 @@ var useSearchParams = () => {
 		searchParams,
 		getSearchParams,
 		setSearchParams: useCallback((param, value) => {
-			const currentParams = new URLSearchParams(searchRef.current);
+			const currentParams = new URLSearchParams(search);
 			if (typeof param === "string" && value !== void 0) {
 				currentParams.delete(param);
 				(Array.isArray(value) ? value : [value]).forEach((v) => currentParams.append(param, v));
 				navigateWithSearchParams(currentParams);
 			} else if (typeof param === "function") navigateWithSearchParams(param(currentParams));
 			else throw new Error("useSearchParams first argument must be either function or string");
-		}, [navigateWithSearchParams, searchRef])
+		}, [navigateWithSearchParams, search])
 	};
 };
 //#endregion
-//#region hooks/useQueryParam.ts
-function useQueryParam(field, adapter, defaultValue) {
-	const { searchParams, setSearchParams } = useSearchParams();
-	return [useMemo(() => {
-		const params = searchParams.getAll(field);
-		const result = adapter.parse(params);
-		const isValid = !(result instanceof Date) || result instanceof Date && !isNaN(result.getTime());
-		if (result !== void 0 && result !== null && result !== "" && isValid) return result;
-		if (defaultValue !== void 0) return defaultValue;
-		return result;
-	}, [
-		field,
-		adapter,
-		searchParams,
-		defaultValue
-	]), useCallback((value) => {
-		if (!value) return setSearchParams(field, []);
-		setSearchParams(field, (adapter.serialize || String)(value));
-	}, [
-		field,
-		adapter.serialize,
-		setSearchParams
-	])];
-}
-//#endregion
 //#region hooks/useFormContext.ts
 var useFormContext = () => useContext(FormContext);
 //#endregion
-//#region utils/adapter.ts
-var adapter = {
-	string: { parse: (params) => params[0] || "" },
-	stringArray: {
-		parse: (params) => params,
-		serialize: (value) => value
-	},
-	integer: { parse: (params) => {
-		const result = parseInt(params[0] || "");
-		return isNaN(result) ? 0 : result;
-	} },
-	integerArray: {
-		parse: (params) => params.map((el) => {
-			const result = parseInt(el);
-			return isNaN(result) ? 0 : result;
-		}),
-		serialize: (value) => value.map(String)
-	},
-	float: { parse: (params) => {
-		const result = parseFloat(params[0] || "");
-		return isNaN(result) ? 0 : result;
-	} },
-	floatArray: {
-		parse: (params) => params.map((el) => {
-			const result = parseFloat(el);
-			return isNaN(result) ? 0 : result;
-		}),
-		serialize: (value) => value.map(String)
-	},
-	boolean: {
-		parse: (params) => params[0]?.toLowerCase() === "true",
-		serialize: String
-	},
-	booleanArray: {
-		parse: (params) => params.map((el) => el.toLowerCase() === "true"),
-		serialize: (value) => value.map(String)
-	},
-	date: {
-		parse: (params) => new Date(Number(params[0])),
-		serialize: (arg) => String(arg.getTime())
-	},
-	dateArray: {
-		parse: (params) => params.map((param) => new Date(Number(param))),
-		serialize: (args) => args.map((arg) => String(arg.getTime()))
-	},
-	zodSchema: (schema) => ({
-		parse: (params) => {
-			let parsed;
-			try {
-				parsed = params[0] ? JSON.parse(params[0]) : void 0;
-			} catch {
-				throw new Error("Invalid JSON");
-			}
-			if (parsed === void 0) return void 0;
-			const result = schema.safeParse(parsed);
-			if (!result.success) throw new Error("Invalid schema");
-			return result.data;
-		},
-		serialize: JSON.stringify
-	})
-};
-//#endregion
-export { Form, Link, Router, adapter, createRouter, useAction, useBlocker, useFormContext, useInvalidate, useLoaderState, useLocation, useNavigate, useParams, useQueryParam, useRouterContext, useSearchParams };
+export { Form, Link, Router, createRouter, useAction, useBlocker, useFormContext, useInvalidate, useLoaderState, useLocation, useNavigate, useParams, useRouterContext, useSearchParams };

package/dist/types.d.ts

@@ -65,10 +65,6 @@ export type LoaderState<T = unknown> = {
     loaderError: Error | null;
     beforeLoadError: Error | null;
 };
-export type Adapter<T> = {
-    parse: (params: string[]) => T;
-    serialize?: (params: T) => string | string[];
-};
 export type RouteItemData = {
     location: Location;
     routeItem: RouteItem | undefined;
@@ -99,9 +95,8 @@ export type RouterProps = {
     context?: Record<string, unknown>;
 };
 export type RouterState = {
-    isLoadingState: Store<boolean>;
-    loaderFallbackState: Store<RouteItem['loaderFallback']>;
     routeItemDataState: Store<RouteItemData>;
+    pendingState: Store<RouteItemData | undefined>;
     currentLoaderState: Store<LoaderState>;
     scrollMapState: Store<Record<string, number>>;
     contextState: Store<Record<string, unknown>>;
@@ -110,27 +105,23 @@ export type RouterState = {
         to: string;
     }>;
     loaderStateRef: Cell<LoaderState>;
-    prevPathnameRef: Cell<string>;
-    pendingPathRef: Cell<string>;
     timestampMap: Map<string, number>;
 };
 export type RouterType = {
-    state: Omit<RouterState, 'loaderStateRef' | 'timestampMap'>;
+    state: Omit<RouterState, 'timestampMap'>;
     runtime: {
         navigate(arg: Location): Promise<void>;
         invalidate(pathList?: string | string[], options?: InvalidateOptions): Promise<InvalidateResult[]>;
         prefetch(pathname: string): Promise<void>;
     };
     hooks: {
-        useIsLoading: () => ReturnType<typeof useGlobalState<boolean>>;
         useBlockedRoute: () => ReturnType<typeof useGlobalState<{
             from: string;
             to: string;
         }>>;
-        useLoaderFallback: () => ReturnType<typeof useGlobalState<RenderElement | undefined>>;
         useRouteItemData: () => ReturnType<typeof useGlobalState<RouteItemData>>;
-        useCurrentLoaderState: () => ReturnType<typeof useGlobalState<LoaderState>>;
         useScrollMap: () => ReturnType<typeof useGlobalState<Record<string, number>>>;
+        usePendingState: () => ReturnType<typeof useGlobalState<RouteItemData | undefined>>;
         useContextState: () => ReturnType<typeof useGlobalState<Record<string, unknown>>>;
         useParams: <T>() => T;
         useNavigate: () => (arg: Location | string | -1) => Promise<void>;

package/dist/utils/commitNavigation.d.ts

@@ -1,3 +1,3 @@
-import { Cell } from '../cell';
-import { Location, RouteItem } from '../types';
-export declare const createCommitNavigation: (navigationExecutor: (arg: Location, routeItem: RouteItem | undefined) => void, prevPathnameRef: Cell<string>) => (nextLocation: Location, routeItem: RouteItem | undefined) => void;
+import { Store } from '../create';
+import { Location, RouteItem, RouteItemData } from '../types';
+export declare const createCommitNavigation: (navigationExecutor: (arg: Location, routeItem: RouteItem | undefined) => void, routeItemDataState: Store<RouteItemData>) => (nextLocation: Location, routeItem: RouteItem | undefined) => void;

package/dist/utils/commitState.d.ts

@@ -1,2 +1,2 @@
 import { Location, RouteItem, RouterState } from '../types';
-export declare const createCommitState: ({ isLoadingState, routeItemDataState, loaderFallbackState, currentLoaderState, prevPathnameRef, loaderStateRef, }: RouterState) => (nextLocation: Location, routeItem: RouteItem | undefined) => void;
+export declare const createCommitState: ({ routeItemDataState, pendingState }: RouterState) => (nextLocation: Location, routeItem: RouteItem | undefined) => void;

package/package.json

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

package/dist/hooks/useLatest.d.ts

@@ -1 +0,0 @@
-export declare const useLatest: <T>(value: T) => import("react").RefObject<T>;

package/dist/hooks/useQueryParam.d.ts

@@ -1,2 +0,0 @@
-import { Adapter } from '../types';
-export declare function useQueryParam<T>(field: string, adapter: Adapter<T>, defaultValue?: T): [T, (arg: T | null) => void];

package/dist/utils/adapter.d.ts

@@ -1,51 +0,0 @@
-import { Adapter } from '../types';
-type ZodInterface<T> = {
-    safeParse(input: unknown): {
-        success: true;
-        data: T;
-    } | {
-        success: false;
-        error: unknown;
-    };
-};
-export declare const adapter: {
-    string: {
-        parse: (params: string[]) => string;
-    };
-    stringArray: {
-        parse: (params: string[]) => string[];
-        serialize: (value: string[]) => string[];
-    };
-    integer: {
-        parse: (params: string[]) => number;
-    };
-    integerArray: {
-        parse: (params: string[]) => number[];
-        serialize: (value: number[]) => string[];
-    };
-    float: {
-        parse: (params: string[]) => number;
-    };
-    floatArray: {
-        parse: (params: string[]) => number[];
-        serialize: (value: number[]) => string[];
-    };
-    boolean: {
-        parse: (params: string[]) => boolean;
-        serialize: StringConstructor;
-    };
-    booleanArray: {
-        parse: (params: string[]) => boolean[];
-        serialize: (value: boolean[]) => string[];
-    };
-    date: {
-        parse: (params: string[]) => Date;
-        serialize: (arg: Date) => string;
-    };
-    dateArray: {
-        parse: (params: string[]) => Date[];
-        serialize: (args: Date[]) => string[];
-    };
-    zodSchema: <T>(schema: ZodInterface<T>) => Adapter<T>;
-};
-export {};