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

package/lib/esm/components/IncubatorListWidget/IncubatorListWidget.js

@@ -220,9 +220,9 @@ export default function IncubatorListWidget(inProps) {
     if (!state.initialized) {
         return _jsx(Skeleton, {});
     }
-    const content = (_jsxs(CardContent, { children: [_jsxs(Box, { className: classes.header, children: [_jsx(Typography, { className: classes.title, variant: 'h5', children: _jsx(FormattedMessage, { id: "ui.incubatorListWidget.title", defaultMessage: "ui.incubatorListWidget.title" }) }), _jsx(IconButton, { className: classes.helpPopover, color: "primary", "aria-label": "info", component: "span", onClick: handleClickHelpButton, children: _jsx(Icon, { children: "help_outline" }) }), isOpen && (_jsx(Popover, { open: isOpen, anchorEl: anchorEl, onClose: handlePopoverClose, anchorOrigin: {
+    const content = (_jsxs(CardContent, { children: [_jsxs(Box, Object.assign({ className: classes.header }, { children: [_jsx(Typography, Object.assign({ className: classes.title, variant: 'h5' }, { children: _jsx(FormattedMessage, { id: "ui.incubatorListWidget.title", defaultMessage: "ui.incubatorListWidget.title" }) })), _jsx(IconButton, Object.assign({ className: classes.helpPopover, color: "primary", "aria-label": "info", component: "span", onClick: handleClickHelpButton }, { children: _jsx(Icon, { children: "help_outline" }) })), isOpen && (_jsx(Popover, Object.assign({ open: isOpen, anchorEl: anchorEl, onClose: handlePopoverClose, anchorOrigin: {
                             vertical: 'bottom',
                             horizontal: 'right'
-                        }, children: _jsx(Box, { sx: { p: '10px' }, children: _jsx(Typography, { component: 'span', sx: { whiteSpace: 'pre-line' }, children: _jsx(FormattedMessage, { id: "ui.incubatorListWidget.popover", defaultMessage: "ui.incubatorListWidget.popover" }) }) }) }))] }), !state.count ? (_jsx(Typography, { className: classes.noResults, variant: "body2", children: _jsx(FormattedMessage, { id: "ui.incubatorListWidget.noResults", defaultMessage: "ui.incubatorListWidget.noResults" }) })) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((incubator) => (_jsx(ListItem, { children: _jsx(Incubator, Object.assign({ elevation: 0, incubator: incubator, subscribeButtonProps: { onSubscribe: handleSubscriptionsUpdate }, ButtonProps: { onClick: () => handleIncubatorDetailDialogOpening(incubator) } }, IncubatorProps)) }, incubator.id))) }), _jsxs(Box, { className: classes.actions, children: [state.count > state.visibleItems && (_jsx(Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: _jsx(FormattedMessage, { id: "ui.incubatorListWidget.ShowAll", defaultMessage: "ui.incubatorListWidget.ShowAll" }) })), _jsx(Button, { size: "small", onClick: () => setOpenCreateIncubatorDialog(true), children: _jsx(FormattedMessage, { id: "ui.incubatorListWidget.SuggestNewTopic", defaultMessage: "ui.incubatorListWidget.SuggestNewTopic" }) })] })] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { id: "ui.incubatorListWidget.title", defaultMessage: "ui.incubatorListWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: _jsx(InfiniteScroll, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: _jsx(IncubatorSkeleton, Object.assign({ elevation: 0 }, IncubatorProps)), height: isMobile ? '100vh' : 400, endMessage: _jsx(Typography, { className: classes.endMessage, children: _jsx(FormattedMessage, { id: "ui.incubatorListWidget.noMoreIncubators", defaultMessage: "ui.incubatorListWidget.noMoreIncubators" }) }), children: _jsx(List, { children: state.results.map((incubator) => (_jsx(ListItem, { children: _jsx(Incubator, Object.assign({ elevation: 0, incubator: incubator, subscribeButtonProps: { onSubscribe: handleSubscriptionsUpdate }, ButtonProps: { onClick: () => handleIncubatorDetailDialogOpening(incubator) } }, IncubatorProps)) }, incubator.id))) }) }) }))), openCreateIncubatorDialog && (_jsx(CreateIncubatorDialog, { className: classes.createDialog, open: openCreateIncubatorDialog, onClose: handleCreateIncubatorDialogClose })), openIncubatorDetailDialog && (_jsx(IncubatorDetail, { open: openIncubatorDetailDialog, onClose: handleIncubatorDetailDialogClose, incubator: detailObj, onSubscriptionsUpdate: handleSubscriptionsUpdate }))] }));
+                        } }, { children: _jsx(Box, Object.assign({ sx: { p: '10px' } }, { children: _jsx(Typography, Object.assign({ component: 'span', sx: { whiteSpace: 'pre-line' } }, { children: _jsx(FormattedMessage, { id: "ui.incubatorListWidget.popover", defaultMessage: "ui.incubatorListWidget.popover" }) })) })) })))] })), !state.count ? (_jsx(Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.incubatorListWidget.noResults", defaultMessage: "ui.incubatorListWidget.noResults" }) }))) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((incubator) => (_jsx(ListItem, { children: _jsx(Incubator, Object.assign({ elevation: 0, incubator: incubator, subscribeButtonProps: { onSubscribe: handleSubscriptionsUpdate }, ButtonProps: { onClick: () => handleIncubatorDetailDialogOpening(incubator) } }, IncubatorProps)) }, incubator.id))) }), _jsxs(Box, Object.assign({ className: classes.actions }, { children: [state.count > state.visibleItems && (_jsx(Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: _jsx(FormattedMessage, { id: "ui.incubatorListWidget.ShowAll", defaultMessage: "ui.incubatorListWidget.ShowAll" }) }))), _jsx(Button, Object.assign({ size: "small", onClick: () => setOpenCreateIncubatorDialog(true) }, { children: _jsx(FormattedMessage, { id: "ui.incubatorListWidget.SuggestNewTopic", defaultMessage: "ui.incubatorListWidget.SuggestNewTopic" }) }))] }))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { id: "ui.incubatorListWidget.title", defaultMessage: "ui.incubatorListWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: _jsx(InfiniteScroll, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: _jsx(IncubatorSkeleton, Object.assign({ elevation: 0 }, IncubatorProps)), height: isMobile ? '100vh' : 400, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.incubatorListWidget.noMoreIncubators", defaultMessage: "ui.incubatorListWidget.noMoreIncubators" }) })) }, { children: _jsx(List, { children: state.results.map((incubator) => (_jsx(ListItem, { children: _jsx(Incubator, Object.assign({ elevation: 0, incubator: incubator, subscribeButtonProps: { onSubscribe: handleSubscriptionsUpdate }, ButtonProps: { onClick: () => handleIncubatorDetailDialogOpening(incubator) } }, IncubatorProps)) }, incubator.id))) }) })) }))), openCreateIncubatorDialog && (_jsx(CreateIncubatorDialog, { className: classes.createDialog, open: openCreateIncubatorDialog, onClose: handleCreateIncubatorDialogClose })), openIncubatorDetailDialog && (_jsx(IncubatorDetail, { open: openIncubatorDetailDialog, onClose: handleIncubatorDetailDialogClose, incubator: detailObj, onSubscriptionsUpdate: handleSubscriptionsUpdate }))] }));
     return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: content })));
 }

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

@@ -35,5 +35,5 @@ const Root = styled(Widget, {
  *
  */
 export default function IncubatorListWidgetSkeleton(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(IncubatorSkeleton, { 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(IncubatorSkeleton, { elevation: 0 }, index))) })) }) })));
 }

package/lib/esm/components/IncubatorSuggestionWidget/IncubatorSuggestionWidget.js

@@ -187,6 +187,6 @@ export default function IncubatorSuggestionWidget(inProps) {
     if (!state.initialized) {
         return _jsx(Skeleton, {});
     }
-    const content = (_jsxs(CardContent, { children: [_jsx(Typography, { className: classes.title, variant: 'h5', children: _jsx(FormattedMessage, { id: "ui.incubatorSuggestionWidget.title", defaultMessage: "ui.incubatorSuggestionWidget.title" }) }), !state.count ? (_jsx(Typography, { className: classes.noResults, variant: "body2", children: _jsx(FormattedMessage, { id: "ui.incubatorSuggestionWidget.noResults", defaultMessage: "ui.incubatorSuggestionWidget.noResults" }) })) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((incubator) => (_jsx(ListItem, { children: _jsx(Incubator, Object.assign({ elevation: 0, incubator: incubator, subscribeButtonProps: { onSubscribe: handleSubscriptionsUpdate }, ButtonProps: { onClick: () => handleIncubatorDetailDialogOpening(incubator) } }, IncubatorProps)) }, incubator.id))) }), state.count > state.visibleItems && (_jsx(Button, { className: classes.showMore, onClick: handleToggleDialogOpen, children: _jsx(FormattedMessage, { id: "ui.incubatorSuggestionWidget.ShowAll", defaultMessage: "ui.incubatorSuggestionWidget.ShowAll" }) }))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { id: "ui.incubatorSuggestionWidget.title", defaultMessage: "ui.incubatorSuggestionWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: _jsx(InfiniteScroll, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: _jsx(IncubatorSkeleton, Object.assign({ elevation: 0 }, IncubatorProps)), height: isMobile ? '100vh' : 400, endMessage: _jsx(Typography, { className: classes.endMessage, children: _jsx(FormattedMessage, { id: "ui.incubatorSuggestionWidget.noMoreIncubators", defaultMessage: "ui.incubatorSuggestionWidget.noMoreIncubators" }) }), children: _jsx(List, { children: state.results.map((incubator) => (_jsx(ListItem, { children: _jsx(Incubator, Object.assign({ elevation: 0, incubator: incubator, subscribeButtonProps: { onSubscribe: handleSubscriptionsUpdate }, ButtonProps: { onClick: () => handleIncubatorDetailDialogOpening(incubator) } }, IncubatorProps)) }, incubator.id))) }) }) }))), openIncubatorDetailDialog && (_jsx(IncubatorDetail, { open: openIncubatorDetailDialog, onClose: handleIncubatorDetailDialogClose, incubator: detailObj, onSubscriptionsUpdate: handleSubscriptionsUpdate }))] }));
+    const content = (_jsxs(CardContent, { children: [_jsx(Typography, Object.assign({ className: classes.title, variant: 'h5' }, { children: _jsx(FormattedMessage, { id: "ui.incubatorSuggestionWidget.title", defaultMessage: "ui.incubatorSuggestionWidget.title" }) })), !state.count ? (_jsx(Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.incubatorSuggestionWidget.noResults", defaultMessage: "ui.incubatorSuggestionWidget.noResults" }) }))) : (_jsxs(React.Fragment, { children: [_jsx(List, { children: state.results.slice(0, state.visibleItems).map((incubator) => (_jsx(ListItem, { children: _jsx(Incubator, Object.assign({ elevation: 0, incubator: incubator, subscribeButtonProps: { onSubscribe: handleSubscriptionsUpdate }, ButtonProps: { onClick: () => handleIncubatorDetailDialogOpening(incubator) } }, IncubatorProps)) }, incubator.id))) }), state.count > state.visibleItems && (_jsx(Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: _jsx(FormattedMessage, { id: "ui.incubatorSuggestionWidget.ShowAll", defaultMessage: "ui.incubatorSuggestionWidget.ShowAll" }) })))] })), openDialog && (_jsx(DialogRoot, Object.assign({ className: classes.dialogRoot, title: _jsx(FormattedMessage, { id: "ui.incubatorSuggestionWidget.title", defaultMessage: "ui.incubatorSuggestionWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: _jsx(InfiniteScroll, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: _jsx(IncubatorSkeleton, Object.assign({ elevation: 0 }, IncubatorProps)), height: isMobile ? '100vh' : 400, endMessage: _jsx(Typography, Object.assign({ className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.incubatorSuggestionWidget.noMoreIncubators", defaultMessage: "ui.incubatorSuggestionWidget.noMoreIncubators" }) })) }, { children: _jsx(List, { children: state.results.map((incubator) => (_jsx(ListItem, { children: _jsx(Incubator, Object.assign({ elevation: 0, incubator: incubator, subscribeButtonProps: { onSubscribe: handleSubscriptionsUpdate }, ButtonProps: { onClick: () => handleIncubatorDetailDialogOpening(incubator) } }, IncubatorProps)) }, incubator.id))) }) })) }))), openIncubatorDetailDialog && (_jsx(IncubatorDetail, { open: openIncubatorDetailDialog, onClose: handleIncubatorDetailDialogClose, incubator: detailObj, onSubscriptionsUpdate: handleSubscriptionsUpdate }))] }));
     return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: content })));
 }

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

@@ -35,5 +35,5 @@ const Root = styled(Widget, {
  *
  */
 export default function IncubatorSuggestionWidgetSkeleton(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(IncubatorSkeleton, { 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(IncubatorSkeleton, { elevation: 0 }, index))) })) }) })));
 }

package/lib/esm/components/InlineComposerWidget/InlineComposerWidget.js

@@ -101,5 +101,5 @@ export default function InlineComposerWidget(inProps) {
     if (!UserUtils.isStaff(scUserContext.user) && onlyStaffEnabled) {
         return _jsx(HiddenPlaceholder, {});
     }
-    return (_jsxs(React.Fragment, { children: [_jsx(Root, Object.assign({ className: classes.root }, rest, { children: _jsxs(CardContent, { className: classes.content, children: [_jsx(Box, { className: classes.input, children: _jsx(Button, { variant: "text", disableFocusRipple: true, disableRipple: true, disableElevation: true, onClick: handleOpen, fullWidth: true, color: "inherit", children: label !== null && label !== void 0 ? label : _jsx(FormattedMessage, { id: "ui.inlineComposerWidget.label", defaultMessage: "ui.inlineComposerWidget.label" }) }) }), _jsx(Box, { className: classes.avatar, children: !scUserContext.user ? (_jsx(Avatar, { variant: "circular" })) : (_jsx(Link, { to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scUserContext.user), children: _jsx(Avatar, { alt: scUserContext.user.username, variant: "circular", src: scUserContext.user.avatar }) })) })] }) })), _jsx(Composer, { open: open, mediaObjectTypes: mediaObjectTypes, defaultValue: defaultValue, fullWidth: true, onClose: handleClose, onSuccess: handleSuccess, feedType: feedType })] }));
+    return (_jsxs(React.Fragment, { children: [_jsx(Root, Object.assign({ className: classes.root }, rest, { children: _jsxs(CardContent, Object.assign({ className: classes.content }, { children: [_jsx(Box, Object.assign({ className: classes.input }, { children: _jsx(Button, Object.assign({ variant: "text", disableFocusRipple: true, disableRipple: true, disableElevation: true, onClick: handleOpen, fullWidth: true, color: "inherit" }, { children: label !== null && label !== void 0 ? label : _jsx(FormattedMessage, { id: "ui.inlineComposerWidget.label", defaultMessage: "ui.inlineComposerWidget.label" }) })) })), _jsx(Box, Object.assign({ className: classes.avatar }, { children: !scUserContext.user ? (_jsx(Avatar, { variant: "circular" })) : (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scUserContext.user) }, { children: _jsx(Avatar, { alt: scUserContext.user.username, variant: "circular", src: scUserContext.user.avatar }) }))) }))] })) })), _jsx(Composer, { open: open, mediaObjectTypes: mediaObjectTypes, defaultValue: defaultValue, fullWidth: true, onClose: handleClose, onSuccess: handleSuccess, feedType: feedType })] }));
 }

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

@@ -38,5 +38,5 @@ const Root = styled(Widget, {
  *
  */
 export default function InlineComposerWidgetSkeleton() {
-    return (_jsx(Root, { className: classes.root, children: _jsxs(CardContent, { className: classes.content, children: [_jsx(Box, { className: classes.input, children: _jsx(Skeleton, { animation: "wave", variant: "text" }) }), _jsx(Box, { className: classes.avatar, children: _jsx(Skeleton, { className: classes.avatar, animation: "wave", variant: "circular" }) })] }) }));
+    return (_jsx(Root, Object.assign({ className: classes.root }, { children: _jsxs(CardContent, Object.assign({ className: classes.content }, { children: [_jsx(Box, Object.assign({ className: classes.input }, { children: _jsx(Skeleton, { animation: "wave", variant: "text" }) })), _jsx(Box, Object.assign({ className: classes.avatar }, { children: _jsx(Skeleton, { className: classes.avatar, animation: "wave", variant: "circular" }) }))] })) })));
 }

package/lib/esm/components/LiveStreamForm/LiveStreamForm.js

@@ -140,14 +140,14 @@ export default function LiveStreamForm(inProps) {
     /**
      * Renders root object
      */
-    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsxs(FormGroup, { className: classes.form, children: [_jsx(TextField, { required: true, className: classes.title, placeholder: `${intl.formatMessage(messages.title)}`, margin: "normal", value: field.title, name: "title", onChange: handleChange, InputProps: {
-                        endAdornment: _jsx(Typography, { variant: "body2", children: LIVE_STREAM_TITLE_MAX_LENGTH - field.title.length })
+    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsxs(FormGroup, Object.assign({ className: classes.form }, { children: [_jsx(TextField, { required: true, className: classes.title, placeholder: `${intl.formatMessage(messages.title)}`, margin: "normal", value: field.title, name: "title", onChange: handleChange, InputProps: {
+                        endAdornment: _jsx(Typography, Object.assign({ variant: "body2" }, { children: LIVE_STREAM_TITLE_MAX_LENGTH - field.title.length }))
                     }, error: Boolean(field.title.length > LIVE_STREAM_TITLE_MAX_LENGTH) || Boolean(error['titleError']), helperText: field.title.length > LIVE_STREAM_TITLE_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.liveStreamForm.title.error.maxLength", defaultMessage: "ui.liveStreamForm.title.error.maxLength" })) : error['titleError'] ? (error['titleError']) : null }), _jsx(TextField, { required: true, className: classes.slug, placeholder: `${intl.formatMessage(messages.slug)}`, margin: "normal", value: field.slug, name: "slug", onChange: handleChange, InputProps: {
-                        endAdornment: _jsx(Typography, { variant: "body2", children: LIVE_STREAM_SLUG_MAX_LENGTH - field.title.length })
+                        endAdornment: _jsx(Typography, Object.assign({ variant: "body2" }, { children: LIVE_STREAM_SLUG_MAX_LENGTH - field.title.length }))
                     }, error: Boolean(field.slug.length > LIVE_STREAM_SLUG_MAX_LENGTH) || Boolean(error['nameError']), helperText: field.title.length > LIVE_STREAM_SLUG_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.liveStreamForm.slug.error.maxLength", defaultMessage: "ui.liveStreamForm.slug.error.maxLength" })) : error['nameError'] ? (error['nameError']) : null }), _jsx(TextField, { multiline: true, rows: 4, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
-                        endAdornment: (_jsx(Typography, { variant: "body2", children: ((_a = field.description) === null || _a === void 0 ? void 0 : _a.length) ? LIVE_STREAM_DESCRIPTION_MAX_LENGTH - field.description.length : LIVE_STREAM_DESCRIPTION_MAX_LENGTH }))
-                    }, error: Boolean(((_b = field.description) === null || _b === void 0 ? void 0 : _b.length) > LIVE_STREAM_DESCRIPTION_MAX_LENGTH), helperText: ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) > LIVE_STREAM_DESCRIPTION_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.liveStreamForm.description.error.maxLength", defaultMessage: "ui.liveStreamForm.description.error.maxLength" })) : null }), _jsx(Box, { className: classes.actions, children: _jsx(LoadingButton, { loading: field.isSubmitting, disabled: !field.title ||
+                        endAdornment: (_jsx(Typography, Object.assign({ variant: "body2" }, { children: ((_a = field.description) === null || _a === void 0 ? void 0 : _a.length) ? LIVE_STREAM_DESCRIPTION_MAX_LENGTH - field.description.length : LIVE_STREAM_DESCRIPTION_MAX_LENGTH })))
+                    }, error: Boolean(((_b = field.description) === null || _b === void 0 ? void 0 : _b.length) > LIVE_STREAM_DESCRIPTION_MAX_LENGTH), helperText: ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) > LIVE_STREAM_DESCRIPTION_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.liveStreamForm.description.error.maxLength", defaultMessage: "ui.liveStreamForm.description.error.maxLength" })) : null }), _jsx(Box, Object.assign({ className: classes.actions }, { children: _jsx(LoadingButton, Object.assign({ loading: field.isSubmitting, disabled: !field.title ||
                             Object.keys(error).length !== 0 ||
                             field.title.length > LIVE_STREAM_TITLE_MAX_LENGTH ||
-                            field.description.length > LIVE_STREAM_DESCRIPTION_MAX_LENGTH, variant: "contained", onClick: handleSubmit, color: "secondary", children: liveStream ? (_jsx(FormattedMessage, { id: "ui.liveStreamForm.button.edit", defaultMessage: "ui.liveStreamForm.button.edit" })) : (_jsx(FormattedMessage, { id: "ui.liveStreamForm.button.create", defaultMessage: "ui.liveStreamForm.button.create" })) }) })] }) })));
+                            field.description.length > LIVE_STREAM_DESCRIPTION_MAX_LENGTH, variant: "contained", onClick: handleSubmit, color: "secondary" }, { children: liveStream ? (_jsx(FormattedMessage, { id: "ui.liveStreamForm.button.edit", defaultMessage: "ui.liveStreamForm.button.edit" })) : (_jsx(FormattedMessage, { id: "ui.liveStreamForm.button.create", defaultMessage: "ui.liveStreamForm.button.create" })) })) }))] })) })));
 }

package/lib/esm/components/LiveStreamRoom/LiveStreamRoom.js

@@ -116,5 +116,5 @@ export default function LiveStreamRoom(inProps) {
     /**
      * Renders root object
      */
-    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsxs(Box, { className: classes.content, "data-lk-theme": "default", children: [_jsx(Box, { className: classes.title, children: liveStream === null || liveStream === void 0 ? void 0 : liveStream.title }), _jsx(Box, { className: classes.description, children: liveStream === null || liveStream === void 0 ? void 0 : liveStream.description }), connectionDetails === undefined || preJoinChoices === undefined ? (_jsx(Box, { className: classes.preJoin, children: _jsx(PreJoin, { persistUserChoices: true, defaults: preJoinDefaults, onSubmit: handlePreJoinSubmit, onError: handlePreJoinError }) })) : (_jsx(LiveStreamVideoConference, { connectionDetails: connectionDetails, userChoices: preJoinChoices, options: { codec: props.codec, hq: props.hq } }))] }) })));
+    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsxs(Box, Object.assign({ className: classes.content, "data-lk-theme": "default" }, { children: [_jsx(Box, Object.assign({ className: classes.title }, { children: liveStream === null || liveStream === void 0 ? void 0 : liveStream.title })), _jsx(Box, Object.assign({ className: classes.description }, { children: liveStream === null || liveStream === void 0 ? void 0 : liveStream.description })), connectionDetails === undefined || preJoinChoices === undefined ? (_jsx(Box, Object.assign({ className: classes.preJoin }, { children: _jsx(PreJoin, { persistUserChoices: true, defaults: preJoinDefaults, onSubmit: handlePreJoinSubmit, onError: handlePreJoinError }) }))) : (_jsx(LiveStreamVideoConference, { connectionDetails: connectionDetails, userChoices: preJoinChoices, options: { codec: props.codec, hq: props.hq } }))] })) })));
 }

package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamVideoConference.js

@@ -1,5 +1,7 @@
 import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-nocheck
 import { Box, CircularProgress } from '@mui/material';
 import { styled } from '@mui/material/styles';
 import { useThemeProps } from '@mui/system';
@@ -177,5 +179,5 @@ export default function LiveStreamVideoConference(inProps) {
     /**
      * Renders root object
      */
-    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: room && liveActive && !error ? (_jsxs(LiveKitRoom, Object.assign({ connect: Boolean(e2eeSetupComplete && liveActive && room), room: room, token: connectionDetails['participantToken'], serverUrl: connectionDetails['serverUrl'], connectOptions: connectOptions, video: userChoices.videoEnabled, audio: userChoices.audioEnabled, onDisconnected: handleOnLeave, onEncryptionError: handleEncryptionError, onError: handleError }, LiveKitRoomComponentsProps, { children: [_jsx(VideoConference, { chatMessageFormatter: formatChatMessageLinks }), _jsx(RecordingIndicator, {}), _jsx(ConnectionState, {})] }))) : (_jsx(_Fragment, { children: error ? error : liveActive === false ? _jsx(_Fragment, { children: "Grazie!" }) : _jsx(CircularProgress, {}) })) })));
+    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: room && liveActive && !error ? (_jsx(_Fragment, { children: _jsxs(LiveKitRoom, Object.assign({ connect: Boolean(e2eeSetupComplete && liveActive && room), room: room, token: connectionDetails['participantToken'], serverUrl: connectionDetails['serverUrl'], connectOptions: connectOptions, video: userChoices.videoEnabled, audio: userChoices.audioEnabled, onDisconnected: handleOnLeave, onEncryptionError: handleEncryptionError, onError: handleError }, LiveKitRoomComponentsProps, { children: [_jsx(VideoConference, { chatMessageFormatter: formatChatMessageLinks }), _jsx(RecordingIndicator, {}), _jsx(ConnectionState, {})] })) })) : (_jsx(_Fragment, { children: error ? error : liveActive === false ? _jsx(_Fragment, { children: "Grazie!" }) : _jsx(CircularProgress, {}) })) })));
 }

package/lib/esm/components/LocationAutocomplete/LocationAutocomplete.js

@@ -107,6 +107,6 @@ export default function LocationAutocomplete(inProps) {
         }, renderOption: (props, option, { inputValue }) => {
             const matches = match(option.full_address, inputValue);
             const parts = parse(option.full_address, matches);
-            return (_jsx("li", Object.assign({}, props, { style: { whiteSpace: 'break-spaces' }, children: parts.map((part, index) => part.highlight ? (_jsx("span", { style: { fontWeight: 700 }, children: part.text }, index)) : (part.text)) }), `${option.lat}_${option.lng}`));
+            return (_jsx("li", Object.assign({}, props, { style: { whiteSpace: 'break-spaces' } }, { children: parts.map((part, index) => part.highlight ? (_jsx("span", Object.assign({ style: { fontWeight: 700 } }, { children: part.text }), index)) : (part.text)) }), `${option.lat}_${option.lng}`));
         } }, rest)));
 }

package/lib/esm/components/LoyaltyProgramWidget/LoyaltyProgramWidget.js

@@ -111,5 +111,5 @@ export default function LoyaltyProgramWidget(inProps) {
     if (loading) {
         return _jsx(Skeleton, {});
     }
-    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsx(CardContent, { children: _jsx(Typography, { className: classes.title, children: _jsx(FormattedMessage, { id: "ui.loyaltyProgramWidget.title", defaultMessage: "ui.loyaltyProgramWidget.title" }) }) }), _jsxs(CardActions, { className: classes.actions, children: [_jsxs(Typography, { className: classes.points, children: [_jsx(Chip, { size: 'medium', component: "span", label: points }), _jsx(FormattedMessage, { id: "ui.loyaltyProgramWidget.points", defaultMessage: "ui.loyaltyProgramWidget.points" })] }), _jsx(Button, { size: "small", variant: "outlined", className: classes.discoverMore, component: Link, to: scRoutingContext.url(SCRoutes.LOYALTY_ROUTE_NAME, {}), children: _jsx(FormattedMessage, { id: "ui.loyaltyProgramWidget.discover", defaultMessage: "ui.loyaltyProgramWidget.discover" }) })] })] })));
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsx(CardContent, { children: _jsx(Typography, Object.assign({ className: classes.title }, { children: _jsx(FormattedMessage, { id: "ui.loyaltyProgramWidget.title", defaultMessage: "ui.loyaltyProgramWidget.title" }) })) }), _jsxs(CardActions, Object.assign({ className: classes.actions }, { children: [_jsxs(Typography, Object.assign({ className: classes.points }, { children: [_jsx(Chip, { size: 'medium', component: "span", label: points }), _jsx(FormattedMessage, { id: "ui.loyaltyProgramWidget.points", defaultMessage: "ui.loyaltyProgramWidget.points" })] })), _jsx(Button, Object.assign({ size: "small", variant: "outlined", className: classes.discoverMore, component: Link, to: scRoutingContext.url(SCRoutes.LOYALTY_ROUTE_NAME, {}) }, { children: _jsx(FormattedMessage, { id: "ui.loyaltyProgramWidget.discover", defaultMessage: "ui.loyaltyProgramWidget.discover" }) }))] }))] })));
 }

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

@@ -41,5 +41,5 @@ const Root = styled(Widget, {
  *
  */
 export default function LoyaltyProgramWidgetSkeleton() {
-    return (_jsxs(Root, { className: classes.root, children: [_jsx(CardContent, { className: classes.content, children: _jsx(Typography, { className: classes.title, children: _jsx(Skeleton, { animation: "wave", height: 25, width: "40%", variant: "rectangular" }) }) }), _jsxs(CardActions, { className: classes.actions, children: [_jsxs(Typography, { className: classes.points, children: [_jsx(Skeleton, { animation: "wave", variant: "circular", width: 60, height: 30, className: classes.chip }), _jsx(Skeleton, { animation: "wave", height: 20, width: 90, variant: "rectangular" })] }), _jsx(Button, { disabled: true, variant: 'outlined', size: 'small', children: _jsx(Skeleton, { animation: "wave", height: 20, width: 70, variant: "text" }) })] })] }));
+    return (_jsxs(Root, Object.assign({ className: classes.root }, { children: [_jsx(CardContent, Object.assign({ className: classes.content }, { children: _jsx(Typography, Object.assign({ className: classes.title }, { children: _jsx(Skeleton, { animation: "wave", height: 25, width: "40%", variant: "rectangular" }) })) })), _jsxs(CardActions, Object.assign({ className: classes.actions }, { children: [_jsxs(Typography, Object.assign({ className: classes.points }, { children: [_jsx(Skeleton, { animation: "wave", variant: "circular", width: 60, height: 30, className: classes.chip }), _jsx(Skeleton, { animation: "wave", height: 20, width: 90, variant: "rectangular" })] })), _jsx(Button, Object.assign({ disabled: true, variant: 'outlined', size: 'small' }, { children: _jsx(Skeleton, { animation: "wave", height: 20, width: 70, variant: "text" }) }))] }))] })));
 }

package/lib/esm/components/MyEventsWidget/MyEventsWidget.js

@@ -157,5 +157,5 @@ export default function MyEventsWidget(inProps) {
     if (!state.initialized || state.isLoadingNext) {
         return _jsx(Skeleton, {});
     }
-    return (_jsxs(Root, Object.assign({ className: classes.root }, rest, { children: [_jsx(Box, { className: classes.titleWrapper, children: _jsx(Typography, { variant: "h5", children: _jsx(FormattedMessage, { id: "ui.myEventsWidget.title", defaultMessage: "ui.myEventsWidget.title" }) }) }), _jsx(Event, { event: state.results[eventIndex], template: SCEventTemplateType.DETAIL, actions: _jsx(_Fragment, {}), elevation: 0, square: true }), _jsxs(CardActions, { className: classes.actions, children: [_jsx(IconButton, { size: "small", disabled: eventIndex === 0, className: classes.arrows, onClick: handlePrev, children: _jsx(Icon, { children: "chevron_left" }) }), _jsx(Button, { href: scRoutingContext.url(SCRoutes.EVENTS_ROUTE_NAME, {}), className: classes.actionButton, children: _jsx(Typography, { variant: "caption", children: _jsx(FormattedMessage, { id: "ui.myEventsWidget.showAll", defaultMessage: "ui.myEventsWidget.showAll" }) }) }), _jsx(IconButton, { size: "small", disabled: eventIndex === state.count - 1, className: classes.arrows, onClick: handleNext, children: _jsx(Icon, { children: "chevron_right" }) })] })] })));
+    return (_jsxs(Root, Object.assign({ className: classes.root }, rest, { children: [_jsx(Box, Object.assign({ className: classes.titleWrapper }, { children: _jsx(Typography, Object.assign({ variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.myEventsWidget.title", defaultMessage: "ui.myEventsWidget.title" }) })) })), _jsx(Event, { event: state.results[eventIndex], template: SCEventTemplateType.DETAIL, actions: _jsx(_Fragment, {}), elevation: 0, square: true }), _jsxs(CardActions, Object.assign({ className: classes.actions }, { children: [_jsx(IconButton, Object.assign({ size: "small", disabled: eventIndex === 0, className: classes.arrows, onClick: handlePrev }, { children: _jsx(Icon, { children: "chevron_left" }) })), _jsx(Button, Object.assign({ href: scRoutingContext.url(SCRoutes.EVENTS_ROUTE_NAME, {}), className: classes.actionButton }, { children: _jsx(Typography, Object.assign({ variant: "caption" }, { children: _jsx(FormattedMessage, { id: "ui.myEventsWidget.showAll", defaultMessage: "ui.myEventsWidget.showAll" }) })) })), _jsx(IconButton, Object.assign({ size: "small", disabled: eventIndex === state.count - 1, className: classes.arrows, onClick: handleNext }, { children: _jsx(Icon, { children: "chevron_right" }) }))] }))] })));
 }

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

@@ -20,5 +20,5 @@ const Root = styled(Widget, {
     overridesResolver: (_props, styles) => styles.skeletonRoot
 })(() => ({}));
 export default function MyEventsWidgetSkeleton() {
-    return (_jsxs(Root, { className: classes.root, children: [_jsx(Box, { padding: "12px 16px", children: _jsx(Skeleton, { animation: "wave", width: "141px", height: "33px" }) }), _jsx(EventSkeleton, { template: SCEventTemplateType.DETAIL, elevation: 0, square: true, actions: _jsx(_Fragment, {}) }), _jsxs(CardActions, { className: classes.actions, children: [_jsx(Skeleton, { animation: "wave", variant: "rounded", width: "14px", height: "14px" }), _jsx(Skeleton, { animation: "wave", width: "52px", height: "20px" }), _jsx(Skeleton, { animation: "wave", variant: "rounded", width: "14px", height: "14px" })] })] }));
+    return (_jsxs(Root, Object.assign({ className: classes.root }, { children: [_jsx(Box, Object.assign({ padding: "12px 16px" }, { children: _jsx(Skeleton, { animation: "wave", width: "141px", height: "33px" }) })), _jsx(EventSkeleton, { template: SCEventTemplateType.DETAIL, elevation: 0, square: true, actions: _jsx(_Fragment, {}) }), _jsxs(CardActions, Object.assign({ className: classes.actions }, { children: [_jsx(Skeleton, { animation: "wave", variant: "rounded", width: "14px", height: "14px" }), _jsx(Skeleton, { animation: "wave", width: "52px", height: "20px" }), _jsx(Skeleton, { animation: "wave", variant: "rounded", width: "14px", height: "14px" })] }))] })));
 }

package/lib/esm/components/NavigationMenuIconButton/DefaultDrawerContent.js

@@ -53,5 +53,5 @@ export default function DefaultDrawerContent(inProps) {
         onTouchMove: mouseLeave
     });
     //order
-    return (_jsxs(Root, Object.assign({ className: classNames(className, classes.root) }, rest, { children: [_jsxs(Typography, { variant: "subtitle1", children: [_jsx("span", { children: _jsx(FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.category.title", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.category.title" }) }), ' ', _jsx(Button, { variant: "text", component: Link, color: "secondary", to: scRoutingContext.url(SCRoutes.CATEGORIES_LIST_ROUTE_NAME, {}), children: _jsx(FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.category.seeAll", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.category.seeAll" }) })] }), _jsx(List, { children: categoriesOrdered.map((c, index) => (_jsx(Zoom, { in: true, style: { transform: isHovered[c.id] && 'scale(1.05)' }, children: _jsx(ListItem, { children: _jsx(Category, Object.assign({ ButtonBaseProps: { component: Link, to: scRoutingContext.url(SCRoutes.CATEGORY_ROUTE_NAME, c) }, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)))) }, c.id) }, index))) })] })));
+    return (_jsxs(Root, Object.assign({ className: classNames(className, classes.root) }, rest, { children: [_jsxs(Typography, Object.assign({ variant: "subtitle1" }, { children: [_jsx("span", { children: _jsx(FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.category.title", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.category.title" }) }), ' ', _jsx(Button, Object.assign({ variant: "text", component: Link, color: "secondary", to: scRoutingContext.url(SCRoutes.CATEGORIES_LIST_ROUTE_NAME, {}) }, { children: _jsx(FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.category.seeAll", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.category.seeAll" }) }))] })), _jsx(List, { children: categoriesOrdered.map((c, index) => (_jsx(Zoom, Object.assign({ in: true, style: { transform: isHovered[c.id] && 'scale(1.05)' } }, { children: _jsx(ListItem, { children: _jsx(Category, Object.assign({ ButtonBaseProps: { component: Link, to: scRoutingContext.url(SCRoutes.CATEGORY_ROUTE_NAME, c) }, elevation: 0, category: c, actions: null }, CategoryItemProps, getMouseEvents(() => handleMouseEnter(c.id), () => handleMouseLeave(c.id)))) }, c.id) }), index))) })] })));
 }

package/lib/esm/components/NavigationMenuIconButton/DefaultHeaderContent.js

@@ -27,5 +27,5 @@ export default function DefaultHeaderContent(inProps) {
     const _logo = useMemo(() => {
         return SCPreferences.LOGO_NAVBAR_LOGO in scPreferences.preferences ? scPreferences.preferences[SCPreferences.LOGO_NAVBAR_LOGO].value : null;
     }, [scPreferences.preferences]);
-    return (_jsx(Root, Object.assign({ className: classNames(className, classes.root) }, rest, { children: _jsx(Link, { to: scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {}), children: _jsx("img", { src: _logo, alt: "logo" }) }) })));
+    return (_jsx(Root, Object.assign({ className: classNames(className, classes.root) }, rest, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {}) }, { children: _jsx("img", { src: _logo, alt: "logo" }) })) })));
 }

package/lib/esm/components/NavigationMenuIconButton/NavigationMenuDrawer.js

@@ -32,5 +32,5 @@ export default function NavigationMenuDrawer(inProps) {
         name: PREFIX
     });
     const { className = null, showDrawerHeader = true, drawerHeaderContent = _jsx(DefaultHeaderContent, {}), drawerContent = _jsx(DefaultDrawerContent, {}), showDrawerFooterContent = true, drawerFooterContent = null, ScrollContainerProps = {}, CreateLiveStreamButtonComponentProps = {}, open, onClose } = props, rest = __rest(props, ["className", "showDrawerHeader", "drawerHeaderContent", "drawerContent", "showDrawerFooterContent", "drawerFooterContent", "ScrollContainerProps", "CreateLiveStreamButtonComponentProps", "open", "onClose"]);
-    return (_jsxs(Root, Object.assign({ anchor: "left", className: classNames(classes.root, className), open: open, onClose: onClose }, rest, { children: [showDrawerHeader && (_jsxs(_Fragment, { children: [_jsxs(Box, { className: classes.drawerHeader, children: [drawerHeaderContent, _jsx(IconButton, { className: classes.drawerHeaderAction, onClick: onClose, children: _jsx(Icon, { children: "close" }) })] }), _jsx(Divider, {})] })), _jsx(ScrollContainer, Object.assign({}, ScrollContainerProps, { children: _jsx(List, { className: classes.drawerContent, onClick: onClose, children: drawerContent }) })), showDrawerFooterContent && (_jsxs(_Fragment, { children: [_jsx(Divider, {}), _jsx(Box, { className: classes.drawerFooter, children: drawerFooterContent ? (drawerFooterContent) : (_jsx(Box, { className: classes.drawerFooterLiveStream, children: _jsx(CreateLiveStreamButton, Object.assign({ color: "primary", className: classes.drawerFooterLiveStreamButton, fullWidth: true }, CreateLiveStreamButtonComponentProps)) })) })] }))] })));
+    return (_jsxs(Root, Object.assign({ anchor: "left", className: classNames(classes.root, className), open: open, onClose: onClose }, rest, { children: [showDrawerHeader && (_jsxs(_Fragment, { children: [_jsxs(Box, Object.assign({ className: classes.drawerHeader }, { children: [drawerHeaderContent, _jsx(IconButton, Object.assign({ className: classes.drawerHeaderAction, onClick: onClose }, { children: _jsx(Icon, { children: "close" }) }))] })), _jsx(Divider, {})] })), _jsx(ScrollContainer, Object.assign({}, ScrollContainerProps, { children: _jsx(List, Object.assign({ className: classes.drawerContent, onClick: onClose }, { children: drawerContent })) })), showDrawerFooterContent && (_jsxs(_Fragment, { children: [_jsx(Divider, {}), _jsx(Box, Object.assign({ className: classes.drawerFooter }, { children: drawerFooterContent ? (drawerFooterContent) : (_jsx(Box, Object.assign({ className: classes.drawerFooterLiveStream }, { children: _jsx(CreateLiveStreamButton, Object.assign({ color: "primary", className: classes.drawerFooterLiveStreamButton, fullWidth: true }, CreateLiveStreamButtonComponentProps)) }))) }))] }))] })));
 }

package/lib/esm/components/NavigationMenuIconButton/NavigationMenuIconButton.js

@@ -61,5 +61,5 @@ export default function NavigationMenuIconButton(inProps) {
     if (!preferences[SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY].value && !((_a = scUserContext.user) === null || _a === void 0 ? void 0 : _a.id)) {
         return null;
     }
-    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { onClick: onMenuIconClick !== null && onMenuIconClick !== void 0 ? onMenuIconClick : handleOpen, children: _jsx(Icon, { children: "menu" }) })), showDrawer && _jsx(NavigationMenuDrawer, Object.assign({ open: Boolean(anchorEl), onClose: handleClose }, DrawerProps))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { onClick: onMenuIconClick !== null && onMenuIconClick !== void 0 ? onMenuIconClick : handleOpen }, { children: _jsx(Icon, { children: "menu" }) })), showDrawer && _jsx(NavigationMenuDrawer, Object.assign({ open: Boolean(anchorEl), onClose: handleClose }, DrawerProps))] }));
 }

package/lib/esm/components/NavigationSettingsIconButton/NavigationSettingsIconButton.js

@@ -134,64 +134,64 @@ export default function NavigationSettingsIconButton(inProps) {
     const renderList = () => {
         if (isMobile) {
             return [
-                _jsx(ListItem, { className: classes.item, children: _jsx(ListItemButton, { component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scUserContext.user), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.profile", defaultMessage: "ui.navigationSettingsIconButton.profile" }) }) }, "profile"),
-                preferences[SCPreferences.CONFIGURATIONS_FOLLOW_ENABLED] && (_jsx(ListItem, { className: classes.item, children: _jsx(ListItemButton, { component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWINGS_ROUTE_NAME, scUserContext.user), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.followings", defaultMessage: "ui.navigationSettingsIconButton.followings" }) }) }, "followings")),
-                preferences[SCPreferences.CONFIGURATIONS_FOLLOW_ENABLED] && (_jsx(ListItem, { className: classes.item, children: _jsx(ListItemButton, { component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWERS_ROUTE_NAME, scUserContext.user), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.followers", defaultMessage: "ui.navigationSettingsIconButton.followers" }) }) }, "followers")),
-                !preferences[SCPreferences.CONFIGURATIONS_FOLLOW_ENABLED] && (_jsx(ListItem, { className: classes.item, children: _jsx(ListItemButton, { component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_CONNECTIONS_ROUTE_NAME, scUserContext.user), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.connections", defaultMessage: "ui.navigationSettingsIconButton.connections" }) }) }, "connections")),
-                preferences[SCPreferences.ADDONS_LOYALTY_POINTS_COLLECTION] && (_jsx(ListItem, { className: classes.item, children: _jsx(ListItemButton, { component: Link, to: scRoutingContext.url(SCRoutes.LOYALTY_ROUTE_NAME, {}), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.loyalty", defaultMessage: "ui.navigationSettingsIconButton.loyalty" }) }) }, "loyaltyProgram")),
-                preferences[SCPreferences.CONFIGURATIONS_POST_TYPE_ENABLED] && (_jsx(ListItem, { className: classes.item, children: _jsx(ListItemButton, { component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWED_POSTS_ROUTE_NAME, scUserContext.user), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.postsFollowed", defaultMessage: "ui.navigationSettingsIconButton.postsFollowed" }) }) }, "followedPosts")),
-                preferences[SCPreferences.CONFIGURATIONS_DISCUSSION_TYPE_ENABLED] && (_jsx(ListItem, { className: classes.item, children: _jsx(ListItemButton, { component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWED_DISCUSSIONS_ROUTE_NAME, scUserContext.user), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.discussionsFollowed", defaultMessage: "ui.navigationSettingsIconButton.discussionsFollowed" }) }) }, "followedDiscussions")),
-                _jsx(ListItem, { className: classes.item, children: _jsx(ListItemButton, { component: Link, to: scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, {}), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.privateMessages", defaultMessage: "ui.navigationSettingsIconButton.privateMessages" }) }) }, "privateMessages"),
-                ...items.map((item, index) => (_jsx(ListItem, { className: classes.item, children: _jsx(ListItemButton, { component: Link, to: item.href, children: item.label }) }, `custom_item_${index}`))),
+                _jsx(ListItem, Object.assign({ className: classes.item }, { children: _jsx(ListItemButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scUserContext.user) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.profile", defaultMessage: "ui.navigationSettingsIconButton.profile" }) })) }), "profile"),
+                preferences[SCPreferences.CONFIGURATIONS_FOLLOW_ENABLED] && (_jsx(ListItem, Object.assign({ className: classes.item }, { children: _jsx(ListItemButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWINGS_ROUTE_NAME, scUserContext.user) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.followings", defaultMessage: "ui.navigationSettingsIconButton.followings" }) })) }), "followings")),
+                preferences[SCPreferences.CONFIGURATIONS_FOLLOW_ENABLED] && (_jsx(ListItem, Object.assign({ className: classes.item }, { children: _jsx(ListItemButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWERS_ROUTE_NAME, scUserContext.user) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.followers", defaultMessage: "ui.navigationSettingsIconButton.followers" }) })) }), "followers")),
+                !preferences[SCPreferences.CONFIGURATIONS_FOLLOW_ENABLED] && (_jsx(ListItem, Object.assign({ className: classes.item }, { children: _jsx(ListItemButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_CONNECTIONS_ROUTE_NAME, scUserContext.user) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.connections", defaultMessage: "ui.navigationSettingsIconButton.connections" }) })) }), "connections")),
+                preferences[SCPreferences.ADDONS_LOYALTY_POINTS_COLLECTION] && (_jsx(ListItem, Object.assign({ className: classes.item }, { children: _jsx(ListItemButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.LOYALTY_ROUTE_NAME, {}) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.loyalty", defaultMessage: "ui.navigationSettingsIconButton.loyalty" }) })) }), "loyaltyProgram")),
+                preferences[SCPreferences.CONFIGURATIONS_POST_TYPE_ENABLED] && (_jsx(ListItem, Object.assign({ className: classes.item }, { children: _jsx(ListItemButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWED_POSTS_ROUTE_NAME, scUserContext.user) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.postsFollowed", defaultMessage: "ui.navigationSettingsIconButton.postsFollowed" }) })) }), "followedPosts")),
+                preferences[SCPreferences.CONFIGURATIONS_DISCUSSION_TYPE_ENABLED] && (_jsx(ListItem, Object.assign({ className: classes.item }, { children: _jsx(ListItemButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWED_DISCUSSIONS_ROUTE_NAME, scUserContext.user) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.discussionsFollowed", defaultMessage: "ui.navigationSettingsIconButton.discussionsFollowed" }) })) }), "followedDiscussions")),
+                _jsx(ListItem, Object.assign({ className: classes.item }, { children: _jsx(ListItemButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, {}) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.privateMessages", defaultMessage: "ui.navigationSettingsIconButton.privateMessages" }) })) }), "privateMessages"),
+                ...items.map((item, index) => (_jsx(ListItem, Object.assign({ className: classes.item }, { children: _jsx(ListItemButton, Object.assign({ component: Link, to: item.href }, { children: item.label })) }), `custom_item_${index}`))),
                 ...(isAdmin
                     ? [
                         _jsx(Divider, {}, "admin_divider"),
                         isCommunityCreator &&
                             preferences[SCPreferences.CONFIGURATIONS_ONBOARDING_ENABLED] &&
-                            preferences[SCPreferences.CONFIGURATIONS_ONBOARDING_HIDDEN] && (_jsx(ListItem, { className: classes.item, children: _jsxs(ListItemButton, { onClick: showOnBoarding, children: [_jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.onboarding", defaultMessage: "ui.navigationSettingsIconButton.onboarding" }), _jsx(ListItemIcon, { children: _jsx(Icon, { children: "magic_wand" }) })] }) }, "onboarding")),
-                        _jsx(ListItem, { className: classes.item, children: _jsx(ListItemButton, { onClick: () => fetchPlatform(''), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.platform", defaultMessage: "ui.navigationSettingsIconButton.platform" }) }) }, "platform")
+                            preferences[SCPreferences.CONFIGURATIONS_ONBOARDING_HIDDEN] && (_jsx(ListItem, Object.assign({ className: classes.item }, { children: _jsxs(ListItemButton, Object.assign({ onClick: showOnBoarding }, { children: [_jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.onboarding", defaultMessage: "ui.navigationSettingsIconButton.onboarding" }), _jsx(ListItemIcon, { children: _jsx(Icon, { children: "magic_wand" }) })] })) }), "onboarding")),
+                        _jsx(ListItem, Object.assign({ className: classes.item }, { children: _jsx(ListItemButton, Object.assign({ onClick: () => fetchPlatform('') }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.platform", defaultMessage: "ui.navigationSettingsIconButton.platform" }) })) }), "platform")
                     ]
                     : []),
                 ...(isModerator || isAdmin
                     ? [
                         _jsx(Divider, {}, "moderation_divider"),
-                        _jsx(ListItem, { className: classes.item, children: _jsx(ListItemButton, { onClick: () => fetchPlatform('/moderation/flags/'), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.moderation", defaultMessage: "ui.navigationSettingsIconButton.moderation" }) }) }, "moderation")
+                        _jsx(ListItem, Object.assign({ className: classes.item }, { children: _jsx(ListItemButton, Object.assign({ onClick: () => fetchPlatform('/moderation/flags/') }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.moderation", defaultMessage: "ui.navigationSettingsIconButton.moderation" }) })) }), "moderation")
                     ]
                     : []),
-                _jsx(ListItem, { className: classes.item, children: _jsx(ListItemButton, { component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_SETTINGS_ROUTE_NAME, scUserContext.user), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.settings", defaultMessage: "ui.navigationSettingsIconButton.settings" }) }) }, "settings"),
+                _jsx(ListItem, Object.assign({ className: classes.item }, { children: _jsx(ListItemButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_SETTINGS_ROUTE_NAME, scUserContext.user) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.settings", defaultMessage: "ui.navigationSettingsIconButton.settings" }) })) }), "settings"),
                 _jsx(Divider, {}, "divider"),
-                _jsx(ListItem, { className: classes.item, children: _jsx(ListItemButton, { onClick: handleLogout, children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.logout", defaultMessage: "ui.navigationSettingsIconButton.logout" }) }) }, "logout")
+                _jsx(ListItem, Object.assign({ className: classes.item }, { children: _jsx(ListItemButton, Object.assign({ onClick: handleLogout }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.logout", defaultMessage: "ui.navigationSettingsIconButton.logout" }) })) }), "logout")
             ];
         }
         else {
             return [
-                _jsx(MenuItem, { className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scUserContext.user), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.profile", defaultMessage: "ui.navigationSettingsIconButton.profile" }) }, "profile"),
-                preferences[SCPreferences.CONFIGURATIONS_FOLLOW_ENABLED] && (_jsx(MenuItem, { className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWINGS_ROUTE_NAME, scUserContext.user), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.followings", defaultMessage: "ui.navigationSettingsIconButton.followings" }) }, "followings")),
-                preferences[SCPreferences.CONFIGURATIONS_FOLLOW_ENABLED] && (_jsx(MenuItem, { className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWERS_ROUTE_NAME, scUserContext.user), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.followers", defaultMessage: "ui.navigationSettingsIconButton.followers" }) }, "followers")),
-                !preferences[SCPreferences.CONFIGURATIONS_FOLLOW_ENABLED] && (_jsx(MenuItem, { className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_CONNECTIONS_ROUTE_NAME, scUserContext.user), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.connections", defaultMessage: "ui.navigationSettingsIconButton.connections" }) }, "connections")),
-                preferences[SCPreferences.ADDONS_LOYALTY_POINTS_COLLECTION] && (_jsx(MenuItem, { className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.LOYALTY_ROUTE_NAME, {}), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.loyalty", defaultMessage: "ui.navigationSettingsIconButton.loyalty" }) }, "loyaltyProgram")),
-                preferences[SCPreferences.CONFIGURATIONS_POST_TYPE_ENABLED] && (_jsx(MenuItem, { className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWED_POSTS_ROUTE_NAME, scUserContext.user), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.postsFollowed", defaultMessage: "ui.navigationSettingsIconButton.postsFollowed" }) }, "followedPosts")),
-                preferences[SCPreferences.CONFIGURATIONS_DISCUSSION_TYPE_ENABLED] && (_jsx(MenuItem, { className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWED_DISCUSSIONS_ROUTE_NAME, scUserContext.user), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.discussionsFollowed", defaultMessage: "ui.navigationSettingsIconButton.discussionsFollowed" }) }, "followedDiscussions")),
-                _jsx(MenuItem, { className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, {}), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.privateMessages", defaultMessage: "ui.navigationSettingsIconButton.privateMessages" }) }, "privateMessages"),
-                ...items.map((item, index) => (_jsx(MenuItem, { className: classes.item, component: Link, to: item.href, children: item.label }, `custom_item_${index}`))),
+                _jsx(MenuItem, Object.assign({ className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scUserContext.user) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.profile", defaultMessage: "ui.navigationSettingsIconButton.profile" }) }), "profile"),
+                preferences[SCPreferences.CONFIGURATIONS_FOLLOW_ENABLED] && (_jsx(MenuItem, Object.assign({ className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWINGS_ROUTE_NAME, scUserContext.user) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.followings", defaultMessage: "ui.navigationSettingsIconButton.followings" }) }), "followings")),
+                preferences[SCPreferences.CONFIGURATIONS_FOLLOW_ENABLED] && (_jsx(MenuItem, Object.assign({ className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWERS_ROUTE_NAME, scUserContext.user) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.followers", defaultMessage: "ui.navigationSettingsIconButton.followers" }) }), "followers")),
+                !preferences[SCPreferences.CONFIGURATIONS_FOLLOW_ENABLED] && (_jsx(MenuItem, Object.assign({ className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_CONNECTIONS_ROUTE_NAME, scUserContext.user) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.connections", defaultMessage: "ui.navigationSettingsIconButton.connections" }) }), "connections")),
+                preferences[SCPreferences.ADDONS_LOYALTY_POINTS_COLLECTION] && (_jsx(MenuItem, Object.assign({ className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.LOYALTY_ROUTE_NAME, {}) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.loyalty", defaultMessage: "ui.navigationSettingsIconButton.loyalty" }) }), "loyaltyProgram")),
+                preferences[SCPreferences.CONFIGURATIONS_POST_TYPE_ENABLED] && (_jsx(MenuItem, Object.assign({ className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWED_POSTS_ROUTE_NAME, scUserContext.user) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.postsFollowed", defaultMessage: "ui.navigationSettingsIconButton.postsFollowed" }) }), "followedPosts")),
+                preferences[SCPreferences.CONFIGURATIONS_DISCUSSION_TYPE_ENABLED] && (_jsx(MenuItem, Object.assign({ className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_FOLLOWED_DISCUSSIONS_ROUTE_NAME, scUserContext.user) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.discussionsFollowed", defaultMessage: "ui.navigationSettingsIconButton.discussionsFollowed" }) }), "followedDiscussions")),
+                _jsx(MenuItem, Object.assign({ className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, {}) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.privateMessages", defaultMessage: "ui.navigationSettingsIconButton.privateMessages" }) }), "privateMessages"),
+                ...items.map((item, index) => (_jsx(MenuItem, Object.assign({ className: classes.item, component: Link, to: item.href }, { children: item.label }), `custom_item_${index}`))),
                 ...(isAdmin
                     ? [
                         _jsx(Divider, {}, "platform_divider"),
                         isCommunityCreator &&
                             preferences[SCPreferences.CONFIGURATIONS_ONBOARDING_ENABLED] &&
-                            preferences[SCPreferences.CONFIGURATIONS_ONBOARDING_HIDDEN] && (_jsxs(MenuItem, { className: classes.item, onClick: showOnBoarding, children: [_jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.onboarding", defaultMessage: "ui.navigationSettingsIconButton.onboarding" }), _jsx(ListItemIcon, { children: _jsx(Icon, { children: "magic_wand" }) })] }, "onboarding")),
-                        _jsx(MenuItem, { className: classes.item, onClick: () => fetchPlatform(''), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.platform", defaultMessage: "ui.navigationSettingsIconButton.platform" }) }, "platform")
+                            preferences[SCPreferences.CONFIGURATIONS_ONBOARDING_HIDDEN] && (_jsxs(MenuItem, Object.assign({ className: classes.item, onClick: showOnBoarding }, { children: [_jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.onboarding", defaultMessage: "ui.navigationSettingsIconButton.onboarding" }), _jsx(ListItemIcon, { children: _jsx(Icon, { children: "magic_wand" }) })] }), "onboarding")),
+                        _jsx(MenuItem, Object.assign({ className: classes.item, onClick: () => fetchPlatform('') }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.platform", defaultMessage: "ui.navigationSettingsIconButton.platform" }) }), "platform")
                     ]
                     : []),
                 ...(isModerator || isAdmin
                     ? [
                         _jsx(Divider, {}, "moderation_divider"),
-                        _jsx(MenuItem, { className: classes.item, onClick: () => fetchPlatform('/moderation/flags/'), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.moderation", defaultMessage: "ui.navigationSettingsIconButton.moderation" }) }, "moderation")
+                        _jsx(MenuItem, Object.assign({ className: classes.item, onClick: () => fetchPlatform('/moderation/flags/') }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.moderation", defaultMessage: "ui.navigationSettingsIconButton.moderation" }) }), "moderation")
                     ]
                     : []),
-                _jsx(MenuItem, { className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_SETTINGS_ROUTE_NAME, scUserContext.user), children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.settings", defaultMessage: "ui.navigationSettingsIconButton.settings" }) }, "settings"),
+                _jsx(MenuItem, Object.assign({ className: classes.item, component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_SETTINGS_ROUTE_NAME, scUserContext.user) }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.settings", defaultMessage: "ui.navigationSettingsIconButton.settings" }) }), "settings"),
                 _jsx(Divider, {}, "divider"),
-                _jsx(MenuItem, { className: classes.item, onClick: handleLogout, children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.logout", defaultMessage: "ui.navigationSettingsIconButton.logout" }) }, "logout")
+                _jsx(MenuItem, Object.assign({ className: classes.item, onClick: handleLogout }, { children: _jsx(FormattedMessage, { id: "ui.navigationSettingsIconButton.logout", defaultMessage: "ui.navigationSettingsIconButton.logout" }) }), "logout")
             ];
         }
     };
@@ -199,5 +199,5 @@ export default function NavigationSettingsIconButton(inProps) {
     if (!scUserContext.user) {
         return null;
     }
-    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { onClick: handleOpen, children: _jsx(Icon, { children: "more_vert" }) })), isMobile ? (_jsx(SwipeableDrawerRoot, { onClick: () => setAnchorEl(null), className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, PaperProps: { className: classes.paper }, disableSwipeToOpen: true, children: _jsx(List, { children: renderList() }) })) : (_jsx(MenuRoot, { onClick: () => setAnchorEl(null), className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, PaperProps: { className: classes.paper }, children: renderList() }))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { onClick: handleOpen }, { children: _jsx(Icon, { children: "more_vert" }) })), isMobile ? (_jsx(SwipeableDrawerRoot, Object.assign({ onClick: () => setAnchorEl(null), className: classes.drawerRoot, anchor: "bottom", open: Boolean(anchorEl), onClose: handleClose, onOpen: handleOpen, PaperProps: { className: classes.paper }, disableSwipeToOpen: true }, { children: _jsx(List, { children: renderList() }) }))) : (_jsx(MenuRoot, Object.assign({ onClick: () => setAnchorEl(null), className: classes.menuRoot, anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose, PaperProps: { className: classes.paper } }, { children: renderList() })))] }));
 }

package/lib/esm/components/NavigationToolbar/NavigationToolbar.js

@@ -138,16 +138,16 @@ export default function NavigationToolbar(inProps) {
     if (scUserContext.loading) {
         return _jsx(NavigationToolbarSkeleton, {});
     }
-    const _children = children || (_jsxs(Box, { className: classes.navigation, children: [scUserContext.user && (_jsx(IconButton, { className: classNames(classes.home, { [classes.active]: value.startsWith(scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {})) }), "aria-label": "Home", to: scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {}), component: Link, children: _jsx(Icon, { children: "home" }) })), preferences[SCPreferences.CONFIGURATIONS_EXPLORE_STREAM_ENABLED] &&
-                (preferences[SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY] || scUserContext.user) && (_jsx(IconButton, { className: classNames(classes.explore, { [classes.active]: value.startsWith(scRoutingContext.url(SCRoutes.EXPLORE_ROUTE_NAME, {})) }), "aria-label": "Explore", to: scRoutingContext.url(SCRoutes.EXPLORE_ROUTE_NAME, {}), component: Link, children: _jsx(Icon, { children: "explore" }) })), groupsEnabled && scUserContext.user && (_jsx(IconButton, { className: classNames(classes.groups, {
+    const _children = children || (_jsxs(Box, Object.assign({ className: classes.navigation }, { children: [scUserContext.user && (_jsx(IconButton, Object.assign({ className: classNames(classes.home, { [classes.active]: value.startsWith(scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {})) }), "aria-label": "Home", to: scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {}), component: Link }, { children: _jsx(Icon, { children: "home" }) }))), preferences[SCPreferences.CONFIGURATIONS_EXPLORE_STREAM_ENABLED] &&
+                (preferences[SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY] || scUserContext.user) && (_jsx(IconButton, Object.assign({ className: classNames(classes.explore, { [classes.active]: value.startsWith(scRoutingContext.url(SCRoutes.EXPLORE_ROUTE_NAME, {})) }), "aria-label": "Explore", to: scRoutingContext.url(SCRoutes.EXPLORE_ROUTE_NAME, {}), component: Link }, { children: _jsx(Icon, { children: "explore" }) }))), groupsEnabled && scUserContext.user && (_jsx(IconButton, Object.assign({ className: classNames(classes.groups, {
                     [classes.active]: value.startsWith(scRoutingContext.url(SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {})) ||
                         value.startsWith(scRoutingContext.url(SCRoutes.GROUPS_ROUTE_NAME, {}))
-                }), "aria-label": "Groups", to: scRoutingContext.url(SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {}), component: Link, children: _jsx(Icon, { children: "groups" }) })), eventsEnabled && (scUserContext.user || preferences[SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY]) && (_jsx(IconButton, { className: classNames(classes.events, {
+                }), "aria-label": "Groups", to: scRoutingContext.url(SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {}), component: Link }, { children: _jsx(Icon, { children: "groups" }) }))), eventsEnabled && (scUserContext.user || preferences[SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY]) && (_jsx(IconButton, Object.assign({ className: classNames(classes.events, {
                     [classes.active]: value.startsWith(scRoutingContext.url(SCRoutes.EVENTS_ROUTE_NAME, {}))
-                }), "aria-label": "Groups", to: scRoutingContext.url(SCRoutes.EVENTS_ROUTE_NAME, {}), component: Link, children: _jsx(Icon, { children: "CalendarIcon" }) }))] }));
-    return (_jsxs(Root, Object.assign({ className: classNames(className, classes.root) }, rest, { children: [_jsx(NavigationMenuIconButtonComponent, Object.assign({}, NavigationMenuIconButtonComponentProps)), _jsx(Link, { to: scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {}), className: classes.logo, children: _jsx("img", { src: preferences[SCPreferences.LOGO_NAVBAR_LOGO], alt: "logo" }) }), !scUserContext.user && !preferences[SCPreferences.ADDONS_CLOSED_COMMUNITY] && (_jsx(Button, { color: "inherit", component: Link, to: scRoutingContext.url(SCRoutes.SIGNUP_ROUTE_NAME, {}), className: classes.register, children: _jsx(FormattedMessage, { id: "ui.appBar.navigation.register", defaultMessage: "ui.appBar.navigation.register" }) })), preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_ENABLED] && (_jsx(_Fragment, { children: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_TEXT] ? (_jsx(Tooltip, { title: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_TEXT], children: _jsx(Link, { target: "blank", to: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_URL], className: classes.customItem, children: _jsx("img", { src: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_IMAGE], alt: "custom_item" }) }) })) : (_jsx(Link, { target: "blank", to: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_URL], className: classes.customItem, children: _jsx("img", { src: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_IMAGE], alt: "custom_item" }) })) })), _children, (preferences[SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY] || scUserContext.user) && !disableSearch ? (_jsx(SearchAutocomplete, Object.assign({ className: classes.search, blurOnSelect: true }, SearchAutocompleteProps))) : (_jsx(Box, { className: classes.search })), startActions, scUserContext.user ? (_jsxs(_Fragment, { children: [showComposer && _jsx(ComposerIconButton, Object.assign({ className: classes.composer }, ComposerIconButtonProps)), _jsx(Tooltip, { title: scUserContext.user.username, children: _jsx(IconButton, { component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scUserContext.user), "aria-label": "Profile", className: classes.profile, children: _jsx(Avatar, { alt: scUserContext.user.username, src: scUserContext.user.avatar }) }) }), _jsxs(_Fragment, { children: [_jsx(IconButton, { className: classNames(classes.notification, {
+                }), "aria-label": "Groups", to: scRoutingContext.url(SCRoutes.EVENTS_ROUTE_NAME, {}), component: Link }, { children: _jsx(Icon, { children: "CalendarIcon" }) })))] })));
+    return (_jsxs(Root, Object.assign({ className: classNames(className, classes.root) }, rest, { children: [_jsx(NavigationMenuIconButtonComponent, Object.assign({}, NavigationMenuIconButtonComponentProps)), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {}), className: classes.logo }, { children: _jsx("img", { src: preferences[SCPreferences.LOGO_NAVBAR_LOGO], alt: "logo" }) })), !scUserContext.user && !preferences[SCPreferences.ADDONS_CLOSED_COMMUNITY] && (_jsx(Button, Object.assign({ color: "inherit", component: Link, to: scRoutingContext.url(SCRoutes.SIGNUP_ROUTE_NAME, {}), className: classes.register }, { children: _jsx(FormattedMessage, { id: "ui.appBar.navigation.register", defaultMessage: "ui.appBar.navigation.register" }) }))), preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_ENABLED] && (_jsx(_Fragment, { children: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_TEXT] ? (_jsx(Tooltip, Object.assign({ title: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_TEXT] }, { children: _jsx(Link, Object.assign({ target: "blank", to: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_URL], className: classes.customItem }, { children: _jsx("img", { src: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_IMAGE], alt: "custom_item" }) })) }))) : (_jsx(Link, Object.assign({ target: "blank", to: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_URL], className: classes.customItem }, { children: _jsx("img", { src: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_IMAGE], alt: "custom_item" }) }))) })), _children, (preferences[SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY] || scUserContext.user) && !disableSearch ? (_jsx(SearchAutocomplete, Object.assign({ className: classes.search, blurOnSelect: true }, SearchAutocompleteProps))) : (_jsx(Box, { className: classes.search })), startActions, scUserContext.user ? (_jsxs(_Fragment, { children: [showComposer && _jsx(ComposerIconButton, Object.assign({ className: classes.composer }, ComposerIconButtonProps)), _jsx(Tooltip, Object.assign({ title: scUserContext.user.username }, { children: _jsx(IconButton, Object.assign({ component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scUserContext.user), "aria-label": "Profile", className: classes.profile }, { children: _jsx(Avatar, { alt: scUserContext.user.username, src: scUserContext.user.avatar }) })) })), _jsxs(_Fragment, { children: [_jsx(IconButton, Object.assign({ className: classNames(classes.notification, {
                                     [classes.active]: value.startsWith(scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}))
-                                }), "aria-label": "Notification", onClick: handleOpenNotificationMenu, children: _jsx(Badge, { badgeContent: scUserContext.user.unseen_notification_banners_counter + scUserContext.user.unseen_interactions_counter, color: "secondary", children: _jsx(Icon, { children: "notifications_active" }) }) }), _jsx(NotificationMenu, Object.assign({ className: classes.notificationsMenu, id: "notification-menu", anchorEl: anchorNotification, open: Boolean(anchorNotification), onClose: handleCloseNotificationMenu, onClick: handleCloseNotificationMenu, transformOrigin: { horizontal: 'right', vertical: 'top' }, anchorOrigin: { horizontal: 'right', vertical: 'bottom' } }, NotificationMenuProps))] }), privateMessagingEnabled && (_jsx(IconButton, { className: classNames(classes.messages, {
+                                }), "aria-label": "Notification", onClick: handleOpenNotificationMenu }, { children: _jsx(Badge, Object.assign({ badgeContent: scUserContext.user.unseen_notification_banners_counter + scUserContext.user.unseen_interactions_counter, color: "secondary" }, { children: _jsx(Icon, { children: "notifications_active" }) })) })), _jsx(NotificationMenu, Object.assign({ className: classes.notificationsMenu, id: "notification-menu", anchorEl: anchorNotification, open: Boolean(anchorNotification), onClose: handleCloseNotificationMenu, onClick: handleCloseNotificationMenu, transformOrigin: { horizontal: 'right', vertical: 'top' }, anchorOrigin: { horizontal: 'right', vertical: 'bottom' } }, NotificationMenuProps))] }), privateMessagingEnabled && (_jsx(IconButton, Object.assign({ className: classNames(classes.messages, {
                             [classes.active]: value.startsWith(scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, {}))
-                        }), "aria-label": "Messages", to: scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, {}), component: Link, children: _jsx(Badge, { badgeContent: 0, color: "secondary", children: _jsx(Icon, { children: "email" }) }) })), endActions, _jsx(NavigationSettingsIconButtonComponent, { className: classes.settings })] })) : (_jsxs(_Fragment, { children: [endActions, _jsx(Button, { color: "inherit", component: Link, to: scRoutingContext.url(SCRoutes.SIGNIN_ROUTE_NAME, {}), children: _jsx(FormattedMessage, { id: "ui.appBar.navigation.login", defaultMessage: "ui.appBar.navigation.login" }) })] }))] })));
+                        }), "aria-label": "Messages", to: scRoutingContext.url(SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, {}), component: Link }, { children: _jsx(Badge, Object.assign({ badgeContent: 0, color: "secondary" }, { children: _jsx(Icon, { children: "email" }) })) }))), endActions, _jsx(NavigationSettingsIconButtonComponent, { className: classes.settings })] })) : (_jsxs(_Fragment, { children: [endActions, _jsx(Button, Object.assign({ color: "inherit", component: Link, to: scRoutingContext.url(SCRoutes.SIGNIN_ROUTE_NAME, {}) }, { children: _jsx(FormattedMessage, { id: "ui.appBar.navigation.login", defaultMessage: "ui.appBar.navigation.login" }) }))] }))] })));
 }

package/lib/esm/components/NavigationToolbar/NotificationMenu.js

@@ -28,5 +28,5 @@ export default function NotificationMenu(inProps) {
     return (
     // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
     // @ts-ignore
-    _jsxs(Root, Object.assign({ className: classes.root, PaperProps: PaperProps, MenuListProps: MenuListProps }, rest, { children: [_jsx(SnippetNotifications, Object.assign({ className: classes.notifications }, SnippetNotificationsProps)), _jsx(Button, { className: classes.link, component: Link, to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}), variant: "text", children: _jsx(FormattedMessage, { id: "ui.header.notifications.button.seeMore", defaultMessage: "ui.header.notifications.button.seeMore" }) })] })));
+    _jsxs(Root, Object.assign({ className: classes.root, PaperProps: PaperProps, MenuListProps: MenuListProps }, rest, { children: [_jsx(SnippetNotifications, Object.assign({ className: classes.notifications }, SnippetNotificationsProps)), _jsx(Button, Object.assign({ className: classes.link, component: Link, to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}), variant: "text" }, { children: _jsx(FormattedMessage, { id: "ui.header.notifications.button.seeMore", defaultMessage: "ui.header.notifications.button.seeMore" }) }))] })));
 }

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

@@ -37,5 +37,5 @@ const Root = styled(Toolbar, {
  *
  */
 export default function NavigationToolbarSkeleton() {
-    return (_jsxs(Root, { className: classes.root, children: [_jsx(Skeleton, { className: classes.logo, animation: "wave", variant: "rectangular" }), _jsx(Skeleton, { className: classes.navigation, animation: "wave", variant: "rectangular" }), _jsx(Skeleton, { className: classes.avatar, animation: "wave", variant: "rounded" })] }));
+    return (_jsxs(Root, Object.assign({ className: classes.root }, { children: [_jsx(Skeleton, { className: classes.logo, animation: "wave", variant: "rectangular" }), _jsx(Skeleton, { className: classes.navigation, animation: "wave", variant: "rectangular" }), _jsx(Skeleton, { className: classes.avatar, animation: "wave", variant: "rounded" })] })));
 }

package/lib/esm/components/NavigationToolbarMobile/NavigationToolbarMobile.js

@@ -103,12 +103,12 @@ export default function NavigationToolbarMobile(inProps) {
     if (scUserContext.loading) {
         return _jsx(NavigationToolbarMobileSkeleton, {});
     }
-    const _children = children || (_jsxs(_Fragment, { children: [_jsx(NavigationMenuIconButtonComponent, {}), _jsx(Link, { to: scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {}), className: classNames(className, classes.logo, {
+    const _children = children || (_jsxs(_Fragment, { children: [_jsx(NavigationMenuIconButtonComponent, {}), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {}), className: classNames(className, classes.logo, {
                     [classes.logoFlex]: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_URL].value
-                }), children: !preserveDesktopLogo ? (_jsx("img", { src: preferences[SCPreferences.LOGO_NAVBAR_LOGO_MOBILE].value, alt: "logo" })) : (_jsx("img", { src: preferences[SCPreferences.LOGO_NAVBAR_LOGO].value, alt: "logo" })) }), preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_ENABLED].value && (_jsx(Link, { target: "blank", to: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_URL].value, className: classes.customItem, children: _jsx("img", { src: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_IMAGE].value, alt: "custom_item" }) }))] }));
-    return (_jsxs(Root, Object.assign({ className: classNames(className, classes.root) }, rest, { children: [_children, startActions, (contentAvailable || scUserContext.user) && !disableSearch && (_jsxs(_Fragment, { children: [_jsx(IconButton, { className: classes.search, onClick: handleOpenSearch, children: _jsx(Icon, { children: "search" }) }), _jsx(SearchDialog, { className: classes.searchDialog, fullScreen: true, open: searchOpen, SearchAutocompleteProps: Object.assign(Object.assign({}, SearchAutocompleteProps), { onClear: handleCloseSearch }) })] })), endActions, (!postOnlyStaffEnabled || (UserUtils.isStaff(scUserContext.user) && postOnlyStaffEnabled)) &&
+                }) }, { children: !preserveDesktopLogo ? (_jsx("img", { src: preferences[SCPreferences.LOGO_NAVBAR_LOGO_MOBILE].value, alt: "logo" })) : (_jsx("img", { src: preferences[SCPreferences.LOGO_NAVBAR_LOGO].value, alt: "logo" })) })), preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_ENABLED].value && (_jsx(Link, Object.assign({ target: "blank", to: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_URL].value, className: classes.customItem }, { children: _jsx("img", { src: preferences[SCPreferences.CONFIGURATIONS_CUSTOM_NAVBAR_ITEM_IMAGE].value, alt: "custom_item" }) })))] }));
+    return (_jsxs(Root, Object.assign({ className: classNames(className, classes.root) }, rest, { children: [_children, startActions, (contentAvailable || scUserContext.user) && !disableSearch && (_jsxs(_Fragment, { children: [_jsx(IconButton, Object.assign({ className: classes.search, onClick: handleOpenSearch }, { children: _jsx(Icon, { children: "search" }) })), _jsx(SearchDialog, { className: classes.searchDialog, fullScreen: true, open: searchOpen, SearchAutocompleteProps: Object.assign(Object.assign({}, SearchAutocompleteProps), { onClear: handleCloseSearch }) })] })), endActions, (!postOnlyStaffEnabled || (UserUtils.isStaff(scUserContext.user) && postOnlyStaffEnabled)) &&
                 groupsEnabled &&
                 eventsEnabled &&
                 (scUserContext.user || contentAvailable) &&
-                exploreStreamEnabled && _jsx(ComposerIconButton, {}), scUserContext.user && (groupsEnabled || eventsEnabled) && (_jsx(IconButton, { className: classes.notifications, component: Link, to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}), children: _jsx(Badge, { badgeContent: scUserContext.user.unseen_notification_banners_counter + scUserContext.user.unseen_interactions_counter, color: "secondary", children: _jsx(Icon, { children: "notifications_active" }) }) })), scUserContext.user ? (_jsx(NavigationSettingsIconButtonComponent, { className: classes.settings })) : (_jsx(Button, { className: classes.login, color: "inherit", component: Link, to: scRoutingContext.url(SCRoutes.SIGNIN_ROUTE_NAME, {}), children: _jsx(FormattedMessage, { id: "ui.appBar.navigation.login", defaultMessage: "ui.appBar.navigation.login" }) }))] })));
+                exploreStreamEnabled && _jsx(ComposerIconButton, {}), scUserContext.user && (groupsEnabled || eventsEnabled) && (_jsx(IconButton, Object.assign({ className: classes.notifications, component: Link, to: scRoutingContext.url(SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}) }, { children: _jsx(Badge, Object.assign({ badgeContent: scUserContext.user.unseen_notification_banners_counter + scUserContext.user.unseen_interactions_counter, color: "secondary" }, { children: _jsx(Icon, { children: "notifications_active" }) })) }))), scUserContext.user ? (_jsx(NavigationSettingsIconButtonComponent, { className: classes.settings })) : (_jsx(Button, Object.assign({ className: classes.login, color: "inherit", component: Link, to: scRoutingContext.url(SCRoutes.SIGNIN_ROUTE_NAME, {}) }, { children: _jsx(FormattedMessage, { id: "ui.appBar.navigation.login", defaultMessage: "ui.appBar.navigation.login" }) })))] })));
 }

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

@@ -33,5 +33,5 @@ const Root = styled(Toolbar, {
  *
  */
 export default function NavigationToolbarMobileSkeleton() {
-    return (_jsx(Root, { className: classes.root, children: _jsx(Skeleton, { className: classes.logo, animation: "wave", variant: "rectangular" }) }));
+    return (_jsx(Root, Object.assign({ className: classes.root }, { children: _jsx(Skeleton, { className: classes.logo, animation: "wave", variant: "rectangular" }) })));
 }

package/lib/esm/components/Notification/CollapsedFor/CollapsedFor.js

@@ -65,5 +65,5 @@ export default function CollapsedForNotification(props) {
     /**
      * Renders root object
      */
-    return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Avatar, { variant: "circular", classes: { root: classes.flagIcon }, children: _jsx(Icon, { children: "outlined_flag" }) }), primary: _jsx(_Fragment, { children: isSnippetTemplate ? (_jsx(Link, { to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])), children: _jsx(Typography, { component: "div", color: "inherit", className: classes.flagText, children: _jsx(FormattedMessage, { id: `ui.notification.collapsedFor.${camelCase(notificationObject.type)}Snippet`, defaultMessage: `ui.notification.collapsedFor.${camelCase(notificationObject.type)}Snippet` }) }) })) : (_jsx(Typography, { component: "div", color: "inherit", className: classes.flagText, children: intl.formatMessage(messages[camelCase(notificationObject.type)], { b: (...chunks) => _jsx("strong", { children: chunks }) }) })) }), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: isSnippetTemplate ? null : (_jsxs(_Fragment, { children: [_jsxs(Box, { className: classes.contributionWrap, children: [_jsx(Typography, { variant: 'body2', color: 'inherit', component: 'div', classes: { root: classes.contributionYouWroteLabel }, children: _jsx(FormattedMessage, { id: "ui.notification.collapsedFor.youWrote", defaultMessage: "ui.notification.collapsedFor.youWrote" }) }), _jsx(Link, { to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])), className: classes.contributionText, children: _jsx(Typography, { component: 'span', variant: "body2", gutterBottom: true, children: getContributionSnippet(notificationObject[contributionType]) }) })] }), template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2, children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, { color: "primary", component: 'div', children: _jsx(Link, { to: scRoutingContext.url(SCRoutes[`${notificationObject[contributionType]['type'].toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])), children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: 'ui.userToastNotifications.viewContribution' }) }) })] }))] })) }, rest)));
+    return (_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Avatar, Object.assign({ variant: "circular", classes: { root: classes.flagIcon } }, { children: _jsx(Icon, { children: "outlined_flag" }) })), primary: _jsx(_Fragment, { children: isSnippetTemplate ? (_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: _jsx(FormattedMessage, { id: `ui.notification.collapsedFor.${camelCase(notificationObject.type)}Snippet`, defaultMessage: `ui.notification.collapsedFor.${camelCase(notificationObject.type)}Snippet` }) })) }))) : (_jsx(Typography, Object.assign({ component: "div", color: "inherit", className: classes.flagText }, { children: intl.formatMessage(messages[camelCase(notificationObject.type)], { b: (...chunks) => _jsx("strong", { children: chunks }) }) }))) }), secondary: (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt })), footer: isSnippetTemplate ? null : (_jsxs(_Fragment, { children: [_jsxs(Box, Object.assign({ className: classes.contributionWrap }, { children: [_jsx(Typography, Object.assign({ variant: 'body2', color: 'inherit', component: 'div', classes: { root: classes.contributionYouWroteLabel } }, { children: _jsx(FormattedMessage, { id: "ui.notification.collapsedFor.youWrote", defaultMessage: "ui.notification.collapsedFor.youWrote" }) })), _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${contributionType.toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])), className: classes.contributionText }, { children: _jsx(Typography, Object.assign({ component: 'span', variant: "body2", gutterBottom: true }, { children: getContributionSnippet(notificationObject[contributionType]) })) }))] })), template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: 'div' }, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes[`${notificationObject[contributionType]['type'].toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: 'ui.userToastNotifications.viewContribution' }) })) }))] })))] })) }, rest)));
 }

package/lib/esm/components/Notification/Comment/Comment.js

@@ -62,13 +62,13 @@ export default function CommentNotification(props) {
      */
     return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Link, Object.assign({}, (!notificationObject.comment.author.deleted && {
                     to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.comment.author)
-                }), { onClick: notificationObject.comment.author.deleted ? () => setOpenAlert(true) : null, children: _jsx(UserAvatar, { hide: !notificationObject.comment.author.community_badge, smaller: true, children: _jsx(Avatar, { alt: notificationObject.comment.author.username, variant: "circular", src: notificationObject.comment.author.avatar, classes: { root: classes.avatar } }) }) })), primary: _jsxs(_Fragment, { children: [_jsx(Link, Object.assign({}, (!notificationObject.comment.author.deleted && {
+                }), { onClick: notificationObject.comment.author.deleted ? () => setOpenAlert(true) : null }, { children: _jsx(UserAvatar, Object.assign({ hide: !notificationObject.comment.author.community_badge, smaller: true }, { children: _jsx(Avatar, { alt: notificationObject.comment.author.username, variant: "circular", src: notificationObject.comment.author.avatar, classes: { root: classes.avatar } }) })) })), primary: _jsxs(_Fragment, { children: [_jsx(Link, Object.assign({}, (!notificationObject.comment.author.deleted && {
                             to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.comment.author)
-                        }), { onClick: notificationObject.comment.author.deleted ? () => setOpenAlert(true) : null, className: classes.username, children: notificationObject.comment.author.username })), ' ', notificationObject.type === SCNotificationTypologyType.NESTED_COMMENT
+                        }), { onClick: notificationObject.comment.author.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.comment.author.username })), ' ', notificationObject.type === SCNotificationTypologyType.NESTED_COMMENT
                             ? intl.formatMessage(messages.comment, {
                                 b: (...chunks) => _jsx("strong", { children: chunks })
                             })
                             : intl.formatMessage(messages.nestedComment, {
                                 b: (...chunks) => _jsx("strong", { children: chunks })
-                            })] }), secondary: _jsxs(React.Fragment, { children: [_jsx(Link, { to: scRoutingContext.url(SCRoutes.COMMENT_ROUTE_NAME, getRouteData(notificationObject.comment)), children: _jsx(Typography, { variant: "body2", className: classes.contributionText, children: getContributionSnippet(notificationObject.comment) }) }), (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsxs(Stack, { direction: "row", justifyContent: "flex-start", alignItems: "center", spacing: 1, children: [_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt }), _jsx(Bullet, { className: classes.bullet }), _jsx(VoteButton, { className: classes.voteButton, variant: "text", size: "small", contributionId: notificationObject.comment.id, contributionType: SCContributionType.COMMENT, contribution: notificationObject.comment, onVote: handleVote })] }))] }), footer: template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2, children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, { color: "primary", component: 'div', children: _jsx(Link, { to: scRoutingContext.url(SCRoutes.COMMENT_ROUTE_NAME, getRouteData(notificationObject.comment)), children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: 'ui.userToastNotifications.viewContribution' }) }) })] })) }, rest)), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
+                            })] }), secondary: _jsxs(React.Fragment, { children: [_jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.COMMENT_ROUTE_NAME, getRouteData(notificationObject.comment)) }, { children: _jsx(Typography, Object.assign({ variant: "body2", className: classes.contributionText }, { children: getContributionSnippet(notificationObject.comment) })) })), (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "flex-start", alignItems: "center", spacing: 1 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt }), _jsx(Bullet, { className: classes.bullet }), _jsx(VoteButton, { className: classes.voteButton, variant: "text", size: "small", contributionId: notificationObject.comment.id, contributionType: SCContributionType.COMMENT, contribution: notificationObject.comment, onVote: handleVote })] })))] }), footer: template === SCNotificationObjectTemplateType.TOAST && (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary", component: 'div' }, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(SCRoutes.COMMENT_ROUTE_NAME, getRouteData(notificationObject.comment)) }, { children: _jsx(FormattedMessage, { id: "ui.userToastNotifications.viewContribution", defaultMessage: 'ui.userToastNotifications.viewContribution' }) })) }))] }))) }, rest)), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }