npm - @selfcommunity/react-ui - Versions diffs - 0.8.0-live.40 → 0.8.0-live.41 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (563) hide show

package/lib/esm/components/AccountRecover/AccountRecover.js CHANGED Viewed

@@ -101,10 +101,10 @@ export default function AccountRecover(inProps) {
         return null;
     }
     // RENDER
-    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: isSucceed ? (_jsxs(Alert, { severity: "success", className: classes.success, children: [intl.formatMessage({ id: 'ui.accountRecover.success', defaultMessage: 'ui.accountRecover.success' }, {
+    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: isSucceed ? (_jsxs(Alert, Object.assign({ severity: "success", className: classes.success }, { children: [intl.formatMessage({ id: 'ui.accountRecover.success', defaultMessage: 'ui.accountRecover.success' }, {
                     email,
                     // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                     // @ts-ignore
                     b: (chunks) => _jsx("b", { children: chunks })
-                }), successAction] })) : (_jsxs("form", { className: classes.form, onSubmit: handleSubmit, children: [_jsx(EmailTextField, Object.assign({ className: classes.email, disabled: isSubmitting, label: _jsx(FormattedMessage, { id: "ui.accountRecover.email.label", defaultMessage: "ui.accountRecover.email.label" }) }, TextFieldProps, { value: email, onChange: handleChange, error: Boolean(emailError), helperText: emailError && (_jsx(FormattedMessage, { id: `ui.accountRecover.email.error.${emailError}`, defaultMessage: `ui.accountRecover.email.error.${emailError}` })) })), _jsx(Button, Object.assign({ type: "submit" }, ButtonProps, { disabled: !email || Boolean(emailError) || isSubmitting, children: _jsx(FormattedMessage, { id: "ui.accountRecover.submit", defaultMessage: "ui.accountRecover.submit" }) }))] })) })));
+                }), successAction] }))) : (_jsxs("form", Object.assign({ className: classes.form, onSubmit: handleSubmit }, { children: [_jsx(EmailTextField, Object.assign({ className: classes.email, disabled: isSubmitting, label: _jsx(FormattedMessage, { id: "ui.accountRecover.email.label", defaultMessage: "ui.accountRecover.email.label" }) }, TextFieldProps, { value: email, onChange: handleChange, error: Boolean(emailError), helperText: emailError && (_jsx(FormattedMessage, { id: `ui.accountRecover.email.error.${emailError}`, defaultMessage: `ui.accountRecover.email.error.${emailError}` })) })), _jsx(Button, Object.assign({ type: "submit" }, ButtonProps, { disabled: !email || Boolean(emailError) || isSubmitting }, { children: _jsx(FormattedMessage, { id: "ui.accountRecover.submit", defaultMessage: "ui.accountRecover.submit" }) }))] }))) })));
 }

package/lib/esm/components/AccountReset/AccountReset.js CHANGED Viewed

@@ -141,5 +141,5 @@ export default function AccountReset(inProps) {
         return null;
     }
     // RENDER
-    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: isSucceed ? (_jsxs(Alert, { severity: "success", className: classes.success, children: [intl.formatMessage({ id: 'ui.accountReset.success', defaultMessage: 'ui.accountReset.success' }), successAction] })) : validationCodeError ? (_jsxs(Alert, { severity: "error", className: classes.error, children: [_jsx(FormattedMessage, { id: "ui.accountReset.code.error", defaultMessage: "ui.accountReset.code.error" }), errorAction] })) : isLoading ? (_jsxs(Box, { className: classes.validating, children: [_jsx(CircularProgress, {}), _jsx("p", { children: _jsx(FormattedMessage, { id: "ui.accountReset.code.validatingToken", defaultMessage: "ui.accountReset.code.validatingToken" }) })] })) : (_jsxs("form", { className: classes.form, onSubmit: handleSubmit, children: [_jsx(PasswordTextField, Object.assign({ className: classes.password, disabled: isSubmitting, label: _jsx(FormattedMessage, { id: "ui.accountReset.password.label", defaultMessage: "ui.accountReset.password.label" }) }, TextFieldProps, { value: password, onChange: handleChange, error: Boolean(passwordError), helperText: passwordError && (_jsx(FormattedMessage, { id: `ui.accountReset.password.error.${passwordError}`, defaultMessage: `ui.accountReset.password.error.${passwordError}` })) })), _jsx(Button, Object.assign({ type: "submit" }, ButtonProps, { disabled: !password || isSubmitting, children: _jsx(FormattedMessage, { id: "ui.accountReset.submit", defaultMessage: "ui.accountReset.submit" }) }))] })) })));
+    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: isSucceed ? (_jsxs(Alert, Object.assign({ severity: "success", className: classes.success }, { children: [intl.formatMessage({ id: 'ui.accountReset.success', defaultMessage: 'ui.accountReset.success' }), successAction] }))) : validationCodeError ? (_jsxs(Alert, Object.assign({ severity: "error", className: classes.error }, { children: [_jsx(FormattedMessage, { id: "ui.accountReset.code.error", defaultMessage: "ui.accountReset.code.error" }), errorAction] }))) : isLoading ? (_jsxs(Box, Object.assign({ className: classes.validating }, { children: [_jsx(CircularProgress, {}), _jsx("p", { children: _jsx(FormattedMessage, { id: "ui.accountReset.code.validatingToken", defaultMessage: "ui.accountReset.code.validatingToken" }) })] }))) : (_jsxs("form", Object.assign({ className: classes.form, onSubmit: handleSubmit }, { children: [_jsx(PasswordTextField, Object.assign({ className: classes.password, disabled: isSubmitting, label: _jsx(FormattedMessage, { id: "ui.accountReset.password.label", defaultMessage: "ui.accountReset.password.label" }) }, TextFieldProps, { value: password, onChange: handleChange, error: Boolean(passwordError), helperText: passwordError && (_jsx(FormattedMessage, { id: `ui.accountReset.password.error.${passwordError}`, defaultMessage: `ui.accountReset.password.error.${passwordError}` })) })), _jsx(Button, Object.assign({ type: "submit" }, ButtonProps, { disabled: !password || isSubmitting }, { children: _jsx(FormattedMessage, { id: "ui.accountReset.submit", defaultMessage: "ui.accountReset.submit" }) }))] }))) })));
 }

package/lib/esm/components/AccountVerify/AccountVerify.js CHANGED Viewed

@@ -84,5 +84,5 @@ export default function AccountVerify(inProps) {
         return null;
     }
     // RENDER
-    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: succeed ? (_jsxs(Alert, { severity: "success", className: classes.success, children: [typeof succeed === 'string' ? succeed : _jsx(FormattedMessage, { id: "ui.accountVerify.success", defaultMessage: "ui.accountVerify.success" }), successAction] })) : error ? (_jsxs(Alert, { severity: "error", className: classes.error, children: [_jsx(FormattedMessage, { id: "ui.accountVerify.error", defaultMessage: "ui.accountVerify.error" }), errorAction] })) : (_jsxs(_Fragment, { children: [_jsx(CircularProgress, {}), _jsx(FormattedMessage, { id: "ui.accountVerify.verifying", defaultMessage: "ui.accountVerify.verifying" })] })) })));
+    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: succeed ? (_jsxs(Alert, Object.assign({ severity: "success", className: classes.success }, { children: [typeof succeed === 'string' ? succeed : _jsx(FormattedMessage, { id: "ui.accountVerify.success", defaultMessage: "ui.accountVerify.success" }), successAction] }))) : error ? (_jsxs(Alert, Object.assign({ severity: "error", className: classes.error }, { children: [_jsx(FormattedMessage, { id: "ui.accountVerify.error", defaultMessage: "ui.accountVerify.error" }), errorAction] }))) : (_jsxs(_Fragment, { children: [_jsx(CircularProgress, {}), _jsx(FormattedMessage, { id: "ui.accountVerify.verifying", defaultMessage: "ui.accountVerify.verifying" })] })) })));
 }

package/lib/esm/components/BottomNavigation/BottomNavigation.js CHANGED Viewed

@@ -91,7 +91,7 @@ export default function BottomNavigation(inProps) {
                     eventsEnabled &&
                     !exploreStreamEnabled ? (_jsx(BottomNavigationAction, { className: classNames(classes.composer, classes.action), component: ComposerIconButton, disableRipple: true }, "composer")) : null,
                 eventsEnabled ? (_jsx(BottomNavigationAction, { className: classes.action, component: Link, to: scRoutingContext.url(SCRoutes.EVENT_ROUTE_NAME, {}), value: scRoutingContext.url(SCRoutes.EVENTS_ROUTE_NAME, {}), icon: _jsx(Icon, { children: "CalendarIcon" }) }, "events")) : null,
-                scUserContext.user && !groupsEnabled && !eventsEnabled ? (_jsx(BottomNavigationAction, { className: classes.action, component: Link, to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}), value: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}), icon: _jsx(Badge, { badgeContent: scUserContext.user.unseen_notification_banners_counter + scUserContext.user.unseen_interactions_counter, color: "secondary", children: _jsx(Icon, { children: "notifications_active" }) }) }, "notifications")) : null,
-                privateMessagingEnabled && scUserContext.user ? (_jsx(BottomNavigationAction, { className: classes.action, component: Link, to: scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, {}), value: scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, {}), icon: _jsx(Badge, { badgeContent: 0, color: "secondary", children: _jsx(Icon, { children: "email" }) }) }, "messages")) : null
+                scUserContext.user && !groupsEnabled && !eventsEnabled ? (_jsx(BottomNavigationAction, { className: classes.action, component: Link, to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}), value: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}), icon: _jsx(Badge, Object.assign({ badgeContent: scUserContext.user.unseen_notification_banners_counter + scUserContext.user.unseen_interactions_counter, color: "secondary" }, { children: _jsx(Icon, { children: "notifications_active" }) })) }, "notifications")) : null,
+                privateMessagingEnabled && scUserContext.user ? (_jsx(BottomNavigationAction, { className: classes.action, component: Link, to: scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, {}), value: scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, {}), icon: _jsx(Badge, Object.assign({ badgeContent: 0, color: "secondary" }, { children: _jsx(Icon, { children: "email" }) })) }, "messages")) : null
             ] })));
 }

package/lib/esm/components/BroadcastMessages/BroadcastMessages.js CHANGED Viewed

@@ -146,5 +146,5 @@ export default function BroadcastMessages(inProps) {
         onHeightChange && onHeightChange();
     }, [data.results.length, loading, viewAll, cacheStrategy]);
     const messagesToShow = [...unViewedMessages, ...data.results.slice(unViewedMessages.length, viewAll ? viewedMessageCounter : 1)];
-    return (_jsxs(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, rest, { children: [messagesToShow.map((message, index) => (_jsx(Box, { children: _jsx(Message, Object.assign({ message: message }, MessageProps, { onClose: handleDisposeMessage, onRead: handleMarkRead })) }, index))), loading && !disableLoader && _jsx(MessageSkeleton, {}), loading !== null && !loading && (data.next || (data.count > 1 && viewedMessageCounter > 0 && !viewAll)) && (_jsx(Widget, { className: classes.boxLoadMore, children: _jsx(CardContent, { children: _jsxs(Button, { variant: "text", onClick: fetchOtherMessages, disabled: loading, color: "inherit", classes: { root: classes.buttonLoadMore }, children: [_jsx(Avatar, { component: "span", className: classes.avatarLoadMore, alt: preferences[SCPreferences.TEXT_APPLICATION_NAME], src: preferences[SCPreferences.LOGO_NAVBAR_LOGO_MOBILE] }), _jsx(FormattedMessage, { id: "ui.broadcastMessages.loadMore", defaultMessage: "ui.broadcastMessages.loadMore" })] }) }) }))] })));
+    return (_jsxs(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, rest, { children: [messagesToShow.map((message, index) => (_jsx(Box, { children: _jsx(Message, Object.assign({ message: message }, MessageProps, { onClose: handleDisposeMessage, onRead: handleMarkRead })) }, index))), loading && !disableLoader && _jsx(MessageSkeleton, {}), loading !== null && !loading && (data.next || (data.count > 1 && viewedMessageCounter > 0 && !viewAll)) && (_jsx(Widget, Object.assign({ className: classes.boxLoadMore }, { children: _jsx(CardContent, { children: _jsxs(Button, Object.assign({ variant: "text", onClick: fetchOtherMessages, disabled: loading, color: "inherit", classes: { root: classes.buttonLoadMore } }, { children: [_jsx(Avatar, { component: "span", className: classes.avatarLoadMore, alt: preferences[SCPreferences.TEXT_APPLICATION_NAME], src: preferences[SCPreferences.LOGO_NAVBAR_LOGO_MOBILE] }), _jsx(FormattedMessage, { id: "ui.broadcastMessages.loadMore", defaultMessage: "ui.broadcastMessages.loadMore" })] })) }) })))] })));
 }

package/lib/esm/components/BroadcastMessages/Message.js CHANGED Viewed

@@ -83,7 +83,7 @@ export default function Message(props) {
     }, [message]);
     // RENDER
     const renderContent = (banner) => {
-        return (_jsxs(_Fragment, { children: [_jsx(CardContent, { className: classes.title, children: _jsx(Typography, { variant: "h6", children: banner.title }) }), banner.image && _jsx(CardMedia, { className: classes.media, component: "img", image: banner.image, alt: banner.title }), (banner.body_text || banner.link_text) && (_jsxs(CardContent, { className: classes.content, children: [banner.body_text && (_jsx(Typography, { variant: "body1", color: "text.secondary", children: banner.body_text })), banner.link_text && (_jsx(Typography, { variant: "body1", color: "text.secondary", children: _jsx("a", { href: banner.link, target: banner.open_in_new_tab ? '_blank' : '_self', children: banner.link_text }) }))] }))] }));
+        return (_jsxs(_Fragment, { children: [_jsx(CardContent, Object.assign({ className: classes.title }, { children: _jsx(Typography, Object.assign({ variant: "h6" }, { children: banner.title })) })), banner.image && _jsx(CardMedia, { className: classes.media, component: "img", image: banner.image, alt: banner.title }), (banner.body_text || banner.link_text) && (_jsxs(CardContent, Object.assign({ className: classes.content }, { children: [banner.body_text && (_jsx(Typography, Object.assign({ variant: "body1", color: "text.secondary" }, { children: banner.body_text }))), banner.link_text && (_jsx(Typography, Object.assign({ variant: "body1", color: "text.secondary" }, { children: _jsx("a", Object.assign({ href: banner.link, target: banner.open_in_new_tab ? '_blank' : '_self' }, { children: banner.link_text })) })))] })))] }));
     };
     // Banner
     const { banner } = message;
@@ -92,10 +92,10 @@ export default function Message(props) {
          * With a fade in transition show the Card (Widget)
          * Include also MarkRead component to
          */
-        return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, rest, { children: _jsx(Fade, { in: open, unmountOnExit: true, children: _jsxs(Box, { children: [message.viewed_at === null && !disableMarkRead && (_jsx(MarkRead, { endpoint: Endpoints.BroadcastMessagesMarkRead, data: { banner_ids: [message.id] }, callback: handleOnRead })), _jsx(CardHeader, { className: classes.header, avatar: _jsx(Avatar, { alt: preferences[SCPreferences.TEXT_APPLICATION_NAME], src: preferences[SCPreferences.LOGO_NAVBAR_LOGO_MOBILE] }), action: template === SCBroadcastMessageTemplateType.DETAIL && (_jsx(IconButton, { "aria-label": "close", onClick: handleClose, disabled: closing, children: closing ? _jsx(CircularProgress, { size: 20 }) : _jsx(Icon, { children: "close" }) })), title: _jsx(Chip, { color: "secondary", size: "small", label: _jsx(FormattedMessage, { id: "ui.broadcastMessages.message.chip", defaultMessage: "ui.broadcastMessages.message.chip" }) }) }), renderContent(banner)] }) }) })));
+        return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, rest, { children: _jsx(Fade, Object.assign({ in: open, unmountOnExit: true }, { children: _jsxs(Box, { children: [message.viewed_at === null && !disableMarkRead && (_jsx(MarkRead, { endpoint: Endpoints.BroadcastMessagesMarkRead, data: { banner_ids: [message.id] }, callback: handleOnRead })), _jsx(CardHeader, { className: classes.header, avatar: _jsx(Avatar, { alt: preferences[SCPreferences.TEXT_APPLICATION_NAME], src: preferences[SCPreferences.LOGO_NAVBAR_LOGO_MOBILE] }), action: template === SCBroadcastMessageTemplateType.DETAIL && (_jsx(IconButton, Object.assign({ "aria-label": "close", onClick: handleClose, disabled: closing }, { children: closing ? _jsx(CircularProgress, { size: 20 }) : _jsx(Icon, { children: "close" }) }))), title: _jsx(Chip, { color: "secondary", size: "small", label: _jsx(FormattedMessage, { id: "ui.broadcastMessages.message.chip", defaultMessage: "ui.broadcastMessages.message.chip" }) }) }), renderContent(banner)] }) })) })));
     }
     // SCBroadcastMessageTemplateType.SNIPPET
-    return (_jsx(Root, Object.assign({ id: id, className: className }, rest, { children: _jsxs(ListItem, { alignItems: 'center', component: 'div', classes: {
+    return (_jsx(Root, Object.assign({ id: id, className: className }, rest, { children: _jsxs(ListItem, Object.assign({ alignItems: 'center', component: 'div', classes: {
                 root: classNames(classes.listItemSnippet, classes.listItemSnippetNew)
-            }, children: [_jsx(ListItemAvatar, { classes: { root: classes.messageIconWrap }, children: _jsx(Avatar, { variant: "circular", classes: { root: classes.messageIconSnippet }, children: _jsx(Icon, { children: "info" }) }) }), _jsx(ListItemText, { disableTypography: true, primary: _jsx(Link, { to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}), children: _jsx(Typography, { component: "span", color: "inherit", children: banner.title }) }) })] }) })));
+            } }, { children: [_jsx(ListItemAvatar, Object.assign({ classes: { root: classes.messageIconWrap } }, { children: _jsx(Avatar, Object.assign({ variant: "circular", classes: { root: classes.messageIconSnippet } }, { children: _jsx(Icon, { children: "info" }) })) })), _jsx(ListItemText, { disableTypography: true, primary: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}) }, { children: _jsx(Typography, Object.assign({ component: "span", color: "inherit" }, { children: banner.title })) })) })] })) })));
 }

package/lib/esm/components/BroadcastMessages/Skeleton.js CHANGED Viewed

@@ -41,7 +41,7 @@ const MessageSkeletonRoot = styled(Widget, {
  */
 export function MessageSkeleton(props) {
     const theme = useTheme();
-    return (_jsxs(MessageSkeletonRoot, { className: messageClasses.root, children: [_jsx(CardHeader, { className: messageClasses.header, avatar: _jsx(Skeleton, { animation: "wave", variant: "circular", width: theme.selfcommunity.user.avatar.sizeMedium, height: theme.selfcommunity.user.avatar.sizeMedium }), title: _jsx(Skeleton, { animation: "wave", variant: "rectangular", width: 60, height: 20 }) }), _jsx(CardContent, { className: messageClasses.title, children: _jsx(React.Fragment, { children: _jsx(Skeleton, { animation: "wave", height: 10, width: "80%" }) }) }), _jsx(Box, { className: messageClasses.media, children: _jsx(Skeleton, { height: 190, animation: "wave", variant: "rectangular" }) }), _jsx(CardContent, { className: messageClasses.content, children: _jsxs(React.Fragment, { children: [_jsx(Skeleton, { animation: "wave", height: 10, width: "80%" }), _jsx(Skeleton, { animation: "wave", height: 10, width: 60 })] }) })] }));
+    return (_jsxs(MessageSkeletonRoot, Object.assign({ className: messageClasses.root }, { children: [_jsx(CardHeader, { className: messageClasses.header, avatar: _jsx(Skeleton, { animation: "wave", variant: "circular", width: theme.selfcommunity.user.avatar.sizeMedium, height: theme.selfcommunity.user.avatar.sizeMedium }), title: _jsx(Skeleton, { animation: "wave", variant: "rectangular", width: 60, height: 20 }) }), _jsx(CardContent, Object.assign({ className: messageClasses.title }, { children: _jsx(React.Fragment, { children: _jsx(Skeleton, { animation: "wave", height: 10, width: "80%" }) }) })), _jsx(Box, Object.assign({ className: messageClasses.media }, { children: _jsx(Skeleton, { height: 190, animation: "wave", variant: "rectangular" }) })), _jsx(CardContent, Object.assign({ className: messageClasses.content }, { children: _jsxs(React.Fragment, { children: [_jsx(Skeleton, { animation: "wave", height: 10, width: "80%" }), _jsx(Skeleton, { animation: "wave", height: 10, width: 60 })] }) }))] })));
 }
 const classes = {
     root: `${PREFIX}-skeleton-root`

package/lib/esm/components/Categories/Categories.js CHANGED Viewed

@@ -147,7 +147,7 @@ export default function Categories(inProps) {
      * Renders categories list
      */
     const filteredCategories = sortByAttr(getFilteredCategories(), 'order');
-    const c = (_jsxs(_Fragment, { children: [showFilters && (_jsx(Grid, { container: true, direction: "row", justifyContent: "center", alignItems: "center", className: classes.filters, children: filters ? (filters) : (_jsx(Grid, { item: true, xs: 12, md: 6, children: _jsx(TextField, { fullWidth: true, value: filterName, label: _jsx(FormattedMessage, { id: "ui.categories.filterByName", defaultMessage: "ui.categories.filterByName" }), variant: "outlined", onChange: handleOnChangeFilterName, disabled: loading }) })) })), loading ? (_jsx(CategoriesSkeletonComponent, Object.assign({}, CategoriesSkeletonProps))) : (_jsx(Grid, { container: true, spacing: { xs: 3 }, className: classes.categories, children: !filteredCategories.length ? (_jsx(Grid, { item: true, children: _jsx(Typography, { className: classes.noResults, variant: "body2", children: _jsx(FormattedMessage, { id: "ui.categories.noResults", defaultMessage: "ui.categories.noResults" }) }) })) : (_jsx(_Fragment, { children: filteredCategories.map((category) => (_jsx(Grid, { item: true, xs: 12, sm: 6, md: 6, lg: 4, children: _jsx(CategoryComponent, Object.assign({ category: category }, CategoryComponentProps, { showTooltip: true, className: classes.category })) }, category.id))) })) }))] }));
+    const c = (_jsxs(_Fragment, { children: [showFilters && (_jsx(Grid, Object.assign({ container: true, direction: "row", justifyContent: "center", alignItems: "center", className: classes.filters }, { children: filters ? (filters) : (_jsx(Grid, Object.assign({ item: true, xs: 12, md: 6 }, { children: _jsx(TextField, { fullWidth: true, value: filterName, label: _jsx(FormattedMessage, { id: "ui.categories.filterByName", defaultMessage: "ui.categories.filterByName" }), variant: "outlined", onChange: handleOnChangeFilterName, disabled: loading }) }))) }))), loading ? (_jsx(CategoriesSkeletonComponent, Object.assign({}, CategoriesSkeletonProps))) : (_jsx(Grid, Object.assign({ container: true, spacing: { xs: 3 }, className: classes.categories }, { children: !filteredCategories.length ? (_jsx(Grid, Object.assign({ item: true }, { children: _jsx(Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.categories.noResults", defaultMessage: "ui.categories.noResults" }) })) }))) : (_jsx(_Fragment, { children: filteredCategories.map((category) => (_jsx(Grid, Object.assign({ item: true, xs: 12, sm: 6, md: 6, lg: 4 }, { children: _jsx(CategoryComponent, Object.assign({ category: category }, CategoryComponentProps, { showTooltip: true, className: classes.category })) }), category.id))) })) })))] }));
     /**
      * Renders root object (if content availability community option is false and user is anonymous, component is hidden)
      */

package/lib/esm/components/Categories/Skeleton.js CHANGED Viewed

@@ -36,5 +36,5 @@ const Root = styled(Box, {
  */
 export default function CategoriesSkeleton(inProps) {
     const { className, CategorySkeletonProps = {} } = inProps, rest = __rest(inProps, ["className", "CategorySkeletonProps"]);
-    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsx(Grid, { container: true, spacing: { xs: 3 }, className: classes.categories, children: [...Array(15)].map((category, index) => (_jsx(Grid, { item: true, xs: 12, sm: 6, md: 4, children: _jsx(CategorySkeleton, Object.assign({ elevation: 0, variant: 'outlined' }, CategorySkeletonProps)) }, index))) }) })));
+    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsx(Grid, Object.assign({ container: true, spacing: { xs: 3 }, className: classes.categories }, { children: [...Array(15)].map((category, index) => (_jsx(Grid, Object.assign({ item: true, xs: 12, sm: 6, md: 4 }, { children: _jsx(CategorySkeleton, Object.assign({ elevation: 0, variant: 'outlined' }, CategorySkeletonProps)) }), index))) })) })));
 }

package/lib/esm/components/CategoriesPopularWidget/CategoriesPopularWidget.js CHANGED Viewed

@@ -206,6 +206,6 @@ export default function CategoriesPopularWidget(inProps) {
     if (!state.initialized) {
         return _jsx(Skeleton, {});
     }
-    const content = (_jsxs(CardContent, { children: [_jsx(Typography, { className: classes.title, variant: "h5", children: _jsx(FormattedMessage, { id: "ui.categoriesPopularWidget.title", defaultMessage: "ui.categoriesPopularWidget.title" }) }), !state.count ? (_jsx(Typography, { className: classes.noResults, variant: "body2", children: _jsx(FormattedMessage, { id: "ui.categoriesPopularWidget.noResults", defaultMessage: "ui.categoriesPopularWidget.noResults" }) })) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((category) => (_jsx(ListItem, { children: _jsx(Category, Object.assign({ elevation: 0, category: category, categoryFollowButtonProps: { onFollow: handleFollowersUpdate } }, CategoryProps)) }, category.id))) }), state.count > state.visibleItems && (_jsx(Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: _jsx(FormattedMessage, { id: "ui.categoriesPopularWidget.button.showAll", defaultMessage: "ui.categoriesPopularWidget.button.showAll" }) }))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.categoriesPopularWidget.title", id: "ui.categoriesPopularWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: _jsx(InfiniteScroll, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: _jsx(CategorySkeleton, Object.assign({ elevation: 0 }, CategoryProps)), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, { className: classes.endMessage, children: _jsx(FormattedMessage, { id: "ui.categoriesPopularWidget.noMoreResults", defaultMessage: "ui.categoriesPopularWidget.noMoreResults" }) }), children: _jsx(List, { children: state.results.map((c) => (_jsx(ListItem, { children: _jsx(Category, Object.assign({ elevation: 0, category: c }, CategoryProps, { categoryFollowButtonProps: { onFollow: handleFollowersUpdate } })) }, c.id))) }) }) })))] }));
+    const content = (_jsxs(CardContent, { children: [_jsx(Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.categoriesPopularWidget.title", defaultMessage: "ui.categoriesPopularWidget.title" }) })), !state.count ? (_jsx(Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.categoriesPopularWidget.noResults", defaultMessage: "ui.categoriesPopularWidget.noResults" }) }))) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((category) => (_jsx(ListItem, { children: _jsx(Category, Object.assign({ elevation: 0, category: category, categoryFollowButtonProps: { onFollow: handleFollowersUpdate } }, CategoryProps)) }, category.id))) }), state.count > state.visibleItems && (_jsx(Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: _jsx(FormattedMessage, { id: "ui.categoriesPopularWidget.button.showAll", defaultMessage: "ui.categoriesPopularWidget.button.showAll" }) })))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.categoriesPopularWidget.title", id: "ui.categoriesPopularWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: _jsx(InfiniteScroll, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: _jsx(CategorySkeleton, Object.assign({ elevation: 0 }, CategoryProps)), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.categoriesPopularWidget.noMoreResults", defaultMessage: "ui.categoriesPopularWidget.noMoreResults" }) })) }, { children: _jsx(List, { children: state.results.map((c) => (_jsx(ListItem, { children: _jsx(Category, Object.assign({ elevation: 0, category: c }, CategoryProps, { categoryFollowButtonProps: { onFollow: handleFollowersUpdate } })) }, c.id))) }) })) })))] }));
     return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: content })));
 }

package/lib/esm/components/CategoriesSuggestionWidget/CategoriesSuggestionWidget.js CHANGED Viewed

@@ -200,6 +200,6 @@ export default function CategoriesSuggestionWidget(inProps) {
     if (!state.initialized) {
         return _jsx(Skeleton, {});
     }
-    const content = (_jsxs(CardContent, { children: [_jsx(Typography, { className: classes.title, variant: "h5", children: _jsx(FormattedMessage, { id: "ui.categoriesSuggestionWidget.title", defaultMessage: "ui.categoriesSuggestionWidget.title" }) }), !state.count ? (_jsx(Typography, { className: classes.noResults, variant: "body2", children: _jsx(FormattedMessage, { id: "ui.categoriesSuggestionWidget.noResults", defaultMessage: "ui.categoriesSuggestionWidget.noResults" }) })) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((category) => (_jsx(ListItem, { children: _jsx(Category, Object.assign({ elevation: 0, category: category, categoryFollowButtonProps: { onFollow: handleFollow } }, CategoryProps)) }, category.id))) }), state.count > state.visibleItems && (_jsx(Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: _jsx(FormattedMessage, { id: "ui.categoriesSuggestionWidget.button.showAll", defaultMessage: "ui.categoriesSuggestionWidget.button.showAll" }) }))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.categoriesSuggestionWidget.title", id: "ui.categoriesSuggestionWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: _jsx(InfiniteScroll, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: _jsx(CategorySkeleton, Object.assign({ elevation: 0 }, CategoryProps)), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, { className: classes.endMessage, children: _jsx(FormattedMessage, { id: "ui.categoriesSuggestionWidget.noMoreResults", defaultMessage: "ui.categoriesSuggestionWidget.noMoreResults" }) }), children: _jsx(List, { children: state.results.map((c) => (_jsx(ListItem, { children: _jsx(Category, Object.assign({ elevation: 0, category: c }, CategoryProps, { categoryFollowButtonProps: { onFollow: handleFollow } })) }, c.id))) }) }) })))] }));
+    const content = (_jsxs(CardContent, { children: [_jsx(Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.categoriesSuggestionWidget.title", defaultMessage: "ui.categoriesSuggestionWidget.title" }) })), !state.count ? (_jsx(Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.categoriesSuggestionWidget.noResults", defaultMessage: "ui.categoriesSuggestionWidget.noResults" }) }))) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((category) => (_jsx(ListItem, { children: _jsx(Category, Object.assign({ elevation: 0, category: category, categoryFollowButtonProps: { onFollow: handleFollow } }, CategoryProps)) }, category.id))) }), state.count > state.visibleItems && (_jsx(Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: _jsx(FormattedMessage, { id: "ui.categoriesSuggestionWidget.button.showAll", defaultMessage: "ui.categoriesSuggestionWidget.button.showAll" }) })))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.categoriesSuggestionWidget.title", id: "ui.categoriesSuggestionWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: _jsx(InfiniteScroll, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: _jsx(CategorySkeleton, Object.assign({ elevation: 0 }, CategoryProps)), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.categoriesSuggestionWidget.noMoreResults", defaultMessage: "ui.categoriesSuggestionWidget.noMoreResults" }) })) }, { children: _jsx(List, { children: state.results.map((c) => (_jsx(ListItem, { children: _jsx(Category, Object.assign({ elevation: 0, category: c }, CategoryProps, { categoryFollowButtonProps: { onFollow: handleFollow } })) }, c.id))) }) })) })))] }));
     return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: content })));
 }

package/lib/esm/components/CategoriesSuggestionWidget/Skeleton.js CHANGED Viewed

@@ -35,5 +35,5 @@ const Root = styled(Widget, {
  *
  */
 export default function CategoriesSuggestionWidgetSkeleton(props) {
-    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: _jsx(CardContent, { children: _jsx(List, { className: classes.list, children: [...Array(4)].map((category, index) => (_jsx(ListItem, { children: _jsx(CategorySkeleton, { elevation: 0 }) }, index))) }) }) })));
+    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: _jsx(CardContent, { children: _jsx(List, Object.assign({ className: classes.list }, { children: [...Array(4)].map((category, index) => (_jsx(ListItem, { children: _jsx(CategorySkeleton, { elevation: 0 }) }, index))) })) }) })));
 }

package/lib/esm/components/Category/Category.js CHANGED Viewed

@@ -81,7 +81,7 @@ export default function Category(inProps) {
     }
     // RENDER
     if (!autoHide) {
-        return (_jsx(Root, Object.assign({ disableTypography: showTooltip, elevation: elevation, className: classNames(classes.root, className, { [classes.followed]: scCategory.followed }, { [classes.autoFollowed]: scCategory.auto_follow === SCCategoryAutoFollowType.FORCED }), ButtonBaseProps: _ButtonBaseProps, image: _jsx(Avatar, { alt: scCategory.name, src: scCategory.image_medium, variant: "square", className: classes.categoryImage }), primary: _jsx(_Fragment, { children: showTooltip ? (_jsx(Tooltip, { title: scCategory.name, children: _jsx(Typography, { className: classes.primary, component: "span", variant: "body1", children: scCategory.name }) })) : (scCategory.name) }), secondary: _jsx(_Fragment, { children: showTooltip ? (_jsx(Typography, { className: classes.secondary, component: "p", variant: "body2", children: showFollowers ? `${intl.formatMessage(messages.categoryFollowers, { total: scCategory.followers_counter })}` : scCategory.slogan })) : (_jsx(_Fragment, { children: showFollowers ? `${intl.formatMessage(messages.categoryFollowers, { total: scCategory.followers_counter })}` : scCategory.slogan })) }), actions: _jsx(CategoryFollowButton, Object.assign({ category: scCategory }, categoryFollowButtonProps)) }, rest)));
+        return (_jsx(Root, Object.assign({ disableTypography: showTooltip, elevation: elevation, className: classNames(classes.root, className, { [classes.followed]: scCategory.followed }, { [classes.autoFollowed]: scCategory.auto_follow === SCCategoryAutoFollowType.FORCED }), ButtonBaseProps: _ButtonBaseProps, image: _jsx(Avatar, { alt: scCategory.name, src: scCategory.image_medium, variant: "square", className: classes.categoryImage }), primary: _jsx(_Fragment, { children: showTooltip ? (_jsx(Tooltip, Object.assign({ title: scCategory.name }, { children: _jsx(Typography, Object.assign({ className: classes.primary, component: "span", variant: "body1" }, { children: scCategory.name })) }))) : (scCategory.name) }), secondary: _jsx(_Fragment, { children: showTooltip ? (_jsx(Typography, Object.assign({ className: classes.secondary, component: "p", variant: "body2" }, { children: showFollowers ? `${intl.formatMessage(messages.categoryFollowers, { total: scCategory.followers_counter })}` : scCategory.slogan }))) : (_jsx(_Fragment, { children: showFollowers ? `${intl.formatMessage(messages.categoryFollowers, { total: scCategory.followers_counter })}` : scCategory.slogan })) }), actions: _jsx(CategoryFollowButton, Object.assign({ category: scCategory }, categoryFollowButtonProps)) }, rest)));
     }
     return null;
 }

package/lib/esm/components/Category/Skeleton.js CHANGED Viewed

@@ -38,5 +38,5 @@ const Root = styled(BaseItem, {
  */
 export default function CategorySkeleton(props) {
     const theme = useTheme();
-    return (_jsx(Root, Object.assign({ className: classes.root }, props, { image: _jsx(Skeleton, { animation: "wave", variant: "rectangular", width: theme.selfcommunity.category.icon.sizeMedium, height: theme.selfcommunity.category.icon.sizeMedium, className: classes.image }), primary: _jsx(Skeleton, { animation: "wave", height: 10, width: 120, className: classes.primary }), secondary: _jsx(Skeleton, { animation: "wave", height: 10, width: 70, className: classes.secondary }), actions: _jsx(Button, { size: "small", variant: "outlined", disabled: true, className: classes.button, children: _jsx(Skeleton, { animation: "wave", height: 10, width: 50, className: classes.action }) }) })));
+    return (_jsx(Root, Object.assign({ className: classes.root }, props, { image: _jsx(Skeleton, { animation: "wave", variant: "rectangular", width: theme.selfcommunity.category.icon.sizeMedium, height: theme.selfcommunity.category.icon.sizeMedium, className: classes.image }), primary: _jsx(Skeleton, { animation: "wave", height: 10, width: 120, className: classes.primary }), secondary: _jsx(Skeleton, { animation: "wave", height: 10, width: 70, className: classes.secondary }), actions: _jsx(Button, Object.assign({ size: "small", variant: "outlined", disabled: true, className: classes.button }, { children: _jsx(Skeleton, { animation: "wave", height: 10, width: 50, className: classes.action }) })) })));
 }

package/lib/esm/components/CategoryAutocomplete/CategoryAutocomplete.js CHANGED Viewed

@@ -95,7 +95,7 @@ const CategoryAutocomplete = (inProps) => {
         }, renderOption: (props, option, { selected, inputValue }) => {
             const matches = match(option.name, inputValue);
             const parts = parse(option.name, matches);
-            return (_jsxs("li", Object.assign({}, props, { children: [checkboxSelect && _jsx(Checkbox, { style: { marginRight: 8 }, checked: selected }), _jsx(Chip, { label: _jsx(React.Fragment, { children: parts.map((part, index) => (_jsx("span", { style: { fontWeight: part.highlight ? 700 : 400 }, children: part.text }, index))) }) })] })));
+            return (_jsxs("li", Object.assign({}, props, { children: [checkboxSelect && _jsx(Checkbox, { style: { marginRight: 8 }, checked: selected }), _jsx(Chip, { label: _jsx(React.Fragment, { children: parts.map((part, index) => (_jsx("span", Object.assign({ style: { fontWeight: part.highlight ? 700 : 400 } }, { children: part.text }), index))) }) })] })));
         }, renderInput: (params) => {
             return (_jsx(TextField, Object.assign({}, params, TextFieldProps, { margin: "dense", InputProps: Object.assign(Object.assign({}, params.InputProps), { autoComplete: 'categories', endAdornment: (_jsxs(React.Fragment, { children: [isLoading ? _jsx(CircularProgress, { color: "inherit", size: 20 }) : null, params.InputProps.endAdornment] })) }) })));
         } }, rest)));

package/lib/esm/components/CategoryFollowersButton/CategoryFollowersButton.js CHANGED Viewed

@@ -123,5 +123,5 @@ export default function CategoryFollowersButton(inProps) {
     // RENDER
     const theme = useTheme();
     const isMobile = useMediaQuery(theme.breakpoints.down('md'));
-    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className), onClick: handleToggleDialogOpen, disabled: loading || !scCategory || scCategory.followers_counter === 0 }, rest, { children: loading || !scCategory ? (_jsx(AvatarGroupSkeleton, Object.assign({}, rest))) : (_jsx(AvatarGroup, { total: scCategory.followers_counter, children: followers.map((c) => (_jsx(Avatar, { alt: c.username, src: c.avatar }, c.id))) })) })), open && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.categoryFollowersButton.dialogTitle", id: "ui.categoryFollowersButton.dialogTitle", values: { total: scCategory.followers_counter } }), onClose: handleToggleDialogOpen, open: open }, DialogProps, { children: _jsx(InfiniteScroll, { dataLength: followers.length, next: fetchFollowers, hasMoreNext: next !== null || loading, loaderNext: _jsx(UserSkeleton, { elevation: 0 }), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, { className: classes.endMessage, children: _jsx(FormattedMessage, { id: "ui.categoryFollowersButton.noOtherFollowers", defaultMessage: "ui.categoryFollowersButton.noOtherFollowers" }) }), children: _jsx(List, { children: followers.map((follower) => (_jsx(ListItem, { children: _jsx(User, { elevation: 0, user: follower }) }, follower.id))) }) }) })))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className), onClick: handleToggleDialogOpen, disabled: loading || !scCategory || scCategory.followers_counter === 0 }, rest, { children: loading || !scCategory ? (_jsx(AvatarGroupSkeleton, Object.assign({}, rest))) : (_jsx(AvatarGroup, Object.assign({ total: scCategory.followers_counter }, { children: followers.map((c) => (_jsx(Avatar, { alt: c.username, src: c.avatar }, c.id))) }))) })), open && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.categoryFollowersButton.dialogTitle", id: "ui.categoryFollowersButton.dialogTitle", values: { total: scCategory.followers_counter } }), onClose: handleToggleDialogOpen, open: open }, DialogProps, { children: _jsx(InfiniteScroll, Object.assign({ dataLength: followers.length, next: fetchFollowers, hasMoreNext: next !== null || loading, loaderNext: _jsx(UserSkeleton, { elevation: 0 }), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.categoryFollowersButton.noOtherFollowers", defaultMessage: "ui.categoryFollowersButton.noOtherFollowers" }) })) }, { children: _jsx(List, { children: followers.map((follower) => (_jsx(ListItem, { children: _jsx(User, { elevation: 0, user: follower }) }, follower.id))) }) })) })))] }));
 }

package/lib/esm/components/CategoryHeader/CategoryHeader.js CHANGED Viewed

@@ -74,5 +74,5 @@ export default function CategoryHeader(inProps) {
     if (!scCategory) {
         return null;
     }
-    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsx(Paper, { style: _backgroundCover, classes: { root: classes.cover } }), _jsxs(Box, { className: classes.info, children: [_jsx(Typography, { variant: "h3", className: classes.name, gutterBottom: true, children: scCategory.name }), scCategory.slogan && (_jsx(Typography, { variant: "h5", className: classes.slogan, children: scCategory.slogan })), _jsxs(Box, { className: classes.followed, children: [_jsx(Typography, { className: classes.followedCounter, component: "div", children: _jsx(FormattedMessage, { id: "ui.categoryHeader.followedBy", defaultMessage: "ui.categoryHeader.followedBy", values: { total: scCategory.followers_counter } }) }), _jsx(CategoryFollowersButton, Object.assign({ category: scCategory, categoryId: scCategory === null || scCategory === void 0 ? void 0 : scCategory.id }, CategoryFollowersButtonProps))] }), _jsx(Box, { className: classes.action, children: _jsx(CategoryFollowButton, Object.assign({ category: scCategory, onFollow: handleFollow }, CategoryFollowButtonProps)) })] })] })));
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsx(Paper, { style: _backgroundCover, classes: { root: classes.cover } }), _jsxs(Box, Object.assign({ className: classes.info }, { children: [_jsx(Typography, Object.assign({ variant: "h3", className: classes.name, gutterBottom: true }, { children: scCategory.name })), scCategory.slogan && (_jsx(Typography, Object.assign({ variant: "h5", className: classes.slogan }, { children: scCategory.slogan }))), _jsxs(Box, Object.assign({ className: classes.followed }, { children: [_jsx(Typography, Object.assign({ className: classes.followedCounter, component: "div" }, { children: _jsx(FormattedMessage, { id: "ui.categoryHeader.followedBy", defaultMessage: "ui.categoryHeader.followedBy", values: { total: scCategory.followers_counter } }) })), _jsx(CategoryFollowersButton, Object.assign({ category: scCategory, categoryId: scCategory === null || scCategory === void 0 ? void 0 : scCategory.id }, CategoryFollowersButtonProps))] })), _jsx(Box, Object.assign({ className: classes.action }, { children: _jsx(CategoryFollowButton, Object.assign({ category: scCategory, onFollow: handleFollow }, CategoryFollowButtonProps)) }))] }))] })));
 }

package/lib/esm/components/CategoryHeader/Skeleton.js CHANGED Viewed

@@ -32,5 +32,5 @@ const Root = styled(Box, {
  *
  */
 export default function CategoryHeaderSkeleton() {
-    return (_jsxs(Root, { className: classes.root, children: [_jsx(Skeleton, { sx: { height: 230 }, animation: "wave", variant: "rectangular", className: classes.cover }), _jsx(Box, { children: _jsx(Skeleton, { animation: "wave", sx: { height: 20, maxWidth: 300, width: '100%', margin: '0 auto' } }) }), _jsx(Box, { children: _jsx(Skeleton, { animation: "wave", sx: { height: 20, maxWidth: 300, width: '100%', margin: '0 auto' } }) })] }));
+    return (_jsxs(Root, Object.assign({ className: classes.root }, { children: [_jsx(Skeleton, { sx: { height: 230 }, animation: "wave", variant: "rectangular", className: classes.cover }), _jsx(Box, { children: _jsx(Skeleton, { animation: "wave", sx: { height: 20, maxWidth: 300, width: '100%', margin: '0 auto' } }) }), _jsx(Box, { children: _jsx(Skeleton, { animation: "wave", sx: { height: 20, maxWidth: 300, width: '100%', margin: '0 auto' } }) })] })));
 }

package/lib/esm/components/CategoryTrendingFeedWidget/CategoryTrendingFeedWidget.js CHANGED Viewed

@@ -180,8 +180,8 @@ export default function CategoryTrendingFeedWidget(inProps) {
     if (!state.initialized) {
         return _jsx(Skeleton, {});
     }
-    const content = (_jsxs(CardContent, { children: [_jsx(Typography, { className: classes.title, variant: "h5", children: _jsx(FormattedMessage, { id: "ui.categoryTrendingFeedWidget.title", defaultMessage: "ui.categoryTrendingFeedWidget.title" }) }), !state.count ? (_jsx(Typography, { className: classes.noResults, variant: "body2", children: _jsx(FormattedMessage, { id: "ui.categoryTrendingFeedWidget.noResults", defaultMessage: "ui.categoryTrendingFeedWidget.noResults" }) })) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((obj) => (_jsx(ListItem, { children: _jsx(FeedObject, Object.assign({ elevation: 0, feedObject: obj[obj.type] }, FeedObjectProps)) }, obj[obj.type].id))) }), state.count > state.visibleItems && (_jsx(Button, Object.assign({ className: classes.showMore }, (isMobile
+    const content = (_jsxs(CardContent, { children: [_jsx(Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.categoryTrendingFeedWidget.title", defaultMessage: "ui.categoryTrendingFeedWidget.title" }) })), !state.count ? (_jsx(Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.categoryTrendingFeedWidget.noResults", defaultMessage: "ui.categoryTrendingFeedWidget.noResults" }) }))) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((obj) => (_jsx(ListItem, { children: _jsx(FeedObject, Object.assign({ elevation: 0, feedObject: obj[obj.type] }, FeedObjectProps)) }, obj[obj.type].id))) }), state.count > state.visibleItems && (_jsx(Button, Object.assign({ className: classes.showMore }, (isMobile
                         ? { onClick: handleToggleDialogOpen }
-                        : { component: Link, to: scRoutingContext.url(SCRoutes.CATEGORY_TRENDING_FEED_ROUTE_NAME, scCategory) }), { 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[obj.type] }, FeedObjectProps)) }, obj[obj.type].id))) }) }) })))] }));
+                        : { component: Link, to: scRoutingContext.url(SCRoutes.CATEGORY_TRENDING_FEED_ROUTE_NAME, scCategory) }), { 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[obj.type] }, FeedObjectProps)) }, obj[obj.type].id))) }) })) })))] }));
     return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: content })));
 }

package/lib/esm/components/CategoryTrendingFeedWidget/Skeleton.js CHANGED Viewed

@@ -35,5 +35,5 @@ const Root = styled(Widget, {
  *
  */
 export default function CategoryTrendingFeedWidgetSkeleton(props) {
-    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: _jsx(CardContent, { children: _jsx(List, { className: classes.list, children: [...Array(4)].map((post, index) => (_jsx(FeedObjectSkeleton, { elevation: 0 }, index))) }) }) })));
+    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: _jsx(CardContent, { children: _jsx(List, Object.assign({ className: classes.list }, { children: [...Array(4)].map((post, index) => (_jsx(FeedObjectSkeleton, { elevation: 0 }, index))) })) }) })));
 }

package/lib/esm/components/CategoryTrendingUsersWidget/CategoryTrendingUsersWidget.js CHANGED Viewed

@@ -172,6 +172,6 @@ export default function CategoryTrendingUsersWidget(inProps) {
     if (!state.initialized) {
         return _jsx(Skeleton, {});
     }
-    const content = (_jsxs(CardContent, { children: [_jsx(Typography, { className: classes.title, variant: "h5", children: _jsx(FormattedMessage, { id: "ui.categoryTrendingUsersWidget.title", defaultMessage: "ui.categoryTrendingUsersWidget.title" }) }), !state.count ? (_jsx(Typography, { className: classes.noResults, variant: "body2", children: _jsx(FormattedMessage, { id: "ui.categoryTrendingUsersWidget.noResults", defaultMessage: "ui.categoryTrendingUsersWidget.noResults" }) })) : (_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.categoryTrendingUsersWidget.button.showAll", defaultMessage: "ui.categoryTrendingUsersWidget.button.showAll" }) }))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.categoryTrendingUsersWidget.title", id: "ui.categoryTrendingUsersWidget.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(UserSkeleton, Object.assign({ elevation: 0 }, UserProps)), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, { className: classes.endMessage, children: _jsx(FormattedMessage, { id: "ui.categoryTrendingUsersWidget.noMoreResults", defaultMessage: "ui.categoryTrendingUsersWidget.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, Object.assign({ className: classes.title, variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.categoryTrendingUsersWidget.title", defaultMessage: "ui.categoryTrendingUsersWidget.title" }) })), !state.count ? (_jsx(Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.categoryTrendingUsersWidget.noResults", defaultMessage: "ui.categoryTrendingUsersWidget.noResults" }) }))) : (_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.categoryTrendingUsersWidget.button.showAll", defaultMessage: "ui.categoryTrendingUsersWidget.button.showAll" }) })))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { defaultMessage: "ui.categoryTrendingUsersWidget.title", id: "ui.categoryTrendingUsersWidget.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(UserSkeleton, Object.assign({ elevation: 0 }, UserProps)), height: isMobile ? '100%' : 400, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.categoryTrendingUsersWidget.noMoreResults", defaultMessage: "ui.categoryTrendingUsersWidget.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/CategoryTrendingUsersWidget/Skeleton.js CHANGED Viewed

@@ -35,5 +35,5 @@ const Root = styled(Widget, {
  *
  */
 export default function CategoryTrendingPeopleWidgetSkeleton(props) {
-    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: _jsx(CardContent, { children: _jsx(List, { className: classes.list, children: [...Array(4)].map((person, index) => (_jsx(ListItem, { children: _jsx(UserSkeleton, { elevation: 0 }) }, index))) }) }) })));
+    return (_jsx(Root, Object.assign({ className: classes.root }, props, { children: _jsx(CardContent, { children: _jsx(List, Object.assign({ className: classes.list }, { children: [...Array(4)].map((person, index) => (_jsx(ListItem, { children: _jsx(UserSkeleton, { elevation: 0 }) }, index))) })) }) })));
 }

package/lib/esm/components/ChangeCover/ChangeCover.js CHANGED Viewed

@@ -167,22 +167,22 @@ export default function ChangeCover(inProps) {
      * Renders change cover menu items
      */
     function renderMenuItems() {
-        return (_jsx(Box, { children: loading ? (_jsx(MenuItem, { sx: { justifyContent: 'center' }, children: _jsx(CircularProgress, { size: 15 }) })) : (_jsxs(_Fragment, { children: [_jsx("input", { type: "file", onChange: handleUpload, ref: fileInput, hidden: true, accept: ".gif,.png,.jpg,.jpeg" }), _jsxs(MenuItem, { disabled: loading, onClick: () => fileInput.current.click(), className: classes.addMenuItem, children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "add_circle_outline" }) }), _jsx(FormattedMessage, { id: "ui.changeCover.button.upload", defaultMessage: "ui.changeCover.button.upload" })] }), hasCover && (_jsxs(MenuItem, { className: classes.delMenuItem, onClick: () => setOpenDeleteCoverDialog(true), children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "delete" }) }), _jsx(FormattedMessage, { id: "ui.changeCover.button.delete", defaultMessage: "ui.changeCover.button.delete" })] }))] })) }));
+        return (_jsx(Box, { children: loading ? (_jsx(MenuItem, Object.assign({ sx: { justifyContent: 'center' } }, { children: _jsx(CircularProgress, { size: 15 }) }))) : (_jsxs(_Fragment, { children: [_jsx("input", { type: "file", onChange: handleUpload, ref: fileInput, hidden: true, accept: ".gif,.png,.jpg,.jpeg" }), _jsxs(MenuItem, Object.assign({ disabled: loading, onClick: () => fileInput.current.click(), className: classes.addMenuItem }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "add_circle_outline" }) }), _jsx(FormattedMessage, { id: "ui.changeCover.button.upload", defaultMessage: "ui.changeCover.button.upload" })] })), hasCover && (_jsxs(MenuItem, Object.assign({ className: classes.delMenuItem, onClick: () => setOpenDeleteCoverDialog(true) }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, { children: "delete" }) }), _jsx(FormattedMessage, { id: "ui.changeCover.button.delete", defaultMessage: "ui.changeCover.button.delete" })] })))] })) }));
     }
     /**
      * Renders change cover menu
      */
-    const cc = (_jsxs(React.Fragment, { children: [_jsx(Button, Object.assign({ size: "small", variant: "contained", disabled: loading, onClick: handleOpen }, rest, { children: _jsx(Icon, { children: "photo_camera" }) })), _jsx(_Fragment, { children: isMobile ? (_jsx(SwipeableDrawer, { open: open, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true, children: renderMenuItems() })) : (_jsx(Menu, { anchorEl: anchorEl, open: open, onClose: handleClose, children: renderMenuItems() })) }), !isMobile && (_jsxs(_Fragment, { children: [_jsx(Button, { className: classes.helpPopover, variant: "contained", onClick: handleClickHelpButton, children: _jsx(Icon, { children: "help_outline" }) }), isOpen && (_jsx(Popover, { open: isOpen, anchorEl: anchorElPopover, onClose: handleCloseHelpPopover, anchorOrigin: {
+    const cc = (_jsxs(React.Fragment, { children: [_jsx(Button, Object.assign({ size: "small", variant: "contained", disabled: loading, onClick: handleOpen }, rest, { children: _jsx(Icon, { children: "photo_camera" }) })), _jsx(_Fragment, { children: isMobile ? (_jsx(SwipeableDrawer, Object.assign({ open: open, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true }, { children: renderMenuItems() }))) : (_jsx(Menu, Object.assign({ anchorEl: anchorEl, open: open, onClose: handleClose }, { children: renderMenuItems() }))) }), !isMobile && (_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ className: classes.helpPopover, variant: "contained", onClick: handleClickHelpButton }, { children: _jsx(Icon, { children: "help_outline" }) })), isOpen && (_jsx(Popover, Object.assign({ open: isOpen, anchorEl: anchorElPopover, onClose: handleCloseHelpPopover, anchorOrigin: {
                             vertical: 'bottom',
                             horizontal: 'right'
-                        }, children: _jsxs(Box, { sx: { p: '10px' }, children: [_jsx(Typography, { component: "h3", children: _jsx(FormattedMessage, { id: "ui.changeCover.button.uploadA", defaultMessage: "ui.changeCover.button.uploadA" }) }), _jsx(Divider, {}), _jsx(Typography, { component: "span", children: _jsx(FormattedMessage, { id: "ui.changeCover.info", defaultMessage: "ui.changeCover.info", values: {
+                        } }, { children: _jsxs(Box, Object.assign({ sx: { p: '10px' } }, { children: [_jsx(Typography, Object.assign({ component: "h3" }, { children: _jsx(FormattedMessage, { id: "ui.changeCover.button.uploadA", defaultMessage: "ui.changeCover.button.uploadA" }) })), _jsx(Divider, {}), _jsx(Typography, Object.assign({ component: "span" }, { children: _jsx(FormattedMessage, { id: "ui.changeCover.info", defaultMessage: "ui.changeCover.info", values: {
                                             // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                             // @ts-ignore
                                             li: (chunks) => _jsx("li", { children: chunks }),
                                             // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                             // @ts-ignore
                                             ul: (chunks) => _jsx("ul", { children: chunks })
-                                        } }) })] }) }))] })), openDeleteCoverDialog && (_jsx(ConfirmDialog, { open: openDeleteCoverDialog, title: _jsx(FormattedMessage, { id: "ui.changeCover.dialog.msg", defaultMessage: "ui.changeCover.dialog.msg" }), onConfirm: deleteCover, isUpdating: isDeletingCover, onClose: () => {
+                                        } }) }))] })) })))] })), openDeleteCoverDialog && (_jsx(ConfirmDialog, { open: openDeleteCoverDialog, title: _jsx(FormattedMessage, { id: "ui.changeCover.dialog.msg", defaultMessage: "ui.changeCover.dialog.msg" }), onConfirm: deleteCover, isUpdating: isDeletingCover, onClose: () => {
                     setOpenDeleteCoverDialog(false);
                     setAnchorEl(null);
                 } }))] }));
@@ -190,13 +190,13 @@ export default function ChangeCover(inProps) {
      * If there is an error
      */
     if (alert) {
-        return (_jsx(Alert, { color: "error", onClose: () => setAlert(null), children: alert }));
+        return (_jsx(Alert, Object.assign({ color: "error", onClose: () => setAlert(null) }, { children: alert })));
     }
     /**
      * Renders root object (if not hidden by autoHide prop)
      */
     if (!autoHide) {
-        return (_jsx(Root, Object.assign({}, rest, { className: classNames(classes.root, className), children: cc })));
+        return (_jsx(Root, Object.assign({}, rest, { className: classNames(classes.root, className) }, { children: cc })));
     }
     return null;
 }

package/lib/esm/components/ChangeGroupCover/ChangeGroupCover.js CHANGED Viewed

@@ -123,7 +123,7 @@ export default function ChangeGroupCover(inProps) {
      * If there is an error
      */
     if (alert) {
-        return (_jsx(Alert, { color: "error", onClose: () => setAlert(null), children: alert }));
+        return (_jsx(Alert, Object.assign({ color: "error", onClose: () => setAlert(null) }, { children: alert })));
     }
     /**
      * Renders root object (if not hidden by autoHide prop)

package/lib/esm/components/ChangeGroupPicture/ChangeGroupPicture.js CHANGED Viewed

@@ -121,7 +121,7 @@ export default function ChangeGroupPicture(inProps) {
      * If there is an error
      */
     if (alert) {
-        return (_jsx(Alert, { color: "error", onClose: () => setAlert(null), children: alert }));
+        return (_jsx(Alert, Object.assign({ color: "error", onClose: () => setAlert(null) }, { children: alert })));
     }
     /**
      * Renders the component (if not hidden by autoHide prop)

package/lib/esm/components/ChangePicture/ChangePictureDialog/ChangePictureDialog.js CHANGED Viewed

@@ -179,12 +179,12 @@ export default function ChangePictureDialog(props) {
     /**
      * Renders root object
      */
-    return (_jsxs(Root, Object.assign({ className: classNames(classes.dialogRoot, className), title: _jsx(FormattedMessage, { defaultMessage: "ui.changePicture.title", id: "ui.changePicture.title" }), onClose: onClose, open: open }, rest, { children: [_jsxs(Box, { className: classes.upload, children: [alert ? (_jsx(Alert, { color: "error", onClose: () => setAlert(false), children: _jsx(FormattedMessage, { id: "ui.changePicture.button.upload.alert", defaultMessage: "ui.changePicture.button.upload.alert" }) })) : (_jsxs(_Fragment, { children: [_jsx("input", { type: "file", onChange: handleUpload, ref: fileInput, hidden: true, accept: ".gif,.png,.jpg,.jpeg" }), _jsx(Button, { disabled: loading || isDeletingAvatar, variant: "outlined", onClick: () => fileInput.current.click(), color: error ? 'error' : 'primary', startIcon: loading ? null : _jsx(Icon, { children: "folder_open" }), children: loading ? (_jsx(CircularProgress, { size: 15 })) : (_jsx(_Fragment, { children: error ? (_jsx(FormattedMessage, { id: "ui.changePicture.button.upload.error", defaultMessage: "ui.changePicture.button.upload.error" })) : (_jsx(FormattedMessage, { id: "ui.changePicture.button.upload", defaultMessage: "ui.changePicture.button.upload" })) })) })] })), _jsx(Typography, { component: "span", fontSize: "small", color: "text.secondary", gutterBottom: true, children: _jsx(FormattedMessage, { id: "ui.changePicture.info", defaultMessage: "ui.changePicture.info", values: {
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.dialogRoot, className), title: _jsx(FormattedMessage, { defaultMessage: "ui.changePicture.title", id: "ui.changePicture.title" }), onClose: onClose, open: open }, rest, { children: [_jsxs(Box, Object.assign({ className: classes.upload }, { children: [alert ? (_jsx(Alert, Object.assign({ color: "error", onClose: () => setAlert(false) }, { children: _jsx(FormattedMessage, { id: "ui.changePicture.button.upload.alert", defaultMessage: "ui.changePicture.button.upload.alert" }) }))) : (_jsxs(_Fragment, { children: [_jsx("input", { type: "file", onChange: handleUpload, ref: fileInput, hidden: true, accept: ".gif,.png,.jpg,.jpeg" }), _jsx(Button, Object.assign({ disabled: loading || isDeletingAvatar, variant: "outlined", onClick: () => fileInput.current.click(), color: error ? 'error' : 'primary', startIcon: loading ? null : _jsx(Icon, { children: "folder_open" }) }, { children: loading ? (_jsx(CircularProgress, { size: 15 })) : (_jsx(_Fragment, { children: error ? (_jsx(FormattedMessage, { id: "ui.changePicture.button.upload.error", defaultMessage: "ui.changePicture.button.upload.error" })) : (_jsx(FormattedMessage, { id: "ui.changePicture.button.upload", defaultMessage: "ui.changePicture.button.upload" })) })) }))] })), _jsx(Typography, Object.assign({ component: "span", fontSize: "small", color: "text.secondary", gutterBottom: true }, { children: _jsx(FormattedMessage, { id: "ui.changePicture.info", defaultMessage: "ui.changePicture.info", values: {
                                 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                 // @ts-ignore
                                 li: (chunks) => _jsx("li", { children: chunks }),
                                 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                 // @ts-ignore
                                 ul: (chunks) => _jsx("ul", { children: chunks })
-                            } }) })] }), _jsx(ImageList, { cols: 3, rowHeight: 'auto', id: "avatarsList", classes: { root: classes.imagesList }, children: avatars.map((avatar) => (_jsx(Box, { className: classes.imageItem, children: _jsxs(ImageListItem, { className: primary === avatar.id ? classes.primary : '', onClick: () => selectPrimaryAvatar(avatar), children: [_jsx("img", { src: avatar.avatar, loading: "lazy", alt: 'img' }), _jsx(ImageListItemBar, { position: "top", actionIcon: _jsx(IconButton, { onClick: () => handleOpen(avatar.id), size: "small", children: _jsx(Icon, { children: "delete" }) }) })] }, avatar.id) }, avatar.id))) }), openDeleteAvatarDialog && (_jsx(ConfirmDialog, { open: openDeleteAvatarDialog, title: _jsx(FormattedMessage, { id: "ui.changePicture.dialog.msg", defaultMessage: "ui.changePicture.dialog.msg" }), btnConfirm: _jsx(FormattedMessage, { id: "ui.changePicture.dialog.confirm", defaultMessage: "ui.changePicture.dialog.confirm" }), onConfirm: deleteAvatar, isUpdating: isDeletingAvatar, onClose: () => setOpenDeleteAvatarDialog(false) }))] })));
+                            } }) }))] })), _jsx(ImageList, Object.assign({ cols: 3, rowHeight: 'auto', id: "avatarsList", classes: { root: classes.imagesList } }, { children: avatars.map((avatar) => (_jsx(Box, Object.assign({ className: classes.imageItem }, { children: _jsxs(ImageListItem, Object.assign({ className: primary === avatar.id ? classes.primary : '', onClick: () => selectPrimaryAvatar(avatar) }, { children: [_jsx("img", { src: avatar.avatar, loading: "lazy", alt: 'img' }), _jsx(ImageListItemBar, { position: "top", actionIcon: _jsx(IconButton, Object.assign({ onClick: () => handleOpen(avatar.id), size: "small" }, { children: _jsx(Icon, { children: "delete" }) })) })] }), avatar.id) }), avatar.id))) })), openDeleteAvatarDialog && (_jsx(ConfirmDialog, { open: openDeleteAvatarDialog, title: _jsx(FormattedMessage, { id: "ui.changePicture.dialog.msg", defaultMessage: "ui.changePicture.dialog.msg" }), btnConfirm: _jsx(FormattedMessage, { id: "ui.changePicture.dialog.confirm", defaultMessage: "ui.changePicture.dialog.confirm" }), onConfirm: deleteAvatar, isUpdating: isDeletingAvatar, onClose: () => setOpenDeleteAvatarDialog(false) }))] })));
 }

package/lib/esm/components/CommentObject/CommentObject.js CHANGED Viewed

@@ -134,14 +134,14 @@ export default function CommentObject(inProps) {
      * @param comment
      */
     function renderTimeAgo(comment) {
-        return (_jsx(_Fragment, { children: linkableCommentDateTime ? (_jsx(Link, { to: scRoutingContext.url(SCRoutes.COMMENT_ROUTE_NAME, getRouteData(comment)), className: classes.activityAt, children: _jsx(DateTimeAgo, { date: comment.added_at }) })) : (_jsx(DateTimeAgo, { date: comment.added_at })) }));
+        return (_jsx(_Fragment, { children: linkableCommentDateTime ? (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.COMMENT_ROUTE_NAME, getRouteData(comment)), className: classes.activityAt }, { children: _jsx(DateTimeAgo, { date: comment.added_at }) }))) : (_jsx(DateTimeAgo, { date: comment.added_at })) }));
     }
     /**
      * Render CommentObjectReply action
      * @param comment
      */
     function renderActionReply(comment) {
-        return (_jsx(Button, { className: classes.reply, variant: "text", onClick: () => reply(comment), children: _jsx(FormattedMessage, { id: "ui.commentObject.reply", defaultMessage: "ui.commentObject.reply" }) }));
+        return (_jsx(Button, Object.assign({ className: classes.reply, variant: "text", onClick: () => reply(comment) }, { children: _jsx(FormattedMessage, { id: "ui.commentObject.reply", defaultMessage: "ui.commentObject.reply" }) })));
     }
     /**
      * Handle reply: open Editor
@@ -299,7 +299,7 @@ export default function CommentObject(inProps) {
         const summaryHtmlTruncated = 'summary_truncated' in comment ? comment.summary_truncated : false;
         const commentHtml = 'summary_html' in comment && truncateContent && summaryHtmlTruncated ? comment.summary_html : comment.html;
         const summaryHtml = getContributionHtml(commentHtml, scRoutingContext.url);
-        return (_jsxs(React.Fragment, { children: [editComment && editComment.id === comment.id ? (_jsx(Box, { className: classes.comment, children: _jsx(CommentObjectReply, Object.assign({ text: comment.html, autoFocus: true, id: `edit-${comment.id}`, onSave: handleSave, onCancel: handleCancel, editable: !isReplying || !isSavingComment }, CommentObjectReplyProps)) })) : (_jsx(BaseItem, { elevation: 0, className: classes.comment, image: _jsx(Link, Object.assign({}, (!comment.author.deleted && { to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, comment.author) }), { onClick: comment.author.deleted ? () => setOpenAlert(true) : null, children: _jsx(UserAvatar, { hide: !obj.author.community_badge, children: _jsx(Avatar, { alt: obj.author.username, variant: "circular", src: comment.author.avatar, className: classes.avatar }) }) })), disableTypography: true, primary: _jsxs(_Fragment, { children: [_jsxs(Widget, Object.assign({ className: classes.content, elevation: elevation }, rest, { children: [_jsxs(CardContent, { className: classNames({ [classes.deleted]: obj && obj.deleted }), children: [_jsx(Link, Object.assign({ className: classes.author }, (!comment.author.deleted && { to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, comment.author) }), { onClick: comment.author.deleted ? () => setOpenAlert(true) : null, children: _jsx(Typography, { component: "span", children: comment.author.username }) })), _jsx(Typography, { className: classes.textContent, variant: "body2", gutterBottom: true, dangerouslySetInnerHTML: { __html: summaryHtml } }), summaryHtmlTruncated && truncateContent && (_jsx(Link, { to: scRoutingContext.url(SCRoutes.COMMENT_ROUTE_NAME, getRouteData(comment)), className: classes.showMoreContent, children: _jsx(FormattedMessage, { id: "ui.commentObject.showMore", defaultMessage: "ui.commentObject.showMore" }) }))] }), scUserContext.user && (_jsx(Box, { className: classes.commentActionsMenu, children: _jsx(ContributionActionsMenu, { commentObject: comment, onRestoreContribution: handleRestore, onHideContribution: handleHide, onDeleteContribution: handleDelete, onEditContribution: handleEdit }) }))] })), _jsxs(Box, { component: "span", className: classes.contentSubSection, children: [renderTimeAgo(comment), _jsx(Bullet, {}), _jsx(VoteButton, { size: "small", className: classes.vote, contributionId: comment.id, contributionType: SCContributionType.COMMENT, contribution: comment, onVote: handleVoteSuccess }), _jsx(Bullet, {}), renderActionReply(comment), _jsx(VoteAudienceButton, { size: "small", className: classes.voteAudience, contributionId: comment.id, contributionType: SCContributionType.COMMENT, contribution: comment })] })] }) })), comment.comment_count > 0 && _jsx(Box, { className: classes.nestedComments, children: renderLatestComment(comment) }), scUserContext.user && replyComment && (replyComment.id === comment.id || replyComment.parent === comment.id) && !comment.parent && (_jsx(Box, { className: classes.nestedComments, children: _jsx(CommentObjectReply, Object.assign({ text: `@${replyComment.author.username}, `, autoFocus: true, id: `reply-${replyComment.id}`, onReply: handleReply, editable: !isReplying }, CommentObjectReplyProps), `reply-${replyComment.id}`) }))] }, comment.id));
+        return (_jsxs(React.Fragment, { children: [editComment && editComment.id === comment.id ? (_jsx(Box, Object.assign({ className: classes.comment }, { children: _jsx(CommentObjectReply, Object.assign({ text: comment.html, autoFocus: true, id: `edit-${comment.id}`, onSave: handleSave, onCancel: handleCancel, editable: !isReplying || !isSavingComment }, CommentObjectReplyProps)) }))) : (_jsx(BaseItem, { elevation: 0, className: classes.comment, image: _jsx(Link, Object.assign({}, (!comment.author.deleted && { to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, comment.author) }), { onClick: comment.author.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !obj.author.community_badge }, { children: _jsx(Avatar, { alt: obj.author.username, variant: "circular", src: comment.author.avatar, className: classes.avatar }) })) })), disableTypography: true, primary: _jsxs(_Fragment, { children: [_jsxs(Widget, Object.assign({ className: classes.content, elevation: elevation }, rest, { children: [_jsxs(CardContent, Object.assign({ className: classNames({ [classes.deleted]: obj && obj.deleted }) }, { children: [_jsx(Link, Object.assign({ className: classes.author }, (!comment.author.deleted && { to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, comment.author) }), { onClick: comment.author.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(Typography, Object.assign({ component: "span" }, { children: comment.author.username })) })), _jsx(Typography, { className: classes.textContent, variant: "body2", gutterBottom: true, dangerouslySetInnerHTML: { __html: summaryHtml } }), summaryHtmlTruncated && truncateContent && (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.COMMENT_ROUTE_NAME, getRouteData(comment)), className: classes.showMoreContent }, { children: _jsx(FormattedMessage, { id: "ui.commentObject.showMore", defaultMessage: "ui.commentObject.showMore" }) })))] })), scUserContext.user && (_jsx(Box, Object.assign({ className: classes.commentActionsMenu }, { children: _jsx(ContributionActionsMenu, { commentObject: comment, onRestoreContribution: handleRestore, onHideContribution: handleHide, onDeleteContribution: handleDelete, onEditContribution: handleEdit }) })))] })), _jsxs(Box, Object.assign({ component: "span", className: classes.contentSubSection }, { children: [renderTimeAgo(comment), _jsx(Bullet, {}), _jsx(VoteButton, { size: "small", className: classes.vote, contributionId: comment.id, contributionType: SCContributionType.COMMENT, contribution: comment, onVote: handleVoteSuccess }), _jsx(Bullet, {}), renderActionReply(comment), _jsx(VoteAudienceButton, { size: "small", className: classes.voteAudience, contributionId: comment.id, contributionType: SCContributionType.COMMENT, contribution: comment })] }))] }) })), comment.comment_count > 0 && _jsx(Box, Object.assign({ className: classes.nestedComments }, { children: renderLatestComment(comment) })), scUserContext.user && replyComment && (replyComment.id === comment.id || replyComment.parent === comment.id) && !comment.parent && (_jsx(Box, Object.assign({ className: classes.nestedComments }, { children: _jsx(CommentObjectReply, Object.assign({ text: `@${replyComment.author.username}, `, autoFocus: true, id: `reply-${replyComment.id}`, onReply: handleReply, editable: !isReplying }, CommentObjectReplyProps), `reply-${replyComment.id}`) })))] }, comment.id));
     }
     /**
      * Render Latest Comment
@@ -322,5 +322,5 @@ export default function CommentObject(inProps) {
     /**
      * Render object
      */
-    return (_jsxs(_Fragment, { children: [_jsx(Root, { id: id, className: classNames(classes.root, className), children: comment }), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, { children: comment })), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }

package/lib/esm/components/CommentObjectReply/CommentObjectReply.js CHANGED Viewed

@@ -116,5 +116,5 @@ export default function CommentObjectReply(inProps) {
         return _html === '' || _html === '<p class="SCEditor-paragraph"></p>' || _html === '<p class="SCEditor-paragraph"><br></p>';
     }, [html]);
     // RENDER
-    return (_jsx(Root, Object.assign({ id: id }, rest, { disableTypography: true, onClick: handleEditorFocus, elevation: elevation, className: classNames(classes.root, className), image: !scUserContext.user ? (_jsx(Avatar, { variant: "circular", className: classes.avatar })) : (_jsx(UserAvatar, { hide: !scUserContext.user.community_badge, children: _jsx(Avatar, { alt: scUserContext.user.username, variant: "circular", src: scUserContext.user.avatar, classes: { root: classes.avatar } }) })), secondary: _jsxs(Widget, Object.assign({ className: classNames(classes.comment, { [classes.hasValue]: !isEditorEmpty }) }, WidgetProps, { children: [_jsx(Editor, { ref: editor, onChange: handleChangeText, defaultValue: html, editable: editable, uploadImage: true }), !isEditorEmpty && (_jsxs(Stack, { direction: "row", spacing: 2, className: classes.actions, children: [onReply && (_jsx(LoadingButton, { variant: "outlined", size: "small", onClick: handleReply, loading: !editable, className: classes.buttonReply, children: _jsx(FormattedMessage, { id: "ui.commentObject.replyComment.reply", defaultMessage: "ui.commentObject.replyComment.reply" }) })), onSave && (_jsxs(_Fragment, { children: [onCancel && (_jsx(LoadingButton, { variant: 'text', size: "small", onClick: handleCancel, disabled: !editable, color: "inherit", className: classes.buttonCancel, children: _jsx(FormattedMessage, { id: "ui.commentObject.replyComment.cancel", defaultMessage: "ui.commentObject.replyComment.cancel" }) })), _jsx(LoadingButton, { variant: "outlined", size: "small", onClick: handleSave, loading: !editable, className: classes.buttonSave, children: _jsx(FormattedMessage, { id: "ui.commentObject.replyComment.save", defaultMessage: "ui.commentObject.replyComment.save" }) })] }))] }))] })) })));
+    return (_jsx(Root, Object.assign({ id: id }, rest, { disableTypography: true, onClick: handleEditorFocus, elevation: elevation, className: classNames(classes.root, className), image: !scUserContext.user ? (_jsx(Avatar, { variant: "circular", className: classes.avatar })) : (_jsx(UserAvatar, Object.assign({ hide: !scUserContext.user.community_badge }, { children: _jsx(Avatar, { alt: scUserContext.user.username, variant: "circular", src: scUserContext.user.avatar, classes: { root: classes.avatar } }) }))), secondary: _jsxs(Widget, Object.assign({ className: classNames(classes.comment, { [classes.hasValue]: !isEditorEmpty }) }, WidgetProps, { children: [_jsx(Editor, { ref: editor, onChange: handleChangeText, defaultValue: html, editable: editable, uploadImage: true }), !isEditorEmpty && (_jsxs(Stack, Object.assign({ direction: "row", spacing: 2, className: classes.actions }, { children: [onReply && (_jsx(LoadingButton, Object.assign({ variant: "outlined", size: "small", onClick: handleReply, loading: !editable, className: classes.buttonReply }, { children: _jsx(FormattedMessage, { id: "ui.commentObject.replyComment.reply", defaultMessage: "ui.commentObject.replyComment.reply" }) }))), onSave && (_jsxs(_Fragment, { children: [onCancel && (_jsx(LoadingButton, Object.assign({ variant: 'text', size: "small", onClick: handleCancel, disabled: !editable, color: "inherit", className: classes.buttonCancel }, { children: _jsx(FormattedMessage, { id: "ui.commentObject.replyComment.cancel", defaultMessage: "ui.commentObject.replyComment.cancel" }) }))), _jsx(LoadingButton, Object.assign({ variant: "outlined", size: "small", onClick: handleSave, loading: !editable, className: classes.buttonSave }, { children: _jsx(FormattedMessage, { id: "ui.commentObject.replyComment.save", defaultMessage: "ui.commentObject.replyComment.save" }) }))] }))] })))] })) })));
 }

package/lib/esm/components/CommentsFeedObject/CommentsFeedObject.js CHANGED Viewed

@@ -90,7 +90,7 @@ export default function CommentsFeedObject(inProps) {
      */
     const renderTitle = useMemo(() => () => {
         if (showTitle) {
-            return (_jsx(Typography, { variant: "h6", gutterBottom: true, color: 'inherit', children: _jsx(FormattedMessage, { id: "ui.commentsObject.title", defaultMessage: "ui.commentsObject.title", values: { total: total } }) }));
+            return (_jsx(Typography, Object.assign({ variant: "h6", gutterBottom: true, color: 'inherit' }, { children: _jsx(FormattedMessage, { id: "ui.commentsObject.title", defaultMessage: "ui.commentsObject.title", values: { total: total } }) })));
         }
         return null;
     }, [total, isLoading]);
@@ -98,13 +98,13 @@ export default function CommentsFeedObject(inProps) {
      * Render no comments
      */
     function renderNoCommentsFound() {
-        return (_jsx(_Fragment, { children: renderNoComments ? (renderNoComments()) : (_jsx(Box, { className: classes.noComments, children: _jsx(FormattedMessage, { id: "ui.commentsObject.noComments", defaultMessage: "ui.commentsObject.noComments" }) })) }));
+        return (_jsx(_Fragment, { children: renderNoComments ? (renderNoComments()) : (_jsx(Box, Object.assign({ className: classes.noComments }, { children: _jsx(FormattedMessage, { id: "ui.commentsObject.noComments", defaultMessage: "ui.commentsObject.noComments" }) }))) }));
     }
     /**
      * Render comment not found
      */
     function renderCommentNotFoundError() {
-        return (_jsx(_Fragment, { children: renderCommentNotFound ? (renderCommentNotFound()) : (_jsx(Box, { className: classes.commentNotFound, children: _jsx(FormattedMessage, { id: "ui.commentsObject.commentNotFound", defaultMessage: "ui.commentsObject.commentNotFound" }) })) }));
+        return (_jsx(_Fragment, { children: renderCommentNotFound ? (renderCommentNotFound()) : (_jsx(Box, Object.assign({ className: classes.commentNotFound }, { children: _jsx(FormattedMessage, { id: "ui.commentsObject.commentNotFound", defaultMessage: "ui.commentsObject.commentNotFound" }) }))) }));
     }
     /**
      * Get a single comment
@@ -218,5 +218,5 @@ export default function CommentsFeedObject(inProps) {
     /**
      * Renders root object
      */
-    return (_jsxs(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, rest, { ref: commentsContainerRef, children: [renderTitle(), commentsRendered] })));
+    return (_jsxs(Root, Object.assign({ id: id, className: classNames(classes.root, className) }, rest, { ref: commentsContainerRef }, { children: [renderTitle(), commentsRendered] })));
 }

package/lib/esm/components/CommentsObject/CommentsObject.js CHANGED Viewed

@@ -125,20 +125,20 @@ export default function CommentsObject(inProps) {
      * Render button load previous comments
      */
     function renderLoadPreviousComments() {
-        return (_jsxs(Box, { className: classes.pagination, children: [isLoadingPrevious && _jsx(CommentObjectSkeleton, Object.assign({}, CommentObjectSkeletonProps, { count: 1 })), !isLoadingPrevious && (_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ variant: "text" }, (inPlaceLoadMoreContents
+        return (_jsxs(Box, Object.assign({ className: classes.pagination }, { children: [isLoadingPrevious && _jsx(CommentObjectSkeleton, Object.assign({}, CommentObjectSkeletonProps, { count: 1 })), !isLoadingPrevious && (_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ variant: "text" }, (inPlaceLoadMoreContents
                             ? { onClick: handlePrevious }
                             : {
                                 component: Link,
                                 to: `${scRoutingContext.url(getContributionRouteName(feedObject), getRouteData(feedObject))}`
-                            }), { disabled: isLoadingPrevious, color: "inherit", classes: { root: classes.loadPreviousCommentsButton }, children: _jsx(FormattedMessage, { id: "ui.commentsObject.loadPreviousComments", defaultMessage: "ui.commentsObject.loadPreviousComments" }) })), !disablePaginationLinks && previousPage && previous && (_jsx(Link, Object.assign({ to: `${appendURLSearchParams(scRoutingContext.url(getContributionRouteName(feedObject), getRouteData(feedObject)), [
+                            }), { disabled: isLoadingPrevious, color: "inherit", classes: { root: classes.loadPreviousCommentsButton } }, { children: _jsx(FormattedMessage, { id: "ui.commentsObject.loadPreviousComments", defaultMessage: "ui.commentsObject.loadPreviousComments" }) })), !disablePaginationLinks && previousPage && previous && (_jsx(Link, Object.assign({ to: `${appendURLSearchParams(scRoutingContext.url(getContributionRouteName(feedObject), getRouteData(feedObject)), [
                                 { [paginationLinksPageQueryParam]: previousPage }
-                            ])}`, className: classNames({ [classes.paginationLink]: hidePaginationLinks }) }, PaginationLinkProps, { children: _jsx(FormattedMessage, { id: "ui.commentsObject.previousComments", defaultMessage: "ui.commentsObject.previousComments" }) })))] }))] }));
+                            ])}`, className: classNames({ [classes.paginationLink]: hidePaginationLinks }) }, PaginationLinkProps, { children: _jsx(FormattedMessage, { id: "ui.commentsObject.previousComments", defaultMessage: "ui.commentsObject.previousComments" }) })))] }))] })));
     }
     /**
      * Footer with n comments of, only for load more pagination mode
      */
     function renderLoadNextComments() {
-        return (_jsx(Box, { className: classes.pagination, children: isLoadingNext ? (_jsx(CommentObjectSkeleton, Object.assign({}, CommentObjectSkeletonProps, { count: 1 }))) : (_jsxs(_Fragment, { children: [_jsx(InView, { as: "div", onChange: handleScrollEnd, threshold: 0.5, children: _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2, children: [_jsx(Button, Object.assign({ variant: "text" }, (inPlaceLoadMoreContents
+        return (_jsx(Box, Object.assign({ className: classes.pagination }, { children: isLoadingNext ? (_jsx(CommentObjectSkeleton, Object.assign({}, CommentObjectSkeletonProps, { count: 1 }))) : (_jsxs(_Fragment, { children: [_jsx(InView, Object.assign({ as: "div", onChange: handleScrollEnd, threshold: 0.5 }, { children: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(Button, Object.assign({ variant: "text" }, (inPlaceLoadMoreContents
                                     ? { onClick: handleNext }
                                     : {
                                         component: Link,
@@ -147,9 +147,9 @@ export default function CommentsObject(inProps) {
                                                 { [paginationLinksPageQueryParam]: nextPage }
                                             ])}`
                                             : `${scRoutingContext.url(getContributionRouteName(feedObject), getRouteData(feedObject))}`
-                                    }), { disabled: isLoadingNext, color: "inherit", classes: { root: classes.loadNextCommentsButton }, children: _jsx(FormattedMessage, { id: "ui.commentsObject.loadMoreComments", defaultMessage: "ui.commentsObject.loadMoreComments" }) })), showCommentsCounter() && (_jsx(Typography, { variant: "body1", classes: { root: classes.commentsCounter }, children: _jsx(FormattedMessage, { id: "ui.commentsObject.numberOfComments", defaultMessage: "ui.commentsObject.numberOfComments", values: { loaded: totalLoadedComments, total: totalComments } }) }))] }) }), !disablePaginationLinks && nextPage && next && (_jsx(Link, Object.assign({ to: `${appendURLSearchParams(scRoutingContext.url(getContributionRouteName(feedObject), getRouteData(feedObject)), [
+                                    }), { disabled: isLoadingNext, color: "inherit", classes: { root: classes.loadNextCommentsButton } }, { children: _jsx(FormattedMessage, { id: "ui.commentsObject.loadMoreComments", defaultMessage: "ui.commentsObject.loadMoreComments" }) })), showCommentsCounter() && (_jsx(Typography, Object.assign({ variant: "body1", classes: { root: classes.commentsCounter } }, { children: _jsx(FormattedMessage, { id: "ui.commentsObject.numberOfComments", defaultMessage: "ui.commentsObject.numberOfComments", values: { loaded: totalLoadedComments, total: totalComments } }) })))] })) })), !disablePaginationLinks && nextPage && next && (_jsx(Link, Object.assign({ to: `${appendURLSearchParams(scRoutingContext.url(getContributionRouteName(feedObject), getRouteData(feedObject)), [
                             { [paginationLinksPageQueryParam]: nextPage }
-                        ])}`, className: classNames({ [classes.paginationLink]: hidePaginationLinks }) }, PaginationLinkProps, { children: _jsx(FormattedMessage, { id: "ui.commentsObject.nextComments", defaultMessage: "ui.commentsObject.nextComments" }) })))] })) }));
+                        ])}`, className: classNames({ [classes.paginationLink]: hidePaginationLinks }) }, PaginationLinkProps, { children: _jsx(FormattedMessage, { id: "ui.commentsObject.nextComments", defaultMessage: "ui.commentsObject.nextComments" }) })))] })) })));
     }
     /**
      * Remove duplicate comments (from header or footer)