react-withhover v0.1.1

react-withhover

Install

yarn add react-withhover # or npm install react-withhover

Usage

high order component

import React, {Component} from 'react'
import {withHover} from 'react-withhover'

class Example extends Component {
  render(){
    return (
      <div>
        {this.props.isHovered ? 'hovered': 'not hovered'}
      </div>
    )
  }
}

export default withHover(Example)

component

import React, {Component} from 'react'
import {Hover} from 'react-withhover'

class Example extends Component {
  render() {
    return (
      <Hover>
        {(props) => {
          return (
            <div>
              {this.props.isHovered ? 'hovered': 'not hovered'}
            </div>
          )
        }}
      </Hover>
    )
  }
}

export default Example

props

• tagName the wrapper tagName, default 'dev'
• className only work when children is string or array
• style only work when children is string or array

• onStateChange the hover state, example:

    onStateChange = (state) => {console.log(state.isHovered)}

License

MIT