Spinner

A loading spinner with size variants and accessible labeling.

Docs: https://bht-galaxy.vercel.app/behivetech/atoms/spinner

A pure CSS animated loading indicator. Uses role="status" and aria-label so screen readers announce the loading state without visual output.

Usage

import { Spinner } from "@behivetech/atoms.spinner";

<Spinner size="md" label="Loading..." />;

Examples

Small

<Spinner size="sm" />

Medium (default)

<Spinner size="md" />

Large

<Spinner size="lg" />

Custom Label

<Spinner size="md" label="Saving your changes..." />

Accessibility

• role="status" announces loading state to screen readers
• aria-label carries the human-readable label (defaults to "Loading...")
• The visible circle is aria-hidden="true" to avoid redundant announcements