Ship regexparam with optional wildcards

packages/wouter-preact/rollup.config.js

@@ -10,7 +10,7 @@ export default defineConfig([
       "wouter/use-hash-location",
       "wouter/memory-location",
     ],
-    external: ["preact", "preact/hooks", "regexparam", "mitt"],
+    external: ["preact", "preact/hooks", "mitt"],
 
     output: {
       dir: "esm",
@@ -21,6 +21,7 @@ export default defineConfig([
       alias({
         entries: {
           "./react-deps.js": "./src/preact-deps.js",
+          regexparam: "wouter/src/regexparam.js",
         },
       }),
     ],

packages/wouter-preact/types/index.d.ts

@@ -24,7 +24,7 @@ import { RouterObject, RouterOptions } from "./router";
 export { Path, BaseLocationHook, BaseSearchHook } from "./location-hook";
 export * from "./router";
 
-import { RouteParams } from "regexparam";
+import { RouteParams } from "./regexparam";
 
 /**
  * Route patterns and parameters

packages/wouter-preact/types/regexparam.d.ts

@@ -0,0 +1,29 @@
+export function parse(
+  route: string,
+  loose?: boolean
+): {
+  keys: string[];
+  pattern: RegExp;
+};
+
+export function parse(route: RegExp): {
+  keys: false;
+  pattern: RegExp;
+};
+
+export type RouteParams<T extends string> =
+  T extends `${infer Prev}/*/${infer Rest}`
+    ? RouteParams<Prev> & { wild: string } & RouteParams<Rest>
+    : T extends `${string}:${infer P}?/${infer Rest}`
+    ? { [K in P]?: string } & RouteParams<Rest>
+    : T extends `${string}:${infer P}/${infer Rest}`
+    ? { [K in P]: string } & RouteParams<Rest>
+    : T extends `${string}:${infer P}?`
+    ? { [K in P]?: string }
+    : T extends `${string}:${infer P}`
+    ? { [K in P]: string }
+    : T extends `${string}*`
+    ? { wild: string }
+    : T extends `${string}*?`
+    ? { wild?: string }
+    : {};

packages/wouter/rollup.config.js

@@ -1,4 +1,5 @@
 import { defineConfig } from "rollup";
+import alias from "@rollup/plugin-alias";
 
 export default defineConfig([
   {
@@ -20,10 +21,18 @@ export default defineConfig([
       "src/use-hash-location.js",
       "src/memory-location.js",
     ],
-    external: [/react-deps/, "regexparam", "mitt"],
+    external: [/react-deps/, "mitt"],
     output: {
       dir: "esm",
       format: "esm",
     },
+
+    plugins: [
+      alias({
+        entries: {
+          regexparam: "./src/regexparam.js",
+        },
+      }),
+    ],
   },
 ]);

packages/wouter/src/regexparam.js

@@ -0,0 +1,44 @@
+/**
+ * The function below was extracted from the `regexparam` package.
+ * It has been modified to support optional wildcards, which is
+ * addressed in this PR https://github.com/lukeed/regexparam/pull/25
+ *
+ * The original source code is distributed under the MIT license
+ * and is available at: https://github.com/lukeed/regexparam
+ *
+ * Copyright: Luke Edwards
+ */
+
+export function parse(str, loose) {
+  if (str instanceof RegExp) return { keys: false, pattern: str };
+  var c,
+    o,
+    tmp,
+    ext,
+    keys = [],
+    pattern = "",
+    arr = str.split("/");
+  arr[0] || arr.shift();
+
+  while ((tmp = arr.shift())) {
+    c = tmp[0];
+    if (c === "*") {
+      o = tmp[1] === "?";
+      keys.push("wild");
+      pattern += o ? "(?:/(.*))?" : "/(.*)";
+    } else if (c === ":") {
+      o = tmp.indexOf("?", 1);
+      ext = tmp.indexOf(".", 1);
+      keys.push(tmp.substring(1, !!~o ? o : !!~ext ? ext : tmp.length));
+      pattern += !!~o && !~ext ? "(?:/([^/]+?))?" : "/([^/]+?)";
+      if (!!~ext) pattern += (!!~o ? "?" : "") + "\\" + tmp.substring(ext);
+    } else {
+      pattern += "/" + tmp;
+    }
+  }
+
+  return {
+    keys: keys,
+    pattern: new RegExp("^" + pattern + (loose ? "(?=$|/)" : "/?$"), "i"),
+  };
+}

packages/wouter/test/use-route.test-d.ts

@@ -36,14 +36,13 @@ it("accepts the type of parameters as a generic argument", () => {
 });
 
 it("infers parameters from the route path", () => {
-  const [, inferedParams] = useRoute("/app/users/:name?/:id");
+  const [, inferedParams] = useRoute("/app/users/:name?/:id/*?");
 
   if (inferedParams) {
     expectTypeOf(inferedParams).toMatchTypeOf<{
       name?: string;
       id: string;
+      wildcard?: string;
     }>();
   }
 });
-
-it.todo("accepts custom parser type for parameter inference");

packages/wouter/test/use-route.test.tsx

@@ -74,6 +74,17 @@ it("uses a question mark to define optional segments", () => {
   });
 });
 
+it("supports optional wildcards", () => {
+  assertRoute("/app/*?", "/app/blog/mac", { wild: "blog/mac" });
+  assertRoute("/app/*?", "/app", { wild: undefined });
+  assertRoute("/app/*?/dashboard", "/app/v1/dashboard", { wild: "v1" });
+  assertRoute("/app/*?/dashboard", "/app/dashboard", { wild: undefined });
+  assertRoute("/app/*?/users/:name", "/app/users/karen", {
+    wild: undefined,
+    name: "karen",
+  });
+});
+
 it("supports other characters in segments", () => {
   assertRoute("/users/:name", "/users/1-alex", { name: "1-alex" });
   assertRoute("/staff/:name/:bio?", "/staff/John Doe 3", {

packages/wouter/types/index.d.ts

@@ -28,7 +28,7 @@ import { RouterObject, RouterOptions } from "./router";
 export { Path, BaseLocationHook, BaseSearchHook } from "./location-hook";
 export * from "./router";
 
-import { RouteParams } from "regexparam";
+import { RouteParams } from "./regexparam";
 
 // React <18 only: fixes incorrect `ReactNode` declaration that had `{}` in the union.
 // This issue has been fixed in React 18 type declaration.

packages/wouter/types/regexparam.d.ts

@@ -0,0 +1,29 @@
+export function parse(
+  route: string,
+  loose?: boolean
+): {
+  keys: string[];
+  pattern: RegExp;
+};
+
+export function parse(route: RegExp): {
+  keys: false;
+  pattern: RegExp;
+};
+
+export type RouteParams<T extends string> =
+  T extends `${infer Prev}/*/${infer Rest}`
+    ? RouteParams<Prev> & { wild: string } & RouteParams<Rest>
+    : T extends `${string}:${infer P}?/${infer Rest}`
+    ? { [K in P]?: string } & RouteParams<Rest>
+    : T extends `${string}:${infer P}/${infer Rest}`
+    ? { [K in P]: string } & RouteParams<Rest>
+    : T extends `${string}:${infer P}?`
+    ? { [K in P]?: string }
+    : T extends `${string}:${infer P}`
+    ? { [K in P]: string }
+    : T extends `${string}*`
+    ? { wild: string }
+    : T extends `${string}*?`
+    ? { wild?: string }
+    : {};