Absolutely positioned loading overlay with spinner and numerous configurable options.


0.10.12 months ago4 years agoMinified + gzip package size for @govuk-react/loading-box in KB




  import LoadingBox from '@govuk-react/loading-box';

Use a LoadingBox to wrap components that can asyncronously load content.

When loading is set to true, a spinner will overlay the contents to give visual feedback to the user.


Prop Required Default Type Description
backgroundColor undefined string Background color (3 or 6 Hex char) of loading spinner overlay when loading is true.
backgroundColorOpacity undefined number Opacity of loading spinner backgroud colour when loading is true
children `````` ReactNode One or more children nodes that loading box will overlay
loading undefined boolean Whether loading is currently set to true or false
spinnerColor undefined string Color (3 or 6 Hex char) of loading spinner
timeIn undefined number Length of fade-in animation in milliseconds
timeOut undefined number Length of fade-out animation in milliseconds
title undefined string Loading spinner title text

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.