useHover
Observes mouse hover state on target DOM elements using either automatic ref tuples or external refs.
1.8 KB
•Updated on September 3, 2026
Example 2: External Ref Passing
Installation
Bash
pnpm dlx shadcn@latest add @spaceui/hooks-dom-use-hoverUsage
Code
import { useHover } from '@/hooks/use-hover'
// Pattern 1: Automatic Ref Tuple
const [ref, isHovered] = useHover<HTMLDivElement>()
// Pattern 2: External Ref Passing
const buttonRef = useRef<HTMLButtonElement>(null)
const isHovered = useHover(buttonRef)API Reference
Parameters / Props
| Parameter | Type | Default | Description |
|---|---|---|---|
elementRef | RefObject<HTMLElement|null> | - | Optional external React ref to watch. |
Return Value
| Return Type | Description |
|---|---|
[RefObject<T>, boolean] & { ref, isHovered } | Returned when called with no arguments (useHover()). |
boolean | Returned when passed an external ref (useHover(ref)). |