React Shared Components

Interactive testing environment for react-shared components

Theme Playground

Current: Default

LoadingSpinner

Animated loading indicator with optional mask overlay.

Interactive Playground

Customize the LoadingSpinner properties and see the changes in real-time.

Loading...

Examples

Default Spinner

Loading...

With Mask Overlay

Loading...

API Reference

PropTypeDefaultDescription
maskbooleanfalseShow semi-transparent background overlay
wrapperStylesReact.CSSPropertiesundefinedCustom inline styles for wrapper
classNamestringundefinedAdditional CSS classes

Usage Notes

Mask Overlay

When mask is enabled, the spinner displays with a semi-transparent background overlay, useful for blocking user interaction during loading states.

Accessibility

The component includes proper ARIA attributes and screen reader text for accessibility.

Animation

The spinner uses CSS animations for smooth rotation. Styling is handled through CSS modules.