useHover
Custom hook that tracks whether a DOM element is being hovered over.
Custom hook that tracks whether a DOM element is being hovered over.
Usage
import { useHover } from "@tilt-legal/cubitt-components/utilities/hooks";
const buttonRef = useRef<HTMLButtonElement>(null);
const isHovered = useHover(buttonRef);
// Access the isHovered variable to determine if the button is being hovered over.API
Signature
declare function useHover<T extends HTMLElement = HTMLElement>(elementRef: RefObject<T>): boolean;Parameters
| Parameter | Type | Description | Default |
|---|---|---|---|
elementRef | RefObject<T> | The ref object for the DOM element to track. | - |
Return Value
| Value | Type | Description |
|---|---|---|
return | boolean | A boolean value indicating whether the element is being hovered over. |
useEventListener
Attach typed event listeners to window, document, media query lists, or element refs.
useIntersectionObserver
Custom hook that tracks the intersection of a DOM element with its containing element or the viewport using the [`Intersection Observer API`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API).