Skeleton Loading

[hazem3500]

Skeleton Loading

[jxom]

This would be nice. Feel free to raise a PR.

I was thinking there could be two types of uses:

Standalone Skeleton

A skeleton can be standalone, and mimic the <Box> component:

// A skeleton with width 100% and height 10px
<Skeleton height="10px" />

// Could also make a circular skeleton of diameter 10px
<Skeleton borderRadius="100%" height="10px" width="10px" />

Skeleton Wrapper

A skeleton can wrap content, and be passed a hasLoaded state:

<Skeleton hasLoaded={!isLoading}>
  <Text.Block fontWeight="semibold">John Jones</Text.Block>
  <Text.Block>Software Engineer</Text.Block>
</Skeleton>

[hazem3500]

Cool 👍, I will see if I'll be able to make a PR soon.