Spinner

@/components/ui/Spinner

Liten, roterende venteindikator — standard 20×20px, text-secondary.

Når brukes den

Kort, ubestemt venting inne i en knapp eller en liten flate (f.eks. Button sin `loading`-tilstand).
Størrelsen justeres via `className` (Tailwind `h-*`/`w-*`) når 20px ikke passer.
tone="accent" kun der venting skjer INNI en aksentfarget flate og trenger å matche den — standard (text-secondary) er riktig ellers, en venteindikator er ikke en handling.
For en hel side eller seksjon som laster, bruk `Loading` i stedet — den har tekst og kontekst rundt selve ikonet.

Standard

Default størrelse (20×20px) og tone (text-secondary) — riktig inni en knapp eller ved siden av kort tekst.

<Spinner />

tone="accent"

Kun der venteindikatoren står på/ved en aksentfarget flate og skal matche den.

<Spinner tone="accent" />

Størrelse via className

Skaleres opp med Tailwind-klasser når spinneren står alene på en større flate.

h-8 w-8

Sveip tabellen for å se hele innholdet

Navn

Type

Default

Beskrivelse

tone

'default' | 'accent'

'default'

`default` er text-secondary (nøytral venting). `accent` for de få stedene som faktisk vil ha aksentfarge.

className

string

—

Overstyrer størrelse (default h-5 w-5) og kan overstyre fargen satt av `tone`.