Skeleton
import Skeleton from "@shpaw415/mui-lite/Skeleton";Why use it
Skeleton placeholders reduce layout shift while data loads. Match shape to the content (text, circular avatar, rectangular media).
Demo
Example
import Skeleton from "@shpaw415/mui-lite/Skeleton";
<>
<Skeleton variant="text" width="60%" />
<Skeleton variant="circular" width={40} height={40} />
<Skeleton variant="rectangular" height={120} />
</>Props
| Prop | Type | Default |
|---|---|---|
| variant | text | circular | rectangular | rounded | text |
| animation | pulse | wave | false | pulse |
| width / height | CSS size | — |