@selfcommunity/react-ui 0.8.0-live.40 → 0.8.0-live.41

package/lib/esm/components/Editor/plugins/ToolbarPlugin.js

@@ -109,7 +109,7 @@ function BlockFormatIconButton({ className = '', editor, blockType, disabled = f
     const handleClose = () => {
         setAnchorEl(null);
     };
-    return (_jsxs(_Fragment, { children: [_jsx(IconButton, { className: className, disabled: disabled, onClick: handleOpen, children: _jsx(Tooltip, { title: _jsx(FormattedMessage, { id: "ui.editor.toolbarPlugin.blockType", defaultMessage: "ui.editor.toolbarPlugin.blockType" }), children: _jsxs(_Fragment, { children: [_jsx(Icon, { children: blockTypeToBlockIcon[blockType] }), _jsx(Icon, { children: anchorEl ? 'expand_less' : 'expand_more' })] }) }) }), _jsx(Menu, { anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, children: Object.keys(blockTypeToBlockIcon).map((block) => (_jsx(MenuItem, { onClick: handleSelect(block), children: _jsx(Icon, { children: blockTypeToBlockIcon[block] }) }, block))) })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(IconButton, Object.assign({ className: className, disabled: disabled, onClick: handleOpen }, { children: _jsx(Tooltip, Object.assign({ title: _jsx(FormattedMessage, { id: "ui.editor.toolbarPlugin.blockType", defaultMessage: "ui.editor.toolbarPlugin.blockType" }) }, { children: _jsxs(_Fragment, { children: [_jsx(Icon, { children: blockTypeToBlockIcon[blockType] }), _jsx(Icon, { children: anchorEl ? 'expand_less' : 'expand_more' })] }) })) })), _jsx(Menu, Object.assign({ anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose }, { children: Object.keys(blockTypeToBlockIcon).map((block) => (_jsx(MenuItem, Object.assign({ onClick: handleSelect(block) }, { children: _jsx(Icon, { children: blockTypeToBlockIcon[block] }) }), block))) }))] }));
 }
 const classes = {
     root: `${PREFIX}-toolbar-plugin-root`,
@@ -262,11 +262,11 @@ export default function ToolbarPlugin(inProps) {
             editor.dispatchCommand(TOGGLE_LINK_COMMAND, null);
         }
     }, [editor, isLink]);
-    return (_jsxs(Root, { className: classes.root, children: [blockType in blockTypeToBlockIcon && activeEditor === editor && (_jsx(BlockFormatIconButton, { className: classes.blockFormat, disabled: !isEditable, blockType: blockType, editor: editor })), _jsx(IconButton, { disabled: !isEditable, onClick: () => {
+    return (_jsxs(Root, Object.assign({ className: classes.root }, { children: [blockType in blockTypeToBlockIcon && activeEditor === editor && (_jsx(BlockFormatIconButton, { className: classes.blockFormat, disabled: !isEditable, blockType: blockType, editor: editor })), _jsx(IconButton, Object.assign({ disabled: !isEditable, onClick: () => {
                     activeEditor.dispatchCommand(FORMAT_ELEMENT_COMMAND, ALIGNMENTS[(ALIGNMENTS.findIndex((a) => alignment === a) + 1) % ALIGNMENTS.length]);
-                }, children: _jsx(Tooltip, { title: _jsx(FormattedMessage, { id: `ui.editor.toolbarPlugin.${alignment}`, defaultMessage: `ui.editor.toolbarPlugin.${alignment}` }), children: _jsx(Icon, { children: `format_align_${alignment}` }) }) }), _jsx(ToggleButtonGroup, { value: formats, children: FORMATS.map((format) => (_jsx(ToggleButton, { value: format, disabled: !isEditable, onClick: () => {
+                } }, { children: _jsx(Tooltip, Object.assign({ title: _jsx(FormattedMessage, { id: `ui.editor.toolbarPlugin.${alignment}`, defaultMessage: `ui.editor.toolbarPlugin.${alignment}` }) }, { children: _jsx(Icon, { children: `format_align_${alignment}` }) })) })), _jsx(ToggleButtonGroup, Object.assign({ value: formats }, { children: FORMATS.map((format) => (_jsx(ToggleButton, Object.assign({ value: format, disabled: !isEditable, onClick: () => {
                         activeEditor.dispatchCommand(FORMAT_TEXT_COMMAND, format);
-                    }, children: _jsx(Tooltip, { title: _jsx(FormattedMessage, { id: `ui.editor.toolbarPlugin.${format}`, defaultMessage: `ui.editor.toolbarPlugin.${format}` }), children: _jsx(Icon, { children: `format_${format}` }) }) }, format))) }), _jsx(IconButton, { disabled: !isEditable, onClick: clearFormatting, children: _jsx(Tooltip, { title: _jsx(FormattedMessage, { id: "ui.editor.toolbarPlugin.clear", defaultMessage: "ui.editor.toolbarPlugin.clear" }), children: _jsx(Icon, { children: "format_clear" }) }) }), _jsx(IconButton, { disabled: !isEditable, onClick: () => {
+                    } }, { children: _jsx(Tooltip, Object.assign({ title: _jsx(FormattedMessage, { id: `ui.editor.toolbarPlugin.${format}`, defaultMessage: `ui.editor.toolbarPlugin.${format}` }) }, { children: _jsx(Icon, { children: `format_${format}` }) })) }), format))) })), _jsx(IconButton, Object.assign({ disabled: !isEditable, onClick: clearFormatting }, { children: _jsx(Tooltip, Object.assign({ title: _jsx(FormattedMessage, { id: "ui.editor.toolbarPlugin.clear", defaultMessage: "ui.editor.toolbarPlugin.clear" }) }, { children: _jsx(Icon, { children: "format_clear" }) })) })), _jsx(IconButton, Object.assign({ disabled: !isEditable, onClick: () => {
                     activeEditor.dispatchCommand(INSERT_HORIZONTAL_RULE_COMMAND, undefined);
-                }, children: _jsx(Tooltip, { title: _jsx(FormattedMessage, { id: "ui.editor.toolbarPlugin.horizontalRule", defaultMessage: "ui.editor.toolbarPlugin.horizontalRule" }), children: _jsx(Icon, { children: "format_horizontal_rule" }) }) }), uploadImage && _jsx(ImagePlugin, {}), _jsx(IconButton, { disabled: !isEditable, onClick: insertLink, children: _jsx(Tooltip, { title: _jsx(FormattedMessage, { id: "ui.editor.toolbarPlugin.link", defaultMessage: "ui.editor.toolbarPlugin.link" }), children: _jsx(Icon, { children: "format_link" }) }) }), _jsx(EmojiPlugin, {})] }));
+                } }, { children: _jsx(Tooltip, Object.assign({ title: _jsx(FormattedMessage, { id: "ui.editor.toolbarPlugin.horizontalRule", defaultMessage: "ui.editor.toolbarPlugin.horizontalRule" }) }, { children: _jsx(Icon, { children: "format_horizontal_rule" }) })) })), uploadImage && _jsx(ImagePlugin, {}), _jsx(IconButton, Object.assign({ disabled: !isEditable, onClick: insertLink }, { children: _jsx(Tooltip, Object.assign({ title: _jsx(FormattedMessage, { id: "ui.editor.toolbarPlugin.link", defaultMessage: "ui.editor.toolbarPlugin.link" }) }, { children: _jsx(Icon, { children: "format_link" }) })) })), _jsx(EmojiPlugin, {})] })));
 }

package/lib/esm/components/Editor/shared/useDecorators.js

@@ -24,7 +24,7 @@ export function useDecorators(editor, ErrorBoundary) {
         const decoratorKeys = Object.keys(decorators);
         for (let i = 0; i < decoratorKeys.length; i++) {
             const nodeKey = decoratorKeys[i];
-            const reactDecorator = (_jsx(ErrorBoundary, { onError: (e) => editor._onError(e), children: _jsx(Suspense, { fallback: null, children: decorators[nodeKey] }) }));
+            const reactDecorator = (_jsx(ErrorBoundary, Object.assign({ onError: (e) => editor._onError(e) }, { children: _jsx(Suspense, Object.assign({ fallback: null }, { children: decorators[nodeKey] })) })));
             const element = editor.getElementByKey(nodeKey);
             if (element !== null) {
                 decoratedPortals.push(createPortal(reactDecorator, element, nodeKey));

package/lib/esm/components/Event/Event.js

@@ -123,17 +123,17 @@ export default function Event(inProps) {
      */
     let contentObj;
     if (template === SCEventTemplateType.DETAIL) {
-        contentObj = (_jsxs(DetailRoot, { className: classes.detailRoot, children: [_jsxs(Box, { className: classes.detailImageWrapper, children: [_jsx(CardMedia, { component: "img", image: scEvent.image_medium, alt: scEvent.name, className: classes.detailImage }), !hideInProgress && inProgress && (_jsx(Chip, { size: "small", component: "div", label: _jsx(FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.detailInProgress })), _jsx(Calendar, { day: new Date(scEvent.start_date).getDate() })] }), _jsxs(CardContent, { className: classes.detailContent, children: [scEvent.active ? (_jsx(Link, { to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.detailNameWrapper, children: _jsx(Typography, { variant: "h3", className: classes.detailName, children: scEvent.name }) })) : (_jsx(Box, { className: classes.detailNameWrapper, children: _jsx(Typography, { variant: "h3", className: classes.detailName, children: scEvent.name }) })), _jsx(EventInfoDetails, { event: scEvent }), !hideEventPlanner && (_jsx(User, { user: scEvent.managed_by, elevation: 0, secondary: _jsx(Typography, { variant: "caption", children: _jsx(FormattedMessage, { id: "ui.myEventsWidget.planner", defaultMessage: "ui.myEventsWidget.planner" }) }), actions: _jsx(_Fragment, {}), className: classes.detailUser })), !hideEventParticipants && (_jsxs(_Fragment, { children: [_jsx(Divider, { className: classes.detailFirstDivider }), _jsx(EventParticipantsButton, Object.assign({ event: scEvent }, EventParticipantsButtonComponentProps))] })), _jsx(Divider, { className: classes.detailSecondDivider })] }), actions !== null && actions !== void 0 ? actions : (_jsx(CardActions, { className: classes.detailActions, children: _jsx(Button, { size: "small", variant: "outlined", component: Link, to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent), children: _jsx(FormattedMessage, { defaultMessage: "ui.event.see", id: "ui.event.see" }) }) }))] }));
+        contentObj = (_jsxs(DetailRoot, Object.assign({ className: classes.detailRoot }, { children: [_jsxs(Box, Object.assign({ className: classes.detailImageWrapper }, { children: [_jsx(CardMedia, { component: "img", image: scEvent.image_medium, alt: scEvent.name, className: classes.detailImage }), !hideInProgress && inProgress && (_jsx(Chip, { size: "small", component: "div", label: _jsx(FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.detailInProgress })), _jsx(Calendar, { day: new Date(scEvent.start_date).getDate() })] })), _jsxs(CardContent, Object.assign({ className: classes.detailContent }, { children: [scEvent.active ? (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.detailNameWrapper }, { children: _jsx(Typography, Object.assign({ variant: "h3", className: classes.detailName }, { children: scEvent.name })) }))) : (_jsx(Box, Object.assign({ className: classes.detailNameWrapper }, { children: _jsx(Typography, Object.assign({ variant: "h3", className: classes.detailName }, { children: scEvent.name })) }))), _jsx(EventInfoDetails, { event: scEvent }), !hideEventPlanner && (_jsx(User, { user: scEvent.managed_by, elevation: 0, secondary: _jsx(Typography, Object.assign({ variant: "caption" }, { children: _jsx(FormattedMessage, { id: "ui.myEventsWidget.planner", defaultMessage: "ui.myEventsWidget.planner" }) })), actions: _jsx(_Fragment, {}), className: classes.detailUser })), !hideEventParticipants && (_jsxs(_Fragment, { children: [_jsx(Divider, { className: classes.detailFirstDivider }), _jsx(EventParticipantsButton, Object.assign({ event: scEvent }, EventParticipantsButtonComponentProps))] })), _jsx(Divider, { className: classes.detailSecondDivider })] })), actions !== null && actions !== void 0 ? actions : (_jsx(CardActions, Object.assign({ className: classes.detailActions }, { children: _jsx(Button, Object.assign({ size: "small", variant: "outlined", component: Link, to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent) }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.event.see", id: "ui.event.see" }) })) })))] })));
     }
     else if (template === SCEventTemplateType.PREVIEW) {
-        contentObj = (_jsxs(PreviewRoot, { className: classes.previewRoot, children: [_jsxs(Box, { position: "relative", className: classes.previewImageWrapper, children: [_jsx(CardMedia, { component: "img", image: scEvent.image_medium, alt: scEvent.name, className: classes.previewImage }), !hideInProgress && inProgress && (_jsx(Chip, { size: "small", component: "div", label: _jsx(FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.previewInProgress }))] }), _jsxs(CardContent, { className: classes.previewContent, children: [_jsx(EventInfoDetails, { event: scEvent, hidePrivacyIcon: true, hasLocationInfo: false, beforePrivacyInfo: _jsx(Link, { to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.previewNameWrapper, children: _jsx(Typography, { variant: "h5", className: classes.previewName, children: scEvent.name }) }) }), !hideEventParticipants && _jsx(EventParticipantsButton, Object.assign({ event: scEvent, hideCaption: true }, EventParticipantsButtonComponentProps))] }), actions !== null && actions !== void 0 ? actions : (_jsx(CardActions, { className: classes.previewActions, children: _jsx(Button, { size: "small", variant: "outlined", component: Link, to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent), children: _jsx(FormattedMessage, { defaultMessage: "ui.event.see", id: "ui.event.see" }) }) }))] }));
+        contentObj = (_jsxs(PreviewRoot, Object.assign({ className: classes.previewRoot }, { children: [_jsxs(Box, Object.assign({ position: "relative", className: classes.previewImageWrapper }, { children: [_jsx(CardMedia, { component: "img", image: scEvent.image_medium, alt: scEvent.name, className: classes.previewImage }), !hideInProgress && inProgress && (_jsx(Chip, { size: "small", component: "div", label: _jsx(FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.previewInProgress }))] })), _jsxs(CardContent, Object.assign({ className: classes.previewContent }, { children: [_jsx(EventInfoDetails, { event: scEvent, hidePrivacyIcon: true, hasLocationInfo: false, beforePrivacyInfo: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.previewNameWrapper }, { children: _jsx(Typography, Object.assign({ variant: "h5", className: classes.previewName }, { children: scEvent.name })) })) }), !hideEventParticipants && _jsx(EventParticipantsButton, Object.assign({ event: scEvent, hideCaption: true }, EventParticipantsButtonComponentProps))] })), actions !== null && actions !== void 0 ? actions : (_jsx(CardActions, Object.assign({ className: classes.previewActions }, { children: _jsx(Button, Object.assign({ size: "small", variant: "outlined", component: Link, to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent) }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.event.see", id: "ui.event.see" }) })) })))] })));
     }
     else {
-        contentObj = (_jsx(SnippetRoot, { elevation: 0, square: true, disableTypography: true, className: classes.snippetRoot, image: _jsxs(Box, { className: classes.snippetImage, children: [_jsx(Avatar, { variant: "square", alt: scEvent.name, src: scEvent.image_medium, className: classes.snippetAvatar }), ' ', !hideInProgress && inProgress && (_jsx(Chip, { size: "small", component: "div", label: _jsx(FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.snippetInProgress }))] }), primary: _jsxs(Link, { to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.snippetPrimary, children: [_jsx(Typography, { component: "span", children: `${intl.formatDate(scEvent.start_date, {
+        contentObj = (_jsx(SnippetRoot, { elevation: 0, square: true, disableTypography: true, className: classes.snippetRoot, image: _jsxs(Box, Object.assign({ className: classes.snippetImage }, { children: [_jsx(Avatar, { variant: "square", alt: scEvent.name, src: scEvent.image_medium, className: classes.snippetAvatar }), ' ', !hideInProgress && inProgress && (_jsx(Chip, { size: "small", component: "div", label: _jsx(FormattedMessage, { id: "ui.event.inProgress", defaultMessage: "ui.event.inProgress" }), className: classes.snippetInProgress }))] })), primary: _jsxs(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent), className: classes.snippetPrimary }, { children: [_jsx(Typography, Object.assign({ component: "span" }, { children: `${intl.formatDate(scEvent.start_date, {
                             weekday: 'long',
                             month: 'long',
                             day: 'numeric'
-                        })}` }), _jsx(Typography, { variant: "body1", children: scEvent.name })] }), secondary: _jsxs(Typography, { component: "p", variant: "body2", className: classes.snippetSecondary, children: [_jsx(FormattedMessage, { id: `ui.eventForm.privacy.${scEvent.privacy}`, defaultMessage: `ui.eventForm.privacy.${scEvent.privacy}` }), " -", ' ', (scEvent === null || scEvent === void 0 ? void 0 : scEvent.location) === SCEventLocationType.PERSON ? (_jsx(FormattedMessage, { id: `ui.eventForm.address.live.label`, defaultMessage: `ui.eventForm.address.live.label` })) : (_jsx(FormattedMessage, { id: `ui.eventForm.address.online.label`, defaultMessage: `ui.eventForm.address.online.label` }))] }), actions: actions !== null && actions !== void 0 ? actions : (_jsx(Box, { className: classes.snippetActions, children: _jsx(Button, { size: "small", variant: "outlined", component: Link, to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent), children: _jsx(FormattedMessage, { defaultMessage: "ui.event.see", id: "ui.event.see" }) }) })) }));
+                        })}` })), _jsx(Typography, Object.assign({ variant: "body1" }, { children: scEvent.name }))] })), secondary: _jsxs(Typography, Object.assign({ component: "p", variant: "body2", className: classes.snippetSecondary }, { children: [_jsx(FormattedMessage, { id: `ui.eventForm.privacy.${scEvent.privacy}`, defaultMessage: `ui.eventForm.privacy.${scEvent.privacy}` }), " -", ' ', (scEvent === null || scEvent === void 0 ? void 0 : scEvent.location) === SCEventLocationType.PERSON ? (_jsx(FormattedMessage, { id: `ui.eventForm.address.live.label`, defaultMessage: `ui.eventForm.address.live.label` })) : (_jsx(FormattedMessage, { id: `ui.eventForm.address.online.label`, defaultMessage: `ui.eventForm.address.online.label` }))] })), actions: actions !== null && actions !== void 0 ? actions : (_jsx(Box, Object.assign({ className: classes.snippetActions }, { children: _jsx(Button, Object.assign({ size: "small", variant: "outlined", component: Link, to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, scEvent) }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.event.see", id: "ui.event.see" }) })) }))) }));
     }
     /**
      * Renders root object

package/lib/esm/components/Event/Skeleton.js

@@ -77,13 +77,13 @@ export default function EventSkeleton(inProps) {
      */
     let contentObj;
     if (template === SCEventTemplateType.DETAIL) {
-        contentObj = (_jsxs(SkeletonDetailRoot, { className: classes.skeletonDetailRoot, children: [_jsxs(Box, { position: "relative", children: [_jsx(Skeleton, { variant: "rectangular", animation: skeletonsAnimation, width: "100%", height: "170px" }), _jsx(Skeleton, { className: classes.skeletonDetailCalendar, variant: "rounded", animation: skeletonsAnimation, width: "60px", height: "60px" })] }), _jsxs(CardContent, { className: classes.skeletonDetailContent, children: [_jsx(Skeleton, { animation: skeletonsAnimation, width: "36%", height: "40px" }), _jsxs(Stack, { direction: "row", alignItems: "center", gap: "8px", marginBottom: "9px", children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "50%", height: "20px" })] }), _jsxs(Stack, { direction: "row", alignItems: "center", gap: "8px", marginBottom: "9px", children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "35%", height: "20px" })] }), _jsxs(Stack, { direction: "row", alignItems: "center", gap: "8px", marginBottom: "14px", children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "27%", height: "20px" })] }), _jsxs(Stack, { direction: "row", gap: "8px", className: classes.skeletonDetailUser, children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "36px", height: "36px" }), _jsxs(Stack, { gap: "1px", children: [_jsx(Skeleton, { animation: skeletonsAnimation, width: "75px", height: "15px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "86px", height: "16px" })] })] }), _jsx(Divider, { className: classes.skeletonDetailFirstDivider }), _jsxs(Stack, { direction: "row", gap: "8px", alignItems: "center", height: "28px", children: [_jsx(Skeleton, { animation: skeletonsAnimation, width: "68px", height: "20px" }), _jsxs(AvatarGroup, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" })] })] }), _jsx(Divider, { className: classes.skeletonDetailSecondDivider })] }), _jsx(CardActions, { className: classes.skeletonDetailActions, children: actions !== undefined ? actions : _jsx(Skeleton, { variant: "rounded", width: 100, height: 30 }) })] }));
+        contentObj = (_jsxs(SkeletonDetailRoot, Object.assign({ className: classes.skeletonDetailRoot }, { children: [_jsxs(Box, Object.assign({ position: "relative" }, { children: [_jsx(Skeleton, { variant: "rectangular", animation: skeletonsAnimation, width: "100%", height: "170px" }), _jsx(Skeleton, { className: classes.skeletonDetailCalendar, variant: "rounded", animation: skeletonsAnimation, width: "60px", height: "60px" })] })), _jsxs(CardContent, Object.assign({ className: classes.skeletonDetailContent }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, width: "36%", height: "40px" }), _jsxs(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px", marginBottom: "9px" }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "50%", height: "20px" })] })), _jsxs(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px", marginBottom: "9px" }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "35%", height: "20px" })] })), _jsxs(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px", marginBottom: "14px" }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "27%", height: "20px" })] })), _jsxs(Stack, Object.assign({ direction: "row", gap: "8px", className: classes.skeletonDetailUser }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "36px", height: "36px" }), _jsxs(Stack, Object.assign({ gap: "1px" }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, width: "75px", height: "15px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "86px", height: "16px" })] }))] })), _jsx(Divider, { className: classes.skeletonDetailFirstDivider }), _jsxs(Stack, Object.assign({ direction: "row", gap: "8px", alignItems: "center", height: "28px" }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, width: "68px", height: "20px" }), _jsxs(AvatarGroup, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" })] })] })), _jsx(Divider, { className: classes.skeletonDetailSecondDivider })] })), _jsx(CardActions, Object.assign({ className: classes.skeletonDetailActions }, { children: actions !== undefined ? actions : _jsx(Skeleton, { variant: "rounded", width: 100, height: 30 }) }))] })));
     }
     else if (template === SCEventTemplateType.PREVIEW) {
-        contentObj = (_jsxs(SkeletonPreviewRoot, { className: classes.skeletonPreviewRoot, children: [_jsx(Box, { position: "relative", children: _jsx(Skeleton, { variant: "rectangular", animation: skeletonsAnimation, width: "100%", height: "80px" }) }), _jsxs(CardContent, { className: classes.skeletonPreviewContent, children: [_jsxs(Stack, { direction: "row", alignItems: "center", gap: "8px", children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "50%", height: "20px" })] }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "67%", height: "25px", className: classes.skeletonPreviewName }), _jsx(Stack, { direction: "row", alignItems: "center", gap: "8px", marginBottom: "2px", children: _jsx(Skeleton, { animation: skeletonsAnimation, width: "27%", height: "18px" }) }), _jsx(Stack, { direction: "row", gap: "8px", alignItems: "center", children: _jsxs(AvatarGroup, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: `${theme.selfcommunity.user.avatar.sizeSmall}px`, height: `${theme.selfcommunity.user.avatar.sizeSmall}px` }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: `${theme.selfcommunity.user.avatar.sizeSmall}px`, height: `${theme.selfcommunity.user.avatar.sizeSmall}px` }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: `${theme.selfcommunity.user.avatar.sizeSmall}px`, height: `${theme.selfcommunity.user.avatar.sizeSmall}px` })] }) })] }), _jsx(CardActions, { className: classes.skeletonPreviewActions, children: actions !== undefined ? actions : _jsx(Skeleton, { variant: "rounded", width: 100, height: 30 }) })] }));
+        contentObj = (_jsxs(SkeletonPreviewRoot, Object.assign({ className: classes.skeletonPreviewRoot }, { children: [_jsx(Box, Object.assign({ position: "relative" }, { children: _jsx(Skeleton, { variant: "rectangular", animation: skeletonsAnimation, width: "100%", height: "80px" }) })), _jsxs(CardContent, Object.assign({ className: classes.skeletonPreviewContent }, { children: [_jsxs(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px" }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: skeletonsAnimation, width: "50%", height: "20px" })] })), _jsx(Skeleton, { animation: skeletonsAnimation, width: "67%", height: "25px", className: classes.skeletonPreviewName }), _jsx(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px", marginBottom: "2px" }, { children: _jsx(Skeleton, { animation: skeletonsAnimation, width: "27%", height: "18px" }) })), _jsx(Stack, Object.assign({ direction: "row", gap: "8px", alignItems: "center" }, { children: _jsxs(AvatarGroup, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: `${theme.selfcommunity.user.avatar.sizeSmall}px`, height: `${theme.selfcommunity.user.avatar.sizeSmall}px` }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: `${theme.selfcommunity.user.avatar.sizeSmall}px`, height: `${theme.selfcommunity.user.avatar.sizeSmall}px` }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "circular", width: `${theme.selfcommunity.user.avatar.sizeSmall}px`, height: `${theme.selfcommunity.user.avatar.sizeSmall}px` })] }) }))] })), _jsx(CardActions, Object.assign({ className: classes.skeletonPreviewActions }, { children: actions !== undefined ? actions : _jsx(Skeleton, { variant: "rounded", width: 100, height: 30 }) }))] })));
     }
     else {
-        contentObj = (_jsx(SkeletonSnippetRoot, { elevation: 0, square: true, disableTypography: true, className: classes.skeletonSnippetRoot, image: _jsxs(Box, { className: classes.skeletonSnippetImage, children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "rectangular", width: 100, height: 60 }), " ", _jsx(Icon, { fontSize: "large", children: "CalendarIcon" })] }), primary: _jsx(Skeleton, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: "40%", style: { marginBottom: 12 } }), secondary: _jsxs(_Fragment, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: "60%", style: { marginBottom: 10, marginRight: 5 } }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: "35%" })] }), actions: _jsx(_Fragment, { children: actions !== undefined ? (actions) : (_jsx(Button, { size: "small", variant: "outlined", disabled: true, children: _jsx(Skeleton, { animation: skeletonsAnimation, height: 10, width: 30, style: { marginTop: 5, marginBottom: 5 } }) })) }) }));
+        contentObj = (_jsx(SkeletonSnippetRoot, { elevation: 0, square: true, disableTypography: true, className: classes.skeletonSnippetRoot, image: _jsxs(Box, Object.assign({ className: classes.skeletonSnippetImage }, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "rectangular", width: 100, height: 60 }), " ", _jsx(Icon, Object.assign({ fontSize: "large" }, { children: "CalendarIcon" }))] })), primary: _jsx(Skeleton, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: "40%", style: { marginBottom: 12 } }), secondary: _jsxs(_Fragment, { children: [_jsx(Skeleton, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: "60%", style: { marginBottom: 10, marginRight: 5 } }), _jsx(Skeleton, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: "35%" })] }), actions: _jsx(_Fragment, { children: actions !== undefined ? (actions) : (_jsx(Button, Object.assign({ size: "small", variant: "outlined", disabled: true }, { children: _jsx(Skeleton, { animation: skeletonsAnimation, height: 10, width: 30, style: { marginTop: 5, marginBottom: 5 } }) }))) }) }));
     }
     return (_jsx(Root, Object.assign({ className: classNames(classes.root, className, `${PREFIX}-skeleton-${template}`) }, rest, { children: contentObj })));
 }

package/lib/esm/components/EventAutocomplete/EventAutocomplete.js

@@ -87,7 +87,7 @@ const EventAutocomplete = (inProps) => {
         renderOption: (props, option, { inputValue }) => {
             const matches = match(option.name, inputValue);
             const parts = parse(option.name, matches);
-            return (_jsxs(Box, Object.assign({ component: "li" }, props, { children: [_jsx(Avatar, { alt: option.name, src: option.image_small, sx: { marginRight: 1 } }), _jsx(React.Fragment, { children: parts.map((part, index) => (_jsx(Typography, { sx: { fontWeight: part.highlight ? 700 : 400, marginRight: 0.2 }, children: part.text }, index))) })] })));
+            return (_jsxs(Box, Object.assign({ component: "li" }, props, { children: [_jsx(Avatar, { alt: option.name, src: option.image_small, sx: { marginRight: 1 } }), _jsx(React.Fragment, { children: parts.map((part, index) => (_jsx(Typography, Object.assign({ sx: { fontWeight: part.highlight ? 700 : 400, marginRight: 0.2 } }, { children: part.text }), index))) })] })));
         }, renderInput: (params) => {
             return (_jsx(TextField, Object.assign({}, params, TextFieldProps, { margin: "dense", InputProps: Object.assign(Object.assign({}, params.InputProps), { autoComplete: 'events', endAdornment: (_jsxs(React.Fragment, { children: [isLoading ? _jsx(CircularProgress, { color: "inherit", size: 20 }) : null, params.InputProps.endAdornment] })) }) })));
         } }, rest)));

package/lib/esm/components/EventForm/EventAddress.js

@@ -112,7 +112,7 @@ export default function EventAddress(inProps) {
     if (!geocodingApiKey && !isLoaded) {
         return _jsx(HiddenPlaceholder, {});
     }
-    return (_jsxs(Root, { className: classNames(classes.root, className), children: [_jsxs(Tabs, { className: classes.tabs, value: location, onChange: handleChange, indicatorColor: "secondary", textColor: "secondary", variant: "fullWidth", children: [_jsx(Tab, { value: SCEventLocationType.PERSON, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "add_location_alt" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.label", defaultMessage: "ui.eventForm.address.live.label" }) }), _jsx(Tab, { value: SCEventLocationType.ONLINE, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "play_circle_outline" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.label", defaultMessage: "ui.eventForm.address.online.label" }) })] }), _jsxs(Box, { className: classes.tabContent, children: [location === SCEventLocationType.PERSON && (_jsx(Autocomplete, { size: "small", value: geolocation, onChange: handleSelection, inputValue: inputValue, onInputChange: handleLocationChange, options: suggestions, getOptionLabel: (option) => option.description || geolocation.description, noOptionsText: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.noResults", defaultMessage: "ui.eventForm.address.live.noResults" }), isOptionEqualToValue: (option, value) => option.description === value.description, renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { label: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.placeholder", defaultMessage: "ui.eventForm.address.live.placeholder" }), variant: "outlined", fullWidth: true, InputProps: Object.assign(Object.assign({}, params.InputProps), { endAdornment: (_jsxs(_Fragment, { children: [_jsx(InputAdornment, { position: "start", children: _jsx(Icon, { children: "add_location_alt" }) }), params.InputProps.endAdornment] })) }) }))) })), location === SCEventLocationType.ONLINE && (_jsx(UrlTextField, { size: "small", fullWidth: true, type: "url", placeholder: `${intl.formatMessage(messages.virtualPlaceholder)}`, helperText: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.help", defaultMessage: "ui.eventForm.address.online.help" }), InputProps: {
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [_jsxs(Tabs, Object.assign({ className: classes.tabs, value: location, onChange: handleChange, indicatorColor: "secondary", textColor: "secondary", variant: "fullWidth" }, { children: [_jsx(Tab, { value: SCEventLocationType.PERSON, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "add_location_alt" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.label", defaultMessage: "ui.eventForm.address.live.label" }) }), _jsx(Tab, { value: SCEventLocationType.ONLINE, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "play_circle_outline" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.label", defaultMessage: "ui.eventForm.address.online.label" }) })] })), _jsxs(Box, Object.assign({ className: classes.tabContent }, { children: [location === SCEventLocationType.PERSON && (_jsx(Autocomplete, { size: "small", value: geolocation, onChange: handleSelection, inputValue: inputValue, onInputChange: handleLocationChange, options: suggestions, getOptionLabel: (option) => option.description || geolocation.description, noOptionsText: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.noResults", defaultMessage: "ui.eventForm.address.live.noResults" }), isOptionEqualToValue: (option, value) => option.description === value.description, renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { label: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.placeholder", defaultMessage: "ui.eventForm.address.live.placeholder" }), variant: "outlined", fullWidth: true, InputProps: Object.assign(Object.assign({}, params.InputProps), { endAdornment: (_jsxs(_Fragment, { children: [_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(Icon, { children: "add_location_alt" }) })), params.InputProps.endAdornment] })) }) }))) })), location === SCEventLocationType.ONLINE && (_jsx(UrlTextField, { size: "small", fullWidth: true, type: "url", placeholder: `${intl.formatMessage(messages.virtualPlaceholder)}`, helperText: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.help", defaultMessage: "ui.eventForm.address.online.help" }), InputProps: {
                             endAdornment: _jsx(Icon, { children: "play_circle_outline" })
-                        }, onChange: handleLinkChange }))] })] }));
+                        }, onChange: handleLinkChange }))] }))] })));
 }

package/lib/esm/components/EventForm/EventForm.js

@@ -282,10 +282,10 @@ export default function EventForm(inProps) {
     /**
      * Renders root object
      */
-    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsx(Paper, { style: _backgroundCover, classes: { root: classes.cover }, children: _jsx(UploadEventCover, { isCreationMode: true, onChange: handleChangeCover }) }), _jsxs(FormGroup, { className: classes.form, children: [_jsx(TextField, { required: true, className: classes.name, placeholder: `${intl.formatMessage(messages.name)}`, margin: "normal", value: field.name, name: "name", onChange: handleChange, InputProps: {
-                            endAdornment: _jsx(Typography, { variant: "body2", children: EVENT_TITLE_MAX_LENGTH - field.name.length })
-                        }, error: Boolean(field.name.length > EVENT_TITLE_MAX_LENGTH) || Boolean(error['nameError']), helperText: field.name.length > EVENT_TITLE_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.eventForm.name.error.maxLength", defaultMessage: "ui.eventForm.name.error.maxLength" })) : error['nameError'] ? (error['nameError']) : null }), _jsx(Box, { className: classes.dateTime, children: _jsxs(LocalizationProvider, { dateAdapter: AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? itLocale : enLocale, children: [_jsx(MobileDatePicker, { className: classes.picker, disablePast: true, label: field.startDate && _jsx(FormattedMessage, { id: "ui.eventForm.date.placeholder", defaultMessage: "ui.eventForm.date.placeholder" }), value: field.startDate, slots: {
-                                        textField: (params) => (_jsx(TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { placeholder: `${intl.formatMessage(messages.startDate)}`, startAdornment: (_jsx(InputAdornment, { position: "start", children: _jsx(IconButton, { children: _jsx(Icon, { children: "CalendarIcon" }) }) })) }) })))
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsx(Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: _jsx(UploadEventCover, { isCreationMode: true, onChange: handleChangeCover }) })), _jsxs(FormGroup, Object.assign({ className: classes.form }, { children: [_jsx(TextField, { required: true, className: classes.name, placeholder: `${intl.formatMessage(messages.name)}`, margin: "normal", value: field.name, name: "name", onChange: handleChange, InputProps: {
+                            endAdornment: _jsx(Typography, Object.assign({ variant: "body2" }, { children: EVENT_TITLE_MAX_LENGTH - field.name.length }))
+                        }, error: Boolean(field.name.length > EVENT_TITLE_MAX_LENGTH) || Boolean(error['nameError']), helperText: field.name.length > EVENT_TITLE_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.eventForm.name.error.maxLength", defaultMessage: "ui.eventForm.name.error.maxLength" })) : error['nameError'] ? (error['nameError']) : null }), _jsx(Box, Object.assign({ className: classes.dateTime }, { children: _jsxs(LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? itLocale : enLocale }, { children: [_jsx(MobileDatePicker, { className: classes.picker, disablePast: true, label: field.startDate && _jsx(FormattedMessage, { id: "ui.eventForm.date.placeholder", defaultMessage: "ui.eventForm.date.placeholder" }), value: field.startDate, slots: {
+                                        textField: (params) => (_jsx(TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { placeholder: `${intl.formatMessage(messages.startDate)}`, startAdornment: (_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "CalendarIcon" }) }) }))) }) })))
                                     }, slotProps: {
                                         toolbar: {
                                             // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
@@ -293,26 +293,26 @@ export default function EventForm(inProps) {
                                             toolbarTitle: _jsx(FormattedMessage, { id: "ui.eventForm.date.title", defaultMessage: "ui.eventForm.date.title" })
                                         }
                                     }, onChange: (value) => handleChangeDateTime(value, 'startDate') }), _jsx(MobileTimePicker, { className: classes.picker, disablePast: disablePastStartTime, label: field.startTime && _jsx(FormattedMessage, { id: "ui.eventForm.time.placeholder", defaultMessage: "ui.eventForm.time.placeholder" }), value: field.startTime, slots: {
-                                        textField: (params) => (_jsx(TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { placeholder: `${intl.formatMessage(messages.startTime)}`, startAdornment: (_jsx(InputAdornment, { position: "start", children: _jsx(IconButton, { children: _jsx(Icon, { children: "access_time" }) }) })) }) })))
+                                        textField: (params) => (_jsx(TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { placeholder: `${intl.formatMessage(messages.startTime)}`, startAdornment: (_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "access_time" }) }) }))) }) })))
                                     }, slotProps: {
                                         toolbar: {
                                             // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
                                             // @ts-ignore
                                             toolbarTitle: _jsx(FormattedMessage, { id: "ui.eventForm.time.title", defaultMessage: "ui.eventForm.time.title" })
                                         }
-                                    }, onChange: (value) => handleChangeDateTime(value, 'startTime') })] }) }), _jsxs(FormControl, { className: classes.frequency, children: [field.recurring !== SCEventRecurrenceType.NEVER && _jsx(InputLabel, { id: "recurring", children: `${intl.formatMessage(messages.frequency)}` }), _jsx(Select, { name: "recurring", label: field.recurring !== SCEventRecurrenceType.NEVER && `${intl.formatMessage(messages.frequency)}`, labelId: "recurring", value: field.recurring, onChange: handleChange, displayEmpty: true, renderValue: (selected) => {
+                                    }, onChange: (value) => handleChangeDateTime(value, 'startTime') })] })) })), _jsxs(FormControl, Object.assign({ className: classes.frequency }, { children: [field.recurring !== SCEventRecurrenceType.NEVER && _jsx(InputLabel, Object.assign({ id: "recurring" }, { children: `${intl.formatMessage(messages.frequency)}` })), _jsx(Select, Object.assign({ name: "recurring", label: field.recurring !== SCEventRecurrenceType.NEVER && `${intl.formatMessage(messages.frequency)}`, labelId: "recurring", value: field.recurring, onChange: handleChange, displayEmpty: true, renderValue: (selected) => {
                                     if (!selected) {
                                         return _jsx("em", { children: `${intl.formatMessage(messages.frequencyPlaceholder)}` });
                                     }
                                     return (_jsx(FormattedMessage, { id: `ui.eventForm.frequency.${selected}.placeholder`, defaultMessage: `ui.eventForm.frequency.${selected}.placeholder` }));
-                                }, startAdornment: _jsx(InputAdornment, { position: "start", children: _jsx(IconButton, { children: _jsx(Icon, { children: "frequency" }) }) }), children: Object.values(SCEventRecurrenceType).map((f) => (_jsx(MenuItem, { value: f, children: _jsx(FormattedMessage, { id: `ui.eventForm.frequency.${f}.placeholder`, defaultMessage: `ui.eventForm.frequency.${f}.placeholder` }) }, f))) })] }), _jsx(Box, { className: classes.dateTime, children: _jsxs(LocalizationProvider, { dateAdapter: AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? itLocale : enLocale, children: [_jsx(MobileDatePicker, { className: classes.picker, disablePast: true, minDate: field.startDate, label: _jsx(FormattedMessage, { id: "ui.eventForm.date.end.placeholder", defaultMessage: "ui.eventForm.date.end.placeholder" }), value: field.endDate, slots: {
-                                        textField: (params) => (_jsx(TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { placeholder: `${intl.formatMessage(messages.endDate)}`, startAdornment: (_jsx(InputAdornment, { position: "start", children: _jsx(IconButton, { children: _jsx(Icon, { children: "calendar_off" }) }) })) }) })))
+                                }, startAdornment: _jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "frequency" }) }) })) }, { children: Object.values(SCEventRecurrenceType).map((f) => (_jsx(MenuItem, Object.assign({ value: f }, { children: _jsx(FormattedMessage, { id: `ui.eventForm.frequency.${f}.placeholder`, defaultMessage: `ui.eventForm.frequency.${f}.placeholder` }) }), f))) }))] })), _jsx(Box, Object.assign({ className: classes.dateTime }, { children: _jsxs(LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? itLocale : enLocale }, { children: [_jsx(MobileDatePicker, { className: classes.picker, disablePast: true, minDate: field.startDate, label: _jsx(FormattedMessage, { id: "ui.eventForm.date.end.placeholder", defaultMessage: "ui.eventForm.date.end.placeholder" }), value: field.endDate, slots: {
+                                        textField: (params) => (_jsx(TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { placeholder: `${intl.formatMessage(messages.endDate)}`, startAdornment: (_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "calendar_off" }) }) }))) }) })))
                                     }, onChange: (value) => handleChangeDateTime(value, 'endDate'), shouldDisableDate: shouldDisabledDate }), _jsx(MobileTimePicker, { className: classes.picker, disablePast: disablePastEndTime, label: field.endTime && _jsx(FormattedMessage, { id: "ui.eventForm.time.end.placeholder", defaultMessage: "ui.eventForm.time.end.placeholder" }), value: field.endTime, slots: {
                                         textField: (params) => {
                                             var _a;
-                                            return (_jsx(TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { placeholder: `${intl.formatMessage(messages.endTime)}`, startAdornment: (_jsx(InputAdornment, { position: "start", children: _jsx(IconButton, { children: _jsx(Icon, { children: "access_time" }) }) })) }), error: Boolean(error['endDateError']), helperText: ((_a = error['endDateError']) === null || _a === void 0 ? void 0 : _a.error) ? (_jsx(FormattedMessage, { id: "ui.eventForm.time.end.error.invalid", defaultMessage: "ui.eventForm.time.end.error.invalid" })) : null })));
+                                            return (_jsx(TextField, Object.assign({}, params, { InputProps: Object.assign(Object.assign({}, params.InputProps), { placeholder: `${intl.formatMessage(messages.endTime)}`, startAdornment: (_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(IconButton, { children: _jsx(Icon, { children: "access_time" }) }) }))) }), error: Boolean(error['endDateError']), helperText: ((_a = error['endDateError']) === null || _a === void 0 ? void 0 : _a.error) ? (_jsx(FormattedMessage, { id: "ui.eventForm.time.end.error.invalid", defaultMessage: "ui.eventForm.time.end.error.invalid" })) : null })));
                                         }
-                                    }, onChange: (value) => handleChangeDateTime(value, 'endTime'), shouldDisableTime: shouldDisabledTime })] }) }), _jsx(EventAddress, { forwardGeolocationData: handleGeoData, event: event !== null && event !== void 0 ? event : null }), privateEnabled && (_jsxs(Box, { className: classes.privacySection, children: [_jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", justifyContent: "center", children: [_jsxs(Typography, { className: classNames(classes.switchLabel, { [classes.active]: !field.isPublic }), children: [_jsx(Icon, { children: "private" }), _jsx(FormattedMessage, { id: "ui.eventForm.privacy.private", defaultMessage: "ui.eventForm.privacy.private" })] }), _jsx(Switch, { className: classes.switch, checked: field.isPublic, onChange: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['isPublic']: !field.isPublic }))), disabled: event && !field.isPublic }), _jsxs(Typography, { className: classNames(classes.switchLabel, { [classes.active]: field.isPublic }), children: [_jsx(Icon, { children: "public" }), _jsx(FormattedMessage, { id: "ui.eventForm.privacy.public", defaultMessage: "ui.eventForm.privacy.public" })] })] }), _jsx(Typography, { variant: "body2", textAlign: "center", className: classes.privacySectionInfo, children: field.isPublic ? (_jsx(FormattedMessage, { id: "ui.eventForm.privacy.public.info", defaultMessage: "ui.eventForm.privacy.public.info", values: {
+                                    }, onChange: (value) => handleChangeDateTime(value, 'endTime'), shouldDisableTime: shouldDisabledTime })] })) })), _jsx(EventAddress, { forwardGeolocationData: handleGeoData, event: event !== null && event !== void 0 ? event : null }), privateEnabled && (_jsxs(Box, Object.assign({ className: classes.privacySection }, { children: [_jsxs(Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center", justifyContent: "center" }, { children: [_jsxs(Typography, Object.assign({ className: classNames(classes.switchLabel, { [classes.active]: !field.isPublic }) }, { children: [_jsx(Icon, { children: "private" }), _jsx(FormattedMessage, { id: "ui.eventForm.privacy.private", defaultMessage: "ui.eventForm.privacy.private" })] })), _jsx(Switch, { className: classes.switch, checked: field.isPublic, onChange: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['isPublic']: !field.isPublic }))), disabled: event && !field.isPublic }), _jsxs(Typography, Object.assign({ className: classNames(classes.switchLabel, { [classes.active]: field.isPublic }) }, { children: [_jsx(Icon, { children: "public" }), _jsx(FormattedMessage, { id: "ui.eventForm.privacy.public", defaultMessage: "ui.eventForm.privacy.public" })] }))] })), _jsx(Typography, Object.assign({ variant: "body2", textAlign: "center", className: classes.privacySectionInfo }, { children: field.isPublic ? (_jsx(FormattedMessage, { id: "ui.eventForm.privacy.public.info", defaultMessage: "ui.eventForm.privacy.public.info", values: {
                                         // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                         // @ts-ignore
                                         b: (chunks) => _jsx("strong", { children: chunks })
@@ -320,9 +320,9 @@ export default function EventForm(inProps) {
                                         // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                         // @ts-ignore
                                         b: (chunks) => _jsx("strong", { children: chunks })
-                                    } })) })] })), _jsx(TextField, { multiline: true, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
-                            endAdornment: (_jsx(Typography, { variant: "body2", children: ((_b = field.description) === null || _b === void 0 ? void 0 : _b.length) ? EVENT_DESCRIPTION_MAX_LENGTH - field.description.length : EVENT_DESCRIPTION_MAX_LENGTH }))
-                        }, error: Boolean(((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) > EVENT_DESCRIPTION_MAX_LENGTH), helperText: ((_d = field.description) === null || _d === void 0 ? void 0 : _d.length) > EVENT_DESCRIPTION_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.eventForm.description.error.maxLength", defaultMessage: "ui.eventForm.description.error.maxLength" })) : null }), _jsx(Box, { className: classes.actions, children: _jsx(LoadingButton, { loading: field.isSubmitting, disabled: !field.name ||
+                                    } })) }))] }))), _jsx(TextField, { multiline: true, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
+                            endAdornment: (_jsx(Typography, Object.assign({ variant: "body2" }, { children: ((_b = field.description) === null || _b === void 0 ? void 0 : _b.length) ? EVENT_DESCRIPTION_MAX_LENGTH - field.description.length : EVENT_DESCRIPTION_MAX_LENGTH })))
+                        }, error: Boolean(((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) > EVENT_DESCRIPTION_MAX_LENGTH), helperText: ((_d = field.description) === null || _d === void 0 ? void 0 : _d.length) > EVENT_DESCRIPTION_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.eventForm.description.error.maxLength", defaultMessage: "ui.eventForm.description.error.maxLength" })) : null }), _jsx(Box, Object.assign({ className: classes.actions }, { children: _jsx(LoadingButton, Object.assign({ loading: field.isSubmitting, disabled: !field.name ||
                                 !field.startDate ||
                                 !field.startTime ||
                                 !field.endDate ||
@@ -332,5 +332,5 @@ export default function EventForm(inProps) {
                                 (field.recurring !== SCEventRecurrenceType.NEVER && !field.endDate && !field.endTime) ||
                                 Object.keys(error).length !== 0 ||
                                 field.name.length > EVENT_TITLE_MAX_LENGTH ||
-                                field.description.length > EVENT_DESCRIPTION_MAX_LENGTH, variant: "contained", onClick: handleSubmit, color: "secondary", children: event ? (_jsx(FormattedMessage, { id: "ui.eventForm.button.edit", defaultMessage: "ui.eventForm.button.edit" })) : (_jsx(FormattedMessage, { id: "ui.eventForm.button.create", defaultMessage: "ui.eventForm.button.create" })) }) })] })] })));
+                                field.description.length > EVENT_DESCRIPTION_MAX_LENGTH, variant: "contained", onClick: handleSubmit, color: "secondary" }, { children: event ? (_jsx(FormattedMessage, { id: "ui.eventForm.button.edit", defaultMessage: "ui.eventForm.button.edit" })) : (_jsx(FormattedMessage, { id: "ui.eventForm.button.create", defaultMessage: "ui.eventForm.button.create" })) })) }))] }))] })));
 }

package/lib/esm/components/EventForm/UploadEventCover.js

@@ -114,7 +114,7 @@ export default function UploadEventCover(inProps) {
      * If there is an error
      */
     if (alert) {
-        return (_jsx(Alert, { color: "error", onClose: () => setAlert(null), children: alert }));
+        return (_jsx(Alert, Object.assign({ color: "error", onClose: () => setAlert(null) }, { children: alert })));
     }
     return (_jsxs(_Fragment, { children: [_jsx("input", { type: "file", onChange: handleUpload, ref: fileInput, hidden: true, accept: ".gif,.png,.jpg,.jpeg" }), _jsx(Root, Object.assign({ className: classNames(classes.root, className), size: "medium", variant: "contained", disabled: loading, onClick: () => fileInput.current.click(), loading: loading }, rest, { children: _jsx(Icon, { children: "image" }) }))] }));
 }

package/lib/esm/components/EventHeader/EventHeader.js

@@ -138,7 +138,7 @@ export default function EventHeader(inProps) {
     return (
     // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
     // @ts-ignore
-    _jsxs(Root, Object.assign({ id: id, className: classNames(classes.root, className), isEventAdmin: isEventAdmin, isEventFinished: isEventFinished }, rest, { children: [_jsx(Paper, { style: _backgroundCover, classes: { root: classes.cover }, children: _jsx(Box, { className: classes.calendar, children: _jsx(Calendar, { day: new Date(scEvent.start_date).getDate() }) }) }), _jsxs(Box, { className: classes.info, children: [scEvent.running && (_jsx(Typography, { variant: "body1", className: classes.inProgress, children: _jsx(FormattedMessage, { id: "ui.eventHeader.inProgress", defaultMessage: "ui.eventHeader.inProgress" }) })), isEventFinished && (_jsx(Chip, { icon: _jsx(Icon, { fontSize: "small", className: classes.chipIcon, children: "calendar_off" }), label: _jsx(Typography, { variant: "body1", children: _jsx(FormattedMessage, { id: "ui.eventHeader.finished", defaultMessage: "ui.eventHeader.finished" }) }), variant: "outlined", size: "medium", color: "secondary", className: classes.chip })), _jsx(Typography, { className: classes.time, children: scEvent.end_date && scEvent.end_date !== scEvent.start_date ? (new Date(scEvent.start_date).getDate() !== new Date(scEvent.end_date).getDate() ? (_jsx(FormattedMessage, { id: "ui.eventHeader.startEndTimeDiff", defaultMessage: "ui.eventHeader.startEndTimeDiff", values: {
+    _jsxs(Root, Object.assign({ id: id, className: classNames(classes.root, className), isEventAdmin: isEventAdmin, isEventFinished: isEventFinished }, rest, { children: [_jsx(Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: _jsx(Box, Object.assign({ className: classes.calendar }, { children: _jsx(Calendar, { day: new Date(scEvent.start_date).getDate() }) })) })), _jsxs(Box, Object.assign({ className: classes.info }, { children: [scEvent.running && (_jsx(Typography, Object.assign({ variant: "body1", className: classes.inProgress }, { children: _jsx(FormattedMessage, { id: "ui.eventHeader.inProgress", defaultMessage: "ui.eventHeader.inProgress" }) }))), isEventFinished && (_jsx(Chip, { icon: _jsx(Icon, Object.assign({ fontSize: "small", className: classes.chipIcon }, { children: "calendar_off" })), label: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.eventHeader.finished", defaultMessage: "ui.eventHeader.finished" }) })), variant: "outlined", size: "medium", color: "secondary", className: classes.chip })), _jsx(Typography, Object.assign({ className: classes.time }, { children: scEvent.end_date && scEvent.end_date !== scEvent.start_date ? (new Date(scEvent.start_date).getDate() !== new Date(scEvent.end_date).getDate() ? (_jsx(FormattedMessage, { id: "ui.eventHeader.startEndTimeDiff", defaultMessage: "ui.eventHeader.startEndTimeDiff", values: {
                                 startDate: intl.formatDate(scEvent.start_date, {
                                     weekday: 'long',
                                     day: 'numeric',
@@ -170,5 +170,5 @@ export default function EventHeader(inProps) {
                                     month: 'long'
                                 }),
                                 hour: intl.formatDate(scEvent.start_date, { hour: 'numeric', minute: 'numeric' })
-                            } })) }), _jsx(Typography, { variant: "h5", className: classes.name, children: scEvent.name }), _jsxs(Box, { className: classes.visibility, children: [_jsx(_Fragment, { children: scEvent.privacy === SCEventPrivacyType.PUBLIC ? (_jsxs(Typography, { className: classes.visibilityItem, children: [_jsx(Icon, { children: "public" }), _jsx(FormattedMessage, { id: "ui.eventHeader.visibility.public", defaultMessage: "ui.eventHeader.visibility.public" })] })) : (_jsxs(Typography, { className: classes.visibilityItem, children: [_jsx(Icon, { children: "private" }), _jsx(FormattedMessage, { id: "ui.eventHeader.visibility.private", defaultMessage: "ui.eventHeader.visibility.private" })] })) }), _jsx(Bullet, {}), _jsx(Typography, { className: classes.visibilityItem, children: scEvent.location === SCEventLocationType.PERSON ? (_jsx(FormattedMessage, { id: "ui.eventHeader.location.live", defaultMessage: "ui.eventHeader.location.live" })) : (_jsx(FormattedMessage, { id: "ui.eventHeader.location.online", defaultMessage: "ui.eventHeader.location.online" })) })] }), _jsx(User, { className: classes.planner, userId: scEvent.managed_by.id, secondary: _jsx(FormattedMessage, { id: "ui.eventHeader.user.manager", defaultMessage: "ui.eventHeader.user.manager" }), elevation: 0, actions: _jsx(_Fragment, { children: isEventAdmin ? (_jsxs(Box, { className: classes.multiActions, children: [_jsx(EventInviteButton, { size: isMobile ? 'small' : 'medium', event: scEvent, eventId: scEvent.id, disabled: isEventFinished }), _jsxs(Box, { children: [!isMobile && (_jsx(EditEventButton, { size: isMobile ? 'small' : 'medium', event: scEvent, eventId: scEvent.id, onEditSuccess: (data) => setSCEvent(data), disabled: isEventFinished })), _jsx(EventActionsMenu, Object.assign({ event: scEvent, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })] })) : (_jsxs(_Fragment, { children: [_jsx(EventSubscribeButton, Object.assign({ eventId: scEvent.id, onSubscribe: handleSubscribe }, EventSubscribeButtonProps, { disabled: isEventFinished })), _jsx(EventActionsMenu, Object.assign({ eventId: scEvent.id, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })) }) })] })] })));
+                            } })) })), _jsx(Typography, Object.assign({ variant: "h5", className: classes.name }, { children: scEvent.name })), _jsxs(Box, Object.assign({ className: classes.visibility }, { children: [_jsx(_Fragment, { children: scEvent.privacy === SCEventPrivacyType.PUBLIC ? (_jsxs(Typography, Object.assign({ className: classes.visibilityItem }, { children: [_jsx(Icon, { children: "public" }), _jsx(FormattedMessage, { id: "ui.eventHeader.visibility.public", defaultMessage: "ui.eventHeader.visibility.public" })] }))) : (_jsxs(Typography, Object.assign({ className: classes.visibilityItem }, { children: [_jsx(Icon, { children: "private" }), _jsx(FormattedMessage, { id: "ui.eventHeader.visibility.private", defaultMessage: "ui.eventHeader.visibility.private" })] }))) }), _jsx(Bullet, {}), _jsx(Typography, Object.assign({ className: classes.visibilityItem }, { children: scEvent.location === SCEventLocationType.PERSON ? (_jsx(FormattedMessage, { id: "ui.eventHeader.location.live", defaultMessage: "ui.eventHeader.location.live" })) : (_jsx(FormattedMessage, { id: "ui.eventHeader.location.online", defaultMessage: "ui.eventHeader.location.online" })) }))] })), _jsx(User, { className: classes.planner, userId: scEvent.managed_by.id, secondary: _jsx(FormattedMessage, { id: "ui.eventHeader.user.manager", defaultMessage: "ui.eventHeader.user.manager" }), elevation: 0, actions: _jsx(_Fragment, { children: isEventAdmin ? (_jsxs(Box, Object.assign({ className: classes.multiActions }, { children: [_jsx(EventInviteButton, { size: isMobile ? 'small' : 'medium', event: scEvent, eventId: scEvent.id, disabled: isEventFinished }), _jsxs(Box, { children: [!isMobile && (_jsx(EditEventButton, { size: isMobile ? 'small' : 'medium', event: scEvent, eventId: scEvent.id, onEditSuccess: (data) => setSCEvent(data), disabled: isEventFinished })), _jsx(EventActionsMenu, Object.assign({ event: scEvent, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })] }))) : (_jsxs(_Fragment, { children: [_jsx(EventSubscribeButton, Object.assign({ eventId: scEvent.id, onSubscribe: handleSubscribe }, EventSubscribeButtonProps, { disabled: isEventFinished })), _jsx(EventActionsMenu, Object.assign({ eventId: scEvent.id, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })) }) })] }))] })));
 }

package/lib/esm/components/EventHeader/Skeleton.js

@@ -38,6 +38,6 @@ const Root = styled(Box, {
  */
 function EventHeaderSkeleton() {
     const theme = useTheme();
-    return (_jsxs(Root, { className: classes.root, children: [_jsx(Skeleton, { className: classes.cover, animation: "wave", variant: "rectangular" }), _jsx(Box, { className: classes.avatar, children: _jsx(Skeleton, { animation: "wave", variant: "rectangular", width: theme.selfcommunity.group.avatar.sizeLarge, height: theme.selfcommunity.group.avatar.sizeLarge }) }), _jsxs(Box, { className: classes.info, children: [_jsx(Typography, { variant: "h5", mb: 1, children: _jsx(Skeleton, { animation: "wave", variant: "rectangular", sx: { height: 20, width: '50%' } }) }), _jsx(Typography, { mb: 1, children: _jsx(Skeleton, { animation: "wave", variant: "rectangular", sx: { height: 30, width: '30%' } }) }), _jsx(Typography, { children: _jsx(Skeleton, { animation: "wave", variant: "rectangular", sx: { height: 15, width: '20%' } }) })] })] }));
+    return (_jsxs(Root, Object.assign({ className: classes.root }, { children: [_jsx(Skeleton, { className: classes.cover, animation: "wave", variant: "rectangular" }), _jsx(Box, Object.assign({ className: classes.avatar }, { children: _jsx(Skeleton, { animation: "wave", variant: "rectangular", width: theme.selfcommunity.group.avatar.sizeLarge, height: theme.selfcommunity.group.avatar.sizeLarge }) })), _jsxs(Box, Object.assign({ className: classes.info }, { children: [_jsx(Typography, Object.assign({ variant: "h5", mb: 1 }, { children: _jsx(Skeleton, { animation: "wave", variant: "rectangular", sx: { height: 20, width: '50%' } }) })), _jsx(Typography, Object.assign({ mb: 1 }, { children: _jsx(Skeleton, { animation: "wave", variant: "rectangular", sx: { height: 30, width: '30%' } }) })), _jsx(Typography, { children: _jsx(Skeleton, { animation: "wave", variant: "rectangular", sx: { height: 15, width: '20%' } }) })] }))] })));
 }
 export default EventHeaderSkeleton;

package/lib/esm/components/EventInfoWidget/EventInfoWidget.js

@@ -97,5 +97,5 @@ export default function EventInfoWidget(inProps) {
     if (!scEvent) {
         return _jsx(HiddenPlaceholder, {});
     }
-    return (_jsx(Root, Object.assign({ className: classes.root }, rest, { children: _jsxs(CardContent, { className: classes.content, children: [_jsxs(Stack, { className: classes.titleWrapper, children: [_jsx(Icon, { fontSize: "small", children: "info" }), _jsx(Typography, { variant: "h5", children: _jsx(FormattedMessage, { id: "ui.infoEventWidget.title", defaultMessage: "ui.infoEventWidget.title" }) })] }), _jsx(Box, { className: classes.textWrapper, children: _jsxs(Typography, { component: "span", variant: "body1", children: [description, showButton && !expanded && (_jsx(Button, { size: "small", variant: "text", className: classes.showMore, onClick: handleToggleSummary, children: _jsx(FormattedMessage, { id: "ui.infoEventWidget.showMore", defaultMessage: "ui.infoEventWidget.showMore" }) }))] }) }), _jsx(EventInfoDetails, { event: scEvent, hasRecurringInfo: true, hasCreatedInfo: true, hasLocationInfo: showInfo })] }) })));
+    return (_jsx(Root, Object.assign({ className: classes.root }, rest, { children: _jsxs(CardContent, Object.assign({ className: classes.content }, { children: [_jsxs(Stack, Object.assign({ className: classes.titleWrapper }, { children: [_jsx(Icon, Object.assign({ fontSize: "small" }, { children: "info" })), _jsx(Typography, Object.assign({ variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.infoEventWidget.title", defaultMessage: "ui.infoEventWidget.title" }) }))] })), _jsx(Box, Object.assign({ className: classes.textWrapper }, { children: _jsxs(Typography, Object.assign({ component: "span", variant: "body1" }, { children: [description, showButton && !expanded && (_jsx(Button, Object.assign({ size: "small", variant: "text", className: classes.showMore, onClick: handleToggleSummary }, { children: _jsx(FormattedMessage, { id: "ui.infoEventWidget.showMore", defaultMessage: "ui.infoEventWidget.showMore" }) })))] })) })), _jsx(EventInfoDetails, { event: scEvent, hasRecurringInfo: true, hasCreatedInfo: true, hasLocationInfo: showInfo })] })) })));
 }

package/lib/esm/components/EventInfoWidget/Skeleton.js

@@ -12,5 +12,5 @@ const Root = styled(Widget, {
     overridesResolver: (_props, styles) => styles.root
 })(() => ({}));
 export default function EventInfoWigetSkeleton() {
-    return (_jsx(Root, { className: classes.root, children: _jsxs(CardContent, { className: classes.content, children: [_jsxs(Stack, { direction: "row", alignItems: "center", gap: "8px", marginBottom: "8px", children: [_jsx(Skeleton, { animation: "wave", variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: "wave", width: "184px", height: "21px" })] }), _jsx(Skeleton, { animation: "wave", width: "100%" }), _jsx(Skeleton, { animation: "wave", width: "100%" }), _jsx(Skeleton, { animation: "wave", width: "50%" }), _jsxs(Stack, { gap: "16px", marginTop: "24px", children: [_jsxs(Stack, { direction: "row", alignItems: "center", gap: "8px", children: [_jsx(Skeleton, { animation: "wave", variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: "wave", width: "223px", height: "21px" })] }), _jsxs(Stack, { direction: "row", alignItems: "center", gap: "8px", children: [_jsx(Skeleton, { animation: "wave", variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: "wave", width: "223px", height: "21px" })] }), _jsxs(Stack, { direction: "row", alignItems: "center", gap: "8px", children: [_jsx(Skeleton, { animation: "wave", variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: "wave", width: "223px", height: "21px" })] }), _jsxs(Stack, { direction: "row", alignItems: "center", gap: "8px", children: [_jsx(Skeleton, { animation: "wave", variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: "wave", width: "223px", height: "21px" })] })] })] }) }));
+    return (_jsx(Root, Object.assign({ className: classes.root }, { children: _jsxs(CardContent, Object.assign({ className: classes.content }, { children: [_jsxs(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px", marginBottom: "8px" }, { children: [_jsx(Skeleton, { animation: "wave", variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: "wave", width: "184px", height: "21px" })] })), _jsx(Skeleton, { animation: "wave", width: "100%" }), _jsx(Skeleton, { animation: "wave", width: "100%" }), _jsx(Skeleton, { animation: "wave", width: "50%" }), _jsxs(Stack, Object.assign({ gap: "16px", marginTop: "24px" }, { children: [_jsxs(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px" }, { children: [_jsx(Skeleton, { animation: "wave", variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: "wave", width: "223px", height: "21px" })] })), _jsxs(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px" }, { children: [_jsx(Skeleton, { animation: "wave", variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: "wave", width: "223px", height: "21px" })] })), _jsxs(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px" }, { children: [_jsx(Skeleton, { animation: "wave", variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: "wave", width: "223px", height: "21px" })] })), _jsxs(Stack, Object.assign({ direction: "row", alignItems: "center", gap: "8px" }, { children: [_jsx(Skeleton, { animation: "wave", variant: "circular", width: "21px", height: "21px" }), _jsx(Skeleton, { animation: "wave", width: "223px", height: "21px" })] }))] }))] })) })));
 }

package/lib/esm/components/EventInviteButton/EventInviteButton.js

@@ -244,7 +244,7 @@ export default function EventInviteButton(inProps) {
     /**
      * Renders root object
      */
-    return (_jsxs(React.Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className), onClick: handleClose, variant: scEvent ? 'contained' : 'outlined', color: scEvent ? 'secondary' : 'inherit', startIcon: _jsx(Icon, { children: "add" }) }, rest, { children: _jsx(FormattedMessage, { id: "ui.eventInviteButton", defaultMessage: "ui.eventInviteButton" }) })), open && (_jsx(DialogRoot, { DialogContentProps: { dividers: false }, open: true, className: classes.dialogRoot, title: _jsxs(_Fragment, { children: [_jsx(IconButton, { onClick: handleClose, children: _jsx(Icon, { children: "close" }) }), _jsx(Typography, { className: classes.dialogTitle, children: _jsx(FormattedMessage, { id: "ui.eventInviteButton.dialog.title", defaultMessage: "ui.eventInviteButton.dialog.title" }) }), _jsx(LoadingButton, { size: "small", color: "secondary", variant: "contained", onClick: handleSendInvitations, loading: isSending, disabled: !invited.length, children: _jsx(FormattedMessage, { id: "ui.eventInviteButton.dialog.button.end", defaultMessage: "ui.eventInviteButton.dialog.button.end" }) })] }), children: _jsxs(Box, { className: classes.dialogContent, children: [_jsx(Autocomplete, { className: classes.autocomplete, loading: loading, size: "small", multiple: true, freeSolo: true, disableClearable: true, options: suggested, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, filterOptions: filterOptions, value: invited, getOptionLabel: (option) => (option ? option.username : '...'), isOptionEqualToValue: (option, value) => (option ? value.id === option.id : false), renderTags: () => null, renderOption: (props, option) => (_jsxs(Box, Object.assign({ component: "li" }, props, { children: [_jsx(Avatar, { alt: option.username, src: option.avatar }), _jsx(Typography, { ml: 1, children: option.username })] }))), renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { variant: "outlined", placeholder: `${intl.formatMessage(messages.placeholder)}`, InputProps: Object.assign(Object.assign({}, params.InputProps), { className: classes.input, startAdornment: (_jsxs(_Fragment, { children: [_jsx(InputAdornment, { position: "start", children: _jsx(Icon, { className: classes.icon, children: "search" }) }), params.InputProps.startAdornment] })) }) }))) }), _jsx(Box, { className: classes.invitedBox, children: invited.map((option, index) => (_jsx(Chip, { avatar: _jsx(Avatar, { alt: option.username, src: option.avatar }), label: option.username, onDelete: () => {
+    return (_jsxs(React.Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className), onClick: handleClose, variant: scEvent ? 'contained' : 'outlined', color: scEvent ? 'secondary' : 'inherit', startIcon: _jsx(Icon, { children: "add" }) }, rest, { children: _jsx(FormattedMessage, { id: "ui.eventInviteButton", defaultMessage: "ui.eventInviteButton" }) })), open && (_jsx(DialogRoot, Object.assign({ DialogContentProps: { dividers: false }, open: true, className: classes.dialogRoot, title: _jsxs(_Fragment, { children: [_jsx(IconButton, Object.assign({ onClick: handleClose }, { children: _jsx(Icon, { children: "close" }) })), _jsx(Typography, Object.assign({ className: classes.dialogTitle }, { children: _jsx(FormattedMessage, { id: "ui.eventInviteButton.dialog.title", defaultMessage: "ui.eventInviteButton.dialog.title" }) })), _jsx(LoadingButton, Object.assign({ size: "small", color: "secondary", variant: "contained", onClick: handleSendInvitations, loading: isSending, disabled: !invited.length }, { children: _jsx(FormattedMessage, { id: "ui.eventInviteButton.dialog.button.end", defaultMessage: "ui.eventInviteButton.dialog.button.end" }) }))] }) }, { children: _jsxs(Box, Object.assign({ className: classes.dialogContent }, { children: [_jsx(Autocomplete, { className: classes.autocomplete, loading: loading, size: "small", multiple: true, freeSolo: true, disableClearable: true, options: suggested, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, filterOptions: filterOptions, value: invited, getOptionLabel: (option) => (option ? option.username : '...'), isOptionEqualToValue: (option, value) => (option ? value.id === option.id : false), renderTags: () => null, renderOption: (props, option) => (_jsxs(Box, Object.assign({ component: "li" }, props, { children: [_jsx(Avatar, { alt: option.username, src: option.avatar }), _jsx(Typography, Object.assign({ ml: 1 }, { children: option.username }))] }))), renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { variant: "outlined", placeholder: `${intl.formatMessage(messages.placeholder)}`, InputProps: Object.assign(Object.assign({}, params.InputProps), { className: classes.input, startAdornment: (_jsxs(_Fragment, { children: [_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(Icon, Object.assign({ className: classes.icon }, { children: "search" })) })), params.InputProps.startAdornment] })) }) }))) }), _jsx(Box, Object.assign({ className: classes.invitedBox }, { children: invited.map((option, index) => (_jsx(Chip, { avatar: _jsx(Avatar, { alt: option.username, src: option.avatar }), label: option.username, onDelete: () => {
                                     handleDelete(option);
-                                }, style: { marginRight: 8 } }, index))) }), _jsxs(Box, { className: classes.suggested, children: [list.length !== 0 && (_jsx(Typography, { variant: "h4", fontWeight: "bold", children: _jsx(FormattedMessage, { id: "ui.eventInviteButton.dialog.content.list", defaultMessage: "ui.eventInviteButton.dialog.content.list" }) })), list.slice(0, 5).map((user, index) => (_jsx(User, { elevation: 0, actions: _jsx(_Fragment, {}), user: user, userId: user.id, buttonProps: { onClick: () => handleUserInvite(user) } }, index)))] })] }) }))] }));
+                                }, style: { marginRight: 8 } }, index))) })), _jsxs(Box, Object.assign({ className: classes.suggested }, { children: [list.length !== 0 && (_jsx(Typography, Object.assign({ variant: "h4", fontWeight: "bold" }, { children: _jsx(FormattedMessage, { id: "ui.eventInviteButton.dialog.content.list", defaultMessage: "ui.eventInviteButton.dialog.content.list" }) }))), list.slice(0, 5).map((user, index) => (_jsx(User, { elevation: 0, actions: _jsx(_Fragment, {}), user: user, userId: user.id, buttonProps: { onClick: () => handleUserInvite(user) } }, index)))] }))] })) })))] }));
 }

package/lib/esm/components/EventLocationWidget/EventLocationWidget.js

@@ -88,11 +88,11 @@ export default function EventLocationWidget(inProps) {
     /**
      * Renders root object
      */
-    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsxs(CardContent, { children: [_jsx(Typography, { variant: "h4", className: classes.title, gutterBottom: true, children: _jsx(FormattedMessage, { id: "ui.eventLocationWidget.title", defaultMessage: "ui.eventLocationWidget.title" }) }), _jsx(Box, { className: classes.map, children: _jsx(GoogleMap, { mapContainerClassName: classes.map, center: {
+    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsxs(CardContent, { children: [_jsx(Typography, Object.assign({ variant: "h4", className: classes.title, gutterBottom: true }, { children: _jsx(FormattedMessage, { id: "ui.eventLocationWidget.title", defaultMessage: "ui.eventLocationWidget.title" }) })), _jsx(Box, Object.assign({ className: classes.map }, { children: _jsx(GoogleMap, Object.assign({ mapContainerClassName: classes.map, center: {
                             lat: scEvent.geolocation_lat,
                             lng: scEvent.geolocation_lng
-                        }, options: mapOptions, zoom: 15, children: _jsx(MarkerF, { position: {
+                        }, options: mapOptions, zoom: 15 }, { children: _jsx(MarkerF, { position: {
                                 lat: scEvent.geolocation_lat,
                                 lng: scEvent.geolocation_lng
-                            } }) }) }), _jsx(Typography, { variant: "h4", className: classes.locationTitle, children: formatEventLocationGeolocation(scEvent.geolocation, true) }), _jsx(Typography, { variant: "body1", className: classes.address, children: formatEventLocationGeolocation(scEvent.geolocation) })] }) })));
+                            } }) })) })), _jsx(Typography, Object.assign({ variant: "h4", className: classes.locationTitle }, { children: formatEventLocationGeolocation(scEvent.geolocation, true) })), _jsx(Typography, Object.assign({ variant: "body1", className: classes.address }, { children: formatEventLocationGeolocation(scEvent.geolocation) }))] }) })));
 }

package/lib/esm/components/EventLocationWidget/Skeleton.js

@@ -33,5 +33,5 @@ const Root = styled(Widget, {
  *
  */
 export default function EventLocationWidgetSkeleton() {
-    return (_jsx(Root, { className: classes.root, children: _jsxs(CardContent, { children: [_jsx(Skeleton, { animation: "wave", height: 30, width: "20%", variant: 'text' }), _jsx(Box, { className: classes.map, children: _jsx(Skeleton, { variant: "rectangular", animation: "wave", height: '100%', width: '100%' }) }), _jsx(Skeleton, { animation: "wave", height: 20, width: "30%", variant: 'text' }), _jsx(Skeleton, { animation: "wave", height: 20, width: "40%", variant: 'text' })] }) }));
+    return (_jsx(Root, Object.assign({ className: classes.root }, { children: _jsxs(CardContent, { children: [_jsx(Skeleton, { animation: "wave", height: 30, width: "20%", variant: 'text' }), _jsx(Box, Object.assign({ className: classes.map }, { children: _jsx(Skeleton, { variant: "rectangular", animation: "wave", height: '100%', width: '100%' }) })), _jsx(Skeleton, { animation: "wave", height: 20, width: "30%", variant: 'text' }), _jsx(Skeleton, { animation: "wave", height: 20, width: "40%", variant: 'text' })] }) })));
 }

package/lib/esm/components/EventMediaWidget/EventMediaWidget.js

@@ -240,11 +240,11 @@ export default function EventMediaWidget(inProps) {
     if (state.initialized && state.count === 0 && !hasAllow) {
         return _jsx(HiddenPlaceholder, {});
     }
-    return (_jsxs(Root, Object.assign({ className: classes.root }, rest, { showPadding: hasAllow, children: [_jsx(CardHeader, { title: _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", children: [_jsx(Typography, { variant: "h5", children: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.title", defaultMessage: "ui.eventMediaWidget.title" }) }), hasAllow && mediasCount > 0 && _jsx(TriggerButton, { size: "small", onAdd: handleAddMedia })] }), className: classes.header }), _jsx(Divider, {}), _jsxs(CardContent, { className: classes.content, children: [_jsxs(Box, { className: classes.grid, children: [showSkeleton === 'widget' && _jsx(EventMediaSkeleton, {}), medias.slice(0, MEDIAS_TO_SHOW).map((media, i, array) => (_jsx(Box, { onClick: () => handleOpenLightbox(i), sx: {
+    return (_jsxs(Root, Object.assign({ className: classes.root }, rest, { showPadding: hasAllow }, { children: [_jsx(CardHeader, { title: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center" }, { children: [_jsx(Typography, Object.assign({ variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.title", defaultMessage: "ui.eventMediaWidget.title" }) })), hasAllow && mediasCount > 0 && _jsx(TriggerButton, { size: "small", onAdd: handleAddMedia })] })), className: classes.header }), _jsx(Divider, {}), _jsxs(CardContent, Object.assign({ className: classes.content }, { children: [_jsxs(Box, Object.assign({ className: classes.grid }, { children: [showSkeleton === 'widget' && _jsx(EventMediaSkeleton, {}), medias.slice(0, MEDIAS_TO_SHOW).map((media, i, array) => (_jsx(Box, Object.assign({ onClick: () => handleOpenLightbox(i), sx: {
                                     background: `url(${media.image}) no-repeat center`
-                                }, className: classes.media, children: medias.length > array.length && i === array.length - 1 && (_jsxs(Fragment, { children: [_jsx(Box, { className: classes.mediaLayer }), _jsx(Box, { className: classes.countHiddenMediaWrapper, children: _jsxs(Typography, { className: classes.countHiddenMedia, children: ["+", countHiddenMedia] }) })] })) }, media.id))), hasAllow && mediasCount === 0 && (_jsx(Tooltip, { title: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.add", defaultMessage: "ui.eventMediaWidget.add" }), children: _jsx(TriggerButton, { size: "large", onAdd: handleAddMedia, isSquare: true }) }))] }), preview !== -1 && _jsx(Lightbox, { onClose: handleCloseLightbox, index: preview, medias: medias, onIndexChange: _fetchNext })] }), hasAllow && mediasCount > 0 && (_jsx(CardActions, { className: classes.actions, children: _jsx(Button, { onClick: handleToggleDialogOpen, children: _jsx(Typography, { variant: "caption", children: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.showAll", defaultMessage: "ui.eventMediaWidget.showAll" }) }) }) })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: intl.formatMessage(messages.title, { user: scEvent.managed_by.username }), onClose: handleToggleDialogOpen, open: openDialog }, dialogProps, { children: _jsx(InfiniteScroll, { dataLength: medias.length, height: isMobile ? '100%' : '515px', next: handleNext, hasMoreNext: Boolean(state.next), className: classes.dialogInfiniteScroll, endMessage: _jsx(Typography, { className: classes.endMessage, children: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.noMoreResults", defaultMessage: "ui.eventMediaWidget.noMoreResults" }) }), children: _jsxs(Box, { className: classes.grid, children: [medias.map((media) => (_jsx(Box, { sx: {
+                                }, className: classes.media }, { children: medias.length > array.length && i === array.length - 1 && (_jsxs(Fragment, { children: [_jsx(Box, { className: classes.mediaLayer }), _jsx(Box, Object.assign({ className: classes.countHiddenMediaWrapper }, { children: _jsxs(Typography, Object.assign({ className: classes.countHiddenMedia }, { children: ["+", countHiddenMedia] })) }))] })) }), media.id))), hasAllow && mediasCount === 0 && (_jsx(Tooltip, Object.assign({ title: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.add", defaultMessage: "ui.eventMediaWidget.add" }) }, { children: _jsx(TriggerButton, { size: "large", onAdd: handleAddMedia, isSquare: true }) })))] })), preview !== -1 && _jsx(Lightbox, { onClose: handleCloseLightbox, index: preview, medias: medias, onIndexChange: _fetchNext })] })), hasAllow && mediasCount > 0 && (_jsx(CardActions, Object.assign({ className: classes.actions }, { children: _jsx(Button, Object.assign({ onClick: handleToggleDialogOpen }, { children: _jsx(Typography, Object.assign({ variant: "caption" }, { children: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.showAll", defaultMessage: "ui.eventMediaWidget.showAll" }) })) })) }))), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: intl.formatMessage(messages.title, { user: scEvent.managed_by.username }), onClose: handleToggleDialogOpen, open: openDialog }, dialogProps, { children: _jsx(InfiniteScroll, Object.assign({ dataLength: medias.length, height: isMobile ? '100%' : '515px', next: handleNext, hasMoreNext: Boolean(state.next), className: classes.dialogInfiniteScroll, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.noMoreResults", defaultMessage: "ui.eventMediaWidget.noMoreResults" }) })) }, { children: _jsxs(Box, Object.assign({ className: classes.grid }, { children: [medias.map((media) => (_jsx(Box, Object.assign({ sx: {
                                     background: `url(${media.image}) no-repeat center`
-                                }, className: classes.dialogMediaWrapper, children: _jsx(Stack, { className: classes.dialogButtonWrapper, children: _jsx(LoadingButton, { className: classes.dialogLoadingButton, loading: mediaId === media.id, size: "large", onClick: () => handleRemoveMedia(media.id), sx: {
+                                }, className: classes.dialogMediaWrapper }, { children: _jsx(Stack, Object.assign({ className: classes.dialogButtonWrapper }, { children: _jsx(LoadingButton, Object.assign({ className: classes.dialogLoadingButton, loading: mediaId === media.id, size: "large", onClick: () => handleRemoveMedia(media.id), sx: {
                                             color: (theme) => (mediaId === media.id ? 'transparent' : theme.palette.common.white)
-                                        }, children: _jsx(Icon, { fontSize: "inherit", children: "delete" }) }) }) }, media.id))), showSkeleton === 'dialog' && Array.from(Array(countHiddenMedia)).map((_, i) => _jsx(EventMediaSkeleton, {}, i))] }) }) }))), openDialogConfirm && (_jsx(ConfirmDialog, { open: openDialogConfirm, title: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.dialog.title", defaultMessage: "ui.eventMediaWidget.dialog.title" }), content: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.dialog.msg", defaultMessage: "ui.eventMediaWidget.dialog.msg" }), btnConfirm: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.dialog.confirm", defaultMessage: "ui.eventMediaWidget.dialog.confirm" }), isUpdating: loading, onConfirm: handleConfirmAction, onClose: handleCloseAction }))] })));
+                                        } }, { children: _jsx(Icon, Object.assign({ fontSize: "inherit" }, { children: "delete" })) })) })) }), media.id))), showSkeleton === 'dialog' && Array.from(Array(countHiddenMedia)).map((_, i) => _jsx(EventMediaSkeleton, {}, i))] })) })) }))), openDialogConfirm && (_jsx(ConfirmDialog, { open: openDialogConfirm, title: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.dialog.title", defaultMessage: "ui.eventMediaWidget.dialog.title" }), content: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.dialog.msg", defaultMessage: "ui.eventMediaWidget.dialog.msg" }), btnConfirm: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.dialog.confirm", defaultMessage: "ui.eventMediaWidget.dialog.confirm" }), isUpdating: loading, onConfirm: handleConfirmAction, onClose: handleCloseAction }))] })));
 }

package/lib/esm/components/EventMediaWidget/Skeleton.js

@@ -15,7 +15,7 @@ const Root = styled(Widget, {
     overridesResolver: (_props, styles) => styles.skeletonRoot
 })(() => ({}));
 export default function EventMediaWidgetSkeleton() {
-    return (_jsxs(Root, { className: classes.root, children: [_jsx(CardHeader, { title: _jsx(Skeleton, { animation: "wave", width: "50px", height: "23px" }) }), _jsx(Divider, {}), _jsx(CardContent, { children: _jsx(Box, { className: classes.grid, children: Array.from(Array(9)).map((_, i) => (_jsx(EventMediaSkeleton, {}, i))) }) })] }));
+    return (_jsxs(Root, Object.assign({ className: classes.root }, { children: [_jsx(CardHeader, { title: _jsx(Skeleton, { animation: "wave", width: "50px", height: "23px" }) }), _jsx(Divider, {}), _jsx(CardContent, { children: _jsx(Box, Object.assign({ className: classes.grid }, { children: Array.from(Array(9)).map((_, i) => (_jsx(EventMediaSkeleton, {}, i))) })) })] })));
 }
 export function EventMediaSkeleton() {
     return _jsx(Skeleton, { variant: "rectangular", animation: "wave", width: "100%", className: classes.media });

package/lib/esm/components/EventMediaWidget/TriggerButton.js

@@ -53,12 +53,12 @@ function TriggerButton(props, ref) {
             }
         });
     }, [enqueueSnackbar]);
-    return (_jsxs(ChunkedUploady, { destination: {
+    return (_jsxs(ChunkedUploady, Object.assign({ destination: {
             url: Endpoints.ComposerChunkUploadMedia.url(),
             method: Endpoints.ComposerChunkUploadMedia.method
-        }, fileFilter: handleFilterByMime, chunkSize: 204800, children: [_jsx(MediaChunkUploader, { onSuccess: handleSuccess, onProgress: handleProgress, onError: handleError, type: "image" }), _jsx(Root, Object.assign({ className: classNames(className, classes.triggerRoot), ref: ref }, rest, { "aria-label": "add media", loading: isUploading, 
+        }, fileFilter: handleFilterByMime, chunkSize: 204800 }, { children: [_jsx(MediaChunkUploader, { onSuccess: handleSuccess, onProgress: handleProgress, onError: handleError, type: "image" }), _jsx(Root, Object.assign({ className: classNames(className, classes.triggerRoot), ref: ref }, rest, { "aria-label": "add media", loading: isUploading, 
                 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                 // @ts-ignore
-                isSquare: isSquare, children: _jsxs(GalleryUploadStack, { className: classes.triggerContent, children: [!isSquare && (_jsx(Typography, { variant: "caption", component: "p", children: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.add", defaultMessage: "ui.eventMediaWidget.add" }) })), _jsx(Icon, { className: classes.triggerIcon, children: "add" })] }) }))] }));
+                isSquare: isSquare }, { children: _jsxs(GalleryUploadStack, Object.assign({ className: classes.triggerContent }, { children: [!isSquare && (_jsx(Typography, Object.assign({ variant: "caption", component: "p" }, { children: _jsx(FormattedMessage, { id: "ui.eventMediaWidget.add", defaultMessage: "ui.eventMediaWidget.add" }) }))), _jsx(Icon, Object.assign({ className: classes.triggerIcon }, { children: "add" }))] })) }))] })));
 }
 export default forwardRef(TriggerButton);

package/lib/esm/components/EventMembersWidget/EventMembersWidget.js

@@ -176,14 +176,14 @@ export default function EventMembersWidget(inProps) {
         (tabValue === TabContentEnum.PARTICIPANTS && participants.isLoadingNext && !participants.initialized)) {
         return _jsx(Skeleton, {});
     }
-    return (_jsx(Root, Object.assign({ className: classes.root }, rest, { children: _jsxs(CardContent, { className: classes.content, children: [_jsx(Typography, { variant: "h5", className: classes.title, children: _jsx(FormattedMessage, { id: title, defaultMessage: title }) }), _jsxs(TabContext, { value: tabValue, children: [_jsxs(TabList, { className: classes.tabsWrapper, onChange: handleTabChange, textColor: "primary", indicatorColor: "primary", variant: "fullWidth", children: [_jsx(Tab, { label: _jsxs(Stack, { className: classes.tabLabelWrapper, children: [_jsx(Typography, { variant: "h3", children: participantsCount }), _jsx(Typography, { variant: "subtitle2", children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.participants", defaultMessage: "ui.eventMembersWidget.participants" }) })] }), value: TabContentEnum.PARTICIPANTS }), hasAllow && (_jsx(Tab, { label: _jsxs(Stack, { className: classes.tabLabelWrapper, children: [_jsx(Typography, { variant: "h3", children: invitedCount }), _jsx(Typography, { variant: "subtitle2", children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.invited", defaultMessage: "ui.eventMembersWidget.invited" }) })] }), value: TabContentEnum.INVITED })), hasAllow && (_jsx(Tab, { label: _jsxs(Stack, { className: classes.tabLabelWrapper, children: [_jsx(Typography, { variant: "h3", children: requestsCount }), _jsx(Typography, { variant: "subtitle2", children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.requests", defaultMessage: "ui.eventMembersWidget.requests" }) })] }), value: TabContentEnum.REQUESTS }))] }), _jsx(TabPanel, { value: TabContentEnum.PARTICIPANTS, className: classes.tabPanel, children: _jsx(TabContentComponent, { tabValue: TabContentEnum.PARTICIPANTS, state: participants, dispatch: dispatchParticipants, userProps: userProps, dialogProps: dialogProps, handleRefresh: handleRefresh }) }), hasAllow && (_jsx(TabPanel, { value: TabContentEnum.INVITED, className: classes.tabPanel, children: _jsx(TabContentComponent, { tabValue: TabContentEnum.INVITED, state: invited, dispatch: dispatchInvited, userProps: userProps, dialogProps: dialogProps, actionProps: {
+    return (_jsx(Root, Object.assign({ className: classes.root }, rest, { children: _jsxs(CardContent, Object.assign({ className: classes.content }, { children: [_jsx(Typography, Object.assign({ variant: "h5", className: classes.title }, { children: _jsx(FormattedMessage, { id: title, defaultMessage: title }) })), _jsxs(TabContext, Object.assign({ value: tabValue }, { children: [_jsxs(TabList, Object.assign({ className: classes.tabsWrapper, onChange: handleTabChange, textColor: "primary", indicatorColor: "primary", variant: "fullWidth" }, { children: [_jsx(Tab, { label: _jsxs(Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [_jsx(Typography, Object.assign({ variant: "h3" }, { children: participantsCount })), _jsx(Typography, Object.assign({ variant: "subtitle2" }, { children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.participants", defaultMessage: "ui.eventMembersWidget.participants" }) }))] })), value: TabContentEnum.PARTICIPANTS }), hasAllow && (_jsx(Tab, { label: _jsxs(Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [_jsx(Typography, Object.assign({ variant: "h3" }, { children: invitedCount })), _jsx(Typography, Object.assign({ variant: "subtitle2" }, { children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.invited", defaultMessage: "ui.eventMembersWidget.invited" }) }))] })), value: TabContentEnum.INVITED })), hasAllow && (_jsx(Tab, { label: _jsxs(Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [_jsx(Typography, Object.assign({ variant: "h3" }, { children: requestsCount })), _jsx(Typography, Object.assign({ variant: "subtitle2" }, { children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.requests", defaultMessage: "ui.eventMembersWidget.requests" }) }))] })), value: TabContentEnum.REQUESTS }))] })), _jsx(TabPanel, Object.assign({ value: TabContentEnum.PARTICIPANTS, className: classes.tabPanel }, { children: _jsx(TabContentComponent, { tabValue: TabContentEnum.PARTICIPANTS, state: participants, dispatch: dispatchParticipants, userProps: userProps, dialogProps: dialogProps, handleRefresh: handleRefresh }) })), hasAllow && (_jsx(TabPanel, Object.assign({ value: TabContentEnum.INVITED, className: classes.tabPanel }, { children: _jsx(TabContentComponent, { tabValue: TabContentEnum.INVITED, state: invited, dispatch: dispatchInvited, userProps: userProps, dialogProps: dialogProps, actionProps: {
                                     scEvent,
                                     setCount: setInvitedCount
-                                }, handleRefresh: handleRefresh }) })), hasAllow && (_jsx(TabPanel, { value: TabContentEnum.REQUESTS, className: classes.tabPanel, children: _jsx(TabContentComponent, { tabValue: TabContentEnum.REQUESTS, state: requests, dispatch: dispatchRequests, userProps: userProps, dialogProps: dialogProps, actionProps: {
+                                }, handleRefresh: handleRefresh }) }))), hasAllow && (_jsx(TabPanel, Object.assign({ value: TabContentEnum.REQUESTS, className: classes.tabPanel }, { children: _jsx(TabContentComponent, { tabValue: TabContentEnum.REQUESTS, state: requests, dispatch: dispatchRequests, userProps: userProps, dialogProps: dialogProps, actionProps: {
                                     scEvent,
                                     count: requestsCount,
                                     setCount: setRequestsCount,
                                     users: requestsUsers,
                                     setUsers: setRequestsUsers
-                                }, handleRefresh: handleRefresh }) }))] })] }) })));
+                                }, handleRefresh: handleRefresh }) })))] }))] })) })));
 }

package/lib/esm/components/EventMembersWidget/Skeleton.js

@@ -21,5 +21,5 @@ const Root = styled(Widget, {
     overridesResolver: (_props, styles) => styles.skeletonRoot
 })(() => ({}));
 export default function EventMembersWidgetSkeleton() {
-    return (_jsx(Root, { className: classes.root, children: _jsxs(CardContent, { className: classes.content, children: [_jsx(Skeleton, { animation: "wave", width: "53px", height: "25px", className: classes.title }), _jsxs(TabContext, { value: "1", children: [_jsx(Box, { className: classes.tabsWrapper, children: _jsx(TabList, { variant: "fullWidth", children: [1, 2, 3].map((_element, i) => (_jsx(Tab, { label: _jsxs(Stack, { className: classes.tabLabelWrapper, children: [_jsx(Skeleton, { animation: "wave", width: "26px", height: "24px" }), _jsx(Skeleton, { animation: "wave", width: "106px", height: "19px" })] }), value: `${i + 1}` }, i))) }) }), _jsx(TabPanel, { value: "1", className: classes.tabPanel, children: _jsxs(List, { children: [[1, 2, 3, 4].map((_element, i) => (_jsx(ListItem, { children: _jsx(UserSkeleton, {}) }, i))), _jsx(Skeleton, { className: classes.actionButton, animation: "wave", width: "52px", height: "20px" })] }) }), _jsx(TabPanel, { value: "2", className: classes.tabPanel }), _jsx(TabPanel, { value: "3", className: classes.tabPanel })] })] }) }));
+    return (_jsx(Root, Object.assign({ className: classes.root }, { children: _jsxs(CardContent, Object.assign({ className: classes.content }, { children: [_jsx(Skeleton, { animation: "wave", width: "53px", height: "25px", className: classes.title }), _jsxs(TabContext, Object.assign({ value: "1" }, { children: [_jsx(Box, Object.assign({ className: classes.tabsWrapper }, { children: _jsx(TabList, Object.assign({ variant: "fullWidth" }, { children: [1, 2, 3].map((_element, i) => (_jsx(Tab, { label: _jsxs(Stack, Object.assign({ className: classes.tabLabelWrapper }, { children: [_jsx(Skeleton, { animation: "wave", width: "26px", height: "24px" }), _jsx(Skeleton, { animation: "wave", width: "106px", height: "19px" })] })), value: `${i + 1}` }, i))) })) })), _jsx(TabPanel, Object.assign({ value: "1", className: classes.tabPanel }, { children: _jsxs(List, { children: [[1, 2, 3, 4].map((_element, i) => (_jsx(ListItem, { children: _jsx(UserSkeleton, {}) }, i))), _jsx(Skeleton, { className: classes.actionButton, animation: "wave", width: "52px", height: "20px" })] }) })), _jsx(TabPanel, { value: "2", className: classes.tabPanel }), _jsx(TabPanel, { value: "3", className: classes.tabPanel })] }))] })) })));
 }

package/lib/esm/components/EventMembersWidget/TabContentComponent.js

@@ -112,7 +112,7 @@ export default function TabContentComponent(props) {
         return undefined;
     }, [tabValue, actionProps]);
     if (tabValue === TabContentEnum.PARTICIPANTS && (actionProps === null || actionProps === void 0 ? void 0 : actionProps.count) === 0) {
-        return (_jsx(Typography, { variant: "body1", children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.noParticipants", defaultMessage: "ui.eventMembersWidget.noParticipants" }) }));
+        return (_jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.noParticipants", defaultMessage: "ui.eventMembersWidget.noParticipants" }) })));
     }
     else if (tabValue === TabContentEnum.INVITED && state.count === 0 && actionProps) {
         const date = actionProps.scEvent.end_date || actionProps.scEvent.start_date;
@@ -125,7 +125,7 @@ export default function TabContentComponent(props) {
         return (_jsx(EventInviteButton, { event: actionProps.scEvent, className: classes.eventButton, handleInvitations: handleInvitations, disabled: disabled }));
     }
     else if (tabValue === TabContentEnum.REQUESTS && (actionProps === null || actionProps === void 0 ? void 0 : actionProps.count) === 0) {
-        return (_jsx(Typography, { variant: "body1", children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.noOtherRequests", defaultMessage: "ui.eventMembersWidget.noOtherRequests" }) }));
+        return (_jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.noOtherRequests", defaultMessage: "ui.eventMembersWidget.noOtherRequests" }) })));
     }
-    return (_jsxs(_Fragment, { children: [_jsx(List, { children: users === null || users === void 0 ? void 0 : users.map((user) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: user }, userProps, { actions: getActionsComponent(user.id) })) }, user.id))) }), state.count > state.visibleItems && (_jsx(Button, { onClick: handleToggleDialogOpen, className: classes.actionButton, children: _jsx(Typography, { variant: "caption", children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.showAll", defaultMessage: "ui.eventMembersWidget.showAll" }) }) })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.eventMembersWidget.title", id: "ui.eventMembersWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, dialogProps, { children: _jsx(InfiniteScroll, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: _jsx(UserSkeleton, Object.assign({ elevation: 0 }, userProps)), className: classes.infiniteScroll, endMessage: _jsx(Typography, { className: classes.endMessage, children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.noMoreResults", defaultMessage: "ui.eventMembersWidget.noMoreResults" }) }), children: _jsx(List, { children: state.results.map((user) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: user }, userProps)) }, user.id))) }) }) })))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(List, { children: users === null || users === void 0 ? void 0 : users.map((user) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: user }, userProps, { actions: getActionsComponent(user.id) })) }, user.id))) }), state.count > state.visibleItems && (_jsx(Button, Object.assign({ onClick: handleToggleDialogOpen, className: classes.actionButton }, { children: _jsx(Typography, Object.assign({ variant: "caption" }, { children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.showAll", defaultMessage: "ui.eventMembersWidget.showAll" }) })) }))), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.eventMembersWidget.title", id: "ui.eventMembersWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, dialogProps, { children: _jsx(InfiniteScroll, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: _jsx(UserSkeleton, Object.assign({ elevation: 0 }, userProps)), className: classes.infiniteScroll, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.eventMembersWidget.noMoreResults", defaultMessage: "ui.eventMembersWidget.noMoreResults" }) })) }, { children: _jsx(List, { children: state.results.map((user) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: user }, userProps)) }, user.id))) }) })) })))] }));
 }

package/lib/esm/components/EventParticipantsButton/EventParticipantsButton.js

@@ -129,5 +129,5 @@ export default function EventParticipantsButton(inProps) {
     const handleToggleDialogOpen = useCallback(() => {
         setOpen((prev) => !prev);
     }, [setOpen]);
-    return (_jsxs(_Fragment, { children: [_jsxs(Root, Object.assign({ className: classNames(classes.root, className), onClick: handleToggleDialogOpen, disabled: loading || !scEvent || scEvent.goings_counter === 0 }, rest, { children: [!hideCaption && (_jsx(Typography, { className: classes.participants, variant: "caption", children: _jsx(FormattedMessage, { defaultMessage: "ui.eventParticipantsButton.participants", id: "ui.eventParticipantsButton.participants" }) })), !followers.length && (loading || !scEvent) ? (_jsx(AvatarGroupSkeleton, Object.assign({}, rest, (!participantsAvailable && { skeletonsAnimation: false })))) : (_jsx(AvatarGroup, { total: followers.length, children: followers.map((c) => (_jsx(Avatar, { alt: c.username, src: c.avatar, className: classes.avatar }, c.id))) }))] })), open && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.eventParticipantsButton.dialogTitle", id: "ui.eventParticipantsButton.dialogTitle", values: { total: scEvent.goings_counter } }), onClose: handleToggleDialogOpen, open: open }, DialogProps, { children: _jsx(InfiniteScroll, { dataLength: followers.length, next: fetchFollowers, hasMoreNext: next !== null || loading, loaderNext: _jsx(UserSkeleton, { elevation: 0 }), className: classes.infiniteScroll, endMessage: _jsx(Typography, { className: classes.endMessage, children: _jsx(FormattedMessage, { id: "ui.eventParticipantsButton.noOtherParticipants", defaultMessage: "ui.eventParticipantsButton.noOtherParticipants" }) }), children: _jsx(List, { children: followers.map((follower) => (_jsx(ListItem, { children: _jsx(User, { elevation: 0, user: follower }) }, follower.id))) }) }) })))] }));
+    return (_jsxs(_Fragment, { children: [_jsxs(Root, Object.assign({ className: classNames(classes.root, className), onClick: handleToggleDialogOpen, disabled: loading || !scEvent || scEvent.goings_counter === 0 }, rest, { children: [!hideCaption && (_jsx(Typography, Object.assign({ className: classes.participants, variant: "caption" }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.eventParticipantsButton.participants", id: "ui.eventParticipantsButton.participants" }) }))), !followers.length && (loading || !scEvent) ? (_jsx(AvatarGroupSkeleton, Object.assign({}, rest, (!participantsAvailable && { skeletonsAnimation: false })))) : (_jsx(AvatarGroup, Object.assign({ total: followers.length }, { children: followers.map((c) => (_jsx(Avatar, { alt: c.username, src: c.avatar, className: classes.avatar }, c.id))) })))] })), open && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.eventParticipantsButton.dialogTitle", id: "ui.eventParticipantsButton.dialogTitle", values: { total: scEvent.goings_counter } }), onClose: handleToggleDialogOpen, open: open }, DialogProps, { children: _jsx(InfiniteScroll, Object.assign({ dataLength: followers.length, next: fetchFollowers, hasMoreNext: next !== null || loading, loaderNext: _jsx(UserSkeleton, { elevation: 0 }), className: classes.infiniteScroll, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.eventParticipantsButton.noOtherParticipants", defaultMessage: "ui.eventParticipantsButton.noOtherParticipants" }) })) }, { children: _jsx(List, { children: followers.map((follower) => (_jsx(ListItem, { children: _jsx(User, { elevation: 0, user: follower }) }, follower.id))) }) })) })))] }));
 }