Les propriétés du composant
Liste des épreuves à afficher dans le carrousel
Callback appelé lors du clic sur une carte
Carrousel interactif avec navigation et gestion tactile
// Utilisation basique avec liste d'épreuves
<CarousselEpreuve
epreuves={epreuvesData}
onCardClickAction={(id) => setSelectedEpreuve(id)}
/>
// Avec gestion d'état et modal
const [selectedEpreuve, setSelectedEpreuve] = useState<number | null>(null);
<CarousselEpreuve
epreuves={filteredEpreuves}
onCardClickAction={(epreuveId) => {
setSelectedEpreuve(epreuveId);
setModalOpen(true);
}}
/>
// Carrousel vide (affichage conditionnel)
<CarousselEpreuve
epreuves={[]}
onCardClickAction={handleEpreuveSelection}
/>
Composant CarousselEpreuve pour l'affichage en carrousel des épreuves olympiques. Voir la documentation du module ci-dessus pour les détails complets.
Le composant crée un carrousel interactif qui s'adapte automatiquement à la taille d'écran et offre plusieurs modes de navigation. Il calcule dynamiquement le nombre de cartes visibles et gère les transitions fluides entre les slides.