COMPONENTS / ATOMS / al-spinner← ALL COMPONENTS

Spinner

<al-spinner><ALSpinner> REACTbeta

Component: el-spinner

PLAYGROUND2 CONTROLS
PREVIEW / al-spinner / SOUTHLEFT
Loading preview
FLAGS
CODE — HTML / REACT
Guidance
NOT YET AUTHORED · 20 COMPONENTS COVERED
NO USAGE GUIDANCE HAS BEEN WRITTEN FOR THIS COMPONENT YET. THE API BELOW IS GENERATED FROM THE MANIFEST AND IS COMPLETE; WHAT IS MISSING IS WHEN TO REACH FOR IT AND WHEN NOT TO.
FIGMA PARITYNOT TRACKED
NO DESIGN-SYSTEM PROJECT TRACKS THIS COMPONENT AGAINST A FIGMA FILE — IT IS EITHER OUTSIDE EVERY PROJECT’S DECLARED SCOPE, OR NOT YET SEEDED INTO ITS PROJECT’S PARITY MANIFEST.
ACCESSIBILITYAXE 4.12.1
CHECKEVIDENCEDETAILRESULT
Default stateAXEspinner--DefaultPASS
Advanced statesAXE2 further storiesPASS
Screen readerMANUALNo screen-reader pass has been recorded for this component.NOT RECORDED
Keyboard navigationINTERACTION TESTSNo interaction tests and no manual keyboard pass.NOT RECORDED
MEASURED 2026-09-08 · 3 STORIES · AXE WCAG2A + WCAG2AA + WCAG21A + WCAG21AA + WCAG22AA
COLOR CONTRAST0 RULES FAILING
The CI gate disables color-contrast globally (libs/al-web-components/story-fixture/src/main.ts), so its result never reaches a test run. It is enabled for this measurement, and reported here whichever way it comes out.
NO CONTRAST VIOLATIONS ACROSS THIS COMPONENT’S 3 STORIES.
INSTALL@southleft/al-web-components/components/spinner
import '@southleft/al-web-components/components/spinner';
import { ALSpinner } from '@southleft/al-react';
API — 2 PROPS2 DOCUMENTED
PROPTYPEDEFAULT
invertedbooleanInverted variant
1) Used for dark backgrounds—
smallbooleanSmall loaderfalse
SLOTS0
THIS COMPONENT DECLARES NO SLOTS IN THE MANIFEST.
EVENTS0
THIS COMPONENT DECLARES NO EVENTS IN THE MANIFEST.
SOURCE — components/spinner/spinner.ts · Atoms/Spinner