Spinner (indicateur de chargement)

Icône de chargement rotative légère. size propose trois échelons prédéfinis ou un nombre personnalisé ; lorsque color n'est pas transmis, l'indicateur hérite de currentColor.

Indicateur de chargement

<template>
  <div class="demo-col">
    <div class="demo-row" style="gap: 48px; flex-wrap: wrap">
      <div class="demo-col" style="align-items: center; gap: 8px">
        <LhSpinner size="small" />
        <span class="demo-note">small</span>
      </div>
      <div class="demo-col" style="align-items: center; gap: 8px">
        <LhSpinner />
        <span class="demo-note">default</span>
      </div>
      <div class="demo-col" style="align-items: center; gap: 8px">
        <LhSpinner size="large" />
        <span class="demo-note">large</span>
      </div>
      <div class="demo-col" style="align-items: center; gap: 8px">
        <LhSpinner :size="56" color="var(--lh-primary-color)" />
        <span class="demo-note">size=56 + color personnalisés</span>
      </div>
    </div>
  </div>
</template>

Props

Prop	Description	Type	Valeur par défaut
size	Taille	'small' \| 'default' \| 'large' \| number	'default'
color	Couleur de l'indicateur (valeur de couleur CSS ; hérite de currentColor si non transmis)	string	—
sx	Propriétés de mise en page rapide	—	—