"use client"
 
import { useHover } from "@/hooks/use-hover"
 
export function Component() {
  const [hoverRef, hovering] = useHover()
 
  return (
    <div
      ref={hoverRef}
      style={{
        width: 200,
        height: 200,
        backgroundColor: hovering ? "lightblue" : "white",
      }}
    >
      {hovering ? "Hovering!" : "Hover over me"}
    </div>
  )
}