react-awesome-menus

Animated Menu ShapeOverlays

Checkout the demo

Acknowledgments

Based in the awesome work https://tympanus.net/Development/ShapeOverlays/index3.html

Install

yarn add react-awesome-menu react-dom

Usage

import withMenu from 'react-awesome-menu'
const MENU_ITEMS = [
  {
    id: 0,
    label: 'Home',
    // Props received by the HOC are forwarded here
    action: (props) => console.log('Any routing trigger you use'),
  },
  {
    id: 2,
    label: 'News',
    action: (props) => console.log('Any routing trigger you use'),
  },
  {
    id: 3,
    label: 'About',
    action: (props) => console.log('Any routing trigger you use'),
  },
  {
    id: 4,
    label: 'Contact',
    action: (props) => console.log('Any routing trigger you use'),
  },
]

// The HOC will also provide a `toggleMenu` to its child, so you can
// Manipulate the visibility as you wish
const App = withMenu({ items: MENU_ITEMS })(({ toggleMenu }) => (
  <div>
    <p>Hi there</p>
  </div>
))

Contributors

Thanks goes to these wonderful people (emoji key):

Ronaldo Lima 💻	Gabriel Rubens 💻

This project follows the all-contributors specification. Contributions of any kind welcome!