Tabs

Navegação por abas para alternar entre painéis de conteúdo. Construído sobre Radix UI Tabs.

import { Tabs, TabsList, TabsTrigger, TabsContent } from "@workspace/ui/components/tabs";

<Tabs defaultValue="tab1">
  <TabsList>
    <TabsTrigger value="tab1">Tab 1</TabsTrigger>
    <TabsTrigger value="tab2">Tab 2</TabsTrigger>
  </TabsList>
  <TabsContent value="tab1">Conteúdo 1</TabsContent>
  <TabsContent value="tab2">Conteúdo 2</TabsContent>
</Tabs>

Default

Tabs padrão com conteúdo em painéis.

Dashboard com métricas e gráficos do período.

Com badges

Tabs com contadores de quantidade.

API Reference

Prop	Type	Default	Descrição
`defaultValue`	`string`	—	Tab ativa por padrão (não controlado)
`value`	`string`	—	Tab ativa (controlado)
`onValueChange`	`(value: string) => void`	—	Callback quando a tab muda
`TabsTrigger.value`	`string`	—	Identificador único da tab
`TabsContent.value`	`string`	—	Identificador do painel vinculado a tab