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

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 })));
 }

package/lib/esm/components/UserCounters/UserCounters.js

@@ -86,25 +86,25 @@ export default function UserCounters(inProps) {
     if (scUserContext.user === undefined || !scUser) {
         return null;
     }
-    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [followEnabled ? (_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ className: classes.button, variant: "text", component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWINGS_ROUTE_NAME, scUser) }, { children: _jsx(FormattedMessage, { id: "ui.userCounters.followings", defaultMessage: "ui.userCounters.followings", values: {
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [followEnabled ? (_jsxs(_Fragment, { children: [_jsx(Button, { className: classes.button, variant: "text", component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWINGS_ROUTE_NAME, scUser), children: _jsx(FormattedMessage, { id: "ui.userCounters.followings", defaultMessage: "ui.userCounters.followings", values: {
                                 count: scUser === null || scUser === void 0 ? void 0 : scUser.followings_counter,
                                 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                 // @ts-ignore
                                 b: (chunks) => _jsx("strong", { children: chunks })
-                            } }) })), _jsx(Bullet, {}), _jsx(Button, Object.assign({ className: classes.button, variant: "text", component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWERS_ROUTE_NAME, scUser) }, { children: _jsx(FormattedMessage, { id: "ui.userCounters.followers", defaultMessage: "ui.userCounters.followers", values: {
+                            } }) }), _jsx(Bullet, {}), _jsx(Button, { className: classes.button, variant: "text", component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWERS_ROUTE_NAME, scUser), children: _jsx(FormattedMessage, { id: "ui.userCounters.followers", defaultMessage: "ui.userCounters.followers", values: {
                                 count: scUser === null || scUser === void 0 ? void 0 : scUser.followers_counter,
                                 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                 // @ts-ignore
                                 b: (chunks) => _jsx("strong", { children: chunks })
-                            } }) }))] })) : (_jsx(Button, Object.assign({ className: classes.button, variant: "text", component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_CONNECTIONS_ROUTE_NAME, scUser) }, { children: _jsx(FormattedMessage, { id: "ui.userCounters.connections", defaultMessage: "ui.userCounters.connections", values: {
+                            } }) })] })) : (_jsx(Button, { className: classes.button, variant: "text", component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_CONNECTIONS_ROUTE_NAME, scUser), children: _jsx(FormattedMessage, { id: "ui.userCounters.connections", defaultMessage: "ui.userCounters.connections", values: {
                         count: scUser === null || scUser === void 0 ? void 0 : scUser.connections_counter,
                         // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                         // @ts-ignore
                         b: (chunks) => _jsx("strong", { children: chunks })
-                    } }) }))), _jsx(Bullet, {}), _jsx(Button, Object.assign({ className: classes.button, variant: "text", component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_CATEGORIES_ROUTE_NAME, scUser) }, { children: _jsx(FormattedMessage, { id: "ui.userCounters.categories", defaultMessage: "ui.userCounters.categories", values: {
+                    } }) })), _jsx(Bullet, {}), _jsx(Button, { className: classes.button, variant: "text", component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_CATEGORIES_ROUTE_NAME, scUser), children: _jsx(FormattedMessage, { id: "ui.userCounters.categories", defaultMessage: "ui.userCounters.categories", values: {
                         count: scUser === null || scUser === void 0 ? void 0 : scUser.categories_counter,
                         // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                         // @ts-ignore
                         b: (chunks) => _jsx("strong", { children: chunks })
-                    } }) }))] })));
+                    } }) })] })));
 }

package/lib/esm/components/UserFollowedCategoriesWidget/UserFollowedCategoriesWidget.js

@@ -157,6 +157,6 @@ export default function UserFollowedCategoriesWidget(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.userFollowedCategoriesWidget.title", defaultMessage: "ui.userFollowedCategoriesWidget.title", values: { total: isMe ? state.results.filter((c) => c.followed).length : state.count } }) })), !state.count ? (_jsx(Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.userFollowedCategoriesWidget.subtitle.noResults", defaultMessage: "ui.userFollowedCategoriesWidget.subtitle.noResults" }) }))) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, limit).map((category) => (_jsx(ListItem, { children: _jsx(Category, Object.assign({ elevation: 0, category: category, categoryFollowButtonProps: { onFollow: handleOnFollowCategory } }, CategoryProps)) }, category.id))) }), limit < state.count && (_jsx(Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: _jsx(FormattedMessage, { id: "ui.userFollowedCategoriesWidget.button.showAll", defaultMessage: "ui.userFollowedCategoriesWidget.button.showAll" }) }))), openDialog && (_jsxs(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { id: "ui.userFollowedCategoriesWidget.title", defaultMessage: "ui.userFollowedCategoriesWidget.title", values: { total: state.count } }), onClose: handleToggleDialogOpen, open: openDialog, scroll: "paper" }, DialogProps, { children: [_jsxs(List, { children: [state.results.map((c) => (_jsx(ListItem, { children: _jsx(Category, Object.assign({ elevation: 0, category: c, categoryFollowButtonProps: { onFollow: handleOnFollowCategory } }, CategoryProps)) }, c.id))), state.isLoadingNext && (_jsx(ListItem, { children: _jsx(CategorySkeleton, Object.assign({ elevation: 0 }, CategoryProps)) }))] }), _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.userFollowedCategoriesWidget.noMoreResults", defaultMessage: "ui.userFollowedCategoriesWidget.noMoreResults" }) }))] })))] }))] }));
+    const content = (_jsxs(CardContent, { children: [_jsx(Typography, { className: classes.title, variant: "h5", children: _jsx(FormattedMessage, { id: "ui.userFollowedCategoriesWidget.title", defaultMessage: "ui.userFollowedCategoriesWidget.title", values: { total: isMe ? state.results.filter((c) => c.followed).length : state.count } }) }), !state.count ? (_jsx(Typography, { className: classes.noResults, variant: "body2", children: _jsx(FormattedMessage, { id: "ui.userFollowedCategoriesWidget.subtitle.noResults", defaultMessage: "ui.userFollowedCategoriesWidget.subtitle.noResults" }) })) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, limit).map((category) => (_jsx(ListItem, { children: _jsx(Category, Object.assign({ elevation: 0, category: category, categoryFollowButtonProps: { onFollow: handleOnFollowCategory } }, CategoryProps)) }, category.id))) }), limit < state.count && (_jsx(Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: _jsx(FormattedMessage, { id: "ui.userFollowedCategoriesWidget.button.showAll", defaultMessage: "ui.userFollowedCategoriesWidget.button.showAll" }) })), openDialog && (_jsxs(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { id: "ui.userFollowedCategoriesWidget.title", defaultMessage: "ui.userFollowedCategoriesWidget.title", values: { total: state.count } }), onClose: handleToggleDialogOpen, open: openDialog, scroll: "paper" }, DialogProps, { children: [_jsxs(List, { children: [state.results.map((c) => (_jsx(ListItem, { children: _jsx(Category, Object.assign({ elevation: 0, category: c, categoryFollowButtonProps: { onFollow: handleOnFollowCategory } }, CategoryProps)) }, c.id))), state.isLoadingNext && (_jsx(ListItem, { children: _jsx(CategorySkeleton, Object.assign({ elevation: 0 }, CategoryProps)) }))] }), _jsx(Typography, { className: classes.endMessage, children: _jsx(FormattedMessage, { id: "ui.userFollowedCategoriesWidget.noMoreResults", defaultMessage: "ui.userFollowedCategoriesWidget.noMoreResults" }) })] })))] }))] }));
     return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: content })));
 }

package/lib/esm/components/UserFollowedUsersWidget/UserFollowedUsersWidget.js

@@ -183,6 +183,6 @@ export default function UserFollowedUsersWidget(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.userFollowedUsersWidget.title", defaultMessage: "ui.userFollowedUsersWidget.title", values: { total: scUser.followings_counter } }) })), !state.count ? (_jsx(Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.userFollowedUsersWidget.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 }, UserProps)) }, user.id))) }), state.count > state.visibleItems && (_jsx(Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: _jsx(FormattedMessage, { id: "ui.userFollowedUsersWidget.button.showAll", defaultMessage: "ui.userFollowedUsersWidget.button.showAll" }) })))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.userFollowedUsersWidget.title", id: "ui.userFollowedUsersWidget.title", values: { total: scUser.followings_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.userFollowedUsersWidget.noMoreResults", defaultMessage: "ui.userFollowedUsersWidget.noMoreResults" }) })) }, { children: _jsx(List, { children: state.results.map((user) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: user }, UserProps)) }, user.id))) }) })) })))] }));
+    const content = (_jsxs(CardContent, { children: [_jsx(Typography, { className: classes.title, variant: "h5", children: _jsx(FormattedMessage, { id: "ui.userFollowedUsersWidget.title", defaultMessage: "ui.userFollowedUsersWidget.title", values: { total: scUser.followings_counter } }) }), !state.count ? (_jsx(Typography, { className: classes.noResults, variant: "body2", children: _jsx(FormattedMessage, { id: "ui.userFollowedUsersWidget.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 }, UserProps)) }, user.id))) }), state.count > state.visibleItems && (_jsx(Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: _jsx(FormattedMessage, { id: "ui.userFollowedUsersWidget.button.showAll", defaultMessage: "ui.userFollowedUsersWidget.button.showAll" }) }))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.userFollowedUsersWidget.title", id: "ui.userFollowedUsersWidget.title", values: { total: scUser.followings_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.userFollowedUsersWidget.noMoreResults", defaultMessage: "ui.userFollowedUsersWidget.noMoreResults" }) }), children: _jsx(List, { children: state.results.map((user) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: user }, UserProps)) }, user.id))) }) }) })))] }));
     return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: content })));
 }

package/lib/esm/components/UserFollowersWidget/UserFollowersWidget.js

@@ -181,6 +181,6 @@ export default function UserFollowersWidget(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.userFollowersWidget.title", defaultMessage: "ui.userFollowersWidget.title", values: { total: scUser.followers_counter } }) })), !state.count ? (_jsx(Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.userFollowersWidget.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 }, UserProps)) }, user.id))) }), state.count > state.visibleItems && (_jsx(Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: _jsx(FormattedMessage, { id: "ui.userFollowersWidget.button.showAll", defaultMessage: "ui.userFollowersWidget.button.showAll" }) })))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.userFollowersWidget.title", id: "ui.userFollowersWidget.title", values: { total: scUser.followers_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.userFollowersWidget.noMoreResults", defaultMessage: "ui.userFollowersWidget.noMoreResults" }) })) }, { children: _jsx(List, { children: state.results.map((user) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: user }, UserProps)) }, user.id))) }) })) })))] }));
+    const content = (_jsxs(CardContent, { children: [_jsx(Typography, { className: classes.title, variant: "h5", children: _jsx(FormattedMessage, { id: "ui.userFollowersWidget.title", defaultMessage: "ui.userFollowersWidget.title", values: { total: scUser.followers_counter } }) }), !state.count ? (_jsx(Typography, { className: classes.noResults, variant: "body2", children: _jsx(FormattedMessage, { id: "ui.userFollowersWidget.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 }, UserProps)) }, user.id))) }), state.count > state.visibleItems && (_jsx(Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: _jsx(FormattedMessage, { id: "ui.userFollowersWidget.button.showAll", defaultMessage: "ui.userFollowersWidget.button.showAll" }) }))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.userFollowersWidget.title", id: "ui.userFollowersWidget.title", values: { total: scUser.followers_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.userFollowersWidget.noMoreResults", defaultMessage: "ui.userFollowersWidget.noMoreResults" }) }), children: _jsx(List, { children: state.results.map((user) => (_jsx(ListItem, { children: _jsx(User, Object.assign({ elevation: 0, user: user }, UserProps)) }, user.id))) }) }) })))] }));
     return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: content })));
 }

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

@@ -32,6 +32,6 @@ const Root = styled(Box, {
  *
  */
 function UserProfileInfoSkeleton() {
-    return (_jsx(Root, Object.assign({ className: classes.root }, { children: Array.from({ length: 3 }).map((v, i) => (_jsxs(Box, Object.assign({ className: classes.field }, { children: [_jsx(Typography, Object.assign({ variant: "h6" }, { children: _jsx(Skeleton, { animation: "wave", sx: { height: 20, width: '50%' } }) })), _jsx(Typography, Object.assign({ variant: "body2" }, { children: _jsx(Skeleton, { animation: "wave", sx: { height: 20, width: '80%' } }) }))] }), i))) })));
+    return (_jsx(Root, { className: classes.root, children: Array.from({ length: 3 }).map((v, i) => (_jsxs(Box, { className: classes.field, children: [_jsx(Typography, { variant: "h6", children: _jsx(Skeleton, { animation: "wave", sx: { height: 20, width: '50%' } }) }), _jsx(Typography, { variant: "body2", children: _jsx(Skeleton, { animation: "wave", sx: { height: 20, width: '80%' } }) })] }, i))) }));
 }
 export default UserProfileInfoSkeleton;

package/lib/esm/components/UserInfo/UserInfo.js

@@ -123,7 +123,7 @@ export default function UserInfo(inProps) {
             case SCUserProfileFields.TAGS:
                 return (_jsx(Tags, { tags: user.tags.filter((t) => t.visible), type: TagsComponentType.LIST, direction: 'row', TagChipProps: { clickable: false, disposable: false } }));
             case SCUserProfileFields.WEBSITE:
-                return (_jsx("a", Object.assign({ href: user[field], target: '_blank' }, { children: user[field] })));
+                return (_jsx("a", { href: user[field], target: '_blank', children: user[field] }));
             default:
                 return user[field];
         }
@@ -137,9 +137,9 @@ export default function UserInfo(inProps) {
     return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _fields.map((field) => {
             if (scUser[field]) {
                 if (field === SCUserProfileFields.TAGS) {
-                    return scUser[field].length > 0 ? (_jsx(Box, Object.assign({ className: classes.field }, { children: renderField(scUser, field) }), field)) : null;
+                    return scUser[field].length > 0 ? (_jsx(Box, { className: classes.field, children: renderField(scUser, field) }, field)) : null;
                 }
-                return (_jsxs(Box, Object.assign({ className: classes.field }, { children: [_jsx(Typography, Object.assign({ variant: "h6" }, { children: metadataDefinitions[field] ? metadataDefinitions[field].label : intl.formatMessage(messages[camelCase(field)]) })), _jsx(Typography, Object.assign({ variant: "body2" }, { children: renderField(scUser, field) }))] }), field));
+                return (_jsxs(Box, { className: classes.field, children: [_jsx(Typography, { variant: "h6", children: metadataDefinitions[field] ? metadataDefinitions[field].label : intl.formatMessage(messages[camelCase(field)]) }), _jsx(Typography, { variant: "body2", children: renderField(scUser, field) })] }, field));
             }
             return null;
         }) })));

package/lib/esm/components/UserInfoDialog/UserInfoDialog.js

@@ -28,6 +28,6 @@ export default function UserInfoDialog(inProps) {
     // HOOKS
     const { scUser } = useSCFetchUser({ id: userId, user });
     // RENDER
-    const subtitle = (_jsxs(Box, Object.assign({ className: classes.caption }, { children: [_jsx(Avatar, { className: classes.avatar, src: scUser === null || scUser === void 0 ? void 0 : scUser.avatar }), _jsx(Typography, Object.assign({ className: classes.username, variant: "h6" }, { children: (scUser === null || scUser === void 0 ? void 0 : scUser.real_name) ? scUser === null || scUser === void 0 ? void 0 : scUser.real_name : scUser === null || scUser === void 0 ? void 0 : scUser.username }))] })));
+    const subtitle = (_jsxs(Box, { className: classes.caption, children: [_jsx(Avatar, { className: classes.avatar, src: scUser === null || scUser === void 0 ? void 0 : scUser.avatar }), _jsx(Typography, { className: classes.username, variant: "h6", children: (scUser === null || scUser === void 0 ? void 0 : scUser.real_name) ? scUser === null || scUser === void 0 ? void 0 : scUser.real_name : scUser === null || scUser === void 0 ? void 0 : scUser.username })] }));
     return (_jsx(Root, Object.assign({ title: _jsx(FormattedMessage, { id: "ui.userInfoDialog.title", defaultMessage: "ui.userInfoDialog.title" }), subtitle: subtitle, className: classNames(classes.root, className) }, rest, { children: scUser ? _jsx(UserInfo, Object.assign({}, UserInfoProps, { userId: userId, user: scUser })) : _jsx(UserInfoSkeleton, {}) })));
 }

package/lib/esm/components/UserProfileBlocked/UserProfileBlocked.js

@@ -78,5 +78,5 @@ export default function UserProfileBlocked(inProps) {
     if (!scUser || !scUserContext.user || loadingBlockedBy) {
         return null;
     }
-    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsx(Divider, {}), !isMe && blockedBy && (_jsx(Typography, Object.assign({ variant: "body1", className: classes.info }, { children: _jsx(FormattedMessage, { id: "ui.userProfileBlocked.blockedUserBy", defaultMessage: "ui.userProfileBlocked.blockedUserBy" }) }))), !isMe && scUserContext.managers.blockedUsers.isBlocked(scUser) && (_jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ variant: "body1", className: classes.info }, { children: _jsx(FormattedMessage, { id: "ui.userProfileBlocked.blockedUser", defaultMessage: "ui.userProfileBlocked.blockedUser" }) })), _jsx(LoadingButton, Object.assign({ variant: "contained", className: classes.button, loading: scUserContext.managers.blockedUsers.loading, disabled: scUserContext.managers.blockedUsers.loading, onClick: handleBlock }, { children: _jsx(FormattedMessage, { id: "ui.userProfileBlocked.unBlockUser", defaultMessage: "ui.userProfileBlocked.unBlockUser" }) }))] }))] })));
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsx(Divider, {}), !isMe && blockedBy && (_jsx(Typography, { variant: "body1", className: classes.info, children: _jsx(FormattedMessage, { id: "ui.userProfileBlocked.blockedUserBy", defaultMessage: "ui.userProfileBlocked.blockedUserBy" }) })), !isMe && scUserContext.managers.blockedUsers.isBlocked(scUser) && (_jsxs(_Fragment, { children: [_jsx(Typography, { variant: "body1", className: classes.info, children: _jsx(FormattedMessage, { id: "ui.userProfileBlocked.blockedUser", defaultMessage: "ui.userProfileBlocked.blockedUser" }) }), _jsx(LoadingButton, { variant: "contained", className: classes.button, loading: scUserContext.managers.blockedUsers.loading, disabled: scUserContext.managers.blockedUsers.loading, onClick: handleBlock, children: _jsx(FormattedMessage, { id: "ui.userProfileBlocked.unBlockUser", defaultMessage: "ui.userProfileBlocked.unBlockUser" }) })] }))] })));
 }

package/lib/esm/components/UserProfileEdit/Section/Account.js

@@ -70,5 +70,5 @@ export default function Account(props) {
     if (!scUserContext.user) {
         return;
     }
-    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [startActions, showCredentialsSection && _jsx(AccountCredentials, Object.assign({ className: classes.credentials, user: scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user }, AccountCredentialProps)), showLanguageSwitcher && _jsx(LanguageSwitcher, Object.assign({ className: classes.languageSwitcher }, LanguageSwitcherProps)), showSocialAccountSection && (_jsx(UserSocialAssociation, { children: _jsxs(Typography, Object.assign({ variant: "body1", mb: 1, sx: { fontWeight: 'bold' } }, { children: [' ', intl.formatMessage(messages.socialTitle)] })), direction: "row", userId: scUserContext.user.id, onDeleteAssociation: handleOpenDeleteDialog, onCreateAssociation: handleAssociationCreate, deletingProvider: shouldUpdate ? provider : null })), openDeleteDialog && (_jsx(ConfirmDialog, { open: openDeleteDialog, title: intl.formatMessage(messages.dialogTitleMsg, { field: provider.provider }), btnConfirm: _jsx(FormattedMessage, { id: "ui.userProfileEditAccount.socialAssociations.dialog.confirm", defaultMessage: "ui.userProfileEditAccount.socialAssociations.dialog.confirm" }), onConfirm: handleDelete, onClose: () => setOpenDeleteDialog(false) })), endActions, _jsxs(Box, Object.assign({ className: classes.dangerZone }, { children: [_jsx(AccountDataPortabilityButton, { fullWidth: true, variant: "outlined", color: "primary" }), _jsx(AccountDeleteButton, Object.assign({ fullWidth: true, variant: "contained", color: "secondary" }, AccountDeleteButtonProps))] }))] })));
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [startActions, showCredentialsSection && _jsx(AccountCredentials, Object.assign({ className: classes.credentials, user: scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user }, AccountCredentialProps)), showLanguageSwitcher && _jsx(LanguageSwitcher, Object.assign({ className: classes.languageSwitcher }, LanguageSwitcherProps)), showSocialAccountSection && (_jsx(UserSocialAssociation, { children: _jsxs(Typography, { variant: "body1", mb: 1, sx: { fontWeight: 'bold' }, children: [' ', intl.formatMessage(messages.socialTitle)] }), direction: "row", userId: scUserContext.user.id, onDeleteAssociation: handleOpenDeleteDialog, onCreateAssociation: handleAssociationCreate, deletingProvider: shouldUpdate ? provider : null })), openDeleteDialog && (_jsx(ConfirmDialog, { open: openDeleteDialog, title: intl.formatMessage(messages.dialogTitleMsg, { field: provider.provider }), btnConfirm: _jsx(FormattedMessage, { id: "ui.userProfileEditAccount.socialAssociations.dialog.confirm", defaultMessage: "ui.userProfileEditAccount.socialAssociations.dialog.confirm" }), onConfirm: handleDelete, onClose: () => setOpenDeleteDialog(false) })), endActions, _jsxs(Box, { className: classes.dangerZone, children: [_jsx(AccountDataPortabilityButton, { fullWidth: true, variant: "outlined", color: "primary" }), _jsx(AccountDeleteButton, Object.assign({ fullWidth: true, variant: "contained", color: "secondary" }, AccountDeleteButtonProps))] })] })));
 }

package/lib/esm/components/UserProfileEdit/Section/AccountCredentials.js

@@ -156,15 +156,15 @@ export default function AccountCredentials(props) {
     if (!user) {
         return;
     }
-    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ variant: "body1", className: classes.email }, { children: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.email", defaultMessage: "ui.userProfileEditAccountCredentials.email" }) })), _jsx(_Fragment, { children: isSubmitting ? (_jsx(CircularProgress, {})) : (_jsx(_Fragment, { children: _jsx(EmailTextField, { name: "email", disabled: !isEditing || isSubmitting, size: "small", value: field.email, onChange: handleChange, onBlur: handleEmailBlur, error: Boolean(error.email), helperText: error.email && (_jsx(FormattedMessage, { id: `ui.userProfileEditAccountCredentials.email.error.${error.email}`, defaultMessage: `ui.userProfileEditAccountCredentials.email.error.${error.email}` })), InputProps: {
-                                    endAdornment: (_jsx(InputAdornment, Object.assign({ position: "end" }, { children: !isEditing ? (_jsx(IconButton, Object.assign({ onClick: () => setIsEditing(true), edge: "end" }, { children: _jsx(Icon, { children: "edit" }) }))) : error.email ? (_jsx(Icon, Object.assign({ color: "error" }, { children: "error" }))) : (_jsx(IconButton, Object.assign({ onClick: handleSubmitEmail, edge: "end", color: "primary", disabled: !field.email || error.email }, { children: _jsx(Icon, { children: "check" }) }))) })))
-                                } }) })) }), _jsx(Typography, Object.assign({ variant: "body1", className: classes.password }, { children: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.passwordLabel", defaultMessage: "ui.userProfileEditAccountCredentials.passwordLabel" }) })), _jsx(Button, Object.assign({ size: "small", variant: "outlined", onClick: () => setOpenChangePasswordDialog(true), sx: { mb: 1 } }, { children: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.changePassword", defaultMessage: "ui.userProfileEditAccountCredentials.changePassword" }) }))] }), openChangePasswordDialog && (_jsxs(PasswordDialogRoot, Object.assign({ className: classes.dialogRoot, title: intl.formatMessage(messages.changePasswordTitle), open: openChangePasswordDialog, onClose: handleCloseDialog }, rest, { children: [_jsxs(FormGroup, Object.assign({ className: classes.form }, { children: [_jsx(PasswordTextField, { className: classes.formField, name: "password", disabled: isSubmittingPassword, label: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.password", defaultMessage: "ui.userProfileEditAccountCredentials.password" }), size: "medium", value: field.password, onChange: handleChange, error: Boolean(error.password), helperText: error.password && (_jsx(FormattedMessage, { id: `ui.userProfileEditAccountCredentials.password.error.${error.password}`, defaultMessage: `ui.userProfileEditAccountCredentials.password.error.${error.password}` })) }), _jsx(PasswordTextField, { name: "newPassword", className: classes.formField, disabled: isSubmittingPassword, label: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.newPassword", defaultMessage: "ui.userProfileEditAccountCredentials.newPassword" }), size: "medium", value: field.newPassword, onChange: handleChange, error: Boolean(error.newPassword), helperText: error.newPassword && (_jsx(FormattedMessage, { id: `ui.userProfileEditAccountCredentials.newPassword.error.${error.newPassword}`, defaultMessage: `ui.userProfileEditAccountCredentials.newPassword.error.${error.newPassword}` })), InputProps: {
-                                    endAdornment: (_jsx(InputAdornment, Object.assign({ position: "end" }, { children: _jsx(IconButton, Object.assign({ "aria-label": "info", onClick: handlePopoverOpen, edge: "end" }, { children: _jsx(Icon, { children: "info" }) })) })))
-                                } }), _jsx(Popover, Object.assign({ open: open, anchorEl: anchorEl, anchorOrigin: {
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsxs(_Fragment, { children: [_jsx(Typography, { variant: "body1", className: classes.email, children: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.email", defaultMessage: "ui.userProfileEditAccountCredentials.email" }) }), _jsx(_Fragment, { children: isSubmitting ? (_jsx(CircularProgress, {})) : (_jsx(_Fragment, { children: _jsx(EmailTextField, { name: "email", disabled: !isEditing || isSubmitting, size: "small", value: field.email, onChange: handleChange, onBlur: handleEmailBlur, error: Boolean(error.email), helperText: error.email && (_jsx(FormattedMessage, { id: `ui.userProfileEditAccountCredentials.email.error.${error.email}`, defaultMessage: `ui.userProfileEditAccountCredentials.email.error.${error.email}` })), InputProps: {
+                                    endAdornment: (_jsx(InputAdornment, { position: "end", children: !isEditing ? (_jsx(IconButton, { onClick: () => setIsEditing(true), edge: "end", children: _jsx(Icon, { children: "edit" }) })) : error.email ? (_jsx(Icon, { color: "error", children: "error" })) : (_jsx(IconButton, { onClick: handleSubmitEmail, edge: "end", color: "primary", disabled: !field.email || error.email, children: _jsx(Icon, { children: "check" }) })) }))
+                                } }) })) }), _jsx(Typography, { variant: "body1", className: classes.password, children: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.passwordLabel", defaultMessage: "ui.userProfileEditAccountCredentials.passwordLabel" }) }), _jsx(Button, { size: "small", variant: "outlined", onClick: () => setOpenChangePasswordDialog(true), sx: { mb: 1 }, children: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.changePassword", defaultMessage: "ui.userProfileEditAccountCredentials.changePassword" }) })] }), openChangePasswordDialog && (_jsxs(PasswordDialogRoot, Object.assign({ className: classes.dialogRoot, title: intl.formatMessage(messages.changePasswordTitle), open: openChangePasswordDialog, onClose: handleCloseDialog }, rest, { children: [_jsxs(FormGroup, { className: classes.form, children: [_jsx(PasswordTextField, { className: classes.formField, name: "password", disabled: isSubmittingPassword, label: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.password", defaultMessage: "ui.userProfileEditAccountCredentials.password" }), size: "medium", value: field.password, onChange: handleChange, error: Boolean(error.password), helperText: error.password && (_jsx(FormattedMessage, { id: `ui.userProfileEditAccountCredentials.password.error.${error.password}`, defaultMessage: `ui.userProfileEditAccountCredentials.password.error.${error.password}` })) }), _jsx(PasswordTextField, { name: "newPassword", className: classes.formField, disabled: isSubmittingPassword, label: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.newPassword", defaultMessage: "ui.userProfileEditAccountCredentials.newPassword" }), size: "medium", value: field.newPassword, onChange: handleChange, error: Boolean(error.newPassword), helperText: error.newPassword && (_jsx(FormattedMessage, { id: `ui.userProfileEditAccountCredentials.newPassword.error.${error.newPassword}`, defaultMessage: `ui.userProfileEditAccountCredentials.newPassword.error.${error.newPassword}` })), InputProps: {
+                                    endAdornment: (_jsx(InputAdornment, { position: "end", children: _jsx(IconButton, { "aria-label": "info", onClick: handlePopoverOpen, edge: "end", children: _jsx(Icon, { children: "info" }) }) }))
+                                } }), _jsx(Popover, { open: open, anchorEl: anchorEl, anchorOrigin: {
                                     vertical: 'center',
                                     horizontal: 'left'
                                 }, transformOrigin: {
                                     vertical: 'center',
                                     horizontal: 'right'
-                                }, onClose: handlePopoverClose }, { children: _jsx(Box, Object.assign({ sx: { p: '10px' } }, { children: _jsx(Typography, Object.assign({ component: 'span', sx: { whiteSpace: 'pre-line' } }, { children: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.newPassword.info", defaultMessage: "ui.userProfileEditAccountCredentials.newPassword.info" }) })) })) })), _jsx(PasswordTextField, { name: "confirmPassword", className: classes.formField, disabled: isSubmittingPassword, label: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.confirmPassword", defaultMessage: "ui.userProfileEditAccountCredentials.confirmPassword" }), size: "medium", value: field.confirmPassword, onChange: handleChange, onBlur: validateInput, error: Boolean(error.confirmPassword), helperText: error.confirmPassword })] })), _jsx(LoadingButton, Object.assign({ className: classes.confirmChangeButton, loading: isSubmittingPassword, disabled: !field.confirmPassword || Boolean(error.confirmPassword) || Boolean(error.password) || Boolean(error.newPassword), variant: "contained", onClick: handleSubmitPassword }, { children: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.changePassword", defaultMessage: "ui.userProfileEditAccountCredentials.changePassword" }) }))] })))] })));
+                                }, onClose: handlePopoverClose, children: _jsx(Box, { sx: { p: '10px' }, children: _jsx(Typography, { component: 'span', sx: { whiteSpace: 'pre-line' }, children: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.newPassword.info", defaultMessage: "ui.userProfileEditAccountCredentials.newPassword.info" }) }) }) }), _jsx(PasswordTextField, { name: "confirmPassword", className: classes.formField, disabled: isSubmittingPassword, label: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.confirmPassword", defaultMessage: "ui.userProfileEditAccountCredentials.confirmPassword" }), size: "medium", value: field.confirmPassword, onChange: handleChange, onBlur: validateInput, error: Boolean(error.confirmPassword), helperText: error.confirmPassword })] }), _jsx(LoadingButton, { className: classes.confirmChangeButton, loading: isSubmittingPassword, disabled: !field.confirmPassword || Boolean(error.confirmPassword) || Boolean(error.password) || Boolean(error.newPassword), variant: "contained", onClick: handleSubmitPassword, children: _jsx(FormattedMessage, { id: "ui.userProfileEditAccountCredentials.changePassword", defaultMessage: "ui.userProfileEditAccountCredentials.changePassword" }) })] })))] })));
 }