Brickslab.

@brickslab/ui-web

En-tête de section avec titre, sous-titre et eyebrow optionnels. Utilisé en début de sections de page pour introduire du contenu. Supporte 3 alignements et l'eyebrow pour les catégories ou numéros de section.

Aperçu

avec eyebrow + subtitle — align: left

Composants

Mise en page & Structure

Des blocs prêts à l'emploi pour organiser vos interfaces en sections cohérentes.

sans eyebrow — align: center

Build faster. Ship smarter.

BricksLab vous fournit les briques pour construire des interfaces modernes et performantes.

align variants

align="left"
Section

Titre de section

align="center"
Section

Titre de section

align="right"
Section

Titre de section

titre seul (minimal)

Documentation API

Props

PropTypeDéfautRequisDescription
titlestringTitre principal de la section.
subtitlestringSous-titre optionnel affiché sous le titre principal.
align"left" | "center" | "right""left"Alignement horizontal du contenu du header.
eyebrowstringTexte court affiché au-dessus du titre (ex. : catégorie, tag, numéro de section). Souvent en couleur brand ou en petites majuscules.

Utilisation

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

// Avec eyebrow
<SectionHeader
  eyebrow="Nouveautés"
  title="Composants de mise en page"
  subtitle="Structures flexibles pour organiser vos pages."
/>

// Centré — typique des sections hero
<SectionHeader
  title="Build faster. Ship smarter."
  subtitle="BricksLab vous fournit les briques pour construire des interfaces modernes."
  align="center"
/>

// Minimal — titre seul
<SectionHeader title="Documentation" />