use-gesture icon indicating copy to clipboard operation
use-gesture copied to clipboard

Typings break in TypeScript with moduleResolution: NodeNext

Open a-type opened this issue 3 years ago • 0 comments

Describe the bug When using the library in a TypeScript project that is using ESM (NodeNext) module resolution, typings for top-level hooks are available but their parameter types are broken and uninferrable.

I notice when using Go to Definition in my editor that I can only get as far as @use-gesture/react/dist/declarations/src/useDrag.d.ts. My editor's TypeScript cannot seem to bridge the gap to the imported @use-gesture/core/types. Not exactly sure what's going on from there, looks like that directory itself is a module? I noticed it only includes one .d.ts file which is cjs, seems suspicious. The file pointed to by the module specifier in the package is actually empty for me.

It's possible this is also pnpm related, although I imagine I'm not the first person to use pnpm here.

Sandbox or Video Reproduction repo:

https://github.com/a-type/esm-repros/tree/use-gesture

Install dependencies with pnpm install, open in an editor, observe that TS cannot infer the state parameter of useDrag in App.tsx.

Information:

  • Use Gesture version: 10.2.20
  • Device: N/A
  • OS: Windows 11
  • Browser N/A

Checklist:

  • [x] I've read the documentation.
  • [x] If this is an issue with drag, I've tried setting touch-action: none to the draggable element.

a-type avatar Sep 15 '22 21:09 a-type