Atoms

Nav Tabs

Navigation tabs with pending state.

FormanceCustom component built for Formance products.

Installation#

npx shadcn@latest add @formance/nav-tabs

Install the following dependencies:

npm install class-variance-authority lucide-react radix-ui

Copy and paste the following code into your project.

Update the import paths to match your project setup.

Usage#

import { NavTabs, NavTab } from '@/components/ui/nav-tabs'

<NavTabs>
  <NavTab variant="active">Ledgers</NavTab>
  <NavTab>Payments</NavTab>
  <NavTab>Wallets</NavTab>
</NavTabs>