sv-router 0.16.0 → 0.16.2

package/README.md

@@ -5,10 +5,11 @@
 # sv-router
 
 [![npm](https://badgen.net/npm/v/sv-router)](https://www.npmjs.com/package/sv-router)
-[![install size](https://packagephobia.com/badge?p=sv-router)](https://packagephobia.com/result?p=sv-router)
+![downloads](https://badgen.net/npm/dm/sv-router)
+![size](https://badgen.net/bundlephobia/minzip/sv-router)
 [![codecov](https://codecov.io/github/colinlienard/sv-router/graph/badge.svg?token=C9RBSEFO9S)](https://codecov.io/github/colinlienard/sv-router)
 
-A feature-rich yet intuitive routing library for Svelte single-page apps.
+Flexible, ergonomic, and complete Svelte 5 router.
 
 [Documentation](https://sv-router.vercel.app/) • [Getting Started](https://sv-router.vercel.app/guide/getting-started) • [Reference](https://sv-router.vercel.app/reference)
 
@@ -18,16 +19,14 @@ A feature-rich yet intuitive routing library for Svelte single-page apps.
 
 ## Features
 
-- 🔒 **Typesafe navigation**: Get autocomplete and type checking for your routes.
-- 🔄 **Flexibility**: Choose between code-based or file-based routing approaches.
-- 🌿 **Nested routes**: Create complex layouts with ease.
+- 🔒 **Type-safe navigation**: Catch broken links before you ship.
+- 🗂️ **File-based routing (optional)**: DX of a meta-framework-like approach.
+- 🪶 **Lightweight**: < 5kB gzipped.
+- ⚡ **Performance**: Built-in code splitting and preloading.
 - 🔍 **Reactive search params**: For simpler state management in the URL.
+- 🌿 **Nested routes**: Share layouts across pages.
 - 🛡️ **Hooks**: For navigation guards, data loading, or analytics tracking.
-- ⚡ **Performance**: Optimized for speed with built-in code splitting and preloading.
-- 🧩 **Familiar API**: Follows established conventions from popular meta frameworks.
-- 🪶 **Lightweight**: Minimal impact on your bundle size.
-- 🚀 **Made for Svelte 5**: True Svelte 5 implementation with the latest features.
-- #️⃣ **Hash-based routing**: Hash-based routing enables usage in local environments.
+- #️⃣ **Hash-based routing**: Works inside Electron/Tauri.
 
 ## Getting Started
 

package/package.json

@@ -1,21 +1,24 @@
 {
   "name": "sv-router",
-  "version": "0.16.0",
-  "description": "Modern Svelte Routing",
+  "version": "0.16.2",
+  "description": "Type-safe routing for Svelte SPAs",
   "keywords": [
-    "svelte",
     "router",
-    "spa"
+    "spa",
+    "svelte"
   ],
   "homepage": "https://github.com/colinlienard/sv-router",
   "bugs": {
     "url": "https://github.com/colinlienard/sv-router/issues"
   },
+  "license": "MIT",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/colinlienard/sv-router.git"
   },
-  "license": "MIT",
+  "files": [
+    "src"
+  ],
   "type": "module",
   "exports": {
     ".": {
@@ -28,38 +31,32 @@
       "types": "./src/vite-plugin/index.d.ts"
     }
   },
-  "bin": "./src/cli/index.js",
-  "files": [
-    "src"
-  ],
   "dependencies": {
     "esm-env": "^1.2.2"
   },
   "devDependencies": {
-    "@changesets/cli": "^2.30.0",
+    "@changesets/cli": "^2.31.0",
     "@eslint/js": "^10.0.1",
-    "@sveltejs/vite-plugin-svelte": "^7.0.0",
+    "@sveltejs/vite-plugin-svelte": "^7.1.2",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/svelte": "^5.3.1",
     "@testing-library/user-event": "^14.6.1",
-    "@types/node": "^24.12.0",
-    "@vitest/coverage-v8": "^4.1.0",
-    "eslint": "^10.0.3",
+    "@types/node": "^24.12.3",
+    "@vitest/coverage-v8": "^4.1.5",
+    "eslint": "^10.3.0",
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-simple-import-sort": "^13.0.0",
-    "eslint-plugin-svelte": "^3.15.2",
+    "eslint-plugin-svelte": "^3.17.1",
     "eslint-plugin-unicorn": "^64.0.0",
-    "globals": "^17.4.0",
-    "happy-dom": "^20.8.4",
-    "prettier": "^3.8.1",
-    "prettier-plugin-jsdoc": "^1.8.0",
-    "prettier-plugin-svelte": "^3.5.1",
-    "svelte-check": "^4.4.5",
+    "globals": "^17.6.0",
+    "happy-dom": "^20.9.0",
+    "oxfmt": "^0.49.0",
+    "svelte-check": "^4.4.8",
     "type-testing": "^0.2.0",
-    "typescript": "^6.0.2",
-    "typescript-eslint": "^8.57.1",
-    "vite": "^8.0.0",
-    "vitest": "^4.1.0"
+    "typescript": "^6.0.3",
+    "typescript-eslint": "^8.59.2",
+    "vite": "^8.0.11",
+    "vitest": "^4.1.5"
   },
   "peerDependencies": {
     "svelte": "^5"
@@ -75,8 +72,11 @@
     "check": "svelte-check && pnpm -r check",
     "lint": "eslint . --max-warnings 0",
     "lint:fix": "eslint . --fix",
-    "format": "prettier . --check",
-    "format:fix": "prettier . --write",
+    "format": "oxfmt --check",
+    "format:fix": "oxfmt",
     "changeset": "changeset"
+  },
+  "bin": {
+    "sv-router": "./src/cli/index.js"
   }
 }

package/src/Router.svelte

@@ -1,4 +1,5 @@
 <script>
+	import { untrack } from 'svelte';
 	import { on } from 'svelte/events';
 	import {
 		componentTree,
@@ -7,15 +8,19 @@
 		onGlobalClick,
 		onNavigate,
 	} from './create-router.svelte.js';
+	import { getUserState } from './helpers/utils.js';
 	import RecursiveComponentTree from './RecursiveComponentTree.svelte';
 
 	/** @type {{ base?: string }} */
 	let { base: basename } = $props();
 
-	// svelte-ignore state_referenced_locally
-	init(basename);
+	init(untrack(() => basename));
 
-	onNavigate();
+	onNavigate(undefined, {
+		search: location.search,
+		hash: location.hash,
+		state: getUserState(history.state),
+	});
 
 	$effect(() => {
 		const cleanup = [

package/src/create-router.svelte.js

@@ -345,6 +345,8 @@ export function onGlobalClick(event) {
 	const path = base.name === '#' ? url.hash : url.pathname;
 	const hash = base.name === '#' ? undefined : url.hash;
 
+	if (base.name && base.name !== '#' && !path.startsWith(base.name)) return;
+
 	event.preventDefault();
 	const { replace, state, scrollToTop, viewTransition } = anchor.dataset;
 

package/src/helpers/utils.js

@@ -68,7 +68,7 @@ function resolveRouteComponent(input) {
 
 /**
  * @param {unknown} input
- * @returns {input is import('../index.d.ts').LazyRouteComponent}
+ * @returns {input is import("../index.d.ts").LazyRouteComponent}
  */
 export function isLazyImport(input) {
 	return (
@@ -104,7 +104,7 @@ export function stripBase(pathname) {
 }
 
 /** @param {any} state */
-function getUserState(state) {
+export function getUserState(state) {
 	if (state && '_userState' in state) {
 		return state._userState;
 	}

package/src/index.d.ts

@@ -316,6 +316,7 @@ export type SearchParams = Omit<
 	getAll(name: string): (string | number | boolean)[];
 	set(name: string, value: string | number | boolean, options?: { replace?: boolean }): void;
 	sort(options?: { replace?: boolean }): void;
+	toURLSearchParams(): URLSearchParams;
 	values(): (string | number | boolean)[];
 };
 

package/src/search-params.svelte.js

@@ -47,6 +47,9 @@ const shell = {
 	values() {
 		return [...searchParams.values()].map(parseSearchValue);
 	},
+	toURLSearchParams() {
+		return new URLSearchParams(searchParams);
+	},
 	get size() {
 		return searchParams.size;
 	},
@@ -63,8 +66,11 @@ export function syncSearchParams(search) {
 		return;
 	}
 	const newSearch = new URLSearchParams(search);
-	for (const [key, value] of newSearch) {
-		searchParams.set(key, value);
+	for (const key of newSearch.keys()) {
+		searchParams.delete(key);
+		for (const value of newSearch.getAll(key)) {
+			searchParams.append(key, value);
+		}
 	}
 	// eslint-disable-next-line unicorn/no-useless-spread
 	for (const key of [...searchParams.keys()]) {