BjChatBubble

Composant Vue pour les bulles de chat DSBJ. Prend en charge les variantes envoyé, reçu et système, avec avatar, horodatage et statut optionnels.

Utilisation

<script setup>
import { BjChatBubble } from '@flrxnt/dsbj/vue'
</script>

<template>
  <div role="list">
    <BjChatBubble variant="received" sender="Amina" time="10:32">
      Bonjour, comment puis-je vous aider ?
    </BjChatBubble>

    <BjChatBubble variant="sent" time="10:33" status="read">
      J'ai besoin d'informations sur mon dossier.
    </BjChatBubble>

    <BjChatBubble variant="system">
      Conversation démarrée
    </BjChatBubble>
  </div>
</template>

Aperçu

Amina
Bonjour, comment puis-je vous aider ?
10:32
J'ai besoin d'informations sur mon dossier.
10:33
Conversation démarrée

Variantes

Bot
Message reçu
09:00
Message envoyé
09:01
Erreur d'envoi
09:02

Props

PropDescription
variantreceived (défaut)
avatarURL de l'avatar de l'expéditeur (optionnel).
senderNom de l'expéditeur (optionnel).
timeHorodatage du message (optionnel).
statussent

Accessibilité

Envelopper les bulles dans un conteneur role="list". Chaque bulle possède role="listitem" et un aria-label descriptif automatique.