@selfcommunity/react-ui/lib/esm/components/CourseDashboard/Header/Skeleton.js

React UI Components to integrate a Community created with SelfCommunity Platform.

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Box, Skeleton, Stack } from '@mui/material';
import { PREFIX } from '../constants';
const classes = {
    header: `${PREFIX}-header`,
    img: `${PREFIX}-header-img`,
    outerWrapper: `${PREFIX}-header-outer-wrapper`,
    innerWrapper: `${PREFIX}-header-inner-wrapper`,
    iconWrapper: `${PREFIX}-header-icon-wrapper`
};
export default function HeaderSkeleton() {
    return (_jsxs(Box, Object.assign({ className: classes.header }, { children: [_jsx(Skeleton, { animation: "wave", variant: "rectangular", className: classes.img }), _jsx(Skeleton, { animation: "wave", variant: "text", width: "266px", height: "25px" }), _jsxs(Stack, Object.assign({ className: classes.outerWrapper }, { children: [_jsx(Stack, Object.assign({ className: classes.innerWrapper }, { children: Array.from(new Array(2)).map((_, i) => (_jsxs(Stack, Object.assign({ className: classes.iconWrapper }, { children: [_jsx(Skeleton, { animation: "wave", variant: "rectangular", width: "20px", height: "20px" }), _jsx(Skeleton, { animation: "wave", variant: "text", width: "50px", height: "21px" })] }), i))) })), _jsx(Skeleton, { animation: "wave", variant: "rounded", width: "160px", height: "28px" })] }))] })));
}