@ausbom/tabs

Navigational tabs can be used to anchor users to a point on a page or to switch between pages within a section.

Usage no npm install needed!

<script type="module">
  import ausbomTabs from 'https://cdn.skypack.dev/@ausbom/tabs';
</script>

README

@ausbom/tabs

Navigational tabs can be used to anchor users to a point on a page or to switch between pages within a section.

Installation

npm install @ausbom/tabs

Usage

import { Tab, TabList, TabPanel } from '@ausbom/tabs'
import React from 'react'

<TabList equalWidthOnMobile>
  <Tab
    label="Today"
    tabId="today"
    active
  />
  <Tab
    label="7 Day"
    tabId="7-day"
  />
  <Tab
    label="Outlook"
    tabId="outlook"
  />
  <Tab
    label="Past"
    tabId="past"
  />
</TabList>
<TabPanel
  label="Today"
  tabId="today"
  active
>
  <p>Today will be Mostly Sunny</p>
</TabPanel>