A tab component based on rsuite nav enhancements
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
docs
src
.babelrc
.eslintrc.js
.gitignore
.prettierrc
LICENSE
README.md
package.json
webpack.config.js

README.md

Responsive Nav

A responsive navigation component based on rsuite navigation enhancements.

features

  • Support for removable tabs.
  • Support for automatic folding options when a row can not show all options.

Installation

npm install @rsuite/responsive-nav --save

Usage

import Nav from "@rsuite/responsive-nav";
const App = () => {
  return (
    <Nav>
      <Nav.Item eventKey="A">Item A</Nav.Item>
      <Nav.Item eventKey="B">Item B</Nav.Item>
      <Nav.Item eventKey="C">Item C</Nav.Item>
      <Nav.Item eventKey="D">Item D</Nav.Item>
      <Nav.Item eventKey="E">Item E</Nav.Item>
    </Nav>
  );
};

ReactDOM.render(<App />, mountNode);

Props

ResponsiveNav extends all the props of Nav and also supports:

Property Type(Default) Description
moreProps object More drop-down menu props
moreText React.Node More text displayed on the drop-down
onItemRemove (eventKey)=>void The callback function when removing options
removable boolean Options can be removed

License

MIT licensed