opt-in type inference for single-fetch

.changeset/young-eagles-grab.md

@@ -0,0 +1,15 @@
+---
+"@remix-run/react": patch
+---
+
+Opt-in types for single-fetch
+
+In your `tsconfig.json`:
+
+```json
+{
+  "include": [
+    "./node_modules/@remix-run/react/future/single-fetch.d.ts"
+  ]
+}
+```

packages/remix-react/future/single-fetch.d.ts

@@ -0,0 +1,51 @@
+import type { AppLoadContext } from "@remix-run/server-runtime";
+
+type Serializable =
+  | undefined
+  | null
+  | boolean
+  | string
+  | symbol
+  | number
+  | Array<Serializable>
+  | { [key: PropertyKey]: Serializable }
+  | bigint
+  | Date
+  | URL
+  | RegExp
+  | Error
+  | Map<Serializable, Serializable>
+  | Set<Serializable>
+  | Promise<Serializable>;
+
+type Params<Key extends string = string> = {
+  readonly [key in Key]: string | undefined;
+};
+
+type ResponseStub = {
+  status?: number;
+  headers: Headers;
+};
+
+type DataFunction = (
+  args: {
+    request: Request;
+    params: Params;
+    context: AppLoadContext;
+    response: ResponseStub;
+  },
+  handlerCtx?: unknown
+) => Serializable;
+
+type Loader = DataFunction & { hydrate?: boolean };
+type Action = DataFunction;
+
+declare module "@remix-run/react" {
+  export function useLoaderData<T>(): T extends Loader
+    ? Awaited<ReturnType<T>>
+    : never;
+
+  export function useActionData<T>(): T extends Action
+    ? Awaited<ReturnType<T>>
+    : never;
+}

packages/remix-react/rollup.config.js

@@ -51,6 +51,7 @@ module.exports = function rollup() {
           { src: "LICENSE.md", dest: [outputDir, sourceDir] },
           { src: `${sourceDir}/package.json`, dest: outputDir },
           { src: `${sourceDir}/README.md`, dest: outputDir },
+          { src: `${sourceDir}/future`, dest: outputDir },
         ],
       }),
       copyToPlaygrounds(),