Spinner
A thin wrapper around the Angular Material progress spinner. Provides a simple way to customize size, color, and stroke width, with an indeterminate loading indicator without requiring Bootstrap.
Overview
Examples
Overview
Import SpinnerComponent and drop the <spinner> element into any standalone component. By default The component always renders an indeterminate Angular Material progress spinner. Tune it with diameter, color, and strokeWidth.
- Tree-shakable: only the imported features are included in your bundle.
- Fully configurable for size, color, and stroke width.
- Follows Angular Material and WCAG accessibility best practices with semantic markup and ARIA attributes.
API
Selectors
spinner, lib-spinner
Inputs
| Name | Type | Default | Description |
|---|---|---|---|
bootstrapSpinner | boolean | true | Deprecated compatibility input; has no effect |
diameter | number | 50 | Diameter of the Material spinner (px) |
color | ThemePalette | 'primary' | Color of the Material spinner ('primary', 'accent', 'warn') |
strokeWidth | number | 5 | Stroke width of the Material spinner |
The default changed from a Bootstrap spinner to an Angular Material spinner. Existing [bootstrapSpinner] bindings still compile but do not change the result.