react-pure-menu
React wrapper for Pure menus
Last updated 6 years ago by bebraw .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install react-pure-menu 
SYNC missed versions from official npm registry.

build status

react-pure-menu - React wrapper for Pure menus

react-pure-menu provides wrapper for Pure menu elements making it easy to build Pure menus using React.

Usage

var Menu = require('react-pure-menu');
<!-- accepts horizontal={true}, defaults to false (vertical) -->
<!-- accepts scrollable={true}, defaults to false -->
<Menu>
    <Menu.Heading>Menu Heading</Menu.Heading>

    <Menu.List>
        <Menu.Item selected={true}>
            <Menu.Link>Dashboard</Menu.Link>
        </Menu.Item>
        <Menu.Item disabled={true}>
            <Menu.Link>Registers</Menu.Link>
        </Menu.Item>
        <Menu.Item>
            <Menu.Link>Contracts</Menu.Link>
        </Menu.Item>
    </Menu.List>
</Menu>

You can attach attributes to each component as usual. className won't override default Pure class so you can customize that.

To make a horizontal menu scrollable, besides setting the flag you'll need to restrict maximum height like this (based on Pure documentation):

.restricted-menu {
    height: 160px;
    width: 150px;
    border: 1px solid gray;
    border-radius: 4px;
}

Development

  • Linting - npm run lint
  • Testing - npm test - This will lint too.
  • Developing - npm start - This will run a server at localhost:3000 and use Hot Module Reloading.
  • Demo deployment - npm run gh-pages and npm run deploy-gh-pages - Demo will contain README.md by default and comes with simple styling based on Pure.

License

react-pure-menu is available under MIT. See LICENSE for more details.

Current Tags

  • 0.2.1                                ...           latest (6 years ago)

2 Versions

  • 0.2.1                                ...           6 years ago
  • 0.1.0                                ...           6 years ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 0
Dependencies (1)
Dev Dependencies (25)
Dependents (0)
None

Copyright 2014 - 2017 © taobao.org |