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

Allow RefObject as target in useEventListener #102

Closed
leroykorterink opened this issue Mar 20, 2023 · 1 comment
Closed

Allow RefObject as target in useEventListener #102

leroykorterink opened this issue Mar 20, 2023 · 1 comment
Assignees
Labels
enhancement New feature or request good first issue Good for newcomers

Comments

@leroykorterink
Copy link
Collaborator

leroykorterink commented Mar 20, 2023

The target in useEventListener should also support RefObjects for ease of use.

export function useEventListener<T extends HTMLAnchorElement, K extends keyof HTMLElementEventMap>(
  target: T | RefObject<T> | undefined,
  type: K,
  listener: (this: HTMLAnchorElement, event: HTMLElementEventMap[K]) => void,
  options?: boolean | AddEventListenerOptions,
): void; {
  const _target = target !== undefined && 'current' in target ? target.current : target;

  useEffect(() => {
    _target?.addEventListener(type, listener, options);
    return () => {
      _target?.removeEventListener(type, listener, options);
    };
  }, [_target, type, listener, options]);
}
@leroykorterink leroykorterink added enhancement New feature or request good first issue Good for newcomers labels Mar 20, 2023
@leroykorterink
Copy link
Collaborator Author

Please check the RefObjectOption<T> in #115, that type and the utility can be used for this change.

leroykorterink added a commit that referenced this issue Mar 31, 2023
- Remove useEventListener function overloads
- Remove useDocument hook
- Remove useWindow hook
- Add useDocument hook
- Add useWindow hook
- Add RefObjectOption to useEventListener for ref support

#101 #102
@leroykorterink leroykorterink self-assigned this Mar 31, 2023
leroykorterink added a commit that referenced this issue Apr 4, 2023
leroykorterink added a commit that referenced this issue Apr 4, 2023
* Update event listener hooks

- Remove useEventListener function overloads
- Remove useDocument hook
- Remove useWindow hook
- Add useDocument hook
- Add useWindow hook
- Add RefObjectOption to useEventListener for ref support

#101 #102

* Remove invalid parameters in docs

* Create isRefObject function

See: #118 (comment)

* Rename getRefObjectOption to unref

* Remove unnecessary useDocument and useWindow hooks

* Update src/utils/unref/unref.mdx

Co-authored-by: Arjan van Wijk <[email protected]>

---------

Co-authored-by: Arjan van Wijk <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request good first issue Good for newcomers
Projects
None yet
Development

No branches or pull requests

1 participant