🚀 Release 2.0.0 (#47)

Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

CHANGELOG.md

@@ -1,5 +1,13 @@
 # Changelog
 
+## 2.0.0
+
+- Bump dependencies
+
+**BREAKING:**
+
+- Replace `useWindowEvent` with [`useEventListener.ts`](./docs/hooks/use-event-listener.md)
+
 ## 1.6.0
 
 - Support React 18

README.md

@@ -34,11 +34,11 @@ const Component = () => {
 - [`useDots.ts`](./docs/hooks/use-dots.md)
 - [`useDownload.ts`](./docs/hooks/use-download.md)
 - [`useEmitEvent.ts`](./docs/hooks/use-emit-event.md)
+- [`useEventListener.ts`](./docs/hooks/use-event-listener.md)
 - [`useMounted.ts`](./docs/hooks/use-mounted.md)
 - [`useNetworkStatus.ts`](./docs/hooks/use-network-status.md)
 - [`usePortal.ts`](./docs/hooks/use-portal.md)
 - [`useSearch.ts`](./docs/hooks/use-search.md)
 - [`useSound.ts`](./docs/hooks/use-sound.md)
 - [`useTabFocus.ts`](./docs/hooks/use-tab-focus.md)
 - [`useViewport.ts`](./docs/hooks/use-viewport.md)
-- [`useWindowEvent.ts`](./docs/hooks/use-window-event.md)

docs/README.md

@@ -5,11 +5,11 @@
 - [`useDots.ts`](./hooks/use-dots.md)
 - [`useDownload.ts`](./hooks/use-download.md)
 - [`useEmitEvent.ts`](./hooks/use-emit-event.md)
+- [`useEventListener.ts`](./hooks/use-event-listener.md)
 - [`useMounted.ts`](./hooks/use-mounted.md)
 - [`useNetworkStatus.ts`](./hooks/use-network-status.md)
 - [`usePortal.ts`](./hooks/use-portal.md)
 - [`useSearch.ts`](./hooks/use-search.md)
 - [`useSound.ts`](./hooks/use-sound.md)
 - [`useTabFocus.ts`](./hooks/use-tab-focus.md)
 - [`useViewport.ts`](./hooks/use-viewport.md)
-- [`useWindowEvent.ts`](./hooks/use-window-event.md)

docs/hooks/use-event-listener.md

@@ -0,0 +1,36 @@
+# useEventListener
+
+Listen for an event and automatically clean up the effect on un-mount
+
+## Example
+
+```tsx
+import * as React from "react";
+import { useEventListener } from "@casper124578/useful/hooks/useEventListener";
+
+const Component = () => {
+  const buttonRef = React.useRef<HTMLButtonElement>(null);
+
+  const myWindowHandler = (event) => {
+    console.log(event);
+  };
+
+  // listen anywhere on the `window`
+  useEventListener({ eventName: "click", handler: myWindowHandler });
+
+  const myButtonHandler = (event) => {
+    console.log("Button handler", event);
+  };
+
+  // listen on the `button`
+  useEventListener({ elementRef: buttonRef, eventName: "click", handler: myButtonHandler });
+
+  return (
+    <div>
+      <p>Hello world!</p>
+
+      <button ref={buttonRef}>Click me!</button>
+    </div>
+  );
+};
+```