From 9c1ab93382feade7cdbd4e5527e9c5cfc6024a22 Mon Sep 17 00:00:00 2001
From: Reinfi <reinfandt@z-em.de>
Date: Mon, 3 Jun 2024 21:38:50 +0200
Subject: [PATCH 1/2] add options to typesafeBrowserRouter

---
 src/browser-router.ts | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/browser-router.ts b/src/browser-router.ts
index 26ecec6..11938a8 100644
--- a/src/browser-router.ts
+++ b/src/browser-router.ts
@@ -1,3 +1,4 @@
+import type { unstable_DataStrategyFunction, FutureConfig, HydrationState } from '@remix-run/router';
 import { RouteObject, createBrowserRouter } from 'react-router-dom';
 
 type Narrowable = string | number | bigint | boolean;
@@ -42,7 +43,15 @@ const joinValidWith =
 	(...valid: any[]) =>
 		valid.filter(Boolean).join(separator);
 
-export const typesafeBrowserRouter = <const R extends RouteObject>(routes: NarrowArray<R>) => {
+interface DOMRouterOpts {
+	basename?: string;
+	future?: Partial<Omit<FutureConfig, 'v7_prependBasename'>>;
+	hydrationData?: HydrationState;
+	unstable_dataStrategy?: unstable_DataStrategyFunction;
+	window?: Window;
+}
+
+export const typesafeBrowserRouter = <const R extends RouteObject>(routes: NarrowArray<R>, opts?: DOMRouterOpts) => {
 	type Paths = ExtractPaths<R, ''>;
 
 	function href<P extends Paths>(
@@ -65,7 +74,7 @@ export const typesafeBrowserRouter = <const R extends RouteObject>(routes: Narro
 	}
 
 	return {
-		router: createBrowserRouter(routes as RouteObject[]),
+		router: createBrowserRouter(routes as RouteObject[], opts),
 		href,
 	};
 };

From 0b7a28d10cb5169f46c0afaa22226d3e376cb964 Mon Sep 17 00:00:00 2001
From: Reinfi <reinfandt@z-em.de>
Date: Thu, 20 Jun 2024 22:17:39 +0200
Subject: [PATCH 2/2] infer type of options from method

---
 src/__tests__/browser-router.test.ts | 10 ++++++++++
 src/browser-router.ts                | 11 ++---------
 2 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/src/__tests__/browser-router.test.ts b/src/__tests__/browser-router.test.ts
index 098f091..00b5477 100644
--- a/src/__tests__/browser-router.test.ts
+++ b/src/__tests__/browser-router.test.ts
@@ -234,3 +234,13 @@ test('works with relative paths', () => {
 
 	expect(output).toEqual('/blog/asd/comments');
 });
+
+test('allows basename option', () => {
+	const { href } = typesafeBrowserRouter([{ path: '/' }], {
+		basename: '/app',
+	});
+
+	const output = href({ path: '/' });
+
+	expect(output).toEqual('/');
+});
diff --git a/src/browser-router.ts b/src/browser-router.ts
index 11938a8..8f154b9 100644
--- a/src/browser-router.ts
+++ b/src/browser-router.ts
@@ -1,4 +1,3 @@
-import type { unstable_DataStrategyFunction, FutureConfig, HydrationState } from '@remix-run/router';
 import { RouteObject, createBrowserRouter } from 'react-router-dom';
 
 type Narrowable = string | number | bigint | boolean;
@@ -43,15 +42,9 @@ const joinValidWith =
 	(...valid: any[]) =>
 		valid.filter(Boolean).join(separator);
 
-interface DOMRouterOpts {
-	basename?: string;
-	future?: Partial<Omit<FutureConfig, 'v7_prependBasename'>>;
-	hydrationData?: HydrationState;
-	unstable_dataStrategy?: unstable_DataStrategyFunction;
-	window?: Window;
-}
+type OptionsType = typeof createBrowserRouter extends (routes: unknown, opts: infer OptsType) => any ? OptsType : never;
 
-export const typesafeBrowserRouter = <const R extends RouteObject>(routes: NarrowArray<R>, opts?: DOMRouterOpts) => {
+export const typesafeBrowserRouter = <const R extends RouteObject>(routes: NarrowArray<R>, opts?: OptionsType) => {
 	type Paths = ExtractPaths<R, ''>;
 
 	function href<P extends Paths>(