Composant · Structure

MediaContent

Documenté

MediaContent encapsule un média (image ou vidéo) avec une légende typée DS, utile pour les blocs éditoriaux enrichis (capture, infographie, illustration, vidéo).

Présentation

MediaContent

Aperçu d’un produit — Exemple vidéo

Vue d’ensemble d’un écran de travail.

© Banque d’images exemple

Voir le code (Svelte)

<MediaContent
  title="Exemple vidéo"
  caption="Vue d’ensemble d’un écran de travail."
  media="https://picsum.photos/seed/media-content/900/500"
  mediaAlt="Aperçu d’un produit"
  mediaKind="image"
  byline="© Banque d’images exemple"
/>

API

Prop	Type	Par défaut	Effet
`media`	`string`	obligatoire	URL du média principal (image/vidéo).
`mediaKind`	`"image" \| "video"`	`"image"`	Détermine le mode de rendu du média.
`mediaAlt`	`string`	`""`	Texte alternatif (image) / étiquette (vidéo).
`aspectRatio`	`string`	`"16/9"`	Forçage de la proportion d’affichage.
`title`	`string`	`« sans titre »`	Titre dans la légende figure.
`caption`	`string`	`« sans caption »`	Légende visible sous le média.

Accessibilité

Le média image expose alt explicite.
La vidéo peut définir son propre label pour les assistances.
Le texte de légende figcaption reste lisible indépendamment du média.