mirror of
https://github.com/XFox111/MuiCharts.git
synced 2026-04-22 06:51:05 +03:00
30 lines
776 B
TypeScript
30 lines
776 B
TypeScript
import { Box, Container, Skeleton } from "@mui/material";
|
|
import { useStyles } from "./ChartSkeleton.styles";
|
|
|
|
function ChartSkeleton(): JSX.Element
|
|
{
|
|
const sx = useStyles();
|
|
|
|
return (
|
|
<Box sx={ sx.root }>
|
|
<Box sx={ sx.chart }>
|
|
<Skeleton variant="rounded" width="24px" height="100%" />
|
|
<Skeleton sx={ sx.xAxis } variant="rounded" width="100%" height="24px" />
|
|
|
|
<Box sx={ sx.grid }>
|
|
{ Array.from({ length: 100 }).map((_, i) =>
|
|
<Skeleton key={ i } variant="rounded" width="100%" height="100%" />
|
|
) }
|
|
</Box>
|
|
</Box>
|
|
|
|
<Container sx={ sx.controls }>
|
|
<Skeleton variant="rounded" width="100%" height="24px" />
|
|
<Skeleton variant="rounded" width="150px" height="38px" />
|
|
</Container>
|
|
</Box>
|
|
);
|
|
}
|
|
|
|
export default ChartSkeleton;
|