react-with-theme
React component theme high order component helper
Usage
First create an object to represent your theme properties:
const themes = lutalica: primaryColor: 'white' secondaryColor: 'black' klexos: primaryColor: 'blue' secondaryColor: 'green' default: primaryColor: 'transparent' secondaryColor: 'transparent'
Let's build an example react component:
const Header = <h1 style=style>Header</h1>
And decorate:
const themeStyle = style: color: themeprimaryColor const Decorated = Header
Now when you use <Decorated theme={'lutalica'} />
it will render <h1 style="color:'white'">Header</h1>
You can declare a default theme as fallback in case you don't inform a theme or misspell.
Contributing
First of all, thank you for wanting to help!
- Fork it.
- Create a feature branch -
git checkout -b more_magic
- Add tests and make your changes
- Check if tests are ok -
npm test
- Commit changes -
git commit -am "Added more magic"
- Push to Github -
git push origin more_magic
- Send a pull request! ❤️ 💖 ❤️