remove $param helper

README.md

@@ -110,25 +110,6 @@ export const loader = async (request) => {
 }
 ```
 
-### Checking params
-
-```typescript
-import { useParams } from "react-router";
-import { $params } from 'safe-routes'; // <-- Import $params helper.
-
-export const action = async ({ params }) => {
-  const { id } = $params("/posts/:id/update", params) // <-- It's type safe, try renaming `id` param.
-
-  // ...
-}
-
-export default function Component() {
-  const params = useParams();
-  const { id } = $params("/posts/:id/update", params);
-  ...
-}
-```
-
 ### $routeId helper for useRouteLoaderData route ids
 
 safe-routes exports the `RouteId` type definition with the list of all valid route ids for your repository, and has a helper function `$routeId` that tells typescript to restrict the given string to one of the valid RouteId values.

example/app/routes/posts/show/route.tsx

@@ -1,3 +1,6 @@
-export default function Component() {
+import type { Route } from './+types/route';
+
+export default function Component(props: Route.ComponentProps) {
+  props.params.id
   return <div>show</div>
 }

example/app/welcome/welcome.tsx

@@ -21,9 +21,8 @@ export function Welcome() {
             />
           </div>
         </header>
-        <Link to={$path('/posts')}>
-        posts
-        </Link>
+        <Link to={$path('/posts')}>posts</Link>
+        <Link to={$path('/posts/:id', { id: 1 })}>post</Link>
         <div className="max-w-[300px] w-full space-y-6 px-4">
           <nav className="rounded-3xl border border-gray-200 p-6 dark:border-gray-700 space-y-4">
             <p className="leading-6 text-gray-700 dark:text-gray-200 text-center">

src/index.ts

@@ -55,13 +55,6 @@ export function $path(route: string, ...paramsOrQuery: Array<any>) {
   return prependBasename(path + '?' + searchParams.toString());
 }
 
-export function $params(
-  _route: string,
-  params: { readonly [key: string]: string | undefined },
-) {
-  return params;
-}
-
 export function $routeId(routeId: string) {
   return routeId;
 }

tests/index.test.ts

@@ -1,5 +1,5 @@
-import { test, expect, vi } from 'vitest';
-import { $path, $params } from '../src';
+import { expect, test, vi } from 'vitest';
+import { $path } from '../src';
 import * as basename from '../src/basename.ts';
 
 vi.mock(import('../src/basename.ts'));
@@ -53,10 +53,6 @@ test('optional segment', () => {
   expect($path('/tree?/:tree?', { tree: 'main' })).toBe('/tree/main');
 });
 
-test('$params', () => {
-  expect($params('/posts/:id', { id: '1' })).toStrictEqual({ id: '1' });
-});
-
 test('basename', async () => {
   vi.mocked(basename.resolveBasename).mockReturnValue('/blog');