material-ui-responsive-menu

Material-UI responsive Menu is a React-Redux component that uses Material-UI to create a responsive IconMenu

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
material-ui-responsive-menu
831.19.37 years ago7 years agoMinified + gzip package size for material-ui-responsive-menu in KB

Readme

Material-UI responsive Menu
!Build Statustravis-imagetravis-url !Dependency Statusdaviddm-imagedaviddm-url !Licenselicense-imagelicense-url !Code Coveragecoverage-imagecoverage-url !Code Stylecode-style-imagecode-style-url

Table of Contents

Description

Material-UI responsive Menu is a React-Redux component that uses Material-UI to create a responsive IconMenu. It shows MenuIcons if there is enough place for theme. If the width of the container element shrinks the MenuIcons move to a IconMenu list.
You can try it out the DEMO.

Installation

This project can be istalled as npm module using following command:
npm i -S material-ui-responsive-menu

Usage

To use it just import the component and set as property a list of menu items:
import {ResponsiveMenu} from 'material-ui-responsive-menu'

const menuList=[
  {
    text: 'test1',
    icon: undefined,
    tooltip: 'test1',
    icon: <ActionHome/>,
    onTouchTap: ()=>{console.log('test1')}
  },
  {
    text: 'test2',
    icon: <ActionHome/>,
    tooltip:'test2',
    onTouchTap: ()=>{console.log('test2')}
  },
  {
    text: 'test3',
    icon: <ActionHome/>,
    tooltip:'test2',
    onTouchTap: ()=>{console.log('test2')}
  }
]

...

//then in your component
<ResponsiveMenu menuList={menuList}/>

...

Thats it :)
An complete example can be found in the App.js of the demo part of this project.

Contributing

Every help no mather if it is a kritik, suggestion or pull request is welkome :)