react-use-tabs v1.0.1

react-use-tabs

A simple React hook and component for managing tabs easily.

Installation

Install the package using npm:

npm install react-use-tabs

Usage

Here's how to use useTabs and Tabs components:

import React from 'react';
import { useTabs, Tabs, Tab } from 'react-use-tabs';

function App() {
  const { currentTab, selectTab } = useTabs('tab1');

  return (
    <div>
      <button onClick={() => selectTab('tab1')}>Tab 1</button>
      <button onClick={() => selectTab('tab2')}>Tab 2</button>

      <Tabs>
        <Tab name="tab1" currentTab={currentTab}>
          <div>Tab 1 Content</div>
        </Tab>
        <Tab name="tab2" currentTab={currentTab}>
          <div>Tab 2 Content</div>
        </Tab>
      </Tabs>
    </div>
  );
}

export default App;

Features

🚀 Easy-to-use useTabs hook 🎨 Simple Tabs and Tab components 📦 Lightweight and flexible