Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG] useEventListener usage example produces TypeScript error #682

Open
mayatron opened this issue Mar 18, 2025 · 1 comment
Open

[BUG] useEventListener usage example produces TypeScript error #682

mayatron opened this issue Mar 18, 2025 · 1 comment
Labels
bug Something isn't working

Comments

@mayatron
Copy link

Describe the bug

The example usage for useEventListener produces a TypeScript error on the following line:

// example with element based event
useEventListener("click", onClick, buttonRef);
src/app/Usage.tsx:32:38 - error TS2769: No overload matches this call.
  The last overload gave the following error.
    Argument of type 'RefObject<HTMLButtonElement | null>' is not assignable to parameter of type 'RefObject<Document>'.
      Type 'HTMLButtonElement | null' is not assignable to type 'Document'.
        Type 'null' is not assignable to type 'Document'.

32   useEventListener("click", onClick, buttonRef);
                                        ~~~~~~~~~

  node_modules/usehooks-ts/dist/index.d.ts:335:18
    335 declare function useEventListener<K extends keyof DocumentEventMap>(eventName: K, handler: (event: DocumentEventMap[K]) => void, element: RefObject<Document>, options?: boolean | AddEventListenerOptions): void;
                         ~~~~~~~~~~~~~~~~
    The last overload is declared here.

To Reproduce

  1. npx create-next-app@latest test-hooks --yes
  2. copy/paste usage example into new component src/app/Usage.tsx
  3. tsc --noEmit

Expected behavior

I expect the usage example to be free of TypeScript errors.

Additional context

No response

@mayatron mayatron added the bug Something isn't working label Mar 18, 2025
@codehz
Copy link

codehz commented Mar 27, 2025

the problem is React 19 changed RefObject to RefObject<T | null>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants