Allow href() to accept number params

[michaelboyles]

Before RR v7, I was using safe-routes (previously called remix-routes).

Their $path is mostly compatible with RRs new href, so in some circumstances it's find-and-replace-able.

$path("/posts/:postId", { postId: "abc" })
// v
href("/posts/:postId", { postId: "abc" })

One of the big differences is that $path accepts numbers, but href only accepts strings. It's especially annoying if you're doing something like this

const postId: number = getTheId();
href("/posts/:postId", { postId }); // Nope, not a string
href("/posts/:postId", { postId: String(postId) }); // has to be this

I looked at the implementation of href and it doesn't actually require the arg to be a string. This is purely a type checker issue. For example, it works fine just with a cast

href("/posts/:postId", { postId: 123 as any });
href("/posts/:postId", { postId: true as any });

I suggest that we widen the allowed types to string | number (and maybe | boolean?). It will help with migration from safe-routes, and make href a little nicer to use

---

Related to #12697

[michaelboyles]

I think it's as simple as changing this line

react-router/packages/react-router/lib/href.ts

Line 11 in 1b7b6b8

type Args = { [K in keyof Params]: ToArgs<Params[K]> };

to e.g.

type ArgumentValue = string | number;
type Args = { [K in keyof Params]: ToArgs<Record<keyof Params[K], ArgumentValue>> };