A state container which provides an interface for listening to hover events on child components. The state of this component will only update if the device being used supports hover according to `!(window.matchMedia('(hover: none)').matches)`
npm install @render-props/hover!(window.matchMedia('(hover: none)').matches)yarn add @render-props/hover` or `npm i @render-props/hover`Usage
`js
import Hover from '@render-props/hover'const HoverableButton = props => (
{
({isHovering, canHover, hoverRef}) => (
)
}
)
`____
Props
- enterDelay {number}
- the amount of time to wait before declaring that an element is being hovered
- leaveDelay {number}
- the amount of time to wait before declaring that an element is no longer
being hovered
- initialValue {bool}
- the initial isHovering value to initiate the component withRender Props
#### Ref
-
hoverRef
- This ref must be provided to whatever element you are trying to observe the
the hover of. e.g.