Support TS moduleResolution, NodeNext

[bestickley]

Is your feature request related to a problem? Please describe.
I get the following TS error when trying to use @hookform/resolver/zod with TS moduleResolution, NodeNext:

src/pages/UserInfo.tsx:2:29 - error TS7016: Could not find a declaration file for module '@hookform/resolvers/zod'. '/Users/stickb/Code/niwc-pac/cosmos-ui/node_modules/.pnpm/@[email protected][email protected]/node_modules/@hookform/resolvers/zod/dist/zod.mjs' implicitly has an 'any' type.
  Try `npm i --save-dev @types/hookform__resolvers` if it exists or add a new declaration (.d.ts) file containing `declare module '@hookform/resolvers/zod';`

2 import { zodResolver } from "@hookform/resolvers/zod";

Describe the solution you'd like
The following pnpm patch fixes this issue:

diff --git a/package.json b/package.json
index b46f9e11d988e11c89fbaf580e6bbc74502c6e7f..5bb7790760e298507138675b2f780c0cc2ec7e69 100644
--- a/package.json
+++ b/package.json
@@ -15,6 +15,7 @@
       "require": "./dist/resolvers.js"
     },
     "./zod": {
+      "types": "./zod/dist/index.d.ts",
       "umd": "./zod/dist/zod.umd.js",
       "import": "./zod/dist/zod.mjs",
       "require": "./zod/dist/zod.js"

Describe alternatives you've considered
I think alternatively, if zod.d.ts contained the same content as index.d.ts, then this would work automatically without the change to the package.json

Additional context
None

[bestickley]

See TS docs:

The new support works similarly with import conditions. By default, TypeScript overlays the same rules with import conditions - if you write an import from an ES module, it will look up the import field, and from a CommonJS module, it will look at the require field. If it finds them, it will look for a colocated declaration file. If you need to point to a different location for your type declarations, you can add a "types" import condition.

https://www.typescriptlang.org/docs/handbook/esm-node.html#packagejson-exports-imports-and-self-referencing

[Jack-Works]

Note: your patch is actually wrong

The correct patch should be:

diff --git a/package.json b/package.json
index b46f9e11d988e11c89fbaf580e6bbc74502c6e7f..143135bd80304d991581643016799b0a0964c83b 100644
--- a/package.json
+++ b/package.json
@@ -16,8 +16,14 @@
     },
     "./zod": {
       "umd": "./zod/dist/zod.umd.js",
-      "import": "./zod/dist/zod.mjs",
-      "require": "./zod/dist/zod.js"
+      "import": {
+        "types": "./zod/dist/index.d.ts",
+        "default": "./zod/dist/zod.mjs"
+      },
+      "require": {
+        "types": "./zod/dist/index.d.ts",
+        "default": "./zod/dist/zod.js"
+      }
     },
     "./yup": {
       "umd": "./yup/dist/yup.umd.js",
diff --git a/zod/dist/index.d.ts b/zod/dist/index.d.ts
index 18dffb9fef1bf09e83d9ff5e3aec325cf562c780..b55eff2beb1311c50274f7040dd88102e5858faf 100644
--- a/zod/dist/index.d.ts
+++ b/zod/dist/index.d.ts
@@ -1,2 +1,2 @@
-export * from './zod';
-export * from './types';
+export * from './zod.js';
+export * from './types.js';
diff --git a/zod/dist/zod.d.ts b/zod/dist/zod.d.ts
index 839632e3d8495c00933dada6dd9f7a7d4003311a..3ad42563f00f8fb0a6d09c7234b66653b84561fe 100644
--- a/zod/dist/zod.d.ts
+++ b/zod/dist/zod.d.ts
@@ -1,2 +1,2 @@
-import type { Resolver } from './types';
+import type { Resolver } from './types.js';
 export declare const zodResolver: Resolver;

[bestickley]

@Jack-Works, it works for me, but your suggestion looks more robust. Thank you!

[arpadgabor]

This error also shows up with TypeScript 5.0's bundler module resolution.

[jorisre]

Can you provide a repro example that I can clone?

[bestickley]

@jorisre, https://github.com/bestickley/rhf-zod-resolver-node-next-issue
See error in editor within src/App.tsx on line 3 (import { zodResolver } from '@hookform/resolvers/zod';)

[mikecousins]

This error also shows up with TypeScript 5.0's bundler module resolution.

Ran into it this morning when we tried to switch to bundler.

[jorisre]

@jorisre, https://github.com/bestickley/rhf-zod-resolver-node-next-issue See error in editor within src/App.tsx on line 3 (import { zodResolver } from '@hookform/resolvers/zod';)

Thank you! I tried with a NextJs project as well. With(out) moduleResolution: "NodeNext" and it works with the @Jack-Works 's solution.

Now, I've to check the standard in order to open a PR on https://github.com/marvinhagemeister/check-export-map.

If someone have link that document this pattern in package.json?

[jorisre]

I also tried with:

"./zod": {
   "umd": "./zod/dist/zod.umd.js",
   "types": "./zod/dist/index.d.ts",
   "import": "./zod/dist/zod.mjs",
   "require": "./zod/dist/zod.js"
},

This is how Preact is doing. We'll probably do the same thing, so the check-export-map will be ok ✅