A tiny higher order component to track mouse state.
Example
;; @@ { // props will include the in and out handlers let isOver isPressed className ...props = thisprops; if isOver className += ' hovered'; // mouse is over component if isPressed className += ' active'; // mouse has been held down for 300ms or was just released return <div ...props className=className> </div> };
API
As a decorator
@Component /* your code */
As a function
Component /* your code */ optionsTest;
Options
inDelay
defaults to 0
Time in ms
to wait before setting the active
status to true
.
outDelay
defaults to 0
Time in ms
to wait before setting the active
status to false
.
inHandler
defaults to 'onMouseEnter'
Property name to expose the inHandler
as.
outHandler
defaults to 'onMouseLeave'
Property name to expose the outHandler
as.
openFunction
no default
Property name to expose the force open function as. This function will ignore the in delay
closeFunction
no default
Property name to expose the force close function as. This function will ignore the out delay.
key
defaults to 'isOver'
Property name to expose the active
status as.