sv-router 0.7.1 → 0.7.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sv-router",
-  "version": "0.7.1",
+  "version": "0.7.2",
   "description": "Modern Svelte Routing",
   "keywords": [
     "svelte",
@@ -38,7 +38,7 @@
   "devDependencies": {
     "@changesets/cli": "^2.29.4",
     "@eslint/js": "^9.28.0",
-    "@sveltejs/vite-plugin-svelte": "^5.1.0",
+    "@sveltejs/vite-plugin-svelte": "^6.0.0",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/svelte": "^5.2.8",
     "@types/node": "^22.15.30",

package/src/actions.svelte.js

@@ -12,10 +12,11 @@ export function isActiveLink(node, { className = 'is-active', startsWith = false
 		if (base.name) {
 			pathname = join(base.name, pathname);
 		}
+		const tokens = className.split(' ').filter(Boolean) ?? [];
 		if (startsWith ? location.pathname.startsWith(pathname) : location.pathname === pathname) {
-			node.classList.add(className);
+			node.classList.add(...tokens);
 		} else {
-			node.classList.remove(className);
+			node.classList.remove(...tokens);
 		}
 	});
 }

package/src/create-router.svelte.js

@@ -2,7 +2,13 @@ import { BROWSER, DEV } from 'esm-env';
 import { isActive } from './helpers/is-active.js';
 import { matchRoute } from './helpers/match-route.js';
 import { preload, preloadOnHover } from './helpers/preload.js';
-import { constructPath, join, resolveRouteComponents, updatedLocation } from './helpers/utils.js';
+import {
+	constructPath,
+	join,
+	resolveRouteComponents,
+	stripBase,
+	updatedLocation,
+} from './helpers/utils.js';
 import { syncSearchParams } from './search-params.svelte.js';
 
 /** @type {import('./index.d.ts').Routes} */
@@ -60,7 +66,7 @@ export function createRouter(r) {
 				return params.value;
 			},
 			get pathname() {
-				return /** @type {import('./index.d.ts').Path<T>} */ (location.pathname);
+				return /** @type {import('./index.d.ts').Path<T>} */ (stripBase(location.pathname));
 			},
 			get search() {
 				return location.search;
@@ -111,16 +117,13 @@ export async function onNavigate(path, options = {}) {
 	navigationIndex++;
 	const currentNavigationIndex = navigationIndex;
 
-	let matchPath = path || globalThis.location.pathname;
-	if (base.name && matchPath.startsWith(base.name)) {
-		matchPath = matchPath.slice(base.name.length) || '/';
-	}
+	const matchPath = stripBase(path || globalThis.location.pathname);
 	const { match, layouts, hooks, meta: newMeta, params: newParams } = matchRoute(matchPath, routes);
 
 	for (const { beforeLoad } of hooks) {
 		try {
 			pendingNavigationIndex = currentNavigationIndex;
-			await beforeLoad?.({ pathname: matchPath, ...options });
+			await beforeLoad?.({ pathname: matchPath, meta: newMeta, ...options });
 		} catch {
 			return;
 		}
@@ -161,7 +164,7 @@ export async function onNavigate(path, options = {}) {
 	}
 
 	for (const { afterLoad } of hooks) {
-		afterLoad?.({ pathname: matchPath, ...options });
+		void afterLoad?.({ pathname: matchPath, meta: newMeta, ...options });
 	}
 }
 

package/src/gen/generate-router-code.js

@@ -177,7 +177,9 @@ export function createRouterCode(routes, routesPath, { allLazy = false } = {}) {
 		`import { createRouter } from 'sv-router';`,
 		...imports,
 		'',
-		`export const { p, navigate, isActive, preload, route } = createRouter(${stringifiedRoutes});`,
+		`const routes = ${stringifiedRoutes};`,
+		'export type Routes = typeof routes;',
+		'export const { p, navigate, isActive, preload, route } = createRouter(routes);',
 	].join('\n');
 }
 

package/src/helpers/match-route.js

@@ -109,7 +109,7 @@ export function matchRoute(pathname, routes) {
 
 			const nestedPathname = '/' + pathParts.slice(index + 1).join('/');
 			const result = matchRoute(nestedPathname, routeMatch);
-			if (result) {
+			if (result.match) {
 				match = result.match;
 				params = { ...params, ...result.params };
 				hooks.push(...result.hooks);
@@ -119,6 +119,8 @@ export function matchRoute(pathname, routes) {
 				} else {
 					layouts.push(...result.layouts);
 				}
+			} else {
+				continue;
 			}
 			break outer;
 		}
@@ -141,7 +143,7 @@ export function sortRoutes(routes) {
  */
 function getRoutePriority(route) {
 	if (route === '' || route === '/') return 1;
-	if (route.startsWith('*')) return 4;
+	if (route.includes('*')) return 4;
 	if (route.includes(':')) return 3;
 	return 2;
 }

package/src/helpers/preload.js

@@ -7,9 +7,9 @@ import { resolveRouteComponents } from './utils.js';
  * @param {import('../index.d.ts').NavigateOptions} [options]
  */
 export async function preload(routes, path, options) {
-	const { match, layouts, hooks } = matchRoute(path, routes);
+	const { match, layouts, hooks, meta } = matchRoute(path, routes);
 	for (const { onPreload } of hooks) {
-		onPreload?.({ pathname: path, ...options });
+		void onPreload?.({ pathname: path, meta, ...options });
 	}
 	await resolveRouteComponents(match ? [...layouts, match] : layouts);
 }

package/src/helpers/utils.js

@@ -1,3 +1,5 @@
+import { base } from '../create-router.svelte.js';
+
 /**
  * @param {string} path
  * @param {Record<string, string>} [params]
@@ -60,6 +62,17 @@ export function join(...parts) {
 	return result;
 }
 
+/**
+ * @param {string} pathname
+ * @returns {string}
+ */
+export function stripBase(pathname) {
+	if (base.name && pathname.startsWith(base.name)) {
+		pathname = pathname.slice(base.name.length) || '/';
+	}
+	return pathname;
+}
+
 export function updatedLocation() {
 	return {
 		pathname: globalThis.location.pathname,

package/src/index.d.ts

@@ -64,9 +64,9 @@ export type Hooks = {
 	 */
 	beforeLoad?(context: HooksContext): void | Promise<void>;
 	/** A function that will be called after the route is loaded. */
-	afterLoad?(context: HooksContext): void;
+	afterLoad?(context: HooksContext): void | Promise<void>;
 	/** A function that will be called when the route is preloaded. */
-	onPreload?(context: HooksContext): void;
+	onPreload?(context: HooksContext): void | Promise<void>;
 };
 
 export type Routes = {
@@ -79,7 +79,11 @@ export type Routes = {
 
 export type IsActiveLink = Action<
 	HTMLAnchorElement,
-	{ className?: string; startsWith?: boolean } | undefined
+	| {
+			className?: string;
+			startsWith?: boolean;
+	  }
+	| undefined
 >;
 
 /**
@@ -143,7 +147,7 @@ export type RouterApi<T extends Routes> = {
 	 */
 	isActive: {
 		<U extends Path<T>>(...args: IsActiveArgs<U>): boolean;
-		startsWith<U extends Path<T>>(...args: IsActiveArgs<U>): boolean;
+		startsWith<U extends Path<T>>(...args: IsActiveArgs<U, true>): boolean;
 	};
 
 	/**
@@ -190,27 +194,39 @@ export type Path<T extends Routes, AnyParam extends boolean = false> = RemovePar
 	RemoveLastSlash<RecursiveKeys<StripNonRoutes<T>, '', AnyParam>>
 >;
 
-export type ConstructPathArgs<T extends string> =
-	PathParams<T> extends never ? [T] : [T, PathParams<T>];
+export type ConstructPathArgs<TPath extends string> = {
+	[Path in TPath]: PathParams<Path> extends never ? [Path] : [Path, PathParams<Path>];
+}[TPath];
 
-export type IsActiveArgs<T extends string> =
-	PathParams<T> extends never ? [T] : [T] | [T, PathParams<T>];
+export type IsActiveArgs<
+	TPath extends string,
+	StartsWith extends boolean = false,
+> = StartsWith extends true
+	? {
+			[Path in TPath]: PathParams<Path> extends never
+				? [PathPrefixes<Path>]
+				: [PathPrefixes<Path>] | [PathPrefixes<Path>, PathParams<Path>];
+		}[TPath]
+	: {
+			[Path in TPath]: PathParams<Path> extends never ? [Path] : [Path] | [Path, PathParams<Path>];
+		}[TPath];
 
-export type PathParams<T extends string> =
-	ExtractParams<RemoveParenthesis<T>> extends never
+export type PathParams<TPath extends string> =
+	ExtractParams<RemoveParenthesis<TPath>> extends never
 		? never
-		: Record<ExtractParams<RemoveParenthesis<T>>, string>;
+		: Record<ExtractParams<RemoveParenthesis<TPath>>, string>;
 
-export type AllParams<T extends Routes> = Partial<
-	Record<ExtractParams<RemoveParenthesis<RecursiveKeys<T>>>, string>
+export type AllParams<TRoutes extends Routes> = Partial<
+	Record<ExtractParams<RemoveParenthesis<RecursiveKeys<TRoutes>>>, string>
 >;
 
 export type HooksContext = {
+	hash?: string;
+	meta: RouteMeta;
 	pathname: string;
 	replace?: boolean;
 	search?: string;
 	state?: string;
-	hash?: string;
 };
 
 export type NavigateOptions =
@@ -288,3 +304,15 @@ type ExtractParams<T extends string> = T extends `${string}:${infer Param}/${inf
 				? never
 				: Param
 			: never;
+
+type PathPrefixes<T extends string, Acc extends string = ''> = T extends '/'
+	? '/'
+	: T extends `/${infer Segment}/${infer Rest}`
+		? Acc extends ''
+			? PathPrefixes<`/${Rest}`, `/${Segment}`> | `/${Segment}`
+			: PathPrefixes<`/${Rest}`, `${Acc}/${Segment}`> | `${Acc}/${Segment}` | Acc
+		: T extends `/${infer Segment}`
+			? Acc extends ''
+				? `/${Segment}`
+				: `${Acc}/${Segment}` | Acc
+			: Acc;