feat(react-router-dom): support future options (#45)

src/client/index.tsx

@@ -28,9 +28,15 @@ export function ViteReactSSG(
   const isClient = typeof window !== 'undefined'
 
   const BASE_URL = routerOptions.basename ?? '/'
+  const { v7_startTransition, ...routerFeature } = routerOptions.future ?? {}
 
   async function createRoot(client = false, routePath?: string) {
-    const browserRouter = client ? createBrowserRouter(convertRoutesToDataRoutes(routerOptions.routes, transformStaticLoaderRoute), { basename: BASE_URL }) : undefined
+    const browserRouter = client
+      ? createBrowserRouter(
+        convertRoutesToDataRoutes(routerOptions.routes, transformStaticLoaderRoute),
+        { basename: BASE_URL, future: routerFeature },
+      )
+      : undefined
 
     const appRenderCallbacks: Function[] = []
     const onSSRAppRendered = client
@@ -106,7 +112,7 @@ export function ViteReactSSG(
       const { router } = await createRoot(true)
       const app = (
         <HelmetProvider>
-          <RouterProvider router={router!} />
+          <RouterProvider router={router!} future={{ v7_startTransition }} />
         </HelmetProvider>
       )
       const isSSR = document.querySelector('[data-server-rendered=true]') !== null

src/node/router-adapter/remix.tsx

@@ -20,7 +20,7 @@ export class RemixAdapter implements IRouterAdapter<ViteReactSSGContext> {
   }
 
   async render(path: string) {
-    const { base, routes, getStyleCollector } = this.context
+    const { base, routes, getStyleCollector, routerOptions } = this.context
     const fetchUrl = `${withTrailingSlash(base)}${removeLeadingSlash(path)}`
     const request = createRequest(fetchUrl)
     const styleCollector = getStyleCollector ? await getStyleCollector() : null
@@ -34,7 +34,7 @@ export class RemixAdapter implements IRouterAdapter<ViteReactSSGContext> {
       throw _context
 
     routerContext = _context
-    const router = createStaticRouter(dataRoutes, routerContext)
+    const router = createStaticRouter(dataRoutes, routerContext, { future: routerOptions.future })
     let app = (
       <HelmetProvider context={helmetContext}>
         <StaticRouterProvider router={router} context={routerContext} />

src/types.ts

@@ -1,5 +1,5 @@
 import type { ReactElement, ReactNode } from 'react'
-import type { IndexRouteObject, NonIndexRouteObject, createBrowserRouter } from 'react-router-dom'
+import type { FutureConfig as CompFutureConfig, IndexRouteObject, NonIndexRouteObject, createBrowserRouter } from 'react-router-dom'
 import type { Options as BeastiesOptions } from 'beasties'
 
 type Router = ReturnType<typeof createBrowserRouter>
@@ -198,10 +198,18 @@ export type IndexRouteRecord = IndexRouteObject & CommonRouteOptions
 
 export type RouteRecord = NonIndexRouteRecord | IndexRouteRecord
 
+export interface RouterFutureConfig {
+  v7_fetcherPersist?: boolean
+  v7_normalizeFormMethod?: boolean
+  v7_partialHydration?: boolean
+  v7_relativeSplatPath?: boolean
+  v7_skipActionErrorRevalidation?: boolean
+}
+
 export interface RouterOptions {
   routes: RouteRecord[]
-  createFetchRequest?: <T>(req: T) => Request
   basename?: string
+  future?: Partial<RouterFutureConfig & CompFutureConfig>
 }
 
 export interface StyleCollector {