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

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

import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { CardActions, CardContent, Skeleton } from '@mui/material';
import { styled } from '@mui/system';
import 'swiper/css';
import { Swiper, SwiperSlide } from 'swiper/react';
import { SCEventTemplateType } from '../../types/event';
import { EventSkeleton } from '../Event';
import Widget from '../Widget';
import { PREFIX } from './constants';
const classes = {
    root: `${PREFIX}-skeleton-root`,
    content: `${PREFIX}-content`,
    title: `${PREFIX}-title`,
    swiperSlide: `${PREFIX}-swiper-slide`,
    actions: `${PREFIX}-actions`
};
const Root = styled(Widget, {
    name: PREFIX,
    slot: 'SkeletonRoot',
    overridesResolver: (_props, styles) => styles.skeletonRoot
})(() => ({}));
export default function SuggestedEventsWidgetSkeleton() {
    return (_jsxs(Root, Object.assign({ className: classes.root }, { children: [_jsxs(CardContent, Object.assign({ className: classes.content }, { children: [_jsx(Skeleton, { className: classes.title, animation: "wave", width: "141px", height: "23px" }), _jsx(Swiper, Object.assign({ spaceBetween: 8, slidesPerView: "auto" }, { children: [1, 2, 3, 4, 5, 6, 7].map((_element, i) => (_jsx(SwiperSlide, Object.assign({ className: classes.swiperSlide }, { children: _jsx(EventSkeleton, { template: SCEventTemplateType.PREVIEW, variant: "outlined", actions: _jsx(_Fragment, {}) }) }), i))) }))] })), _jsx(CardActions, Object.assign({ className: classes.actions }, { children: _jsx(Skeleton, { animation: "wave", width: "52px", height: "20px" }) }))] })));
}