clear-react-router 1.8.3 → 1.8.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/index.js +26 -61
- package/dist/types.d.ts +1 -4
- package/dist/utils/findRoute.d.ts +1 -1
- package/dist/utils/utils.d.ts +2 -5
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -70,7 +70,7 @@ It provides first-class support for:
|
|
|
70
70
|
|
|
71
71
|
### `createRouter(routes)`
|
|
72
72
|
|
|
73
|
-
Normalizes route configuration
|
|
73
|
+
Normalizes route configuration, extracts dynamic params, builds nested paths.
|
|
74
74
|
|
|
75
75
|
| Property | Type | Description |
|
|
76
76
|
|----------|------|-------------|
|
package/dist/index.js
CHANGED
|
@@ -174,55 +174,38 @@ var createLazyComponent = (importFn, fallback) => {
|
|
|
174
174
|
//#endregion
|
|
175
175
|
//#region utils/utils.ts
|
|
176
176
|
var isLazy = (el) => typeof el.element === "function" && el.element.toString().includes("import(");
|
|
177
|
-
var parseClientRouteItem = (el,
|
|
178
|
-
const
|
|
179
|
-
const staticSegments = [];
|
|
180
|
-
const currentParams = [...parentParams];
|
|
181
|
-
let lastStaticSegment = "";
|
|
182
|
-
for (const segment of segments) if (segment.startsWith(":")) {
|
|
183
|
-
if (!lastStaticSegment) throw new Error(`Route "${el.path}" cannot start with a parameter.`);
|
|
184
|
-
currentParams.push({
|
|
185
|
-
key: lastStaticSegment,
|
|
186
|
-
value: segment.slice(1)
|
|
187
|
-
});
|
|
188
|
-
} else {
|
|
189
|
-
lastStaticSegment = segment;
|
|
190
|
-
staticSegments.push(segment);
|
|
191
|
-
}
|
|
192
|
-
const path = `${parentPath}/${staticSegments.join("/")}`.replace(/\/+/g, "/");
|
|
177
|
+
var parseClientRouteItem = (el, parentPattern = "") => {
|
|
178
|
+
const pattern = `${parentPattern}/${el.path}`.replace(/\/+/g, "/");
|
|
193
179
|
const resolvedElement = isLazy(el) ? createLazyComponent(el.element, el.fallback) : el.element;
|
|
194
180
|
return [{
|
|
195
181
|
...el,
|
|
196
|
-
|
|
197
|
-
params: currentParams,
|
|
182
|
+
pattern,
|
|
198
183
|
element: resolvedElement
|
|
199
|
-
}, ...el.children?.flatMap((child) => parseClientRouteItem(child,
|
|
184
|
+
}, ...el.children?.flatMap((child) => parseClientRouteItem(child, pattern)) ?? []];
|
|
200
185
|
};
|
|
201
|
-
var createRouter = (clientList) => clientList.flatMap((el) => parseClientRouteItem(el
|
|
202
|
-
var getParamsObject = (
|
|
203
|
-
|
|
204
|
-
const
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
}
|
|
186
|
+
var createRouter = (clientList) => clientList.flatMap((el) => parseClientRouteItem(el));
|
|
187
|
+
var getParamsObject = (nextItem, nextPathname) => {
|
|
188
|
+
const { routeItem: stateItem, location: { pathname: statePathname } } = router.state.routeItemDataState.getState();
|
|
189
|
+
const routeItem = nextItem || stateItem;
|
|
190
|
+
const pathname = nextPathname || statePathname;
|
|
191
|
+
if (!routeItem) return {};
|
|
192
|
+
const pathnameSegments = pathname.split("/");
|
|
193
|
+
return routeItem.pattern.split("/").reduce((acc, segment, index) => {
|
|
194
|
+
if (segment.startsWith(":")) acc[segment.slice(1)] = pathnameSegments[index];
|
|
195
|
+
return acc;
|
|
196
|
+
}, {});
|
|
212
197
|
};
|
|
213
198
|
var parseWindowLocation = (location) => ({
|
|
214
199
|
pathname: location.pathname,
|
|
215
200
|
search: location.search
|
|
216
201
|
});
|
|
217
|
-
var comparePaths = (
|
|
218
|
-
|
|
219
|
-
const
|
|
220
|
-
|
|
221
|
-
const splitPathname = pathname.split("/").filter(Boolean);
|
|
222
|
-
return splitElementPath.every((item, index) => item === splitPathname[2 * index]) && splitPathname.length === splitElementPath.length + paramsLength;
|
|
202
|
+
var comparePaths = (route, pathname) => {
|
|
203
|
+
const pattern = route.pattern.split("/").filter(Boolean);
|
|
204
|
+
const current = pathname.split("/").filter(Boolean);
|
|
205
|
+
return pattern.length === current.length ? pattern.every((segment, index) => segment.startsWith(":") || segment === current[index]) : false;
|
|
223
206
|
};
|
|
224
207
|
var findRoute = (pathname, includeAll) => {
|
|
225
|
-
if (includeAll) return routerConfig.routes.find((el) => el.path === "
|
|
208
|
+
if (includeAll) return routerConfig.routes.find((el) => el.path === "*" || comparePaths(el, pathname));
|
|
226
209
|
return routerConfig.routes.find((el) => comparePaths(el, pathname));
|
|
227
210
|
};
|
|
228
211
|
//#endregion
|
|
@@ -241,10 +224,7 @@ var createNavigate = (routerState, revalidateCache) => {
|
|
|
241
224
|
const nextItem = findRoute(location.pathname, true);
|
|
242
225
|
return {
|
|
243
226
|
nextItem,
|
|
244
|
-
params: getParamsObject(
|
|
245
|
-
params: nextItem?.params,
|
|
246
|
-
pathname: location.pathname
|
|
247
|
-
})
|
|
227
|
+
params: getParamsObject(nextItem, location.pathname)
|
|
248
228
|
};
|
|
249
229
|
};
|
|
250
230
|
const beforeLoad = async (routeItem, params) => {
|
|
@@ -326,10 +306,7 @@ var createInvalidate = ({ routeItemDataState, loaderStateRef, timestampMap, curr
|
|
|
326
306
|
const invalidatePath = async (routeItem, pathname, options) => {
|
|
327
307
|
const routePathname = routeItemDataState.getState().location.pathname;
|
|
328
308
|
timestampMap.delete(pathname);
|
|
329
|
-
const params = getParamsObject(
|
|
330
|
-
params: routeItem?.params,
|
|
331
|
-
pathname
|
|
332
|
-
});
|
|
309
|
+
const params = getParamsObject();
|
|
333
310
|
try {
|
|
334
311
|
if (routeItem?.beforeLoad && options?.withBeforeLoad) {
|
|
335
312
|
const context = contextState.getState();
|
|
@@ -423,10 +400,7 @@ var createRevalidateCache = (routerState) => {
|
|
|
423
400
|
try {
|
|
424
401
|
const context = contextState.getState();
|
|
425
402
|
const setContext = contextState.setState;
|
|
426
|
-
const params = getParamsObject(
|
|
427
|
-
params: routeItem.params,
|
|
428
|
-
pathname
|
|
429
|
-
});
|
|
403
|
+
const params = getParamsObject(routeItem, pathname);
|
|
430
404
|
const result = await routeItem?.loader({
|
|
431
405
|
params,
|
|
432
406
|
context,
|
|
@@ -504,13 +478,10 @@ var createRouterInstance = () => {
|
|
|
504
478
|
const invalidate = createInvalidate(routerState, revalidateCache);
|
|
505
479
|
const prefetch = createPrefetch(revalidateCache);
|
|
506
480
|
const useGetAction = (actionKey) => {
|
|
507
|
-
const { routeItem
|
|
481
|
+
const { routeItem } = routerState.routeItemDataState.getState();
|
|
508
482
|
const context = routerState.contextState.getState();
|
|
509
483
|
const setContext = routerState.contextState.setState;
|
|
510
|
-
const params = getParamsObject(
|
|
511
|
-
params: routeItem?.params,
|
|
512
|
-
pathname: location.pathname
|
|
513
|
-
});
|
|
484
|
+
const params = getParamsObject();
|
|
514
485
|
if (!routeItem) throw new Error("Route not found");
|
|
515
486
|
if (!routeItem.actions) throw new Error("Route action creator not found");
|
|
516
487
|
const action = routeItem.actions({
|
|
@@ -549,13 +520,7 @@ var createRouterInstance = () => {
|
|
|
549
520
|
useCurrentLoaderState: () => useGlobalState(routerState.currentLoaderState),
|
|
550
521
|
useScrollMap: () => useGlobalState(routerState.scrollMapState),
|
|
551
522
|
useContextState: () => useGlobalState(routerState.contextState),
|
|
552
|
-
useParams: () =>
|
|
553
|
-
const routeItemData = routerState.routeItemDataState.getState();
|
|
554
|
-
return getParamsObject({
|
|
555
|
-
params: routeItemData.routeItem?.params,
|
|
556
|
-
pathname: routeItemData.location.pathname
|
|
557
|
-
});
|
|
558
|
-
},
|
|
523
|
+
useParams: () => getParamsObject(),
|
|
559
524
|
useNavigate: () => {
|
|
560
525
|
const { blockedRouteState } = routerState;
|
|
561
526
|
const { location } = routerState.routeItemDataState.getState();
|
package/dist/types.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export declare const
|
|
1
|
+
export declare const NOT_FOUND = "*";
|
|
2
2
|
export declare const findRoute: (pathname: string, includeAll?: boolean) => import("..").RouteItem | undefined;
|
package/dist/utils/utils.d.ts
CHANGED
|
@@ -1,8 +1,5 @@
|
|
|
1
1
|
import { ClientRouteItem, Location, RouteItem } from '../types';
|
|
2
2
|
export declare const createRouter: (clientList: ClientRouteItem[]) => RouteItem[];
|
|
3
|
-
export declare const getParamsObject: (
|
|
4
|
-
params?: RouteItem["params"];
|
|
5
|
-
pathname: string;
|
|
6
|
-
}) => {};
|
|
3
|
+
export declare const getParamsObject: (nextItem?: RouteItem, nextPathname?: string) => Record<string, string>;
|
|
7
4
|
export declare const parseWindowLocation: (location: typeof window.location) => Location;
|
|
8
|
-
export declare const comparePaths: (
|
|
5
|
+
export declare const comparePaths: (route: RouteItem, pathname: string) => boolean;
|