react-tabs-css

Demo

https://react-tabs-css.netlify.app/

Install

npm install --save react-tabs-css

Usage

import React, { Component } from 'react'

import { Tab, Tabs } from "react-tabs-css";

class Example extends Component {
  render () {
    return (
      <Tabs >
        <Tab index={0} title="Tab 1" group="group-1">
          <h1>Tab 1</h1>
          <input type="text" placeholder="tab 1"/>
        </Tab>

        <Tab index={1} title="Tab 2" 
        active
        group="group-1"
        >
          <h2>Tab 2</h2>
          <p>orem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,</p>
         
        </Tab>
      </Tabs>
    )
  }
}

Props

Tabs props :

• style : Object (exmple : style={{backgroundColor : "red"}})

Tab props :

• index* : (required and unique) Number(exmple : index={0})
• style : Object (exmple : style={{backgroundColor : "red"}})
• group* : String (exmple : group="group-1") all the tab inside the tabs should have the same group
• title : String (exmple : title="Hello world")
• active : boolean (example : ```active={true})

License

MIT © yagoubi abdelkader