Docs
GitHub

Spinner

Loading

Spinner signals that something is happening but you don't know how long it'll take. For a known duration, use Progress instead.

Usage

import { Spinner } from "@sina-design-system/core";

<Spinner size="md" label="Loading transactions" />

Examples

Sizes · sm / md / lg

Loading (sm)sm
Loading (md)md
Loading (lg)lg

Accessible label · announced via role="status", never shown

Loading transactionslabel is screen-reader-only

Props

PropTypeDefaultDescription
size"sm" | "md" | "lg""md"Indicator size.
labelstringAnnounced to screen readers (visually hidden).

Accessibility

The animation respects prefers-reduced-motion. Always pass a label so the wait is announced, not silent.