TabBar

Visão Geral

Navegação horizontal em abas com contadores opcionais.

Localização

frontend-react/src/components/ui/TabBar.tsx

Uso

import { TabBar } from './components/ui';

const tabs = [
  { id: 'all', label: 'Todos', count: 42 },
  { id: 'pending', label: 'Pendentes', count: 5 },
  { id: 'completed', label: 'Concluídos', count: 37 },
];

<TabBar
  tabs={tabs}
  activeTab={active}
  onChange={setActive}
/>

Props

Prop	Tipo	Descrição
tabs	Array<{ id, label, count? }>	Lista de abas
activeTab	string	Aba ativa
onChange	(id: string) => void	Callback de mudança

Layout

[ Todos (42) ] [ Pendentes (5) ] [ Concluídos (37) ]