Yeti

# Popovers & Tooltips

# Demo

Demo

# Usage

<Tabs activeIndex={1}>
  <TabsNavigation>
    <TabsNavigationItem index={1} className="uppercase">
      Tab One
    </TabsNavigationItem>
    <TabsNavigationItem index={2} className="uppercase">
      Tab Two
    </TabsNavigationItem>
    <TabsNavigationItem index={3} className="uppercase">
      Tab Three
    </TabsNavigationItem>
  </TabsNavigation>
  <TabsContent>
    <TabsContentItem index={1}>
      Lorem ipsum dolor sit amet consectetur adipisicing elit. Commodi veritatis
      officiis, quidem placeat autem nihil voluptatem velit quaerat adipisci
      veniam iste. Quae odio sint dolorum aliquid eos numquam est ducimus! Lorem
      ipsum dolor, sit amet consectetur adipisicing elit. Itaque enim alias odit
      facilis, necessitatibus quam nulla! Sapiente nostrum nulla ut, aspernatur
      nisi unde enim quas ipsam laudantium excepturi vel consequuntur.
    </TabsContentItem>
    <TabsContentItem index={2}>
      Lorem ipsum dolor sit amet consectetur adipisicing elit. Commodi veritatis
      officiis, quidem placeat autem nihil voluptatem velit quaerat adipisci
      veniam iste. Quae odio sint dolorum aliquid eos numquam est ducimus! Lorem
      ipsum dolor, sit amet consectetur adipisicing elit. Itaque enim alias odit
      facilis, necessitatibus quam nulla! Sapiente nostrum nulla ut, aspernatur
      nisi unde enim quas ipsam laudantium excepturi vel consequuntur. Lorem
      ipsum dolor sit amet consectetur adipisicing elit. Commodi veritatis
      officiis, quidem placeat autem nihil voluptatem velit quaerat adipisci
      veniam iste. Quae odio sint dolorum aliquid eos numquam est ducimus! Lorem
      ipsum dolor, sit amet consectetur adipisicing elit. Itaque enim alias odit
      facilis, necessitatibus quam nulla! Sapiente nostrum nulla ut, aspernatur
      nisi unde enim quas ipsam laudantium excepturi vel consequuntur.
    </TabsContentItem>
    <TabsContentItem index={3}>
      Lorem ipsum dolor sit amet consectetur adipisicing elit. Commodi veritatis
      officiis, quidem placeat autem nihil voluptatem velit quaerat adipisci
      veniam iste. Quae odio sint dolorum aliquid eos numquam est ducimus! Lorem
      ipsum dolor, sit amet consectetur adipisicing elit. Itaque enim alias odit
      facilis, necessitatibus quam nulla! Sapiente nostrum nulla ut, aspernatur
      nisi unde enim quas ipsam laudantium excepturi vel consequuntur.
    </TabsContentItem>
  </TabsContent>
</Tabs>

# Props

# Tabs

Property Type Default Required Description
activeIndex number no Index of active tab
onActiveIndexChange function no Callback function when active tab index is changed
className string no Additional classes

# TabsNavigationItem

Property Type Default Required Description
index number no Index of the tab
className string no Additional classes

# TabsContent

Property Type Default Required Description
className string no Additional classes

# TabsContentItem

Property Type Default Required Description
className string no Additional classes

← Toasts →