A customizable, simple loading overlay with transitions.
Wrap your components in it and toggle the active prop as necessary.
importLoadingOverlayfrom'@tkforce/react-loading-overlay';<LoadingOverlayactive={isActive}spinnertext='Loading your content...'><p>Some content or children or something.</p></LoadingOverlay>- active,
Boolean, whether the loader is visible. - animate,
Boolean, whether to fade the overlay in and out. - spinner,
Boolean, whether to use a spinner in the loader. - text,
String, used as content of the loader. - background,
String, valid css color declaration for the overlay background. - color,
String, valid css color declaration for the text and circle color. - spinnerSize,
String, valid css size (100px) for the size of the spinner circle. - zIndex,
Integer, use in case you are experiencing other z-indexed components appearing over top of the overlay. - onClick,
Function, triggered when the overlay is clicked.
- Passing in custom loader components.
- Composable loader, maybe some alternative spinner options or something.