Brickslab.Toolsv2.1.1

@brickslab./ui-web

Navigation horizontale pour les barres de header. Affiche une liste de liens avec mise en évidence de l'élément actif basée sur activePath. Conçu pour s'intégrer dans HeaderBar.

Aperçu

navigation standard avec élément actif

different active paths

activePath="/"
activePath="/docs"
sans activePath

Props

PropTypeDéfautRequisDescription
itemsTopNavItem[]Liste des éléments de navigation. Chaque item contient un label et un href.
activePathstringChemin de la page courante. L'item dont le href correspond à activePath est mis en évidence.
Override rapide

Tous les paramètres listés dans cette table sont overrideables via les props. Utilisez ce squelette comme point de départ.

<MyComponent
  items={[]}
  activePath="..."
/>
itemsactivePath

Utilisation

tsx
import { TopNav } from "@brickslab./ui-web";

<TopNav
  items={[
    { label: "Accueil",      href: "/" },
    { label: "Composants",   href: "/components" },
    { label: "Documentation", href: "/docs" },
    { label: "À propos",     href: "/about" },
  ]}
  activePath="/components"
/>