@react-router/dev 0.0.0-experimental-f1dd850aa → 0.0.0-experimental-e87ed2fd4

package/dist/cli/index.js

@@ -1,6 +1,6 @@
 #!/usr/bin/env node
 /**
- * @react-router/dev v0.0.0-experimental-f1dd850aa
+ * @react-router/dev v0.0.0-experimental-e87ed2fd4
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -915,7 +915,7 @@ function generateServerBuild(ctx) {
 function generateRoutes(ctx) {
   const fileToRoutes = /* @__PURE__ */ new Map();
   const lineages = /* @__PURE__ */ new Map();
-  const pages = /* @__PURE__ */ new Set();
+  const allPages = /* @__PURE__ */ new Set();
   const routeToPages = /* @__PURE__ */ new Map();
   for (const route of Object.values(ctx.config.routes)) {
     let routeIds = fileToRoutes.get(route.file);
@@ -926,16 +926,17 @@ function generateRoutes(ctx) {
     routeIds.add(route.id);
     const lineage2 = lineage(ctx.config.routes, route);
     lineages.set(route.id, lineage2);
-    const page = fullpath(lineage2);
-    if (!page) continue;
-    pages.add(page);
+    const fullpath2 = fullpath(lineage2);
+    if (!fullpath2) continue;
+    const pages = explodeOptionalSegments(fullpath2);
+    pages.forEach((page) => allPages.add(page));
     lineage2.forEach(({ id }) => {
       let routePages = routeToPages.get(id);
       if (!routePages) {
         routePages = /* @__PURE__ */ new Set();
         routeToPages.set(id, routePages);
       }
-      routePages.add(page);
+      pages.forEach((page) => routePages.add(page));
     });
   }
   const routesTs = {
@@ -951,7 +952,7 @@ function generateRoutes(ctx) {
             routeFiles: RouteFiles
           }
         }
-      ` + "\n\n" + generate(pagesType(pages)).code + "\n\n" + generate(routeFilesType({ fileToRoutes, routeToPages })).code
+      ` + "\n\n" + generate(pagesType(allPages)).code + "\n\n" + generate(routeFilesType({ fileToRoutes, routeToPages })).code
   };
   const allAnnotations = Array.from(fileToRoutes.entries()).filter(([file]) => isInAppDirectory(ctx, file)).map(
     ([file, routeIds]) => getRouteAnnotations({ ctx, file, routeIds, lineages })
@@ -1156,6 +1157,29 @@ function paramsType(path8) {
     })
   );
 }
+function explodeOptionalSegments(path8) {
+  let segments = path8.split("/");
+  if (segments.length === 0) return [];
+  let [first, ...rest] = segments;
+  let isOptional = first.endsWith("?");
+  let required = first.replace(/\?$/, "");
+  if (rest.length === 0) {
+    return isOptional ? [required, ""] : [required];
+  }
+  let restExploded = explodeOptionalSegments(rest.join("/"));
+  let result = [];
+  result.push(
+    ...restExploded.map(
+      (subpath) => subpath === "" ? required : [required, subpath].join("/")
+    )
+  );
+  if (isOptional) {
+    result.push(...restExploded);
+  }
+  return result.map(
+    (exploded) => path8.startsWith("/") && exploded === "" ? "/" : exploded
+  );
+}
 var import_dedent, Path3, Pathe, t2;
 var init_generate = __esm({
   "typegen/generate.ts"() {
@@ -1368,14 +1392,10 @@ var init_route_chunks = __esm({
 });
 
 // vite/with-props.ts
-var import_dedent2, vmod;
 var init_with_props = __esm({
   "vite/with-props.ts"() {
     "use strict";
-    import_dedent2 = __toESM(require("dedent"));
     init_babel();
-    init_virtual_module();
-    vmod = create("with-props");
   }
 });
 
@@ -1778,7 +1798,7 @@ async function viteAppBuild(root, {
         },
         configResolved(config) {
           let hasReactRouterPlugin = config.plugins.find(
-            (plugin2) => plugin2.name === "react-router"
+            (plugin) => plugin.name === "react-router"
           );
           if (!hasReactRouterPlugin) {
             throw new Error(
@@ -1917,7 +1937,7 @@ async function dev(root, {
     clearScreen,
     logLevel
   });
-  if (!server.config.plugins.find((plugin2) => plugin2.name === "react-router")) {
+  if (!server.config.plugins.find((plugin) => plugin.name === "react-router")) {
     console.error(
       import_picocolors6.default.red("React Router Vite plugin not found in Vite config")
     );

package/dist/config.js

@@ -1,5 +1,5 @@
 /**
- * @react-router/dev v0.0.0-experimental-f1dd850aa
+ * @react-router/dev v0.0.0-experimental-e87ed2fd4
  *
  * Copyright (c) Remix Software Inc.
  *

package/dist/routes.js

@@ -1,5 +1,5 @@
 /**
- * @react-router/dev v0.0.0-experimental-f1dd850aa
+ * @react-router/dev v0.0.0-experimental-e87ed2fd4
  *
  * Copyright (c) Remix Software Inc.
  *

package/dist/vite/cloudflare.js

@@ -1,5 +1,5 @@
 /**
- * @react-router/dev v0.0.0-experimental-f1dd850aa
+ * @react-router/dev v0.0.0-experimental-e87ed2fd4
  *
  * Copyright (c) Remix Software Inc.
  *

package/dist/vite.js

@@ -1,5 +1,5 @@
 /**
- * @react-router/dev v0.0.0-experimental-f1dd850aa
+ * @react-router/dev v0.0.0-experimental-e87ed2fd4
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -902,7 +902,7 @@ var { t: t2 } = babel_exports;
 function generateRoutes(ctx) {
   const fileToRoutes = /* @__PURE__ */ new Map();
   const lineages = /* @__PURE__ */ new Map();
-  const pages = /* @__PURE__ */ new Set();
+  const allPages = /* @__PURE__ */ new Set();
   const routeToPages = /* @__PURE__ */ new Map();
   for (const route of Object.values(ctx.config.routes)) {
     let routeIds = fileToRoutes.get(route.file);
@@ -913,16 +913,17 @@ function generateRoutes(ctx) {
     routeIds.add(route.id);
     const lineage2 = lineage(ctx.config.routes, route);
     lineages.set(route.id, lineage2);
-    const page = fullpath(lineage2);
-    if (!page) continue;
-    pages.add(page);
+    const fullpath2 = fullpath(lineage2);
+    if (!fullpath2) continue;
+    const pages = explodeOptionalSegments(fullpath2);
+    pages.forEach((page) => allPages.add(page));
     lineage2.forEach(({ id }) => {
       let routePages = routeToPages.get(id);
       if (!routePages) {
         routePages = /* @__PURE__ */ new Set();
         routeToPages.set(id, routePages);
       }
-      routePages.add(page);
+      pages.forEach((page) => routePages.add(page));
     });
   }
   const routesTs = {
@@ -938,7 +939,7 @@ function generateRoutes(ctx) {
             routeFiles: RouteFiles
           }
         }
-      ` + "\n\n" + generate(pagesType(pages)).code + "\n\n" + generate(routeFilesType({ fileToRoutes, routeToPages })).code
+      ` + "\n\n" + generate(pagesType(allPages)).code + "\n\n" + generate(routeFilesType({ fileToRoutes, routeToPages })).code
   };
   const allAnnotations = Array.from(fileToRoutes.entries()).filter(([file]) => isInAppDirectory(ctx, file)).map(
     ([file, routeIds]) => getRouteAnnotations({ ctx, file, routeIds, lineages })
@@ -1143,6 +1144,29 @@ function paramsType(path6) {
     })
   );
 }
+function explodeOptionalSegments(path6) {
+  let segments = path6.split("/");
+  if (segments.length === 0) return [];
+  let [first, ...rest] = segments;
+  let isOptional = first.endsWith("?");
+  let required = first.replace(/\?$/, "");
+  if (rest.length === 0) {
+    return isOptional ? [required, ""] : [required];
+  }
+  let restExploded = explodeOptionalSegments(rest.join("/"));
+  let result = [];
+  result.push(
+    ...restExploded.map(
+      (subpath) => subpath === "" ? required : [required, subpath].join("/")
+    )
+  );
+  if (isOptional) {
+    result.push(...restExploded);
+  }
+  return result.map(
+    (exploded) => path6.startsWith("/") && exploded === "" ? "/" : exploded
+  );
+}
 
 // typegen/index.ts
 async function clearRouteModuleAnnotations(ctx) {
@@ -2183,59 +2207,11 @@ function getRouteChunkNameFromModuleId(id) {
 }
 
 // vite/with-props.ts
-var import_dedent2 = __toESM(require("dedent"));
-var vmod = create("with-props");
-var NAMED_COMPONENT_EXPORTS = ["HydrateFallback", "ErrorBoundary"];
-var plugin = {
-  name: "react-router-with-props",
-  enforce: "pre",
-  resolveId(id) {
-    if (id === vmod.id) return vmod.resolvedId;
-  },
-  async load(id) {
-    if (id !== vmod.resolvedId) return;
-    return import_dedent2.default`
-      import { createElement as h } from "react";
-      import { useActionData, useLoaderData, useMatches, useParams, useRouteError } from "react-router";
-
-      export function withComponentProps(Component) {
-        return function Wrapped() {
-          const props = {
-            params: useParams(),
-            loaderData: useLoaderData(),
-            actionData: useActionData(),
-            matches: useMatches(),
-          };
-          return h(Component, props);
-        };
-      }
-
-      export function withHydrateFallbackProps(HydrateFallback) {
-        return function Wrapped() {
-          const props = {
-            params: useParams(),
-            loaderData: useLoaderData(),
-            actionData: useActionData(),
-          };
-          return h(HydrateFallback, props);
-        };
-      }
-
-      export function withErrorBoundaryProps(ErrorBoundary) {
-        return function Wrapped() {
-          const props = {
-            params: useParams(),
-            loaderData: useLoaderData(),
-            actionData: useActionData(),
-            error: useRouteError(),
-          };
-          return h(ErrorBoundary, props);
-        };
-      }
-    `;
-  }
-};
-var transform = (ast) => {
+var namedComponentExports = ["HydrateFallback", "ErrorBoundary"];
+function isNamedComponentExport(name) {
+  return namedComponentExports.includes(name);
+}
+var decorateComponentExportsWithProps = (ast) => {
   const hocs = [];
   function getHocUid(path6, hocName) {
     const uid = path6.scope.generateUidIdentifier(hocName);
@@ -2248,7 +2224,7 @@ var transform = (ast) => {
         const declaration = path6.get("declaration");
         const expr = declaration.isExpression() ? declaration.node : declaration.isFunctionDeclaration() ? toFunctionExpression(declaration.node) : void 0;
         if (expr) {
-          const uid = getHocUid(path6, "withComponentProps");
+          const uid = getHocUid(path6, "UNSAFE_withComponentProps");
           declaration.replaceWith(t.callExpression(uid, [expr]));
         }
         return;
@@ -2263,8 +2239,8 @@ var transform = (ast) => {
             if (!expr) return;
             if (!id.isIdentifier()) return;
             const { name } = id.node;
-            if (!NAMED_COMPONENT_EXPORTS.includes(name)) return;
-            const uid = getHocUid(path6, `with${name}Props`);
+            if (!isNamedComponentExport(name)) return;
+            const uid = getHocUid(path6, `UNSAFE_with${name}Props`);
             init.replaceWith(t.callExpression(uid, [expr]));
           });
           return;
@@ -2273,8 +2249,8 @@ var transform = (ast) => {
           const { id } = decl.node;
           if (!id) return;
           const { name } = id;
-          if (!NAMED_COMPONENT_EXPORTS.includes(name)) return;
-          const uid = getHocUid(path6, `with${name}Props`);
+          if (!isNamedComponentExport(name)) return;
+          const uid = getHocUid(path6, `UNSAFE_with${name}Props`);
           decl.replaceWith(
             t.variableDeclaration("const", [
               t.variableDeclarator(
@@ -2293,7 +2269,7 @@ var transform = (ast) => {
         hocs.map(
           ([name, identifier]) => t.importSpecifier(identifier, t.identifier(name))
         ),
-        t.stringLiteral(vmod.id)
+        t.stringLiteral("react-router")
       )
     );
   }
@@ -2390,8 +2366,8 @@ var virtual = {
   browserManifest: create("browser-manifest")
 };
 var invalidateVirtualModules = (viteDevServer) => {
-  Object.values(virtual).forEach((vmod2) => {
-    let mod = viteDevServer.moduleGraph.getModuleById(vmod2.resolvedId);
+  Object.values(virtual).forEach((vmod) => {
+    let mod = viteDevServer.moduleGraph.getModuleById(vmod.resolvedId);
     if (mod) {
       viteDevServer.moduleGraph.invalidateModule(mod);
     }
@@ -2625,7 +2601,7 @@ var reactRouterVitePlugin = () => {
   };
   let pluginIndex = (pluginName) => {
     invariant(viteConfig);
-    return viteConfig.plugins.findIndex((plugin2) => plugin2.name === pluginName);
+    return viteConfig.plugins.findIndex((plugin) => plugin.name === pluginName);
   };
   let getServerEntry = async ({ routeIds }) => {
     invariant(viteConfig, "viteconfig required to generate the server entry");
@@ -3211,9 +3187,9 @@ var reactRouterVitePlugin = () => {
           envFile: false,
           plugins: [
             childCompilerPlugins.filter(
-              (plugin2) => typeof plugin2 === "object" && plugin2 !== null && "name" in plugin2 && plugin2.name !== "react-router" && plugin2.name !== "react-router:route-exports" && plugin2.name !== "react-router:hmr-updates"
-            ).map((plugin2) => ({
-              ...plugin2,
+              (plugin) => typeof plugin === "object" && plugin !== null && "name" in plugin && plugin.name !== "react-router" && plugin.name !== "react-router:route-exports" && plugin.name !== "react-router:hmr-updates"
+            ).map((plugin) => ({
+              ...plugin,
               configureServer: void 0,
               configurePreviewServer: void 0
             }))
@@ -3603,8 +3579,8 @@ var reactRouterVitePlugin = () => {
       name: "react-router:virtual-modules",
       enforce: "pre",
       resolveId(id) {
-        const vmod2 = Object.values(virtual).find((vmod3) => vmod3.id === id);
-        if (vmod2) return vmod2.resolvedId;
+        const vmod = Object.values(virtual).find((vmod2) => vmod2.id === id);
+        if (vmod) return vmod.resolvedId;
       },
       async load(id) {
         switch (id) {
@@ -3715,7 +3691,6 @@ var reactRouterVitePlugin = () => {
         }
       }
     },
-    plugin,
     {
       name: "react-router:route-exports",
       async transform(code, id, options) {
@@ -3752,7 +3727,7 @@ var reactRouterVitePlugin = () => {
         if (!options?.ssr) {
           removeExports(ast, SERVER_ONLY_ROUTE_EXPORTS);
         }
-        transform(ast);
+        decorateComponentExportsWithProps(ast);
         return generate(ast, {
           sourceMaps: true,
           filename: id,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-router/dev",
-  "version": "0.0.0-experimental-f1dd850aa",
+  "version": "0.0.0-experimental-e87ed2fd4",
   "description": "Dev tools and CLI for React Router",
   "homepage": "https://reactrouter.com",
   "bugs": {
@@ -86,7 +86,7 @@
     "set-cookie-parser": "^2.6.0",
     "valibot": "^0.41.0",
     "vite-node": "3.0.0-beta.2",
-    "@react-router/node": "0.0.0-experimental-f1dd850aa"
+    "@react-router/node": "0.0.0-experimental-e87ed2fd4"
   },
   "devDependencies": {
     "@types/babel__core": "^7.20.5",
@@ -110,15 +110,15 @@
     "vite": "^6.1.0",
     "wireit": "0.14.9",
     "wrangler": "^4.2.0",
-    "@react-router/serve": "0.0.0-experimental-f1dd850aa",
-    "react-router": "^0.0.0-experimental-f1dd850aa"
+    "@react-router/serve": "0.0.0-experimental-e87ed2fd4",
+    "react-router": "^0.0.0-experimental-e87ed2fd4"
   },
   "peerDependencies": {
     "typescript": "^5.1.0",
     "vite": "^5.1.0 || ^6.0.0",
     "wrangler": "^3.28.2 || ^4.0.0",
-    "@react-router/serve": "^0.0.0-experimental-f1dd850aa",
-    "react-router": "^0.0.0-experimental-f1dd850aa"
+    "@react-router/serve": "^0.0.0-experimental-e87ed2fd4",
+    "react-router": "^0.0.0-experimental-e87ed2fd4"
   },
   "peerDependenciesMeta": {
     "@react-router/serve": {