Brickslab.

@brickslab/ui-web

Hero pleine-largeur pour les pages de navigation. Remplace SectionHeader avec un mesh gradient, un dot grid, un eyebrow pill et une stats row.

Aperçu

Exemple

Page Hero

Un hero moderne pour les pages principales. Dot grid, gradient mesh, stats row intégrés.

47Composants
100%TypeScript
v1.0Version

Avec children

Documentation

Résultats des Tests

Audit qualité 7 axes par composant.

92%Score moyen
47Composants

Code

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

<PageHero
  eyebrow="Catalogue Complet"
  title="47 composants"
  subtitle="Tous les composants React documentés et testés."
  stats={[
    { value: 47, label: "Web" },
    { value: "13", label: "Catégories" },
  ]}
/>

Props

PropTypeDéfautRequisDescription
titlestringTitre principal (h1).
subtitlestringSous-titre affiché sous le titre.
eyebrowstringBadge pill au-dessus du titre (ex: 'Catalogue Complet').
statsPageHeroStat[]Ligne de statistiques sous le titre. Chaque stat a value, label et une color optionnelle.
childrenReact.ReactNodeSlot pour contenu additionnel (boutons, badges…).