@selfcommunity/react-ui 0.8.0-embeds.16 → 0.8.0-live.40

package/lib/esm/components/PrivateMessageEditor/PrivateMessageEditor.js

@@ -120,16 +120,16 @@ export default function PrivateMessageEditor(inProps) {
      * Rendering
      */
     if (autoHide || autoHideDeletion) {
-        return (_jsx(Alert, Object.assign({ severity: autoHideDeletion ? 'warning' : 'info' }, { children: autoHideDeletion ? (_jsx(FormattedMessage, { id: "ui.privateMessage.editor.disabled.deleted.msg", defaultMessage: "ui.privateMessage.editor.disabled.deleted.msg" })) : (_jsx(FormattedMessage, { id: "ui.privateMessage.editor.disabled.msg", defaultMessage: "ui.privateMessage.editor.disabled.msg" })) })));
+        return (_jsx(Alert, { severity: autoHideDeletion ? 'warning' : 'info', children: autoHideDeletion ? (_jsx(FormattedMessage, { id: "ui.privateMessage.editor.disabled.deleted.msg", defaultMessage: "ui.privateMessage.editor.disabled.deleted.msg" })) : (_jsx(FormattedMessage, { id: "ui.privateMessage.editor.disabled.msg", defaultMessage: "ui.privateMessage.editor.disabled.msg" })) }));
     }
     else if (error) {
-        return (_jsx(Alert, Object.assign({ severity: "error", action: _jsx(IconButton, Object.assign({ color: "inherit", size: "small", onClick: onErrorRemove }, { children: _jsx(Icon, { children: "close" }) })) }, { children: _jsx(FormattedMessage, { id: "ui.privateMessage.editor.error.send.msg", defaultMessage: "ui.privateMessage.editor.error.send.msg" }) })));
+        return (_jsx(Alert, { severity: "error", action: _jsx(IconButton, { color: "inherit", size: "small", onClick: onErrorRemove, children: _jsx(Icon, { children: "close" }) }), children: _jsx(FormattedMessage, { id: "ui.privateMessage.editor.error.send.msg", defaultMessage: "ui.privateMessage.editor.error.send.msg" }) }));
     }
     function renderContent() {
-        return (_jsx(_Fragment, { children: openMediaSection ? (_jsx(MessageMediaUploader, { className: classes.mediaUploader, open: openMediaSection, onClose: handleMediaSectionClose, forwardMessageFile: handleMessageFiles, isUploading: setUploading, action: _jsx(IconButton, Object.assign({ disabled: (!message && !messageFiles.length) || uploading, onClick: handleMessageSend }, { children: _jsx(Icon, { children: "send" }) })) })) : (_jsxs(_Fragment, { children: [openEmojiSection && _jsx(EmojiPicker, { className: classes.emojiSection, onEmojiClick: handleEmojiClick, width: "100%", searchDisabled: true }), _jsx(TextField, { size: "small", inputRef: ref, disabled: Boolean(messageFiles.length) || openMediaSection, className: classes.messageInput, multiline: true, placeholder: `${intl.formatMessage(messages.placeholder)}`, value: message, onChange: handleMessageInput, maxRows: 2, onSelect: () => setOpenEmojiSection(false), InputProps: {
-                            startAdornment: (_jsxs(_Fragment, { children: [_jsx(IconButton, Object.assign({ disabled: openMediaSection, onClick: () => setOpenEmojiSection(!openEmojiSection) }, { children: _jsx(Icon, { children: "sentiment_satisfied_alt" }) })), _jsx(IconButton, Object.assign({ disabled: message !== '' || openEmojiSection, onClick: () => setOpenMediaSection(true) }, { children: _jsx(Icon, { children: "attach_file" }) }))] })),
-                            endAdornment: (_jsx(IconButton, Object.assign({ disabled: (!message && !messageFiles.length) || uploading, onClick: handleMessageSend }, { children: _jsx(Icon, { children: "send" }) })))
+        return (_jsx(_Fragment, { children: openMediaSection ? (_jsx(MessageMediaUploader, { className: classes.mediaUploader, open: openMediaSection, onClose: handleMediaSectionClose, forwardMessageFile: handleMessageFiles, isUploading: setUploading, action: _jsx(IconButton, { disabled: (!message && !messageFiles.length) || uploading, onClick: handleMessageSend, children: _jsx(Icon, { children: "send" }) }) })) : (_jsxs(_Fragment, { children: [openEmojiSection && _jsx(EmojiPicker, { className: classes.emojiSection, onEmojiClick: handleEmojiClick, width: "100%", searchDisabled: true }), _jsx(TextField, { size: "small", inputRef: ref, disabled: Boolean(messageFiles.length) || openMediaSection, className: classes.messageInput, multiline: true, placeholder: `${intl.formatMessage(messages.placeholder)}`, value: message, onChange: handleMessageInput, maxRows: 2, onSelect: () => setOpenEmojiSection(false), InputProps: {
+                            startAdornment: (_jsxs(_Fragment, { children: [_jsx(IconButton, { disabled: openMediaSection, onClick: () => setOpenEmojiSection(!openEmojiSection), children: _jsx(Icon, { children: "sentiment_satisfied_alt" }) }), _jsx(IconButton, { disabled: message !== '' || openEmojiSection, onClick: () => setOpenMediaSection(true), children: _jsx(Icon, { children: "attach_file" }) })] })),
+                            endAdornment: (_jsx(IconButton, { disabled: (!message && !messageFiles.length) || uploading, onClick: handleMessageSend, children: _jsx(Icon, { children: "send" }) }))
                         } })] })) }));
     }
-    return (_jsx(Root, Object.assign({}, rest, { className: classNames(classes.root, className, { [classes.ios]: isIOS }) }, { children: renderContent() })));
+    return (_jsx(Root, Object.assign({}, rest, { className: classNames(classes.root, className, { [classes.ios]: isIOS }), children: renderContent() })));
 }

package/lib/esm/components/PrivateMessageSettingsIconButton/PrivateMessageSettingsIconButton.js

@@ -109,18 +109,18 @@ export default function PrivateMessageSettingsIconButton(inProps) {
     const renderList = () => {
         if (isMobile) {
             return [
-                user && !group && (_jsxs(ListItem, Object.assign({ className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, user) }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "people_alt" }) }), _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.item.profile", defaultMessage: "ui.privateMessageSettingsIconButton.item.profile" })] }), "profile")),
-                group && !user && (_jsxs(ListItem, Object.assign({ className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.GROUP_ROUTE_NAME, group) }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "groups" }) }), _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.item.group", defaultMessage: "ui.privateMessageSettingsIconButton.item.group" })] }), "group")),
-                _jsxs(ListItem, Object.assign({ className: classes.item, onClick: threadToDelete ? handleOpenDialog : onMenuItemDeleteClick }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "delete" }) }), _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.item.delete", defaultMessage: "ui.privateMessageSettingsIconButton.item.delete" })] }), "delete")
+                user && !group && (_jsxs(ListItem, { className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, user), children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "people_alt" }) }), _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.item.profile", defaultMessage: "ui.privateMessageSettingsIconButton.item.profile" })] }, "profile")),
+                group && !user && (_jsxs(ListItem, { className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.GROUP_ROUTE_NAME, group), children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "groups" }) }), _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.item.group", defaultMessage: "ui.privateMessageSettingsIconButton.item.group" })] }, "group")),
+                _jsxs(ListItem, { className: classes.item, onClick: threadToDelete ? handleOpenDialog : onMenuItemDeleteClick, children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "delete" }) }), _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.item.delete", defaultMessage: "ui.privateMessageSettingsIconButton.item.delete" })] }, "delete")
             ];
         }
         else {
             return [
-                user && !group && (_jsxs(MenuItem, Object.assign({ className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, user), onClick: handleCloseDialog }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "people_alt" }) }), _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.item.profile", defaultMessage: "ui.privateMessageSettingsIconButton.item.profile" })] }), "profile")),
-                group && !user && (_jsxs(MenuItem, Object.assign({ className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.GROUP_ROUTE_NAME, group), onClick: handleCloseDialog }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "groups" }) }), _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.item.group", defaultMessage: "ui.privateMessageSettingsIconButton.item.group" })] }), "group")),
-                _jsxs(MenuItem, Object.assign({ className: classes.item, onClick: threadToDelete ? handleOpenDialog : onMenuItemDeleteClick }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "delete" }) }), _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.item.delete", defaultMessage: "ui.privateMessageSettingsIconButton.item.delete" })] }), "delete")
+                user && !group && (_jsxs(MenuItem, { className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, user), onClick: handleCloseDialog, children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "people_alt" }) }), _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.item.profile", defaultMessage: "ui.privateMessageSettingsIconButton.item.profile" })] }, "profile")),
+                group && !user && (_jsxs(MenuItem, { className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.GROUP_ROUTE_NAME, group), onClick: handleCloseDialog, children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "groups" }) }), _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.item.group", defaultMessage: "ui.privateMessageSettingsIconButton.item.group" })] }, "group")),
+                _jsxs(MenuItem, { className: classes.item, onClick: threadToDelete ? handleOpenDialog : onMenuItemDeleteClick, children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "delete" }) }), _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.item.delete", defaultMessage: "ui.privateMessageSettingsIconButton.item.delete" })] }, "delete")
             ];
         }
     };
-    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { onClick: handleOpen }, { children: _jsx(Icon, { children: "more_vert" }) })), isMobile ? (_jsx(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, PaperProps: { className: classes.paper }, disableSwipeToOpen: true }, { children: _jsx(List, { children: renderList() }) }))) : (_jsx(MenuRoot, Object.assign({ className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, PaperProps: { className: classes.paper } }, { children: renderList() }))), openConfirmDialog && (_jsx(ConfirmDialog, { open: openConfirmDialog, title: _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.dialog.msg", defaultMessage: "ui.privateMessageSettingsIconButton.dialog.msg" }), btnConfirm: _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.dialog.confirm", defaultMessage: "ui.privateMessageSettingsIconButton.dialog.confirm" }), onConfirm: handleDeleteThread, onClose: handleCloseDialog }))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { onClick: handleOpen, children: _jsx(Icon, { children: "more_vert" }) })), isMobile ? (_jsx(SwipeableDrawerRoot, { className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, PaperProps: { className: classes.paper }, disableSwipeToOpen: true, children: _jsx(List, { children: renderList() }) })) : (_jsx(MenuRoot, { className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, PaperProps: { className: classes.paper }, children: renderList() })), openConfirmDialog && (_jsx(ConfirmDialog, { open: openConfirmDialog, title: _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.dialog.msg", defaultMessage: "ui.privateMessageSettingsIconButton.dialog.msg" }), btnConfirm: _jsx(FormattedMessage, { id: "ui.privateMessageSettingsIconButton.dialog.confirm", defaultMessage: "ui.privateMessageSettingsIconButton.dialog.confirm" }), onConfirm: handleDeleteThread, onClose: handleCloseDialog }))] }));
 }

package/lib/esm/components/PrivateMessageSnippetItem/PrivateMessageSnippetItem.js

@@ -86,13 +86,13 @@ export default function PrivateMessageSnippetItem(inProps) {
     /**
      * Renders root object
      */
-    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { secondaryAction: secondaryAction, disablePadding: true }, { children: _jsxs(ListItemButton, Object.assign({ onClick: onItemClick, classes: { root: classNames({ [classes.unread]: message.thread_status === SCPrivateMessageStatusType.NEW }) } }, { children: [_jsx(ListItemAvatar, { children: _jsx(UserAvatar, Object.assign({ hide: !hasBadge() }, { children: message.group ? (_jsx(Avatar, { alt: message.group.name, src: message.group.image_big })) : (_jsx(Avatar, { alt: ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) === message.receiver.username ? message.sender.username : message.receiver.username, src: ((_b = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _b === void 0 ? void 0 : _b.username) === message.receiver.username ? message.sender.avatar : message.receiver.avatar })) })) }), _jsx(ListItemText, { primary: _jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ component: "span", className: classes.username }, { children: message.group
+    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { secondaryAction: secondaryAction, disablePadding: true, children: _jsxs(ListItemButton, { onClick: onItemClick, classes: { root: classNames({ [classes.unread]: message.thread_status === SCPrivateMessageStatusType.NEW }) }, children: [_jsx(ListItemAvatar, { children: _jsx(UserAvatar, { hide: !hasBadge(), children: message.group ? (_jsx(Avatar, { alt: message.group.name, src: message.group.image_big })) : (_jsx(Avatar, { alt: ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) === message.receiver.username ? message.sender.username : message.receiver.username, src: ((_b = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _b === void 0 ? void 0 : _b.username) === message.receiver.username ? message.sender.avatar : message.receiver.avatar })) }) }), _jsx(ListItemText, { primary: _jsxs(_Fragment, { children: [_jsx(Typography, { component: "span", className: classes.username, children: message.group
                                     ? message.group.name
                                     : ((_c = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _c === void 0 ? void 0 : _c.username) === message.receiver.username
                                         ? message.sender.username
-                                        : message.receiver.username })), hasBadge() && preferences && (_jsx(Chip, { component: "span", className: classes.badgeLabel, size: "small", label: preferences[SCPreferences.STAFF_STAFF_BADGE_LABEL] })), _jsx(Typography, Object.assign({ color: "secondary", className: classes.time, component: "span" }, { children: `${intl.formatDate(message.last_message_at, {
+                                        : message.receiver.username }), hasBadge() && preferences && (_jsx(Chip, { component: "span", className: classes.badgeLabel, size: "small", label: preferences[SCPreferences.STAFF_STAFF_BADGE_LABEL] })), _jsx(Typography, { color: "secondary", className: classes.time, component: "span", children: `${intl.formatDate(message.last_message_at, {
                                     day: '2-digit',
                                     month: '2-digit',
                                     year: '2-digit'
-                                })}` }))] }), secondary: _jsx(_Fragment, { children: _jsx(Typography, { component: "span", color: "text.secondary", dangerouslySetInnerHTML: { __html: (_d = message.headline) !== null && _d !== void 0 ? _d : message.message } }) }) })] })) })));
+                                })}` })] }), secondary: _jsx(_Fragment, { children: _jsx(Typography, { component: "span", color: "text.secondary", dangerouslySetInnerHTML: { __html: (_d = message.headline) !== null && _d !== void 0 ? _d : message.message } }) }) })] }) })));
 }

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

@@ -37,5 +37,5 @@ const Root = styled(ListItem, {
  */
 export default function PrivateMessageSnippetItemSkeleton(props) {
     const theme = useTheme();
-    return (_jsxs(Root, Object.assign({ className: classes.root }, props, { secondaryAction: _jsx(Skeleton, { animation: "wave", height: 30, width: 5 }) }, { children: [_jsx(ListItemAvatar, { children: _jsx(Skeleton, { animation: "wave", variant: "circular", width: theme.selfcommunity.user.avatar.sizeMedium, height: theme.selfcommunity.user.avatar.sizeMedium }) }), _jsx(ListItemText, { primary: _jsx(Skeleton, { animation: "wave", height: 10, width: 120, style: { marginBottom: 10 } }), secondary: _jsx(Skeleton, { animation: "wave", height: 10, width: 70, style: { marginBottom: 10 } }) })] })));
+    return (_jsxs(Root, Object.assign({ className: classes.root }, props, { secondaryAction: _jsx(Skeleton, { animation: "wave", height: 30, width: 5 }), children: [_jsx(ListItemAvatar, { children: _jsx(Skeleton, { animation: "wave", variant: "circular", width: theme.selfcommunity.user.avatar.sizeMedium, height: theme.selfcommunity.user.avatar.sizeMedium }) }), _jsx(ListItemText, { primary: _jsx(Skeleton, { animation: "wave", height: 10, width: 120, style: { marginBottom: 10 } }), secondary: _jsx(Skeleton, { animation: "wave", height: 10, width: 70, style: { marginBottom: 10 } }) })] })));
 }

package/lib/esm/components/PrivateMessageSnippets/PrivateMessageSnippets.js

@@ -234,9 +234,9 @@ export default function PrivateMessageSnippets(inProps) {
     /**
      * Renders the component
      */
-    return (_jsx(Root, Object.assign({}, rest, { className: classNames(classes.root, className) }, { children: _jsxs(CardContent, { children: [_jsx(Button, Object.assign({ variant: "outlined", size: "medium", className: classes.newMessageButton, onClick: handleOpenNewMessage }, { children: _jsx(FormattedMessage, { id: "ui.privateMessage.snippets.button.newMessage", defaultMessage: "ui.privateMessage.snippets.button.newMessage" }) })), data.snippets.length !== 0 && (_jsxs(_Fragment, { children: [_jsx(TextField, { className: classes.searchBar, variant: "outlined", margin: "normal", fullWidth: true, id: `${PREFIX}-search`, placeholder: `${intl.formatMessage(messages.placeholder)}`, size: "small", onChange: handleChange, value: search, InputProps: {
+    return (_jsx(Root, Object.assign({}, rest, { className: classNames(classes.root, className), children: _jsxs(CardContent, { children: [_jsx(Button, { variant: "outlined", size: "medium", className: classes.newMessageButton, onClick: handleOpenNewMessage, children: _jsx(FormattedMessage, { id: "ui.privateMessage.snippets.button.newMessage", defaultMessage: "ui.privateMessage.snippets.button.newMessage" }) }), data.snippets.length !== 0 && (_jsxs(_Fragment, { children: [_jsx(TextField, { className: classes.searchBar, variant: "outlined", margin: "normal", fullWidth: true, id: `${PREFIX}-search`, placeholder: `${intl.formatMessage(messages.placeholder)}`, size: "small", onChange: handleChange, value: search, InputProps: {
                                 className: classes.input,
-                                startAdornment: _jsx(Icon, Object.assign({ className: classes.icon }, { children: "search" })),
-                                endAdornment: (_jsx(IconButton, Object.assign({ className: classes.clear, disabled: !search, onClick: handleClear, size: "small" }, { children: _jsx(Icon, { children: "close" }) })))
-                            } }), _jsx(List, { children: filteredSnippets.map((message) => (_jsx(PrivateMessageSnippetItem, { message: message, onItemClick: () => handleOpenThread(message), secondaryAction: _jsxs(_Fragment, { children: [message.thread_status === SCPrivateMessageStatusType.NEW && _jsx(Icon, Object.assign({ color: "secondary" }, { children: "fiber_manual_record" })), !isMobile && (_jsx(PrivateMessageSettingsIconButton, { threadToDelete: (message === null || message === void 0 ? void 0 : message.group) ? message.group.id : messageReceiver(message, authUserId), onItemDeleteConfirm: () => handleDeleteConversation(messageReceiver(message, authUserId)), user: messageReceiver(message, authUserId, true), group: message === null || message === void 0 ? void 0 : message.group }))] }), selected: isSelected(message) }, message.id))) })] }))] }) })));
+                                startAdornment: _jsx(Icon, { className: classes.icon, children: "search" }),
+                                endAdornment: (_jsx(IconButton, { className: classes.clear, disabled: !search, onClick: handleClear, size: "small", children: _jsx(Icon, { children: "close" }) }))
+                            } }), _jsx(List, { children: filteredSnippets.map((message) => (_jsx(PrivateMessageSnippetItem, { message: message, onItemClick: () => handleOpenThread(message), secondaryAction: _jsxs(_Fragment, { children: [message.thread_status === SCPrivateMessageStatusType.NEW && _jsx(Icon, { color: "secondary", children: "fiber_manual_record" }), !isMobile && (_jsx(PrivateMessageSettingsIconButton, { threadToDelete: (message === null || message === void 0 ? void 0 : message.group) ? message.group.id : messageReceiver(message, authUserId), onItemDeleteConfirm: () => handleDeleteConversation(messageReceiver(message, authUserId)), user: messageReceiver(message, authUserId, true), group: message === null || message === void 0 ? void 0 : message.group }))] }), selected: isSelected(message) }, message.id))) })] }))] }) })));
 }

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

@@ -38,5 +38,5 @@ const Root = styled(Card, {
  *
  */
 export default function PrivateMessageSnippetsSkeleton(props) {
-    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: _jsxs(CardContent, { children: [_jsxs(Stack, Object.assign({ direction: "column", justifyContent: "center", spacing: 1, alignItems: "center" }, { children: [_jsx(Button, Object.assign({ variant: "outlined", size: "medium", disabled: true, className: classes.button }, { children: _jsx(Skeleton, { height: 20, width: 100, variant: 'rectangular' }) })), _jsx(Skeleton, { height: 25, width: '100%', variant: 'rounded', className: classes.searchBar })] })), _jsx(List, Object.assign({ className: classes.list }, { children: [...Array(6)].map((category, index) => (_jsx(PrivateMessageSnippetItemSkeleton, { elevation: 0 }, index))) }))] }) })));
+    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: _jsxs(CardContent, { children: [_jsxs(Stack, { direction: "column", justifyContent: "center", spacing: 1, alignItems: "center", children: [_jsx(Button, { variant: "outlined", size: "medium", disabled: true, className: classes.button, children: _jsx(Skeleton, { height: 20, width: 100, variant: 'rectangular' }) }), _jsx(Skeleton, { height: 25, width: '100%', variant: 'rounded', className: classes.searchBar })] }), _jsx(List, { className: classes.list, children: [...Array(6)].map((category, index) => (_jsx(PrivateMessageSnippetItemSkeleton, { elevation: 0 }, index))) })] }) })));
 }

package/lib/esm/components/PrivateMessageThread/PrivateMessageThread.js

@@ -466,20 +466,20 @@ export default function PrivateMessageThread(inProps) {
         if (loadingMessageObjs) {
             return _jsx(PrivateMessageThreadSkeleton, {});
         }
-        return (_jsxs(CardContent, { children: [_jsx(InfiniteScroll, Object.assign({ height: '100%', dataLength: messageObjs.length, previous: handlePrevious, inverse: true, hasMorePrevious: Boolean(previous), loaderPrevious: _jsx(PrivateMessageThreadItemSkeleton, {}) }, { children: _jsx(List, Object.assign({ ref: messagesEndRef }, { children: Object.keys(formattedMessages).map((key) => (_jsx("li", Object.assign({ className: classes.section }, { children: _jsxs("ul", { children: [_jsx(ListSubheader, { children: _jsx(Typography, Object.assign({ align: "center", className: classes.subHeader }, { children: key })) }), formattedMessages[key].map((msg) => {
+        return (_jsxs(CardContent, { children: [_jsx(InfiniteScroll, { height: '100%', dataLength: messageObjs.length, previous: handlePrevious, inverse: true, hasMorePrevious: Boolean(previous), loaderPrevious: _jsx(PrivateMessageThreadItemSkeleton, {}), children: _jsx(List, { ref: messagesEndRef, children: Object.keys(formattedMessages).map((key) => (_jsx("li", { className: classes.section, children: _jsxs("ul", { children: [_jsx(ListSubheader, { children: _jsx(Typography, { align: "center", className: classes.subHeader, children: key }) }), formattedMessages[key].map((msg) => {
                                         var _a;
-                                        return (_jsxs(Box, Object.assign({ className: classes.item }, { children: [msg.group && ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) !== msg.sender.username && (_jsx(ListItemAvatar, { children: _jsx(Avatar, { alt: msg.sender.username, src: msg.sender.avatar, className: classes.avatar }) })), _jsx(PrivateMessageThreadItem, { className: authUserId === msg.sender.id ? classes.sender : classes.receiver, message: msg, mouseEvents: {
+                                        return (_jsxs(Box, { className: classes.item, children: [msg.group && ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) !== msg.sender.username && (_jsx(ListItemAvatar, { children: _jsx(Avatar, { alt: msg.sender.username, src: msg.sender.avatar, className: classes.avatar }) })), _jsx(PrivateMessageThreadItem, { className: authUserId === msg.sender.id ? classes.sender : classes.receiver, message: msg, mouseEvents: {
                                                         onMouseEnter: () => handleMouseEnter(msg.id),
                                                         onMouseLeave: () => handleMouseLeave(msg.id)
-                                                    }, isHovering: isHovered[msg.id], showMenuIcon: authUserId === msg.sender.id, onMenuIconClick: () => handleOpenDeleteMessageDialog(msg) }, msg.id)] }), msg.id));
-                                    })] }) }), key))) })) })), _jsx(PrivateMessageEditor, { className: classes.editor, send: handleSend, autoHide: type !== SCPrivateMessageType.GROUP && !(scUser === null || scUser === void 0 ? void 0 : scUser.can_send_pm_to), autoHideDeletion: type === SCPrivateMessageType.USER && ((receiver === null || receiver === void 0 ? void 0 : receiver.deleted) || (scUser === null || scUser === void 0 ? void 0 : scUser.deleted)), onThreadChangeId: isNumber ? threadObj : type === SCPrivateMessageType.USER ? threadObj.receiver.id : threadObj.group.id, error: error, onErrorRemove: () => setError(false) }), openDeleteMessageDialog && (_jsx(ConfirmDialog, { open: openDeleteMessageDialog, title: _jsx(FormattedMessage, { id: "ui.privateMessage.component.delete.message.dialog.msg", defaultMessage: "ui.privateMessage.component.delete.message.dialog.msg" }), btnConfirm: _jsx(FormattedMessage, { id: "ui.privateMessage.component.delete.message.dialog.confirm", defaultMessage: "ui.privateMessage.component.delete.message.dialog.confirm" }), onConfirm: handleDeleteMessage, onClose: handleCloseDeleteMessageDialog }))] }));
+                                                    }, isHovering: isHovered[msg.id], showMenuIcon: authUserId === msg.sender.id, onMenuIconClick: () => handleOpenDeleteMessageDialog(msg) }, msg.id)] }, msg.id));
+                                    })] }) }, key))) }) }), _jsx(PrivateMessageEditor, { className: classes.editor, send: handleSend, autoHide: type !== SCPrivateMessageType.GROUP && !(scUser === null || scUser === void 0 ? void 0 : scUser.can_send_pm_to), autoHideDeletion: type === SCPrivateMessageType.USER && ((receiver === null || receiver === void 0 ? void 0 : receiver.deleted) || (scUser === null || scUser === void 0 ? void 0 : scUser.deleted)), onThreadChangeId: isNumber ? threadObj : type === SCPrivateMessageType.USER ? threadObj.receiver.id : threadObj.group.id, error: error, onErrorRemove: () => setError(false) }), openDeleteMessageDialog && (_jsx(ConfirmDialog, { open: openDeleteMessageDialog, title: _jsx(FormattedMessage, { id: "ui.privateMessage.component.delete.message.dialog.msg", defaultMessage: "ui.privateMessage.component.delete.message.dialog.msg" }), btnConfirm: _jsx(FormattedMessage, { id: "ui.privateMessage.component.delete.message.dialog.confirm", defaultMessage: "ui.privateMessage.component.delete.message.dialog.confirm" }), onConfirm: handleDeleteMessage, onClose: handleCloseDeleteMessageDialog }))] }));
     }
     /**
      * Renders empty box (when there is no thread open) or new message box
      * @return {JSX.Element}
      */
     function renderNewOrNoMessageBox() {
-        return (_jsx(CardContent, { children: isNew || singleMessageThread ? (_jsxs(_Fragment, { children: [_jsxs(Box, Object.assign({ className: classes.newMessageHeader }, { children: [_jsxs(Box, Object.assign({ className: classes.newMessageHeaderContent }, { children: [_jsx(Icon, Object.assign({ className: classes.newMessageHeaderIcon }, { children: "person" })), _jsx(Typography, { children: _jsx(FormattedMessage, { defaultMessage: "ui.privateMessage.thread.newMessage.to", id: "ui.privateMessage.thread.newMessage.to" }) }), _jsx(Autocomplete, { className: classes.autocomplete, loading: loading, multiple: !singleMessageThread, limitTags: 3, freeSolo: true, disableClearable: true, options: followers, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, value: singleMessageThread ? singleMessageUser : recipients, getOptionLabel: (option) => (option ? option.username : '...'), isOptionEqualToValue: (option, value) => (option ? value.id === option.id : false), renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { placeholder: singleMessageThread ? '...' : `${intl.formatMessage(translMessages.placeholder)}`, variant: "standard", InputProps: Object.assign(Object.assign({}, params.InputProps), { disableUnderline: true }) }))), classes: { popper: classes.autocompleteDialog }, disabled: Boolean(singleMessageUser) })] })), _jsx(IconButton, Object.assign({ size: "small", onClick: handleNewMessageClose }, { children: _jsx(Icon, { children: "close" }) }))] })), _jsx(List, { className: classes.newMessageContent }), _jsx(PrivateMessageEditor, { className: classes.editor, send: handleSend, autoHide: !followers, error: error, onErrorRemove: () => setError(false) })] })) : (_jsx(Typography, Object.assign({ className: classes.emptyMessage }, { children: _jsx(FormattedMessage, { id: "ui.privateMessage.thread.emptyBox.message", defaultMessage: "ui.privateMessage.thread.emptyBox.message" }) }))) }));
+        return (_jsx(CardContent, { children: isNew || singleMessageThread ? (_jsxs(_Fragment, { children: [_jsxs(Box, { className: classes.newMessageHeader, children: [_jsxs(Box, { className: classes.newMessageHeaderContent, children: [_jsx(Icon, { className: classes.newMessageHeaderIcon, children: "person" }), _jsx(Typography, { children: _jsx(FormattedMessage, { defaultMessage: "ui.privateMessage.thread.newMessage.to", id: "ui.privateMessage.thread.newMessage.to" }) }), _jsx(Autocomplete, { className: classes.autocomplete, loading: loading, multiple: !singleMessageThread, limitTags: 3, freeSolo: true, disableClearable: true, options: followers, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, value: singleMessageThread ? singleMessageUser : recipients, getOptionLabel: (option) => (option ? option.username : '...'), isOptionEqualToValue: (option, value) => (option ? value.id === option.id : false), renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { placeholder: singleMessageThread ? '...' : `${intl.formatMessage(translMessages.placeholder)}`, variant: "standard", InputProps: Object.assign(Object.assign({}, params.InputProps), { disableUnderline: true }) }))), classes: { popper: classes.autocompleteDialog }, disabled: Boolean(singleMessageUser) })] }), _jsx(IconButton, { size: "small", onClick: handleNewMessageClose, children: _jsx(Icon, { children: "close" }) })] }), _jsx(List, { className: classes.newMessageContent }), _jsx(PrivateMessageEditor, { className: classes.editor, send: handleSend, autoHide: !followers, error: error, onErrorRemove: () => setError(false) })] })) : (_jsx(Typography, { className: classes.emptyMessage, children: _jsx(FormattedMessage, { id: "ui.privateMessage.thread.emptyBox.message", defaultMessage: "ui.privateMessage.thread.emptyBox.message" }) })) }));
     }
     // Anonymous
     if (!authUserId) {
@@ -488,5 +488,5 @@ export default function PrivateMessageThread(inProps) {
     /**
      * Renders the component
      */
-    return (_jsx(Root, Object.assign({}, rest, { className: classNames(classes.root, className) }, { children: threadObj !== null && !isNew && !singleMessageThread ? renderThread() : renderNewOrNoMessageBox() })));
+    return (_jsx(Root, Object.assign({}, rest, { className: classNames(classes.root, className), children: threadObj !== null && !isNew && !singleMessageThread ? renderThread() : renderNewOrNoMessageBox() })));
 }

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

@@ -37,5 +37,5 @@ const Root = styled(Card, {
 export default function PrivateMessageThreadSkeleton(props) {
     const theme = useTheme();
     const isMobile = useMediaQuery(theme.breakpoints.down('sm'));
-    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: _jsxs(CardContent, { children: [_jsxs(List, Object.assign({ className: classes.list }, { children: [_jsx(ListSubheader, Object.assign({ sx: { display: 'flex', justifyContent: 'center' } }, { children: _jsx(Skeleton, { animation: "wave", height: 30, width: 120, style: { borderRadius: 20 } }) })), [...Array(isMobile ? 6 : 8)].map((item, index) => (_jsx(PrivateMessageThreadItemSkeleton, { index: index }, index)))] })), _jsx(Box, Object.assign({ className: classes.editor }, { children: _jsx(Skeleton, { animation: "wave", height: 55, width: '100%', variant: 'rectangular' }) }))] }) })));
+    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: _jsxs(CardContent, { children: [_jsxs(List, { className: classes.list, children: [_jsx(ListSubheader, { sx: { display: 'flex', justifyContent: 'center' }, children: _jsx(Skeleton, { animation: "wave", height: 30, width: 120, style: { borderRadius: 20 } }) }), [...Array(isMobile ? 6 : 8)].map((item, index) => (_jsx(PrivateMessageThreadItemSkeleton, { index: index }, index)))] }), _jsx(Box, { className: classes.editor, children: _jsx(Skeleton, { animation: "wave", height: 55, width: '100%', variant: 'rectangular' }) })] }) })));
 }

package/lib/esm/components/PrivateMessageThreadItem/PrivateMessageThreadItem.js

@@ -125,23 +125,23 @@ export default function PrivateMessageThreadItem(inProps) {
             return null;
         }
         let section = null;
-        const defaultSection = (_jsx(Box, Object.assign({ className: classes.other }, { children: _jsxs(Button, Object.assign({ onClick: () => handleDownload(m.file), startIcon: _jsx(Icon, { children: "download" }) }, { children: [_jsx(Typography, { children: m.file.filename }), _jsx(Typography, { children: bytesToSize(m.file.filesize) })] })) })));
+        const defaultSection = (_jsx(Box, { className: classes.other, children: _jsxs(Button, { onClick: () => handleDownload(m.file), startIcon: _jsx(Icon, { children: "download" }), children: [_jsx(Typography, { children: m.file.filename }), _jsx(Typography, { children: bytesToSize(m.file.filesize) })] }) }));
         if (m.file) {
             let type = m.file.mimetype;
             switch (true) {
                 case type.startsWith(SCMessageFileType.IMAGE):
-                    section = (_jsx(Box, Object.assign({ className: classes.img }, { children: _jsx("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img', onClick: () => setOpenDialog(true) }) })));
+                    section = (_jsx(Box, { className: classes.img, children: _jsx("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img', onClick: () => setOpenDialog(true) }) }));
                     break;
                 case type.startsWith(SCMessageFileType.VIDEO):
                     if (!isSupportedVideoFormat(m.file.filename)) {
                         section = defaultSection;
                     }
                     else {
-                        section = (_jsxs(Box, Object.assign({ className: classNames(classes.img, classes.video) }, { children: [_jsx("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img' }), _jsx(IconButton, Object.assign({ onClick: () => setOpenDialog(true) }, { children: _jsx(Icon, { children: "play_circle_outline" }) }))] })));
+                        section = (_jsxs(Box, { className: classNames(classes.img, classes.video), children: [_jsx("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img' }), _jsx(IconButton, { onClick: () => setOpenDialog(true), children: _jsx(Icon, { children: "play_circle_outline" }) })] }));
                     }
                     break;
                 case type.startsWith(SCMessageFileType.DOCUMENT):
-                    section = (_jsxs(Box, Object.assign({ className: m.file.filename.endsWith('.pdf') ? classes.document : classes.other }, { children: [m.file.filename.endsWith('.pdf') && _jsx("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img' }), _jsxs(Button, Object.assign({ onClick: () => handleDownload(m.file), startIcon: _jsx(Icon, { children: "download" }) }, { children: [_jsx(Typography, { children: m.file.filename }), _jsx(Typography, { children: bytesToSize(m.file.filesize) })] }))] })));
+                    section = (_jsxs(Box, { className: m.file.filename.endsWith('.pdf') ? classes.document : classes.other, children: [m.file.filename.endsWith('.pdf') && _jsx("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img' }), _jsxs(Button, { onClick: () => handleDownload(m.file), startIcon: _jsx(Icon, { children: "download" }), children: [_jsx(Typography, { children: m.file.filename }), _jsx(Typography, { children: bytesToSize(m.file.filesize) })] })] }));
                     break;
                 default:
                     // section = <Icon>hide_image</Icon>;
@@ -159,10 +159,8 @@ export default function PrivateMessageThreadItem(inProps) {
      */
     return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, getMouseEvents(mouseEvents.onMouseEnter, mouseEvents.onMouseLeave), rest, { secondaryAction: (isHovering || isMobile) &&
             showMenuIcon &&
-            message.status !== SCPrivateMessageStatusType.HIDDEN && _jsx(PrivateMessageSettingsIconButton, { onMenuItemDeleteClick: handleMenuItemClick }) }, { children: [message.group && ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) !== message.sender.username && (_jsx(Typography, Object.assign({ color: "secondary", variant: "h4", className: classes.username }, { children: message.sender.username }))), _jsxs(_Fragment, { children: [hasFile && message.status !== SCPrivateMessageStatusType.HIDDEN ? (renderMessageFile(message)) : (_jsx(Box, Object.assign({ className: classes.text }, { children: _jsx(Typography, { component: "span", dangerouslySetInnerHTML: { __html: message.message } }) }))), _jsx(Typography, Object.assign({ className: classes.messageTime, color: "text.secondary" }, { children: `${intl.formatDate(message.created_at, {
+            message.status !== SCPrivateMessageStatusType.HIDDEN && _jsx(PrivateMessageSettingsIconButton, { onMenuItemDeleteClick: handleMenuItemClick }), children: [message.group && ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) !== message.sender.username && (_jsx(Typography, { color: "secondary", variant: "h4", className: classes.username, children: message.sender.username })), _jsxs(_Fragment, { children: [hasFile && message.status !== SCPrivateMessageStatusType.HIDDEN ? (renderMessageFile(message)) : (_jsx(Box, { className: classes.text, children: _jsx(Typography, { component: "span", dangerouslySetInnerHTML: { __html: message.message } }) })), _jsx(Typography, { className: classes.messageTime, color: "text.secondary", children: `${intl.formatDate(message.created_at, {
                             hour: 'numeric',
                             minute: 'numeric'
-                        })}` }))] }), openDialog && (_jsx(_Fragment, { children: (message === null || message === void 0 ? void 0 : message.file.mimetype.startsWith(SCMessageFileType.VIDEO)) ? (_jsx(DialogRoot, Object.assign({ open: openDialog, onClose: () => setOpenDialog(false), className: classes.dialogRoot }, { children: _jsx(AutoPlayer, { url: message === null || message === void 0 ? void 0 : message.file.url, width: '100%', enableAutoplay: false }) }))) : (_jsx(LightBox, { images: [{ src: message === null || message === void 0 ? void 0 : message.file.url, key: message.file.uuid }], onClose: () => setOpenDialog(false), toolbarButtons: [
-                        _jsx(IconButton, Object.assign({ onClick: () => handleDownload(message === null || message === void 0 ? void 0 : message.file), className: classes.downloadButton }, { children: _jsx(Icon, { children: "download" }) }), 'download')
-                    ] })) }))] })));
+                        })}` })] }), openDialog && (_jsx(_Fragment, { children: (message === null || message === void 0 ? void 0 : message.file.mimetype.startsWith(SCMessageFileType.VIDEO)) ? (_jsx(DialogRoot, { open: openDialog, onClose: () => setOpenDialog(false), className: classes.dialogRoot, children: _jsx(AutoPlayer, { url: message === null || message === void 0 ? void 0 : message.file.url, width: '100%', enableAutoplay: false }) })) : (_jsx(LightBox, { images: [{ src: message === null || message === void 0 ? void 0 : message.file.url, key: message.file.uuid }], onClose: () => setOpenDialog(false), toolbarButtons: _jsx(IconButton, { onClick: () => handleDownload(message === null || message === void 0 ? void 0 : message.file), className: classes.downloadButton, children: _jsx(Icon, { children: "download" }) }, 'download') })) }))] })));
 }

package/lib/esm/components/RelatedEventsWidget/RelatedEventsWidget.js

@@ -119,5 +119,5 @@ export default function RelatedEventsWidget(inProps) {
     if (!scEvent || (state === null || state === void 0 ? void 0 : state.count) === 0) {
         return _jsx(HiddenPlaceholder, {});
     }
-    return (_jsxs(Root, Object.assign({ className: classes.root }, rest, { children: [_jsxs(CardContent, Object.assign({ className: classes.content }, { children: [_jsxs(Stack, Object.assign({ className: classes.header }, { children: [_jsx(Button, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, { id: (_a = scUserContext.user) === null || _a === void 0 ? void 0 : _a.id }), className: classes.avatarWrapper }, { children: _jsx(Avatar, { variant: "rounded", src: scEvent.managed_by.avatar, alt: scEvent.managed_by.username, className: classes.avatar }) })), _jsx(Typography, Object.assign({ variant: "h4" }, { children: _jsx("b", { children: intl.formatMessage(messages.title, { user: scEvent.managed_by.username }) }) }))] })), _jsx(Stack, Object.assign({ className: classes.eventWrapper }, { children: state === null || state === void 0 ? void 0 : state.results.map((_event, i, array) => (_jsxs(Fragment, { children: [_jsx(Event, Object.assign({ event: _event, eventId: _event.id }, eventComponentProps, { className: classes.event })), i < array.length - 1 && _jsx(Divider, {})] }, i))) }))] })), state.count > state.visibleItems && (_jsx(CardActions, Object.assign({ className: classes.actions }, { children: _jsx(Button, Object.assign({ onClick: handleToggleDialogOpen, className: classes.actionButton }, { children: _jsx(Typography, Object.assign({ variant: "caption" }, { children: _jsx(FormattedMessage, { id: "ui.relatedEventsWidget.showAll", defaultMessage: "ui.relatedEventsWidget.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: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: _jsx(EventSkeleton, Object.assign({ elevation: 0 }, eventComponentProps)), className: classes.infiniteScroll, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.relatedEventsWidget.noMoreResults", defaultMessage: "ui.eventMembersWidget.noMoreResults" }) })) }, { children: _jsx(List, { children: state.results.map((event) => (_jsx(ListItem, { children: _jsx(Event, Object.assign({ elevation: 0, event: event }, eventComponentProps)) }, event.id))) }) })) })))] })));
+    return (_jsxs(Root, Object.assign({ className: classes.root }, rest, { children: [_jsxs(CardContent, { className: classes.content, children: [_jsxs(Stack, { className: classes.header, children: [_jsx(Button, { component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, { id: (_a = scUserContext.user) === null || _a === void 0 ? void 0 : _a.id }), className: classes.avatarWrapper, children: _jsx(Avatar, { variant: "rounded", src: scEvent.managed_by.avatar, alt: scEvent.managed_by.username, className: classes.avatar }) }), _jsx(Typography, { variant: "h4", children: _jsx("b", { children: intl.formatMessage(messages.title, { user: scEvent.managed_by.username }) }) })] }), _jsx(Stack, { className: classes.eventWrapper, children: state === null || state === void 0 ? void 0 : state.results.map((_event, i, array) => (_jsxs(Fragment, { children: [_jsx(Event, Object.assign({ event: _event, eventId: _event.id }, eventComponentProps, { className: classes.event })), i < array.length - 1 && _jsx(Divider, {})] }, i))) })] }), state.count > state.visibleItems && (_jsx(CardActions, { className: classes.actions, children: _jsx(Button, { onClick: handleToggleDialogOpen, className: classes.actionButton, children: _jsx(Typography, { variant: "caption", children: _jsx(FormattedMessage, { id: "ui.relatedEventsWidget.showAll", defaultMessage: "ui.relatedEventsWidget.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: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: _jsx(EventSkeleton, Object.assign({ elevation: 0 }, eventComponentProps)), className: classes.infiniteScroll, endMessage: _jsx(Typography, { className: classes.endMessage, children: _jsx(FormattedMessage, { id: "ui.relatedEventsWidget.noMoreResults", defaultMessage: "ui.eventMembersWidget.noMoreResults" }) }), children: _jsx(List, { children: state.results.map((event) => (_jsx(ListItem, { children: _jsx(Event, Object.assign({ elevation: 0, event: event }, eventComponentProps)) }, event.id))) }) }) })))] })));
 }

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

@@ -20,5 +20,5 @@ const Root = styled(Widget, {
     overridesResolver: (_props, styles) => styles.skeletonRoot
 })(() => ({}));
 export default function RelatedEventsWidgetSkeleton() {
-    return (_jsxs(Root, Object.assign({ className: classes.root }, { children: [_jsx(CardContent, Object.assign({ className: classes.content }, { children: _jsx(Stack, Object.assign({ className: classes.eventWrapper }, { children: [1, 2, 3, 4].map((_event, i, array) => (_jsxs(Fragment, { children: [_jsx(EventSkeleton, { elevation: 0, className: classes.event }), i < array.length - 1 && _jsx(Divider, {})] }, i))) })) })), _jsx(CardActions, Object.assign({ className: classes.actions }, { children: _jsx(Skeleton, { animation: "wave", width: "52px", height: "20px" }) }))] })));
+    return (_jsxs(Root, { className: classes.root, children: [_jsx(CardContent, { className: classes.content, children: _jsx(Stack, { className: classes.eventWrapper, children: [1, 2, 3, 4].map((_event, i, array) => (_jsxs(Fragment, { children: [_jsx(EventSkeleton, { elevation: 0, className: classes.event }), i < array.length - 1 && _jsx(Divider, {})] }, i))) }) }), _jsx(CardActions, { className: classes.actions, children: _jsx(Skeleton, { animation: "wave", width: "52px", height: "20px" }) })] }));
 }

package/lib/esm/components/RelatedFeedObjectsWidget/RelatedFeedObjectsWidget.js

@@ -197,6 +197,6 @@ export default function RelatedFeedObjectWidget(inProps) {
         return null;
     };
     const advPosition = Math.floor(Math.random() * (Math.min(state.count, 5) - 1 + 1) + 1);
-    const content = (_jsxs(CardContent, { children: [_jsx(Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.relatedFeedObjectsWidget.title", defaultMessage: "ui.relatedFeedObjectsWidget.title" }) })), !state.count ? (_jsx(Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.relatedFeedObjectsWidget.noResults", defaultMessage: "ui.relatedFeedObjectsWidget.noResults" }) }))) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((obj, index) => (_jsxs(React.Fragment, { children: [_jsx(ListItem, { children: _jsx(FeedObject, Object.assign({ elevation: 0, feedObject: obj, template: template }, FeedObjectProps)) }, obj.id), advPosition === index && renderAdvertising()] }, index))) }), state.count > state.visibleItems && (_jsx(Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: _jsx(FormattedMessage, { id: "ui.categoryTrendingFeedWidget.button.showAll", defaultMessage: "ui.categoryTrendingFeedWidget.button.showAll" }) })))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.categoryTrendingFeedWidget.title", id: "ui.categoryTrendingFeedWidget.title", values: { total: state.count } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: _jsx(InfiniteScroll, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: _jsx(FeedObjectSkeleton, Object.assign({ elevation: 0 }, FeedObjectProps)), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.categoryTrendingFeedWidget.noMoreResults", defaultMessage: "ui.categoryTrendingFeedWidget.noMoreResults" }) })) }, { children: _jsx(List, { children: state.results.map((obj) => (_jsx(ListItem, { children: _jsx(FeedObject, Object.assign({ elevation: 0, feedObject: obj }, FeedObjectProps)) }, obj.id))) }) })) })))] }));
+    const content = (_jsxs(CardContent, { children: [_jsx(Typography, { className: classes.title, variant: "h5", children: _jsx(FormattedMessage, { id: "ui.relatedFeedObjectsWidget.title", defaultMessage: "ui.relatedFeedObjectsWidget.title" }) }), !state.count ? (_jsx(Typography, { className: classes.noResults, variant: "body2", children: _jsx(FormattedMessage, { id: "ui.relatedFeedObjectsWidget.noResults", defaultMessage: "ui.relatedFeedObjectsWidget.noResults" }) })) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((obj, index) => (_jsxs(React.Fragment, { children: [_jsx(ListItem, { children: _jsx(FeedObject, Object.assign({ elevation: 0, feedObject: obj, template: template }, FeedObjectProps)) }, obj.id), advPosition === index && renderAdvertising()] }, index))) }), state.count > state.visibleItems && (_jsx(Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: _jsx(FormattedMessage, { id: "ui.categoryTrendingFeedWidget.button.showAll", defaultMessage: "ui.categoryTrendingFeedWidget.button.showAll" }) }))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.categoryTrendingFeedWidget.title", id: "ui.categoryTrendingFeedWidget.title", values: { total: state.count } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: _jsx(InfiniteScroll, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: _jsx(FeedObjectSkeleton, Object.assign({ elevation: 0 }, FeedObjectProps)), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, { className: classes.endMessage, children: _jsx(FormattedMessage, { id: "ui.categoryTrendingFeedWidget.noMoreResults", defaultMessage: "ui.categoryTrendingFeedWidget.noMoreResults" }) }), children: _jsx(List, { children: state.results.map((obj) => (_jsx(ListItem, { children: _jsx(FeedObject, Object.assign({ elevation: 0, feedObject: obj }, FeedObjectProps)) }, obj.id))) }) }) })))] }));
     return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: content })));
 }

package/lib/esm/components/SearchAutocomplete/SearchAutocomplete.js

@@ -125,7 +125,7 @@ export default function SearchAutocomplete(inProps) {
                 return option;
             }
             return optionLabel(option);
-        }, renderOption: (props, option) => (_jsxs(Box, Object.assign({ component: "li" }, props, { children: [_jsx(Avatar, { alt: getOptionData(option).name, src: getOptionData(option).image, variant: getOptionData(option).variant }), _jsx(Typography, Object.assign({ ml: 1 }, { children: getOptionData(option).name }))] }))), renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { placeholder: `${intl.formatMessage(messages.placeholder, {
+        }, renderOption: (props, option) => (_jsxs(Box, Object.assign({ component: "li" }, props, { children: [_jsx(Avatar, { alt: getOptionData(option).name, src: getOptionData(option).image, variant: getOptionData(option).variant }), _jsx(Typography, { ml: 1, children: getOptionData(option).name })] }))), renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { placeholder: `${intl.formatMessage(messages.placeholder, {
                 community: scPreferences.preferences[SCPreferences.TEXT_APPLICATION_NAME].value
-            })}`, InputProps: Object.assign(Object.assign({}, params.InputProps), { autoFocus, name: 'search-autocomplete', className: classes.input, startAdornment: _jsx(Icon, Object.assign({ className: classes.icon }, { children: "search" })), endAdornment: (_jsx(Fade, Object.assign({ in: value.length > 0 || Boolean(onClear), appear: false }, { children: _jsx(IconButton, Object.assign({ className: classes.clear, onClick: handleClear, size: "small" }, { children: _jsx(Icon, { children: "close" }) })) }))) }) }))) }, rest)));
+            })}`, InputProps: Object.assign(Object.assign({}, params.InputProps), { autoFocus, name: 'search-autocomplete', className: classes.input, startAdornment: _jsx(Icon, { className: classes.icon, children: "search" }), endAdornment: (_jsx(Fade, { in: value.length > 0 || Boolean(onClear), appear: false, children: _jsx(IconButton, { className: classes.clear, onClick: handleClear, size: "small", children: _jsx(Icon, { children: "close" }) }) })) }) }))) }, rest)));
 }

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

@@ -38,5 +38,5 @@ const Root = styled(List, {
 export default function SnippetNotificationSkeleton(props) {
     const theme = useTheme();
     const notificationSkeleton = (_jsx(NotificationItem, { className: classes.item, template: SCNotificationObjectTemplateType.SNIPPET, image: _jsx(Skeleton, { animation: "wave", variant: "circular", width: theme.selfcommunity.user.avatar.sizeSmall, height: theme.selfcommunity.user.avatar.sizeSmall }), primary: _jsx(Skeleton, { animation: "wave", height: 10, width: 120, style: { marginBottom: 10 } }), secondary: _jsx(Skeleton, { animation: "wave", height: 10, width: 70, style: { marginBottom: 10 } }) }));
-    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: [...Array(7)].map((x, i) => (_jsx(ListItem, Object.assign({ className: classes.item }, { children: notificationSkeleton }), i))) })));
+    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: [...Array(7)].map((x, i) => (_jsx(ListItem, { className: classes.item, children: notificationSkeleton }, i))) })));
 }

package/lib/esm/components/SnippetNotifications/SnippetNotifications.js

@@ -276,9 +276,9 @@ export default function SnippetNotifications(inProps) {
     /**
      * Renders root object
      */
-    return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, rest, { children: _jsx(Box, Object.assign({ className: classes.notificationsWrap }, { children: !initialized || loading ? (_jsx(Skeleton, { elevation: 0 })) : (_jsx(ScrollContainer, Object.assign({}, ScrollContainerProps, { children: _jsxs(MenuList, Object.assign({ className: classes.list, disabledItemsFocusable: true, disableListWrap: true }, { children: [scUserContext.user.unseen_notification_banners_counter ? (_jsx(MenuItem, Object.assign({ className: classNames(classes.item, classes.broadcastMessagesBanner), component: Link, to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}) }, { children: _jsx(NotificationItem, { template: SCNotificationObjectTemplateType.SNIPPET, isNew: true, disableTypography: true, image: _jsx(Avatar, { alt: preferences[SCPreferences.TEXT_APPLICATION_NAME], src: preferences[SCPreferences.LOGO_NAVBAR_LOGO_MOBILE] }), primary: _jsx(Typography, Object.assign({ component: 'div' }, { children: intl.formatMessage({ id: 'ui.snippetNotifications.broadcastMessages', defaultMessage: 'ui.snippetNotifications.broadcastMessages' }, {
+    return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, rest, { children: _jsx(Box, { className: classes.notificationsWrap, children: !initialized || loading ? (_jsx(Skeleton, { elevation: 0 })) : (_jsx(ScrollContainer, Object.assign({}, ScrollContainerProps, { children: _jsxs(MenuList, { className: classes.list, disabledItemsFocusable: true, disableListWrap: true, children: [scUserContext.user.unseen_notification_banners_counter ? (_jsx(MenuItem, { className: classNames(classes.item, classes.broadcastMessagesBanner), component: Link, to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}), children: _jsx(NotificationItem, { template: SCNotificationObjectTemplateType.SNIPPET, isNew: true, disableTypography: true, image: _jsx(Avatar, { alt: preferences[SCPreferences.TEXT_APPLICATION_NAME], src: preferences[SCPreferences.LOGO_NAVBAR_LOGO_MOBILE] }), primary: _jsx(Typography, { component: 'div', children: intl.formatMessage({ id: 'ui.snippetNotifications.broadcastMessages', defaultMessage: 'ui.snippetNotifications.broadcastMessages' }, {
                                         count: scUserContext.user.unseen_notification_banners_counter,
                                         b: (...chunks) => _jsx("strong", { children: chunks }),
-                                        link: (...chunks) => _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}) }, { children: chunks }))
-                                    }) })) }) }), "banner")) : null, notifications.length === 0 ? (_jsx(MenuItem, Object.assign({ className: classes.emptyBoxNotifications }, { children: _jsx(FormattedMessage, { id: "ui.snippetNotifications.noNotifications", defaultMessage: "ui.snippetNotifications.noNotifications" }) }))) : (notifications.slice(0, showMax).map((notificationObject, i) => notificationObject.aggregated.map((n, k) => (_jsx(MenuItem, Object.assign({ className: classes.item, onClick: (e) => handleSingleNotificationClick(e, n), disableRipple: true, disableTouchRipple: true }, { children: renderAggregatedItem(n, i) }), k)))))] })) }))) })) })));
+                                        link: (...chunks) => _jsx(Link, { to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}), children: chunks })
+                                    }) }) }) }, "banner")) : null, notifications.length === 0 ? (_jsx(MenuItem, { className: classes.emptyBoxNotifications, children: _jsx(FormattedMessage, { id: "ui.snippetNotifications.noNotifications", defaultMessage: "ui.snippetNotifications.noNotifications" }) })) : (notifications.slice(0, showMax).map((notificationObject, i) => notificationObject.aggregated.map((n, k) => (_jsx(MenuItem, { className: classes.item, onClick: (e) => handleSingleNotificationClick(e, n), disableRipple: true, disableTouchRipple: true, children: renderAggregatedItem(n, i) }, k)))))] }) }))) }) })));
 }

package/lib/esm/components/SuggestedEventsWidget/Arrow.js

@@ -21,7 +21,7 @@ export default function Arrow(props) {
         setCurrentItem(swiper.snapIndex);
     }, [type]);
     if (type === 'prev') {
-        return (currentItem > 0 && (_jsx(Button, Object.assign({ variant: "contained", className: className, size: "medium", onClick: () => handleChange('prev') }, { children: _jsx(Icon, { children: "chevron_left" }) }))));
+        return (currentItem > 0 && (_jsx(Button, { variant: "contained", className: className, size: "medium", onClick: () => handleChange('prev'), children: _jsx(Icon, { children: "chevron_left" }) })));
     }
-    return (currentItem < itemsLength - 1 && (_jsx(Button, Object.assign({ variant: "contained", className: className, size: "medium", onClick: () => handleChange('next') }, { children: _jsx(Icon, { children: "chevron_right" }) }))));
+    return (currentItem < itemsLength - 1 && (_jsx(Button, { variant: "contained", className: className, size: "medium", onClick: () => handleChange('next'), children: _jsx(Icon, { children: "chevron_right" }) })));
 }

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

@@ -20,5 +20,5 @@ const Root = styled(Widget, {
     overridesResolver: (_props, styles) => styles.skeletonRoot
 })(() => ({}));
 export default function SuggestedEventsWidgetSkeleton() {
-    return (_jsxs(Root, Object.assign({ className: classes.root }, { children: [_jsxs(CardContent, Object.assign({ className: classes.content }, { children: [_jsx(Skeleton, { className: classes.title, animation: "wave", width: "141px", height: "23px" }), _jsx(Swiper, Object.assign({ spaceBetween: 8, slidesPerView: "auto" }, { children: [1, 2, 3, 4, 5, 6, 7].map((_element, i) => (_jsx(SwiperSlide, Object.assign({ className: classes.swiperSlide }, { children: _jsx(EventSkeleton, { template: SCEventTemplateType.PREVIEW, variant: "outlined", actions: _jsx(_Fragment, {}) }) }), i))) }))] })), _jsx(CardActions, Object.assign({ className: classes.actions }, { children: _jsx(Skeleton, { animation: "wave", width: "52px", height: "20px" }) }))] })));
+    return (_jsxs(Root, { className: classes.root, children: [_jsxs(CardContent, { className: classes.content, children: [_jsx(Skeleton, { className: classes.title, animation: "wave", width: "141px", height: "23px" }), _jsx(Swiper, { spaceBetween: 8, slidesPerView: "auto", children: [1, 2, 3, 4, 5, 6, 7].map((_element, i) => (_jsx(SwiperSlide, { className: classes.swiperSlide, children: _jsx(EventSkeleton, { template: SCEventTemplateType.PREVIEW, variant: "outlined", actions: _jsx(_Fragment, {}) }) }, i))) })] }), _jsx(CardActions, { className: classes.actions, children: _jsx(Skeleton, { animation: "wave", width: "52px", height: "20px" }) })] }));
 }

package/lib/esm/components/SuggestedEventsWidget/SuggestedEventsWidget.js

@@ -137,8 +137,8 @@ export default function SuggestedEventsWidget(inProps) {
     if (!events || count === 0) {
         return _jsx(HiddenPlaceholder, {});
     }
-    return (_jsxs(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: "ui.suggestedEventsWidget.title", defaultMessage: "ui.suggestedEventsWidget.title" }) })), _jsxs(Swiper, Object.assign({ spaceBetween: 8, slidesPerView: "auto", grabCursor: true, onReachBeginning: handleReachBeginning, onReachEnd: handleReachEnd, onSlideChange: handleChange, className: classes.swiper, style: {
+    return (_jsxs(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: "ui.suggestedEventsWidget.title", defaultMessage: "ui.suggestedEventsWidget.title" }) }), _jsxs(Swiper, { spaceBetween: 8, slidesPerView: "auto", grabCursor: true, onReachBeginning: handleReachBeginning, onReachEnd: handleReachEnd, onSlideChange: handleChange, className: classes.swiper, style: {
                             marginLeft: hideMarginLeft ? `-${theme.spacing(2)}` : 0,
                             marginRight: hideMarginRight ? `-${theme.spacing(2)}` : 0
-                        } }, { children: [(showSkeleton ? [...events, undefined] : events).map((event, i) => (_jsx(SwiperSlide, Object.assign({ className: classes.swiperSlide }, { children: _jsx(Event, { event: event, template: SCEventTemplateType.PREVIEW, actions: _jsx(_Fragment, {}), variant: "outlined", className: classes.event }) }), i))), _jsx(Arrow, { className: classNames(classes.swiperArrow, classes.swiperPrevArrow), type: "prev", currentItem: currentItem, setCurrentItem: setCurrentItem }), _jsx(Arrow, { className: classNames(classes.swiperArrow, classes.swiperNextArrow), type: "next", currentItem: currentItem, setCurrentItem: setCurrentItem })] }))] })), _jsx(CardActions, Object.assign({ className: classes.actions }, { children: _jsx(Button, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.EVENTS_SUGGESTED_ROUTE_NAME, {}), className: classes.actionButton }, { children: _jsx(Typography, Object.assign({ variant: "caption" }, { children: _jsx(FormattedMessage, { id: "ui.suggestedEventsWidget.showAll", defaultMessage: "ui.suggestedEventsWidget.showAll" }) })) })) }))] })));
+                        }, children: [(showSkeleton ? [...events, undefined] : events).map((event, i) => (_jsx(SwiperSlide, { className: classes.swiperSlide, children: _jsx(Event, { event: event, template: SCEventTemplateType.PREVIEW, actions: _jsx(_Fragment, {}), variant: "outlined", className: classes.event }) }, i))), _jsx(Arrow, { className: classNames(classes.swiperArrow, classes.swiperPrevArrow), type: "prev", currentItem: currentItem, setCurrentItem: setCurrentItem }), _jsx(Arrow, { className: classNames(classes.swiperArrow, classes.swiperNextArrow), type: "next", currentItem: currentItem, setCurrentItem: setCurrentItem })] })] }), _jsx(CardActions, { className: classes.actions, children: _jsx(Button, { component: Link, to: scRoutingContext.url(SCRoutes.EVENTS_SUGGESTED_ROUTE_NAME, {}), className: classes.actionButton, children: _jsx(Typography, { variant: "caption", children: _jsx(FormattedMessage, { id: "ui.suggestedEventsWidget.showAll", defaultMessage: "ui.suggestedEventsWidget.showAll" }) }) }) })] })));
 }

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

@@ -33,5 +33,5 @@ const Root = styled(BaseItem, {
  */
 export default function UserSkeleton(props) {
     const theme = useTheme();
-    return (_jsx(Root, Object.assign({ className: classes.root }, props, { image: _jsx(Skeleton, { animation: "wave", variant: "circular", width: theme.selfcommunity.user.avatar.sizeMedium, height: theme.selfcommunity.user.avatar.sizeMedium }), primary: _jsx(Skeleton, { animation: "wave", height: 10, width: 120, style: { marginBottom: 10 } }), secondary: _jsx(Skeleton, { animation: "wave", height: 10, width: 70, style: { marginBottom: 10 } }), actions: _jsx(Button, Object.assign({ size: "small", variant: "outlined", disabled: true }, { children: _jsx(Skeleton, { animation: "wave", height: 10, width: 30, style: { marginTop: 5, marginBottom: 5 } }) })) })));
+    return (_jsx(Root, Object.assign({ className: classes.root }, props, { image: _jsx(Skeleton, { animation: "wave", variant: "circular", width: theme.selfcommunity.user.avatar.sizeMedium, height: theme.selfcommunity.user.avatar.sizeMedium }), primary: _jsx(Skeleton, { animation: "wave", height: 10, width: 120, style: { marginBottom: 10 } }), secondary: _jsx(Skeleton, { animation: "wave", height: 10, width: 70, style: { marginBottom: 10 } }), actions: _jsx(Button, { size: "small", variant: "outlined", disabled: true, children: _jsx(Skeleton, { animation: "wave", height: 10, width: 30, style: { marginTop: 5, marginBottom: 5 } }) }) })));
 }

package/lib/esm/components/User/User.js

@@ -87,7 +87,7 @@ export default function User(inProps) {
      * @return {JSX.Element}
      */
     function renderAuthenticatedActions() {
-        return (_jsxs(React.Fragment, { children: [handleIgnoreAction && (_jsx(Button, Object.assign({ size: "small", onClick: handleIgnoreAction }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.user.ignore", id: "ui.user.ignore" }) }))), _jsx(ConnectionUserButton, Object.assign({ user: scUser }, followConnectUserButtonProps))] }));
+        return (_jsxs(React.Fragment, { children: [handleIgnoreAction && (_jsx(Button, { size: "small", onClick: handleIgnoreAction, children: _jsx(FormattedMessage, { defaultMessage: "ui.user.ignore", id: "ui.user.ignore" }) })), _jsx(ConnectionUserButton, Object.assign({ user: scUser }, followConnectUserButtonProps))] }));
     }
     /**
      * Renders user object
@@ -100,5 +100,5 @@ export default function User(inProps) {
      */
     return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ elevation: elevation }, rest, { className: classNames(classes.root, className), ButtonBaseProps: buttonProps !== null && buttonProps !== void 0 ? buttonProps : (scUser.deleted
                     ? { onClick: () => setOpenAlert(true) }
-                    : { component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scUser) }), image: badgeContent ? (_jsx(Badge, Object.assign({ overlap: "circular", anchorOrigin: { vertical: 'bottom', horizontal: 'right' }, badgeContent: badgeContent }, { children: _jsx(Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) }))) : (_jsx(UserAvatar, Object.assign({ hide: !hasBadge }, { children: _jsx(Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) }))), primary: (hasBadge && preferences) || isGroupAdmin ? (_jsxs(_Fragment, { children: [scUser.username, _jsx(Chip, { component: "span", className: isGroupAdmin ? classes.groupAdminBadgeLabel : classes.staffBadgeLabel, size: "small", label: isGroupAdmin ? (_jsx(FormattedMessage, { defaultMessage: "ui.user.group.admin", id: "ui.user.group.admin" })) : (preferences[SCPreferences.STAFF_STAFF_BADGE_LABEL]) })] })) : (scUser.username), secondary: secondary || (showFollowers ? `${intl.formatMessage(messages.userFollowers, { total: scUser.followers_counter })}` : scUser.description), actions: actions !== null && actions !== void 0 ? actions : renderAuthenticatedActions() })), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
+                    : { component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scUser) }), image: badgeContent ? (_jsx(Badge, { overlap: "circular", anchorOrigin: { vertical: 'bottom', horizontal: 'right' }, badgeContent: badgeContent, children: _jsx(Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) })) : (_jsx(UserAvatar, { hide: !hasBadge, children: _jsx(Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) })), primary: (hasBadge && preferences) || isGroupAdmin ? (_jsxs(_Fragment, { children: [scUser.username, _jsx(Chip, { component: "span", className: isGroupAdmin ? classes.groupAdminBadgeLabel : classes.staffBadgeLabel, size: "small", label: isGroupAdmin ? (_jsx(FormattedMessage, { defaultMessage: "ui.user.group.admin", id: "ui.user.group.admin" })) : (preferences[SCPreferences.STAFF_STAFF_BADGE_LABEL]) })] })) : (scUser.username), secondary: secondary || (showFollowers ? `${intl.formatMessage(messages.userFollowers, { total: scUser.followers_counter })}` : scUser.description), actions: actions !== null && actions !== void 0 ? actions : renderAuthenticatedActions() })), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }

package/lib/esm/components/UserActionIconButton/UserActionIconButton.js

@@ -129,17 +129,17 @@ export default function UserActionIconButton(inProps) {
     const renderList = () => {
         if (isMobile) {
             return [
-                ...items.map((item, index) => (_jsx(ListItem, { children: _jsx(ListItemButton, Object.assign({ component: Link, to: item.to }, { children: _jsx(ListItemText, { primary: item.label }) })) }, index))),
-                _jsx(ListItem, { children: _jsx(ListItemButton, Object.assign({ onClick: handleInfoOpen }, { children: _jsx(ListItemText, { primary: _jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.information", id: "ui.userActionIconButton.information" }) }) })) }, "info"),
+                ...items.map((item, index) => (_jsx(ListItem, { children: _jsx(ListItemButton, { component: Link, to: item.to, children: _jsx(ListItemText, { primary: item.label }) }) }, index))),
+                _jsx(ListItem, { children: _jsx(ListItemButton, { onClick: handleInfoOpen, children: _jsx(ListItemText, { primary: _jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.information", id: "ui.userActionIconButton.information" }) }) }) }, "info"),
                 ...(isMe
                     ? []
                     : [
                         _jsx(Divider, {}, "divider"),
-                        _jsx(ListItem, { children: _jsx(ListItemButton, Object.assign({ onClick: handleHideToggle, disabled: isHiddenLoading || scUser.community_badge || (!hidden && UserUtils.isStaff(scUser)) }, { children: _jsx(ListItemText, { primary: hidden ? (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.show", id: "ui.userActionIconButton.show" })) : (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.hide", id: "ui.userActionIconButton.hide" })) }) })) }, "hide"),
+                        _jsx(ListItem, { children: _jsx(ListItemButton, { onClick: handleHideToggle, disabled: isHiddenLoading || scUser.community_badge || (!hidden && UserUtils.isStaff(scUser)), children: _jsx(ListItemText, { primary: hidden ? (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.show", id: "ui.userActionIconButton.show" })) : (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.hide", id: "ui.userActionIconButton.hide" })) }) }) }, "hide"),
                         ...(canModerate
                             ? [
                                 _jsx(Divider, {}, "divider_moderate"),
-                                _jsx(ListItem, { children: _jsx(ListItemButton, Object.assign({ component: Link, to: `${scContext.settings.portal}/platform/access?next=/moderation/user/?username=${scUser.username}` }, { children: _jsx(ListItemText, { primary: _jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.moderate", id: "ui.userActionIconButton.moderate" }) }) })) }, "moderate")
+                                _jsx(ListItem, { children: _jsx(ListItemButton, { component: Link, to: `${scContext.settings.portal}/platform/access?next=/moderation/user/?username=${scUser.username}`, children: _jsx(ListItemText, { primary: _jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.moderate", id: "ui.userActionIconButton.moderate" }) }) }) }, "moderate")
                             ]
                             : [])
                     ])
@@ -147,22 +147,22 @@ export default function UserActionIconButton(inProps) {
         }
         else {
             return [
-                ...items.map((item, index) => (_jsx(MenuItem, Object.assign({ component: Link, to: item.to, onClick: handleClose }, { children: item.label }), index))),
-                _jsx(MenuItem, Object.assign({ onClick: handleInfoOpen }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.information", id: "ui.userActionIconButton.information" }) }), "info"),
+                ...items.map((item, index) => (_jsx(MenuItem, { component: Link, to: item.to, onClick: handleClose, children: item.label }, index))),
+                _jsx(MenuItem, { onClick: handleInfoOpen, children: _jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.information", id: "ui.userActionIconButton.information" }) }, "info"),
                 ...(isMe
                     ? []
                     : [
                         _jsx(Divider, {}, "divider"),
-                        _jsx(MenuItem, Object.assign({ onClick: handleHide, disabled: isHiddenLoading || scUser.community_badge }, { children: hidden ? (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.show", id: "ui.userActionIconButton.show" })) : (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.hide", id: "ui.userActionIconButton.hide" })) }), "hide"),
+                        _jsx(MenuItem, { onClick: handleHide, disabled: isHiddenLoading || scUser.community_badge, children: hidden ? (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.show", id: "ui.userActionIconButton.show" })) : (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.hide", id: "ui.userActionIconButton.hide" })) }, "hide"),
                         ...(canModerate
                             ? [
                                 _jsx(Divider, {}, "divider_moderate"),
-                                _jsx(MenuItem, Object.assign({ component: Link, to: `${scContext.settings.portal}/platform/access?next=/moderation/user/?username=${scUser.username}`, onClick: handleClose }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.moderate", id: "ui.userActionIconButton.moderate" }) }), "moderate")
+                                _jsx(MenuItem, { component: Link, to: `${scContext.settings.portal}/platform/access?next=/moderation/user/?username=${scUser.username}`, onClick: handleClose, children: _jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.moderate", id: "ui.userActionIconButton.moderate" }) }, "moderate")
                             ]
                             : [])
                     ])
             ];
         }
     };
-    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { onClick: handleOpen }, { children: _jsx(Icon, { children: "more_vert" }) })), isMobile ? (_jsx(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, disableSwipeToOpen: true }, { children: _jsx(List, { children: renderList() }) }))) : (_jsx(MenuRoot, Object.assign({ className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose }, { children: renderList() }))), _jsx(UserInfoDialog, { userId: userId, user: scUser, open: infoOpen, onClose: handleInfoClose }), openHideDialog && (_jsx(ConfirmDialog, { open: openHideDialog, isUpdating: isHiddenLoading, TransitionComponent: Transition, keepMounted: true, title: hidden ? (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.show", id: "ui.userActionIconButton.show" })) : (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.hide", id: "ui.userActionIconButton.hide" })), content: hidden ? (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.dialogShowAction", id: "ui.userActionIconButton.dialogShowAction" })) : (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.dialogHideAction", id: "ui.userActionIconButton.dialogHideAction" })), onConfirm: handleHideToggle, onClose: () => setOpenHideDialog(false) }))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { onClick: handleOpen, children: _jsx(Icon, { children: "more_vert" }) })), isMobile ? (_jsx(SwipeableDrawerRoot, { className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, disableSwipeToOpen: true, children: _jsx(List, { children: renderList() }) })) : (_jsx(MenuRoot, { className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, children: renderList() })), _jsx(UserInfoDialog, { userId: userId, user: scUser, open: infoOpen, onClose: handleInfoClose }), openHideDialog && (_jsx(ConfirmDialog, { open: openHideDialog, isUpdating: isHiddenLoading, TransitionComponent: Transition, keepMounted: true, title: hidden ? (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.show", id: "ui.userActionIconButton.show" })) : (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.hide", id: "ui.userActionIconButton.hide" })), content: hidden ? (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.dialogShowAction", id: "ui.userActionIconButton.dialogShowAction" })) : (_jsx(FormattedMessage, { defaultMessage: "ui.userActionIconButton.dialogHideAction", id: "ui.userActionIconButton.dialogHideAction" })), onConfirm: handleHideToggle, onClose: () => setOpenHideDialog(false) }))] }));
 }

package/lib/esm/components/UserConnectionsRequestsSentWidget/UserConnectionsRequestsSentWidget.js

@@ -173,6 +173,6 @@ export default function UserConnectionsRequestsSentWidget(inProps) {
     if (!state.initialized) {
         return _jsx(Skeleton, {});
     }
-    const content = (_jsxs(CardContent, { children: [_jsx(Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.title", defaultMessage: "ui.userConnectionsRequestsSentWidget.title", values: { total: scUserContext.user.connection_requests_sent_counter } }) })), !state.count ? (_jsx(Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.subtitle.noResults", defaultMessage: "" }) }))) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((conReq) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: conReq.to_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.to_user.id))) }), state.count > state.visibleItems && (_jsx(Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.button.showAll", defaultMessage: "ui.userConnectionsRequestsSentWidget.button.showAll" }) })))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.userConnectionsRequestsSentWidget.title", id: "ui.userConnectionsRequestsSentWidget.title", values: { total: scUserContext.user.connection_requests_sent_counter } }), 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)), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.noMoreResults", defaultMessage: "ui.userConnectionsRequestsSentWidget.noMoreResults" }) })) }, { children: _jsx(List, { children: state.results.map((conReq) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: conReq.to_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.to_user.id))) }) })) })))] }));
+    const content = (_jsxs(CardContent, { children: [_jsx(Typography, { className: classes.title, variant: "h5", children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.title", defaultMessage: "ui.userConnectionsRequestsSentWidget.title", values: { total: scUserContext.user.connection_requests_sent_counter } }) }), !state.count ? (_jsx(Typography, { className: classes.noResults, variant: "body2", children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.subtitle.noResults", defaultMessage: "" }) })) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((conReq) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: conReq.to_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.to_user.id))) }), state.count > state.visibleItems && (_jsx(Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.button.showAll", defaultMessage: "ui.userConnectionsRequestsSentWidget.button.showAll" }) }))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.userConnectionsRequestsSentWidget.title", id: "ui.userConnectionsRequestsSentWidget.title", values: { total: scUserContext.user.connection_requests_sent_counter } }), 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)), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, { className: classes.endMessage, children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsSentWidget.noMoreResults", defaultMessage: "ui.userConnectionsRequestsSentWidget.noMoreResults" }) }), children: _jsx(List, { children: state.results.map((conReq) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: conReq.to_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.to_user.id))) }) }) })))] }));
     return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: content })));
 }

package/lib/esm/components/UserConnectionsRequestsWidget/UserConnectionsRequestsWidget.js

@@ -173,6 +173,6 @@ export default function UserConnectionsRequestsWidget(inProps) {
     if (!state.initialized) {
         return _jsx(Skeleton, {});
     }
-    const content = (_jsxs(CardContent, { children: [_jsx(Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsWidget.title", defaultMessage: "ui.userConnectionsRequestsWidget.title", values: { total: scUserContext.user.connection_requests_received_counter } }) })), !state.count ? (_jsx(Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsWidget.subtitle.noResults", defaultMessage: "" }) }))) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((conReq) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: conReq.from_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.from_user.id))) }), state.count > state.visibleItems && (_jsx(Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsWidget.button.showAll", defaultMessage: "ui.userConnectionsRequestsWidget.button.showAll" }) })))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.userConnectionsRequestsWidget.title", id: "ui.userConnectionsRequestsWidget.title", values: { total: scUserContext.user.connection_requests_received_counter } }), 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)), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsWidget.noMoreResults", defaultMessage: "ui.userConnectionsRequestsWidget.noMoreResults" }) })) }, { children: _jsx(List, { children: state.results.map((conReq) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: conReq.from_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.from_user.id))) }) })) })))] }));
+    const content = (_jsxs(CardContent, { children: [_jsx(Typography, { className: classes.title, variant: "h5", children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsWidget.title", defaultMessage: "ui.userConnectionsRequestsWidget.title", values: { total: scUserContext.user.connection_requests_received_counter } }) }), !state.count ? (_jsx(Typography, { className: classes.noResults, variant: "body2", children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsWidget.subtitle.noResults", defaultMessage: "" }) })) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((conReq) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: conReq.from_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.from_user.id))) }), state.count > state.visibleItems && (_jsx(Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsWidget.button.showAll", defaultMessage: "ui.userConnectionsRequestsWidget.button.showAll" }) }))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.userConnectionsRequestsWidget.title", id: "ui.userConnectionsRequestsWidget.title", values: { total: scUserContext.user.connection_requests_received_counter } }), 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)), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, { className: classes.endMessage, children: _jsx(FormattedMessage, { id: "ui.userConnectionsRequestsWidget.noMoreResults", defaultMessage: "ui.userConnectionsRequestsWidget.noMoreResults" }) }), children: _jsx(List, { children: state.results.map((conReq) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: conReq.from_user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, conReq.from_user.id))) }) }) })))] }));
     return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: content })));
 }

package/lib/esm/components/UserConnectionsWidget/UserConnectionsWidget.js

@@ -175,6 +175,6 @@ export default function UserConnectionsWidget(inProps) {
     if (!state.initialized) {
         return _jsx(Skeleton, {});
     }
-    const content = (_jsxs(CardContent, { children: [_jsx(Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.userConnectionsWidget.title", defaultMessage: "ui.userConnectionsWidget.title", values: { total: scUser.connections_counter } }) })), !state.count ? (_jsx(Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.userConnectionsWidget.subtitle.noResults", defaultMessage: "" }) }))) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((user) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, user.id))) }), state.count > state.visibleItems && (_jsx(Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: _jsx(FormattedMessage, { id: "ui.userConnectionsWidget.button.showAll", defaultMessage: "ui.userConnectionsWidget.button.showAll" }) })))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.userConnectionsWidget.title", id: "ui.userConnectionsWidget.title", values: { total: scUser.connections_counter } }), 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)), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.userConnectionsWidget.noMoreResults", defaultMessage: "ui.userConnectionsWidget.noMoreResults" }) })) }, { children: _jsx(List, { children: state.results.map((user) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, user.id))) }) })) })))] }));
+    const content = (_jsxs(CardContent, { children: [_jsx(Typography, { className: classes.title, variant: "h5", children: _jsx(FormattedMessage, { id: "ui.userConnectionsWidget.title", defaultMessage: "ui.userConnectionsWidget.title", values: { total: scUser.connections_counter } }) }), !state.count ? (_jsx(Typography, { className: classes.noResults, variant: "body2", children: _jsx(FormattedMessage, { id: "ui.userConnectionsWidget.subtitle.noResults", defaultMessage: "" }) })) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((user) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, user.id))) }), state.count > state.visibleItems && (_jsx(Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: _jsx(FormattedMessage, { id: "ui.userConnectionsWidget.button.showAll", defaultMessage: "ui.userConnectionsWidget.button.showAll" }) }))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.userConnectionsWidget.title", id: "ui.userConnectionsWidget.title", values: { total: scUser.connections_counter } }), 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)), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, { className: classes.endMessage, children: _jsx(FormattedMessage, { id: "ui.userConnectionsWidget.noMoreResults", defaultMessage: "ui.userConnectionsWidget.noMoreResults" }) }), children: _jsx(List, { children: state.results.map((user) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: user, followConnectUserButtonProps: { followConnectUserButtonProps: { onChangeConnectionStatus: handleChangeConnectionStatus } } }, UserProps)) }, user.id))) }) }) })))] }));
     return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: content })));
 }