UNPKG

react-tab-view

Version:
78 lines (58 loc) 1.43 kB
# react-tab-view [![npm version](https://badge.fury.io/js/react-tab-view.svg)](https://badge.fury.io/js/react-tab-view) ![](https://raw.githubusercontent.com/StevenIseki/react-tab-view/master/example/screenshot.gif) react-tab-view is a simple tabs component using react.js. ## Install `yarn add react-tab-view` ## Usage ```jsx import { Tabs, Tab } from 'react-tab-view' import ReactDOM from 'react-dom' import React, { Component } from 'react' class TestComponent extends Component { handleChange(e) { this.setState({ value: e }) console.log(e) } render() { const headers = ['Heading 1', 'Heading 2', 'Heading 3'] return ( <div> <Tabs headers={headers}> <Tab> <div> <p>This is the first tab</p> <p>with some content</p> </div> </Tab> <Tab> <p>This is the second tab</p> </Tab> <Tab> <p>This is the third tab</p> </Tab> </Tabs> </div> ) } } ReactDOM.render(<TestComponent />, document.getElementById('root')) ``` ## Styles Uses styled-components 💅 for the base styling. ## Development yarn yarn dev ## Test yarn test ## Build yarn yarn build ## Publish npm login npm version patch git add -A git push origin master npm publish ## License [MIT](http://isekivacenz.mit-license.org/)