> Spinner

Spinner

Indicateur de chargement animé en rotation. Trois tailles disponibles : sm (16 px), md (32 px, défaut) et lg (64 px). La prop delay permet de retarder l'apparition du spinner pour éviter un flash sur les opérations rapides : •false / absent : visible immédiatement •true : délai de 1 000 ms •"short" : 300 ms •"long" : 1 000 ms •number : délai personnalisé en millisecondes

TagsuiExemples2StylesDisponibles

Sizes

export const Sizes = () => (
  <Box display="flex" flexDirection="row" style={{ alignItems: 'center' }} gap={16}>
    <Spinner size="sm" />
    <Spinner size="md" />
    <Spinner size="lg" />
  </Box>
);

WithDelay

export const WithDelay = () => (
  <Box display="flex" flexDirection="row" style={{ alignItems: 'center' }} gap={16}>
    <Spinner size="md" delay="short" key="short" />
    <Spinner size="md" delay="long" key="long" />
  </Box>
);

Alveole UI Kit — v1.8.4