Spinner
Indeterminate loading indicator.
Examples
Default
Demo.tsxtsx
import { Spinner } from '@var-ui/react';
<Spinner label="Loading results" />Props
Accessibility
Built on React Aria Components where applicable.
Spinner
Indeterminate loading indicator.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
className | string | undefined | — | — |
label | string | undefined | — | — |
Theme this component via createDesignTheme({ components: { spinner: … } }).
See Customize for the full override API.
Public classes and data attributes from @var-ui/core spinner().
| Name | Example | Description |
|---|---|---|
class | var-ui-spinner | Root / part class name |
data-size | md | Recipe variant / state attribute from `@var-ui/core`. |
data-tone | accent | Recipe variant / state attribute from `@var-ui/core`. |
data-appearance | solid | Recipe variant / state attribute from `@var-ui/core`. |
Apply via `recipeProps(recipe(…))` or copy the class / data attributes onto your markup.