Installation
Usage
import { PillNav } from "@/components/pioneerui/pill-nav"
export default function Nav() {
return (
<PillNav
items={[
{ value: "home", label: "Home" },
{ value: "explore", label: "Explore" },
{ value: "notifications", label: "Alerts", badge: 3 },
]}
defaultValue="home"
onChange={(value) => console.log(value)}
/>
)
}Props
| Prop | Type | Default | Description |
|---|---|---|---|
items | PillNavItem[] | — | Navigation items (required) |
defaultValue | string | first item | Initially active item |
onChange | (value: string) => void | undefined | Change callback |
size | sm | md | lg | md | Nav size |