react-event-as-prop
React Higher-Order Components to get event like hover, focus, active as props
Installation
$ npm install react-event-as-prop
Usage
Simple usage
const Button = { return <button // really important, it's to pass onMouseEnter & onMouseLeave // generated by the HoCs ...props style= ...stylesmain ...hovered && styleshovered > "Submit" </button> } const styles = main: fontWeight: "100" hovered: fontWeight: "bold" // ⚠️ Here is the trick
Advanced Usage
You can just pipe all HoCs !
const Button = { return <button // really important, it's to pass on{Event}* generated by the HoCs ...props style= ...stylesmain ...hovered && styleshovered ...touched && stylestouched ...focused && stylesfocused > "Submit" </button> } const styles = main: fontWeight: "100" hovered: fontWeight: "bold" touched: opacity: 06 focused: outline: "1px solid red" // ⚠️ Here is the trick
Imports
You can import all from the main package
Or you can import just one
CONTRIBUTING
- ⇄ Pull/Merge requests and ★ Stars are always welcome.
- For bugs and feature requests, please create an issue.
- Pull/Merge requests must be accompanied by passing automated tests (
$ npm test
).