Spinner
A turning ring that says work is happening. It is a status named Loading, so screen readers hear it without extra markup.
bunx --bun shadcn@4.17.0 add @waimakers/spinner- npm dependencies
- lucide-react@1.33.0
From the registry
A turning ring in the current text colour that says it is working: role=status named "Loading" by default, so a screen reader hears it; pass aria-label to say what is loading. Button's loading prop lays one over its label.
Examples
Sizes
Size it with a size utility; it takes the current text colour.
With text
Pair it with words when the wait is longer than a moment, and hide the ring's own name.
Transcribing the Tuesday stand-up
In a button
Button's loading prop lays the spinner over the label and keeps the width.