Aller au contenu principal
LyraDesign System

PulseDot

StableRSC-safe

Atome d'identité Aurora « Vivant » — indique sync active, marché ouvert, IA en cours. SVG natif, 4 variantes chromatiques (cyan / magenta / amber / dim), animation GPU-only, prefers-reduced-motion.

import { PulseDot } from "@lyra/tokens/components";

Playground

Variantes chromatiques (showLabel=true)
En directIA actifAttentionHors ligne
Tailles (size prop) — sans label
Usage en contexte (dans un header simulé)
Sync WealthicaEn direct

Démo interactive — réglages du playground (props ajustables en direct) à venir.

// Sync active
<PulseDot variant="cyan" label="Sync active" />

// IA en cours, avec label visible
<PulseDot variant="magenta" label="IA actif" showLabel />

// Taille personnalisée
<PulseDot variant="amber" label="Attention" size={12} showLabel />

Documentation

  • cyan (live)
    En direct
  • magenta (IA)
    IA actif
  • amber (alerte)
    Attention
  • dim (hors ligne)
    Hors ligne