feat: improve useEventListener

React already handles the change inside refs, therefore there is no need
to unwrap it on each render.

src/useEventListener/__tests__/dom.ts

@@ -38,8 +38,9 @@ describe('useEventListener', () => {
     const addSpy = jest.spyOn(div, 'addEventListener');
     const removeSpy = jest.spyOn(div, 'removeEventListener');
 
+    const ref = { current: div };
     const { rerender, unmount } = renderHook(() =>
-      useEventListener({ current: div }, 'resize', () => {}, { passive: true })
+      useEventListener(ref, 'resize', () => {}, { passive: true })
     );
 
     expect(addSpy).toHaveBeenCalledTimes(1);

src/useEventListener/useEventListener.ts

@@ -1,6 +1,5 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { MutableRefObject, RefObject, useEffect, useMemo } from 'react';
-import { hasOwnProperty } from '../util/misc';
 import { useSyncedRef, useIsMounted } from '..';
 
 type ITargetOrTargetRef<T extends EventTarget> = T | null | RefObject<T> | MutableRefObject<T>;
@@ -19,11 +18,6 @@ export function useEventListener<T extends EventTarget>(
     | Parameters<T['addEventListener']>
     | [string, EventListenerOrEventListenerObject | ((...args: any[]) => any), ...any]
 ): void {
-  // extract current target from ref object
-  const tgt: T =
-    target && hasOwnProperty(target, 'current')
-      ? (target as MutableRefObject<T>).current
-      : (target as T);
   const isMounted = useIsMounted();
 
   // create static event listener
@@ -53,6 +47,7 @@ export function useEventListener<T extends EventTarget>(
   );
 
   useEffect(() => {
+    const tgt = target && 'current' in target ? target.current : target;
     if (!tgt) return undefined;
 
     const restParams = params.slice(2);
@@ -61,5 +56,5 @@ export function useEventListener<T extends EventTarget>(
 
     return () => tgt.removeEventListener(params[0], eventListener, ...restParams);
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [tgt, params[0]]);
+  }, [target, params[0]]);
 }