Manual v0.1 // Component Library
The Spinner
Frames
"Found buried in samSepiol's 404.astro, her beloved cli spinner, braille frames and all."
A single <span> cycling through 10 braille frames on a setInterval. No SVG, no animation library. speed, size, and color are the whole API.
01 / DEFAULT
cli spinner
⠋
Spec1.5rem / 80ms / inherit
<Spinner />
02 / LARGE
loading state
⠋
Spec3rem / 80ms / accent
<Spinner size="3rem" color="var(--deep)" />
03 / SLOW
gentler
⠋
Spec1.5rem / 200ms / inherit
<Spinner :speed="200" />
How to use
import { Spinner } from "echo-ui";<Spinner size="2rem" :speed="80" color="var(--deep)" />speed is ms per frame (default 80). color defaults to inherit, so it picks up whatever text colour surrounds it, try the picker above each tile to override it live.
Base rule
10-frame braille cycle, role="status" for a11y
Source
echo-ui/components/Spinner.vue