Skip to content
Telescope

Loading

A component used as a placeholder when content is not yet available or to indicate that an action is being processed.

Features

  • Specify the color of loading dots.
  • Specify the size of loading dots.
  • Can be used for loading of pages and in overlays.

Examples

Page loading

Use this component when the entire page is not yet ready to be rendered. You can (optionally) add a description to clarify the loading state.

import {LoadingPage} from '@pleo-io/telescope'
Loading expenses...

Overlay loading

Fixed positioned loading visual cue that overlays other content; make sure to disable the underlying interactive elements.

import {LoadingOverlay} from '@pleo-io/telescope'


export default () => <LoadingOverlay>Loading expenses...</LoadingOverlay>

Related components

  • Spinner: A component used as a placeholder when content is not yet available or to indicate that an action is being processed.