Spinner

Loading indicator.

Loading

Installation

Once per app, set up Aedis UI. The CLI verifies the signed release before writing anything and pins every dependency:

npx @aedis/cli@0.1.0 init

Import the theme once in your global CSS, after Tailwind:

app/globals.css
@import "tailwindcss";@import "./styles/aedis-theme.css";

Then add the component:

npx @aedis/cli@0.1.0 add spinner# pnpm dlx @aedis/cli@0.1.0 add spinner · yarn dlx @aedis/cli@0.1.0 add spinner · bunx @aedis/cli@0.1.0 add spinner

Props

PropTypeDefaultDescription
labelsPartial<SpinnerLabels>—label: what is loading, announced politely.
...propsspan props—Every prop of the wrapping span (role="status").

Security

  • With reduced motion it stops rotating and shows its label as text.