Components

Tabs

Switch between related views.

Health, traffic, and recent deployments.

Usage

With @flagon-io/ui installed (see Installation), import it directly.

import { Tabs, TabsList, TabsTrigger, TabsContent } from "@flagon-io/ui";

<Tabs defaultValue="overview">
  <TabsList>
    <TabsTrigger value="overview">Overview</TabsTrigger>
    <TabsTrigger value="logs">Logs</TabsTrigger>
  </TabsList>
  <TabsContent value="overview">...</TabsContent>
  <TabsContent value="logs">...</TabsContent>
</Tabs>

Prefer to own the code?

You don’t have to install the package - you can copy this component into your project with the shadcn CLI and edit it freely.

npx shadcn@latest add https://ui.flagon.io/r/tabs.json