BjQuote

Citation React : blockquote rendu avec children ?? text, auteur et source optionnels, image et accent.

Utilisation

import { BjQuote } from '@flrxnt/dsbj/react'

export function Example() {
  return (
    <BjQuote
      accent
      author="Ministère du numérique"
      source="Rapport annuel 2024"
      text="L’accessibilité et la clarté guident chaque service public numérique."
    />
  )
}

accent

L’accessibilité et la clarté guident chaque service public numérique.

Ministère du numériqueRapport annuel 2024

L’accessibilité et la clarté guident chaque service public numérique.

Ministère du numérique

<BjQuote accent text="Citation avec accent." author="Auteur" />
<BjQuote text="Citation sans accent." author="Auteur" />

text et children

Si vous passez des children, ils remplacent la prop text pour le contenu du blockquote.

<!-- Children remplace text pour le blockquote -->
<BjQuote accent author="Auteur" source="Source">
  <em>Citation</em> avec <strong>markup</strong>.
</BjQuote>

<!-- text seul -->
<BjQuote text="Citation simple." author="Auteur" />

Auteur et source

<BjQuote text="…" author="Nom seul" />
<BjQuote text="…" author="Nom" source="Ouvrage, 2024" />

Image

Ministère du numériqueRapport annuel 2024

<BjQuote
  image="https://picsum.photos/96/96"
  text="Citation avec portrait."
  author="Prénom Nom"
/>

Exemple complet

<BjQuote
  accent
  image="https://picsum.photos/96/96"
  text={text}
  author={author}
  source={source}
/>

Props

Prop	Description
`accent`	Bordure gauche accent si vrai.
`text`	Texte utilisé lorsque children est absent ou null.
`author`	Nom dans figcaption.
`source`	Référence dans figcaption.
`image`	URL de l’image au-dessus du blockquote.
`children`	Si vous passez des children, ils remplacent la prop <code>text</code> pour le contenu du blockquote.