SectionCard

StableRSC-safe

Carte de section avec titre + badge + slot contenu + footer optionnel. Trois surfaces : default / raised / kpi. Tokens Aurora sémantiques, a11y section+aria-labelledby.

import { SectionCard } from "@lyra/tokens/components";

Playground

CELI

TFSA

42 500 $

68 %OK

Budget alimentation

Juin 2026

88 %Proche limite

Dépensé880 $

Enveloppe1 000 $

Patrimoine net

847 230 $

+12 340 $ ce mois

Démo interactive — réglages du playground (props ajustables en direct) à venir.

<SectionCard
  title="CELI"
  badge="TFSA"
  surface="default"
  footer="Mis à jour le 2026-06-11"
>
  {/* contenu */}
</SectionCard>

Documentation

surface=default
Défaut
Contenu
surface=raised
Raised
Contenu
surface=kpi
KPI
Contenu

title, surface, badge, elevated, footer, children

<SectionCard
  title="CELI"
  badge="TFSA"
  surface="default"
  footer="Mis à jour le 2026-06-11"
>
  {/* contenu */}
</SectionCard>