# Spinner

> Indeterminate loading indicator.

Import from `@aspyn-io/kit`. Scaffold source: `npx shadcn@latest add https://design.aspyn.io/r/spinner.json`

## Install

```tsx
import { Spinner } from "@aspyn-io/kit";
```

### Default

```tsx
<Spinner />
```

### Sizes and color

Sized and colored with utilities: it inherits currentColor and scales with size-*.

```tsx
<Spinner className="size-4" />
<Spinner className="size-6" />
<Spinner className="size-8 text-primary" />
```

### In a button

```tsx
<Button disabled>
  <Spinner />
  Saving…
</Button>
```

## Notes

- Exposes role="status" with an accessible label (default "Loading"); pass label to describe the specific action, e.g. label="Saving".
- Uses the animate-spin utility; honors reduced-motion when the app disables that animation.