Spinner
A spinner component used to indicate loading or progress states in an application.
Usage
Default
<Spinner />Props
| Type | Description | |
|---|---|---|
| aria-busy | boolean | Whether the related region is busy. Defaults to true. |
| aria-describedby | string | ID of element(s) that describe the spinner. |
| aria-label | string | Accessible label announced by screen readers. Falls back to `label`, then "Loading". |
| aria-labelledby | string | ID of element(s) that label the spinner. Takes precedence over `aria-label` when provided. |
| aria-live | "off" | "polite" | "assertive" | ARIA live region politeness. Defaults to "polite". |
| className | string | Additional class names for styling customization. |
| data-testid | string | Test ID for testing frameworks (e.g., for use with Jest or Cypress). |
| label | string | Optional visible label for the spinner. |
| role | React.AriaRole | Optional ARIA role. Defaults to "status". |
| shadow | ShadowType | Shadow style for the spinner. One of: "none" | "light" | "medium" | "strong" | "intense" |
| size | number | The size of the spinner (in pixels). |
| state | StateType | The state of the spinner. One of: "success" | "error" | "warning" | "disabled" | "" |
| theme | ThemeType | The theme color of the spinner. One of: "primary" | "secondary" | "tertiary" | "quaternary" | "clear" |