Toast de nouvel arrivant
Un curseur coloré avec le nom de la personne entre dans le document pendant que le toast annonce son arrivée.
Réglages
Code
<div class="uv-qpj"><button type="button" class="fire">Afficher à nouveau</button><span class="cu" aria-hidden="true"><svg viewBox="0 0 24 24"><path d="M4 3l15 7.5-6.5 1.8L10 19z"/></svg><b>Marta</b></span><div class="tt" role="status"><span class="av" aria-hidden="true">MR<i></i></span><span class="tx"><b>Marta a rejoint le document</b><small>Vous êtes 3 à modifier</small></span><span class="st"><i style="--c:#3b82f6"></i><i style="--c:#f59e0b"></i><i style="--c:var(--c1)"></i></span></div></div>Prompt pour l’IA
Collez-le dans ChatGPT, Claude ou Cursor : le bloc sera adapté à votre projet avec ces réglages, même sans React.
Plus dans Notifications
Voir tout : NotificationsOù l’utiliser
Les éditeurs collaboratifs montrent la présence en temps réel, et une notification d'arrivée fonctionne mieux quand elle ressemble à la collaboration elle-même. Quand ce toast apparaît, un curseur rose avec son étiquette de nom entre dans la scène et se promène un peu, tandis que le toast montre l'avatar avec un point en ligne, le message et la pile des personnes présentes.
Utilise-le dans les documents, tableaux blancs, outils de design ou feuilles partagées. Le curseur est décoratif et masqué aux technologies d'assistance. La couleur principale définit le curseur, l'anneau de l'avatar et la nouvelle pastille.