Tabs

This is the <Tabs /> component

---

Examples

tab 1tab 2tab 3

Tab content 1

Content 2

Content 3

<Tabs
  onTabChange={(i) => {
    console.log('Current Tab', i)
  }}
>
  <Tab
    label="tab 1"
    onClick={(i) => {
      console.log('Action on single tab click', i)
    }}
  >
    Tab content 1
  </Tab>
  <Tab label="tab 2">Content 2</Tab>
  <Tab label="tab 3">Content 3</Tab>
</Tabs>

---

Basic Usage

import Tabs, { Tab } from '@candy/kitkat/snackbar'

export const MyComponent = () => (
  <Tabs>
    <Tab label="Tab label 1">Tab 1 content here</Tab>
    <Tab label="Tab label 2">Tab 2 content here</Tab>
  </Tabs>
)

---

Tabs Props

Name	Type	Default	Description
children	ReactElement | ReactElement[]		Content for inside of tab panels
direction?	column | row	row	Horizontal or Vertical Tabs,
onTabChange?	(i: number) => void	--

Tab Props

Name	Type	Default	Description
label	string | ReactNode		Label for Tab Panel
onTabChange?	(i: number) => void	--	Action when single tab is clicked