Spinner
Spinner de carregamento em CSS puro. 4 tamanhos, 4 variantes, label acessível.
Demonstração
Sizes
SmallMediumLargeExtra Large
Variants
DefaultSecondaryOutlineGhost
Props
| Prop | Tipo | Padrão | Descrição |
|---|---|---|---|
size | 'sm' | 'md' | 'lg' | 'xl' | 'md' | Size of the spinner. |
variant | 'default' | 'secondary' | 'outline' | 'ghost' | 'default' | Color variant. |
label | string | 'Loading…' | Accessible label (aria-label). |
Uso
import { Spinner } from '@ghiberti85/ui'
// Default
<Spinner />
// Sizes
<Spinner size="sm" />
<Spinner size="md" />
<Spinner size="lg" />
<Spinner size="xl" />
// Variants
<Spinner variant="default" />
<Spinner variant="secondary" />
<Spinner variant="outline" />
<Spinner variant="ghost" />
// Custom label
<Spinner label="Saving changes…" />