Components
Loading
A component used as a placeholder when content is not yet available or to indicate that an action is being processed.
Basic usage
First, import the component.
import {Loading} from '@pleo-io/telescope'
Then use it, like so:
API reference
The component accepts the following props.
| Prop | Type | Default |
|---|---|---|
color | string | tokens.colorContentStaticQuiet |
size | number | 20 |
This component also accepts the following styled system props:
| Prop | Type | Default |
|---|---|---|
height | enum | |
m | enum | |
margin | enum | |
marginBottom | enum | |
marginLeft | enum | |
marginRight | enum | |
marginTop | enum | |
marginX | enum | |
marginY | enum | |
mb | enum | |
ml | enum | |
mr | enum | |
mt | enum | |
mx | enum | |
my | enum | |
p | enum | |
padding | enum | |
paddingBottom | enum | |
paddingLeft | enum | |
paddingRight | enum | |
paddingTop | enum | |
paddingX | enum | |
paddingY | enum | |
pb | enum | |
pl | enum | |
pr | enum | |
pt | enum | |
px | enum | |
py | enum | |
width | enum |
LoadingPage
| Prop | Type | Default |
|---|---|---|
color | string | tokens.colorContentStaticQuiet |
size | number | 20 |
This component also accepts the following styled system props:
| Prop | Type | Default |
|---|---|---|
height | enum | |
m | enum | |
margin | enum | |
marginBottom | enum | |
marginLeft | enum | |
marginRight | enum | |
marginTop | enum | |
marginX | enum | |
marginY | enum | |
mb | enum | |
ml | enum | |
mr | enum | |
mt | enum | |
mx | enum | |
my | enum | |
p | enum | |
padding | enum | |
paddingBottom | enum | |
paddingLeft | enum | |
paddingRight | enum | |
paddingTop | enum | |
paddingX | enum | |
paddingY | enum | |
pb | enum | |
pl | enum | |
pr | enum | |
pt | enum | |
px | enum | |
py | enum | |
width | enum |
LoadingOverlay
| Prop | Type | Default |
|---|---|---|
color | string | tokens.colorContentStaticQuiet |
size | number | 20 |
This component also accepts the following styled system props:
| Prop | Type | Default |
|---|---|---|
height | enum | |
m | enum | |
margin | enum | |
marginBottom | enum | |
marginLeft | enum | |
marginRight | enum | |
marginTop | enum | |
marginX | enum | |
marginY | enum | |
mb | enum | |
ml | enum | |
mr | enum | |
mt | enum | |
mx | enum | |
my | enum | |
p | enum | |
padding | enum | |
paddingBottom | enum | |
paddingLeft | enum | |
paddingRight | enum | |
paddingTop | enum | |
paddingX | enum | |
paddingY | enum | |
pb | enum | |
pl | enum | |
pr | enum | |
pt | enum | |
px | enum | |
py | enum | |
width | enum |