useHover

Overview

A hook that tracks whether the element is being hovered.

pnpm dlx shadcn@latest add https://shadcn-ahooks.vercel.app/r/useHover.json

npx shadcn@latest add https://shadcn-ahooks.vercel.app/r/useHover.json

yarn shadcn@latest add https://shadcn-ahooks.vercel.app/r/useHover.json

bun shadcn@latest add https://shadcn-ahooks.vercel.app/r/useHover.json

A hook that tracks whether the element is being hovered.

const isHovering = useHover(
  target,
  {
   onEnter,
   onLeave,
   onChange
  }
);

Property	Description	Type	Default
target	DOM element or ref	`() => Element` \| `Element` \| `MutableRefObject<Element>`	-
options	More config	`Options`	-

Property	Description	Type	Default
onEnter	Callback to be executed on mouse hover	`() => void`	-
onLeave	Callback to be executed on mouse leave	`() => void`	-
onChange	Callback to be executed on hover change	`(isHovering: boolean) => void`	-

Property	Description	Type
isHovering	Whether the element is being hovered	`boolean`