Loading navigation…
User
API and Development
LoadingIndicator displays an animated spinner to signal that content is loading or an operation is in progress. It provides visual feedback during asynchronous operations, helping users understand that the system is working. Built on Radix UI's Spinner component, it offers consistent loading states across the interface with multiple size variants.
| Name | Default | Description |
|---|---|---|
size | LoadingIndicatorSize.Regular | Size variant. Options: Small, Regular, Large. |
loading | Whether the loading indicator is visible. Note: This prop is currently not implemented in the component. | |
children | Optional content to display alongside the loading indicator. Note: Radix UI's Spinner component may not render children. |
Use in tight spaces or when the loading indicator supplements other content.
Default size for most loading scenarios, balancing visibility and space efficiency.
Use for prominent loading states, such as full-page or major content area loading.
Use loading indicators to provide feedback during data fetching or processing.
Display a centered loading indicator when loading full pages or major sections.
Show a small loading indicator inline with text or other content.
Use loading indicators in table cells or empty states when data is loading.
Control the visibility of loading indicators based on application state.
Combine loading indicators with contextual messages to inform users about what's happening.
Compare different sizes side by side to choose the appropriate variant.