Spinner
A spinning animation that indicates loading.
This is a pass through component from React-Bootstrap.
See React-Bootstrap for documentation.
Basic Usage
Show editable code example
Any Paragon component or export may be added to the code example.
Color Variants
Show editable code example
Any Paragon component or export may be added to the code example.
Theme Variables#
| CSS Variable | Computed Value |
|---|---|
| | |
| | |
| | |
| | |
| | |
Props API#
Spinner Props API
This is a pass through component from React-Bootstrap; see original props documentation here. You can also pass any HTML attributes, such as onClick, role, etc. Which attributes are available depends on whether or not you have overriden the underlying HTML element using the as property.
- className
stringOptionally specify additional CSS classes to give this spinner's
<div>. - screenReaderText
React.ReactNodeSpecifies the screen reader content for a11y.
Usage Insights#
Spinner
| Project Name | Paragon Version | Instance Count | |
|---|---|---|---|
| edx-ora2 | 21.13.1 | 1 | |
| frontend-app-account | 22.10.0 | 4 | |
| frontend-app-admin-portal | 21.13.1 | 25 | |
| frontend-app-authn | 22.11.2 | 3 | |
| frontend-app-communications | 22.7.0 | 1 | |
| frontend-app-course-authoring | 22.8.1 | 11 | |
| frontend-app-discussions | 22.7.0 | 11 | |
| frontend-app-enterprise-public-catalog | 21.13.1 | 3 | |
| frontend-app-learner-dashboard | 22.9.0 | 1 | |
| frontend-app-learner-portal-enterprise | 21.13.1 | 3 | |
| frontend-app-learning | 22.10.0 | 4 | |
| frontend-app-library-authoring | 21.11.3 | 1 | |
| frontend-app-ora-grading | 21.11.3 | 3 | |
| frontend-app-publisher | 21.13.1 | 2 | |
| frontend-app-support-tools | 21.13.1 | 1 | |
| frontend-component-header-edx | 21.13.1 | 1 | |
| frontend-lib-special-exams | 22.7.0 | 2 | |
| prospectus | 20.46.2 | 4 |