@selfcommunity/react-ui 0.7.50-events.41 → 0.7.50-events.44

package/lib/cjs/components/CategoriesPopularWidget/CategoriesPopularWidget.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = tslib_1.__importStar(require("react"));
 const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
@@ -181,25 +182,12 @@ function CategoriesPopularWidget(inProps) {
     };
     // RENDER
     if ((!contentAvailability && !scUserContext.user) || (state.initialized && autoHide && !state.count)) {
-        return react_1.default.createElement(HiddenPlaceholder_1.default, null);
+        return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
     }
     if (!state.initialized) {
-        return react_1.default.createElement(Skeleton_1.default, null);
+        return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
     }
-    const content = (react_1.default.createElement(material_1.CardContent, null,
-        react_1.default.createElement(material_1.Typography, { className: classes.title, variant: "h5" },
-            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoriesPopularWidget.title", defaultMessage: "ui.categoriesPopularWidget.title" })),
-        !state.count ? (react_1.default.createElement(material_1.Typography, { className: classes.noResults, variant: "body2" },
-            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoriesPopularWidget.noResults", defaultMessage: "ui.categoriesPopularWidget.noResults" }))) : (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(material_1.List, null, state.results.slice(0, state.visibleItems).map((category) => (react_1.default.createElement(material_1.ListItem, { key: category.id },
-                react_1.default.createElement(Category_1.default, Object.assign({ elevation: 0, category: category, categoryFollowButtonProps: { onFollow: handleFollowersUpdate } }, CategoryProps)))))),
-            state.count > state.visibleItems && (react_1.default.createElement(material_1.Button, { className: classes.showMore, onClick: handleToggleDialogOpen },
-                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoriesPopularWidget.button.showAll", defaultMessage: "ui.categoriesPopularWidget.button.showAll" }))))),
-        openDialog && (react_1.default.createElement(DialogRoot, Object.assign({ className: classes.dialogRoot, title: react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoriesPopularWidget.title", id: "ui.categoriesPopularWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps),
-            react_1.default.createElement(InfiniteScroll_1.default, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: react_1.default.createElement(Category_1.CategorySkeleton, Object.assign({ elevation: 0 }, CategoryProps)), height: isMobile ? '100%' : 400, endMessage: react_1.default.createElement(material_1.Typography, { className: classes.endMessage },
-                    react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoriesPopularWidget.noMoreResults", defaultMessage: "ui.categoriesPopularWidget.noMoreResults" })) },
-                react_1.default.createElement(material_1.List, null, state.results.map((c) => (react_1.default.createElement(material_1.ListItem, { key: c.id },
-                    react_1.default.createElement(Category_1.default, Object.assign({ elevation: 0, category: c }, CategoryProps, { categoryFollowButtonProps: { onFollow: handleFollowersUpdate } })))))))))));
-    return (react_1.default.createElement(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest), content));
+    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoriesPopularWidget.title", defaultMessage: "ui.categoriesPopularWidget.title" }) })), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoriesPopularWidget.noResults", defaultMessage: "ui.categoriesPopularWidget.noResults" }) }))) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.List, { children: state.results.slice(0, state.visibleItems).map((category) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.default, Object.assign({ elevation: 0, category: category, categoryFollowButtonProps: { onFollow: handleFollowersUpdate } }, CategoryProps)) }, category.id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoriesPopularWidget.button.showAll", defaultMessage: "ui.categoriesPopularWidget.button.showAll" }) })))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoriesPopularWidget.title", id: "ui.categoriesPopularWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(Category_1.CategorySkeleton, Object.assign({ elevation: 0 }, CategoryProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoriesPopularWidget.noMoreResults", defaultMessage: "ui.categoriesPopularWidget.noMoreResults" }) })) }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: state.results.map((c) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.default, Object.assign({ elevation: 0, category: c }, CategoryProps, { categoryFollowButtonProps: { onFollow: handleFollowersUpdate } })) }, c.id))) }) })) })))] }));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: content })));
 }
 exports.default = CategoriesPopularWidget;

package/lib/cjs/components/CategoriesPopularWidget/Skeleton.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const Skeleton_1 = tslib_1.__importDefault(require("../CategoriesSuggestionWidget/Skeleton"));
 const styles_1 = require("@mui/material/styles");
 const constants_1 = require("./constants");
@@ -33,6 +33,6 @@ const Root = (0, styles_1.styled)(Skeleton_1.default, {
  *
  */
 function CategoriesPopularSkeleton(props) {
-    return react_1.default.createElement(Root, Object.assign({ className: classes.root }, props));
+    return (0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, props));
 }
 exports.default = CategoriesPopularSkeleton;

package/lib/cjs/components/CategoriesSuggestionWidget/CategoriesSuggestionWidget.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = tslib_1.__importStar(require("react"));
 const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
@@ -175,25 +176,12 @@ function CategoriesSuggestionWidget(inProps) {
     };
     // RENDER
     if ((autoHide && !state.count && state.initialized) || !scUserContext.user) {
-        return react_1.default.createElement(HiddenPlaceholder_1.default, null);
+        return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
     }
     if (!state.initialized) {
-        return react_1.default.createElement(Skeleton_1.default, null);
+        return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
     }
-    const content = (react_1.default.createElement(material_1.CardContent, null,
-        react_1.default.createElement(material_1.Typography, { className: classes.title, variant: "h5" },
-            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoriesSuggestionWidget.title", defaultMessage: "ui.categoriesSuggestionWidget.title" })),
-        !state.count ? (react_1.default.createElement(material_1.Typography, { className: classes.noResults, variant: "body2" },
-            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoriesSuggestionWidget.noResults", defaultMessage: "ui.categoriesSuggestionWidget.noResults" }))) : (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(material_1.List, null, state.results.slice(0, state.visibleItems).map((category) => (react_1.default.createElement(material_1.ListItem, { key: category.id },
-                react_1.default.createElement(Category_1.default, Object.assign({ elevation: 0, category: category, categoryFollowButtonProps: { onFollow: handleFollow } }, CategoryProps)))))),
-            state.count > state.visibleItems && (react_1.default.createElement(material_1.Button, { className: classes.showMore, onClick: handleToggleDialogOpen },
-                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoriesSuggestionWidget.button.showAll", defaultMessage: "ui.categoriesSuggestionWidget.button.showAll" }))))),
-        openDialog && (react_1.default.createElement(DialogRoot, Object.assign({ className: classes.dialogRoot, title: react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoriesSuggestionWidget.title", id: "ui.categoriesSuggestionWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps),
-            react_1.default.createElement(InfiniteScroll_1.default, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: react_1.default.createElement(Category_1.CategorySkeleton, Object.assign({ elevation: 0 }, CategoryProps)), height: isMobile ? '100%' : 400, endMessage: react_1.default.createElement(material_1.Typography, { className: classes.endMessage },
-                    react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoriesSuggestionWidget.noMoreResults", defaultMessage: "ui.categoriesSuggestionWidget.noMoreResults" })) },
-                react_1.default.createElement(material_1.List, null, state.results.map((c) => (react_1.default.createElement(material_1.ListItem, { key: c.id },
-                    react_1.default.createElement(Category_1.default, Object.assign({ elevation: 0, category: c }, CategoryProps, { categoryFollowButtonProps: { onFollow: handleFollow } })))))))))));
-    return (react_1.default.createElement(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest), content));
+    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoriesSuggestionWidget.title", defaultMessage: "ui.categoriesSuggestionWidget.title" }) })), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoriesSuggestionWidget.noResults", defaultMessage: "ui.categoriesSuggestionWidget.noResults" }) }))) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.List, { children: state.results.slice(0, state.visibleItems).map((category) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.default, Object.assign({ elevation: 0, category: category, categoryFollowButtonProps: { onFollow: handleFollow } }, CategoryProps)) }, category.id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoriesSuggestionWidget.button.showAll", defaultMessage: "ui.categoriesSuggestionWidget.button.showAll" }) })))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoriesSuggestionWidget.title", id: "ui.categoriesSuggestionWidget.title" }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(Category_1.CategorySkeleton, Object.assign({ elevation: 0 }, CategoryProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoriesSuggestionWidget.noMoreResults", defaultMessage: "ui.categoriesSuggestionWidget.noMoreResults" }) })) }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: state.results.map((c) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Category_1.default, Object.assign({ elevation: 0, category: c }, CategoryProps, { categoryFollowButtonProps: { onFollow: handleFollow } })) }, c.id))) }) })) })))] }));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: content })));
 }
 exports.default = CategoriesSuggestionWidget;

package/lib/cjs/components/CategoriesSuggestionWidget/Skeleton.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const List_1 = tslib_1.__importDefault(require("@mui/material/List"));
 const styles_1 = require("@mui/material/styles");
 const Skeleton_1 = tslib_1.__importDefault(require("../Category/Skeleton"));
@@ -38,9 +38,6 @@ const Root = (0, styles_1.styled)(Widget_1.default, {
  *
  */
 function CategoriesSuggestionWidgetSkeleton(props) {
-    return (react_1.default.createElement(Root, Object.assign({ className: classes.root }, props),
-        react_1.default.createElement(material_1.CardContent, null,
-            react_1.default.createElement(List_1.default, { className: classes.list }, [...Array(4)].map((category, index) => (react_1.default.createElement(material_1.ListItem, { key: index },
-                react_1.default.createElement(Skeleton_1.default, { elevation: 0 }))))))));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, props, { children: (0, jsx_runtime_1.jsx)(material_1.CardContent, { children: (0, jsx_runtime_1.jsx)(List_1.default, Object.assign({ className: classes.list }, { children: [...Array(4)].map((category, index) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { elevation: 0 }) }, index))) })) }) })));
 }
 exports.default = CategoriesSuggestionWidgetSkeleton;

package/lib/cjs/components/Category/Category.js

@@ -1,7 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
 const react_core_1 = require("@selfcommunity/react-core");
@@ -78,12 +79,11 @@ function Category(inProps) {
     // HOOKS
     const intl = (0, react_intl_1.useIntl)();
     if (!scCategory) {
-        return react_1.default.createElement(Skeleton_1.default, { elevation: elevation });
+        return (0, jsx_runtime_1.jsx)(Skeleton_1.default, { elevation: elevation });
     }
     // RENDER
     if (!autoHide) {
-        return (react_1.default.createElement(Root, Object.assign({ disableTypography: showTooltip, elevation: elevation, className: (0, classnames_1.default)(classes.root, className, { [classes.followed]: scCategory.followed }, { [classes.autoFollowed]: scCategory.auto_follow === types_1.SCCategoryAutoFollowType.FORCED }), ButtonBaseProps: _ButtonBaseProps, image: react_1.default.createElement(material_1.Avatar, { alt: scCategory.name, src: scCategory.image_medium, variant: "square", className: classes.categoryImage }), primary: react_1.default.createElement(react_1.default.Fragment, null, showTooltip ? (react_1.default.createElement(material_1.Tooltip, { title: scCategory.name },
-                react_1.default.createElement(material_1.Typography, { className: classes.primary, component: "span", variant: "body1" }, scCategory.name))) : (scCategory.name)), secondary: react_1.default.createElement(react_1.default.Fragment, null, showTooltip ? (react_1.default.createElement(material_1.Typography, { className: classes.secondary, component: "p", variant: "body2" }, showFollowers ? `${intl.formatMessage(messages.categoryFollowers, { total: scCategory.followers_counter })}` : scCategory.slogan)) : (react_1.default.createElement(react_1.default.Fragment, null, showFollowers ? `${intl.formatMessage(messages.categoryFollowers, { total: scCategory.followers_counter })}` : scCategory.slogan))), actions: react_1.default.createElement(CategoryFollowButton_1.default, Object.assign({ category: scCategory }, categoryFollowButtonProps)) }, rest)));
+        return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ disableTypography: showTooltip, elevation: elevation, className: (0, classnames_1.default)(classes.root, className, { [classes.followed]: scCategory.followed }, { [classes.autoFollowed]: scCategory.auto_follow === types_1.SCCategoryAutoFollowType.FORCED }), ButtonBaseProps: _ButtonBaseProps, image: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: scCategory.name, src: scCategory.image_medium, variant: "square", className: classes.categoryImage }), primary: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: showTooltip ? ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: scCategory.name }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.primary, component: "span", variant: "body1" }, { children: scCategory.name })) }))) : (scCategory.name) }), secondary: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: showTooltip ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.secondary, component: "p", variant: "body2" }, { children: showFollowers ? `${intl.formatMessage(messages.categoryFollowers, { total: scCategory.followers_counter })}` : scCategory.slogan }))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: showFollowers ? `${intl.formatMessage(messages.categoryFollowers, { total: scCategory.followers_counter })}` : scCategory.slogan })) }), actions: (0, jsx_runtime_1.jsx)(CategoryFollowButton_1.default, Object.assign({ category: scCategory }, categoryFollowButtonProps)) }, rest)));
     }
     return null;
 }

package/lib/cjs/components/Category/Skeleton.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const styles_1 = require("@mui/material/styles");
 const Skeleton_1 = tslib_1.__importDefault(require("@mui/material/Skeleton"));
 const material_1 = require("@mui/material");
@@ -41,7 +41,6 @@ const Root = (0, styles_1.styled)(BaseItem_1.default, {
  */
 function CategorySkeleton(props) {
     const theme = (0, material_1.useTheme)();
-    return (react_1.default.createElement(Root, Object.assign({ className: classes.root }, props, { image: react_1.default.createElement(Skeleton_1.default, { animation: "wave", variant: "rectangular", width: theme.selfcommunity.category.icon.sizeMedium, height: theme.selfcommunity.category.icon.sizeMedium, className: classes.image }), primary: react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 10, width: 120, className: classes.primary }), secondary: react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 10, width: 70, className: classes.secondary }), actions: react_1.default.createElement(material_1.Button, { size: "small", variant: "outlined", disabled: true, className: classes.button },
-            react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 10, width: 50, className: classes.action })) })));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, props, { image: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", variant: "rectangular", width: theme.selfcommunity.category.icon.sizeMedium, height: theme.selfcommunity.category.icon.sizeMedium, className: classes.image }), primary: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", height: 10, width: 120, className: classes.primary }), secondary: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", height: 10, width: 70, className: classes.secondary }), actions: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", disabled: true, className: classes.button }, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", height: 10, width: 50, className: classes.action }) })) })));
 }
 exports.default = CategorySkeleton;

package/lib/cjs/components/CategoryAutocomplete/CategoryAutocomplete.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = tslib_1.__importStar(require("react"));
 const react_intl_1 = require("react-intl");
 const Autocomplete_1 = tslib_1.__importDefault(require("@mui/material/Autocomplete"));
@@ -52,7 +53,7 @@ const CategoryAutocomplete = (inProps) => {
     // Props
     const { onChange, multiple = false, defaultValue = multiple ? [] : null, limitCountCategories = 0, checkboxSelect = false, disabled = false, TextFieldProps = {
         variant: 'outlined',
-        label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoryAutocomplete.label", defaultMessage: "ui.categoryAutocomplete.label" })
+        label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryAutocomplete.label", defaultMessage: "ui.categoryAutocomplete.label" })
     } } = props, rest = tslib_1.__rest(props, ["onChange", "multiple", "defaultValue", "limitCountCategories", "checkboxSelect", "disabled", "TextFieldProps"]);
     // State
     const [open, setOpen] = (0, react_1.useState)(false);
@@ -91,18 +92,14 @@ const CategoryAutocomplete = (inProps) => {
         setValue(newValue);
     };
     // Render
-    return (react_1.default.createElement(Root, Object.assign({ className: classes.root, multiple: multiple, open: open, onOpen: handleOpen, onClose: handleClose, filterSelectedOptions: !checkboxSelect, disableCloseOnSelect: checkboxSelect, options: categories || [], getOptionLabel: (option) => option.name || '', value: value, selectOnFocus: true, clearOnBlur: true, blurOnSelect: true, handleHomeEndKeys: true, clearIcon: null, disabled: disabled || isLoading, noOptionsText: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoryAutocomplete.empty", defaultMessage: "ui.categoryAutocomplete.empty" }), onChange: handleChange, isOptionEqualToValue: (option, value) => value.id === option.id, renderTags: (value, getTagProps) => {
-            return value.map((option, index) => (react_1.default.createElement(material_1.Chip, Object.assign({ key: option.id, id: option.id, label: option.name, color: option.color }, getTagProps({ index })))));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root, multiple: multiple, open: open, onOpen: handleOpen, onClose: handleClose, filterSelectedOptions: !checkboxSelect, disableCloseOnSelect: checkboxSelect, options: categories || [], getOptionLabel: (option) => option.name || '', value: value, selectOnFocus: true, clearOnBlur: true, blurOnSelect: true, handleHomeEndKeys: true, clearIcon: null, disabled: disabled || isLoading, noOptionsText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryAutocomplete.empty", defaultMessage: "ui.categoryAutocomplete.empty" }), onChange: handleChange, isOptionEqualToValue: (option, value) => value.id === option.id, renderTags: (value, getTagProps) => {
+            return value.map((option, index) => ((0, jsx_runtime_1.jsx)(material_1.Chip, Object.assign({ id: option.id, label: option.name, color: option.color }, getTagProps({ index })), option.id)));
         }, renderOption: (props, option, { selected, inputValue }) => {
             const matches = (0, match_1.default)(option.name, inputValue);
             const parts = (0, parse_1.default)(option.name, matches);
-            return (react_1.default.createElement("li", Object.assign({}, props),
-                checkboxSelect && react_1.default.createElement(Checkbox_1.default, { style: { marginRight: 8 }, checked: selected }),
-                react_1.default.createElement(material_1.Chip, { label: react_1.default.createElement(react_1.default.Fragment, null, parts.map((part, index) => (react_1.default.createElement("span", { key: index, style: { fontWeight: part.highlight ? 700 : 400 } }, part.text)))) })));
+            return ((0, jsx_runtime_1.jsxs)("li", Object.assign({}, props, { children: [checkboxSelect && (0, jsx_runtime_1.jsx)(Checkbox_1.default, { style: { marginRight: 8 }, checked: selected }), (0, jsx_runtime_1.jsx)(material_1.Chip, { label: (0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: parts.map((part, index) => ((0, jsx_runtime_1.jsx)("span", Object.assign({ style: { fontWeight: part.highlight ? 700 : 400 } }, { children: part.text }), index))) }) })] })));
         }, renderInput: (params) => {
-            return (react_1.default.createElement(TextField_1.default, Object.assign({}, params, TextFieldProps, { margin: "dense", InputProps: Object.assign(Object.assign({}, params.InputProps), { autoComplete: 'categories', endAdornment: (react_1.default.createElement(react_1.default.Fragment, null,
-                        isLoading ? react_1.default.createElement(CircularProgress_1.default, { color: "inherit", size: 20 }) : null,
-                        params.InputProps.endAdornment)) }) })));
+            return ((0, jsx_runtime_1.jsx)(TextField_1.default, Object.assign({}, params, TextFieldProps, { margin: "dense", InputProps: Object.assign(Object.assign({}, params.InputProps), { autoComplete: 'categories', endAdornment: ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [isLoading ? (0, jsx_runtime_1.jsx)(CircularProgress_1.default, { color: "inherit", size: 20 }) : null, params.InputProps.endAdornment] })) }) })));
         } }, rest)));
 };
 exports.default = CategoryAutocomplete;

package/lib/cjs/components/CategoryFollowButton/CategoryFollowButton.js

@@ -1,7 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const styles_1 = require("@mui/material/styles");
 const utils_1 = require("@selfcommunity/utils");
 const react_core_1 = require("@selfcommunity/react-core");
@@ -91,6 +92,6 @@ function CategoryFollowButton(inProps) {
     if (!scCategory || (scCategory && followed && scCategory.auto_follow === types_1.SCCategoryAutoFollowType.FORCED)) {
         return null;
     }
-    return (react_1.default.createElement(FollowButton, Object.assign({ size: "small", variant: "outlined", onClick: handleFollowAction, loading: scUserContext.user ? followed === null || scCategoriesManager.isLoading(scCategory) : null, className: (0, classnames_1.default)(classes.root, className) }, rest), followed && scUserContext.user ? (react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoryFollowButton.unfollow", id: "ui.categoryFollowButton.unfollow" })) : (react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoryFollowButton.follow", id: "ui.categoryFollowButton.follow" }))));
+    return ((0, jsx_runtime_1.jsx)(FollowButton, Object.assign({ size: "small", variant: "outlined", onClick: handleFollowAction, loading: scUserContext.user ? followed === null || scCategoriesManager.isLoading(scCategory) : null, className: (0, classnames_1.default)(classes.root, className) }, rest, { children: followed && scUserContext.user ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoryFollowButton.unfollow", id: "ui.categoryFollowButton.unfollow" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoryFollowButton.follow", id: "ui.categoryFollowButton.follow" })) })));
 }
 exports.default = CategoryFollowButton;

package/lib/cjs/components/CategoryFollowersButton/CategoryFollowersButton.js

@@ -1,7 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
 const BaseDialog_1 = tslib_1.__importDefault(require("../../shared/BaseDialog"));
@@ -124,12 +125,6 @@ function CategoryFollowersButton(inProps) {
     // RENDER
     const theme = (0, material_1.useTheme)();
     const isMobile = (0, useMediaQuery_1.default)(theme.breakpoints.down('md'));
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), onClick: handleToggleDialogOpen, disabled: loading || !scCategory || scCategory.followers_counter === 0 }, rest), loading || !scCategory ? (react_1.default.createElement(AvatarGroupSkeleton_1.default, Object.assign({}, rest))) : (react_1.default.createElement(material_1.AvatarGroup, { total: scCategory.followers_counter }, followers.map((c) => (react_1.default.createElement(material_1.Avatar, { key: c.id, alt: c.username, src: c.avatar })))))),
-        open && (react_1.default.createElement(DialogRoot, Object.assign({ className: classes.dialogRoot, title: react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoryFollowersButton.dialogTitle", id: "ui.categoryFollowersButton.dialogTitle", values: { total: scCategory.followers_counter } }), onClose: handleToggleDialogOpen, open: open }, DialogProps),
-            react_1.default.createElement(InfiniteScroll_1.default, { dataLength: followers.length, next: fetchFollowers, hasMoreNext: next !== null || loading, loaderNext: react_1.default.createElement(User_1.UserSkeleton, { elevation: 0 }), height: isMobile ? '100%' : 400, endMessage: react_1.default.createElement(material_1.Typography, { className: classes.endMessage },
-                    react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoryFollowersButton.noOtherFollowers", defaultMessage: "ui.categoryFollowersButton.noOtherFollowers" })) },
-                react_1.default.createElement(material_1.List, null, followers.map((follower) => (react_1.default.createElement(material_1.ListItem, { key: follower.id },
-                    react_1.default.createElement(User_1.default, { elevation: 0, user: follower }))))))))));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), onClick: handleToggleDialogOpen, disabled: loading || !scCategory || scCategory.followers_counter === 0 }, rest, { children: loading || !scCategory ? ((0, jsx_runtime_1.jsx)(AvatarGroupSkeleton_1.default, Object.assign({}, rest))) : ((0, jsx_runtime_1.jsx)(material_1.AvatarGroup, Object.assign({ total: scCategory.followers_counter }, { children: followers.map((c) => ((0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: c.username, src: c.avatar }, c.id))) }))) })), open && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoryFollowersButton.dialogTitle", id: "ui.categoryFollowersButton.dialogTitle", values: { total: scCategory.followers_counter } }), onClose: handleToggleDialogOpen, open: open }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: followers.length, next: fetchFollowers, hasMoreNext: next !== null || loading, loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, { elevation: 0 }), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryFollowersButton.noOtherFollowers", defaultMessage: "ui.categoryFollowersButton.noOtherFollowers" }) })) }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: followers.map((follower) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, { elevation: 0, user: follower }) }, follower.id))) }) })) })))] }));
 }
 exports.default = CategoryFollowersButton;

package/lib/cjs/components/CategoryHeader/CategoryHeader.js

@@ -1,7 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
 const CategoryFollowButton_1 = tslib_1.__importDefault(require("../CategoryFollowButton"));
@@ -75,16 +76,6 @@ function CategoryHeader(inProps) {
     if (!scCategory) {
         return null;
     }
-    return (react_1.default.createElement(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest),
-        react_1.default.createElement(material_1.Paper, { style: _backgroundCover, classes: { root: classes.cover } }),
-        react_1.default.createElement(material_1.Box, { className: classes.info },
-            react_1.default.createElement(material_1.Typography, { variant: "h3", className: classes.name, gutterBottom: true }, scCategory.name),
-            scCategory.slogan && (react_1.default.createElement(material_1.Typography, { variant: "h5", className: classes.slogan }, scCategory.slogan)),
-            react_1.default.createElement(material_1.Box, { className: classes.followed },
-                react_1.default.createElement(material_1.Typography, { className: classes.followedCounter, component: "div" },
-                    react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoryHeader.followedBy", defaultMessage: "ui.categoryHeader.followedBy", values: { total: scCategory.followers_counter } })),
-                react_1.default.createElement(CategoryFollowersButton_1.default, Object.assign({ category: scCategory, categoryId: scCategory === null || scCategory === void 0 ? void 0 : scCategory.id }, CategoryFollowersButtonProps))),
-            react_1.default.createElement(material_1.Box, { className: classes.action },
-                react_1.default.createElement(CategoryFollowButton_1.default, Object.assign({ category: scCategory, onFollow: handleFollow }, CategoryFollowButtonProps))))));
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.Paper, { style: _backgroundCover, classes: { root: classes.cover } }), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.info }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3", className: classes.name, gutterBottom: true }, { children: scCategory.name })), scCategory.slogan && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.slogan }, { children: scCategory.slogan }))), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.followed }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.followedCounter, component: "div" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryHeader.followedBy", defaultMessage: "ui.categoryHeader.followedBy", values: { total: scCategory.followers_counter } }) })), (0, jsx_runtime_1.jsx)(CategoryFollowersButton_1.default, Object.assign({ category: scCategory, categoryId: scCategory === null || scCategory === void 0 ? void 0 : scCategory.id }, CategoryFollowersButtonProps))] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.action }, { children: (0, jsx_runtime_1.jsx)(CategoryFollowButton_1.default, Object.assign({ category: scCategory, onFollow: handleFollow }, CategoryFollowButtonProps)) }))] }))] })));
 }
 exports.default = CategoryHeader;

package/lib/cjs/components/CategoryHeader/Skeleton.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const material_1 = require("@mui/material");
 const styles_1 = require("@mui/material/styles");
 const Skeleton_1 = tslib_1.__importDefault(require("@mui/material/Skeleton"));
@@ -35,11 +35,6 @@ const Root = (0, styles_1.styled)(material_1.Box, {
  *
  */
 function CategoryHeaderSkeleton() {
-    return (react_1.default.createElement(Root, { className: classes.root },
-        react_1.default.createElement(Skeleton_1.default, { sx: { height: 230 }, animation: "wave", variant: "rectangular", className: classes.cover }),
-        react_1.default.createElement(material_1.Box, null,
-            react_1.default.createElement(Skeleton_1.default, { animation: "wave", sx: { height: 20, maxWidth: 300, width: '100%', margin: '0 auto' } })),
-        react_1.default.createElement(material_1.Box, null,
-            react_1.default.createElement(Skeleton_1.default, { animation: "wave", sx: { height: 20, maxWidth: 300, width: '100%', margin: '0 auto' } }))));
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { sx: { height: 230 }, animation: "wave", variant: "rectangular", className: classes.cover }), (0, jsx_runtime_1.jsx)(material_1.Box, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", sx: { height: 20, maxWidth: 300, width: '100%', margin: '0 auto' } }) }), (0, jsx_runtime_1.jsx)(material_1.Box, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", sx: { height: 20, maxWidth: 300, width: '100%', margin: '0 auto' } }) })] })));
 }
 exports.default = CategoryHeaderSkeleton;

package/lib/cjs/components/CategoryTrendingFeedWidget/CategoryTrendingFeedWidget.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = tslib_1.__importStar(require("react"));
 const styles_1 = require("@mui/material/styles");
 const List_1 = tslib_1.__importDefault(require("@mui/material/List"));
@@ -176,27 +177,14 @@ function CategoryTrendingFeedWidget(inProps) {
     };
     // RENDER
     if ((!contentAvailability && !scUserContext.user) || (autoHide && !state.count && state.initialized)) {
-        return react_1.default.createElement(HiddenPlaceholder_1.default, null);
+        return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
     }
     if (!state.initialized) {
-        return react_1.default.createElement(Skeleton_1.default, null);
+        return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
     }
-    const content = (react_1.default.createElement(material_1.CardContent, null,
-        react_1.default.createElement(material_1.Typography, { className: classes.title, variant: "h5" },
-            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingFeedWidget.title", defaultMessage: "ui.categoryTrendingFeedWidget.title" })),
-        !state.count ? (react_1.default.createElement(material_1.Typography, { className: classes.noResults, variant: "body2" },
-            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingFeedWidget.noResults", defaultMessage: "ui.categoryTrendingFeedWidget.noResults" }))) : (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(List_1.default, null, state.results.slice(0, state.visibleItems).map((obj) => (react_1.default.createElement(material_1.ListItem, { key: obj[obj.type].id },
-                react_1.default.createElement(FeedObject_1.default, Object.assign({ elevation: 0, feedObject: obj[obj.type] }, FeedObjectProps)))))),
-            state.count > state.visibleItems && (react_1.default.createElement(material_1.Button, Object.assign({ className: classes.showMore }, (isMobile
-                ? { onClick: handleToggleDialogOpen }
-                : { component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.CATEGORY_TRENDING_FEED_ROUTE_NAME, scCategory) })),
-                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingFeedWidget.button.showAll", defaultMessage: "ui.categoryTrendingFeedWidget.button.showAll" }))))),
-        openDialog && (react_1.default.createElement(DialogRoot, Object.assign({ className: classes.dialogRoot, title: react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoryTrendingFeedWidget.title", id: "ui.categoryTrendingFeedWidget.title", values: { total: state.count } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps),
-            react_1.default.createElement(InfiniteScroll_1.default, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: react_1.default.createElement(FeedObject_1.FeedObjectSkeleton, Object.assign({ elevation: 0 }, FeedObjectProps)), height: isMobile ? '100%' : 400, endMessage: react_1.default.createElement(material_1.Typography, { className: classes.endMessage },
-                    react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingFeedWidget.noMoreResults", defaultMessage: "ui.categoryTrendingFeedWidget.noMoreResults" })) },
-                react_1.default.createElement(List_1.default, null, state.results.map((obj) => (react_1.default.createElement(material_1.ListItem, { key: obj[obj.type].id },
-                    react_1.default.createElement(FeedObject_1.default, Object.assign({ elevation: 0, feedObject: obj[obj.type] }, FeedObjectProps)))))))))));
-    return (react_1.default.createElement(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest), content));
+    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingFeedWidget.title", defaultMessage: "ui.categoryTrendingFeedWidget.title" }) })), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingFeedWidget.noResults", defaultMessage: "ui.categoryTrendingFeedWidget.noResults" }) }))) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, state.visibleItems).map((obj) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(FeedObject_1.default, Object.assign({ elevation: 0, feedObject: obj[obj.type] }, FeedObjectProps)) }, obj[obj.type].id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.showMore }, (isMobile
+                        ? { onClick: handleToggleDialogOpen }
+                        : { component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.CATEGORY_TRENDING_FEED_ROUTE_NAME, scCategory) }), { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingFeedWidget.button.showAll", defaultMessage: "ui.categoryTrendingFeedWidget.button.showAll" }) })))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoryTrendingFeedWidget.title", id: "ui.categoryTrendingFeedWidget.title", values: { total: state.count } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(FeedObject_1.FeedObjectSkeleton, Object.assign({ elevation: 0 }, FeedObjectProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingFeedWidget.noMoreResults", defaultMessage: "ui.categoryTrendingFeedWidget.noMoreResults" }) })) }, { children: (0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.map((obj) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(FeedObject_1.default, Object.assign({ elevation: 0, feedObject: obj[obj.type] }, FeedObjectProps)) }, obj[obj.type].id))) }) })) })))] }));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: content })));
 }
 exports.default = CategoryTrendingFeedWidget;

package/lib/cjs/components/CategoryTrendingFeedWidget/Skeleton.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const Widget_1 = tslib_1.__importDefault(require("../Widget"));
 const List_1 = tslib_1.__importDefault(require("@mui/material/List"));
 const styles_1 = require("@mui/material/styles");
@@ -38,8 +38,6 @@ const Root = (0, styles_1.styled)(Widget_1.default, {
  *
  */
 function CategoryTrendingFeedWidgetSkeleton(props) {
-    return (react_1.default.createElement(Root, Object.assign({ className: classes.root }, props),
-        react_1.default.createElement(material_1.CardContent, null,
-            react_1.default.createElement(List_1.default, { className: classes.list }, [...Array(4)].map((post, index) => (react_1.default.createElement(Skeleton_1.default, { key: index, elevation: 0 })))))));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, props, { children: (0, jsx_runtime_1.jsx)(material_1.CardContent, { children: (0, jsx_runtime_1.jsx)(List_1.default, Object.assign({ className: classes.list }, { children: [...Array(4)].map((post, index) => ((0, jsx_runtime_1.jsx)(Skeleton_1.default, { elevation: 0 }, index))) })) }) })));
 }
 exports.default = CategoryTrendingFeedWidgetSkeleton;

package/lib/cjs/components/CategoryTrendingUsersWidget/CategoryTrendingUsersWidget.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = tslib_1.__importStar(require("react"));
 const styles_1 = require("@mui/material/styles");
 const List_1 = tslib_1.__importDefault(require("@mui/material/List"));
@@ -168,25 +169,12 @@ function CategoryTrendingUsersWidget(inProps) {
     };
     // RENDER
     if ((!contentAvailability && !scUserContext.user) || (autoHide && !state.count && state.initialized)) {
-        return react_1.default.createElement(HiddenPlaceholder_1.default, null);
+        return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
     }
     if (!state.initialized) {
-        return react_1.default.createElement(Skeleton_1.default, null);
+        return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
     }
-    const content = (react_1.default.createElement(material_1.CardContent, null,
-        react_1.default.createElement(material_1.Typography, { className: classes.title, variant: "h5" },
-            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingUsersWidget.title", defaultMessage: "ui.categoryTrendingUsersWidget.title" })),
-        !state.count ? (react_1.default.createElement(material_1.Typography, { className: classes.noResults, variant: "body2" },
-            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingUsersWidget.noResults", defaultMessage: "ui.categoryTrendingUsersWidget.noResults" }))) : (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(List_1.default, null, state.results.slice(0, state.visibleItems).map((user) => (react_1.default.createElement(material_1.ListItem, { key: user.id },
-                react_1.default.createElement(User_1.default, Object.assign({ elevation: 0, user: user }, UserProps)))))),
-            state.count > state.visibleItems && (react_1.default.createElement(material_1.Button, { className: classes.showMore, onClick: handleToggleDialogOpen },
-                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingUsersWidget.button.showAll", defaultMessage: "ui.categoryTrendingUsersWidget.button.showAll" }))))),
-        openDialog && (react_1.default.createElement(DialogRoot, Object.assign({ className: classes.dialogRoot, title: react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoryTrendingUsersWidget.title", id: "ui.categoryTrendingUsersWidget.title", values: { total: state.count } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps),
-            react_1.default.createElement(InfiniteScroll_1.default, { dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: react_1.default.createElement(User_1.UserSkeleton, Object.assign({ elevation: 0 }, UserProps)), height: isMobile ? '100%' : 400, endMessage: react_1.default.createElement(material_1.Typography, { className: classes.endMessage },
-                    react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingUsersWidget.noMoreResults", defaultMessage: "ui.categoryTrendingUsersWidget.noMoreResults" })) },
-                react_1.default.createElement(List_1.default, null, state.results.map((user) => (react_1.default.createElement(material_1.ListItem, { key: user.id },
-                    react_1.default.createElement(User_1.default, Object.assign({ elevation: 0, user: user }, UserProps)))))))))));
-    return (react_1.default.createElement(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest), content));
+    const content = ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.title, variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingUsersWidget.title", defaultMessage: "ui.categoryTrendingUsersWidget.title" }) })), !state.count ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.noResults, variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingUsersWidget.noResults", defaultMessage: "ui.categoryTrendingUsersWidget.noResults" }) }))) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, state.visibleItems).map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user }, UserProps)) }, user.id))) }), state.count > state.visibleItems && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.showMore, onClick: handleToggleDialogOpen }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingUsersWidget.button.showAll", defaultMessage: "ui.categoryTrendingUsersWidget.button.showAll" }) })))] })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoryTrendingUsersWidget.title", id: "ui.categoryTrendingUsersWidget.title", values: { total: state.count } }), onClose: handleToggleDialogOpen, open: openDialog }, DialogProps, { children: (0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: state.results.length, next: handleNext, hasMoreNext: Boolean(state.next), loaderNext: (0, jsx_runtime_1.jsx)(User_1.UserSkeleton, Object.assign({ elevation: 0 }, UserProps)), height: isMobile ? '100%' : 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.endMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryTrendingUsersWidget.noMoreResults", defaultMessage: "ui.categoryTrendingUsersWidget.noMoreResults" }) })) }, { children: (0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.map((user) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, Object.assign({ elevation: 0, user: user }, UserProps)) }, user.id))) }) })) })))] }));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: content })));
 }
 exports.default = CategoryTrendingUsersWidget;

package/lib/cjs/components/CategoryTrendingUsersWidget/Skeleton.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const Widget_1 = tslib_1.__importDefault(require("../Widget"));
 const List_1 = tslib_1.__importDefault(require("@mui/material/List"));
 const styles_1 = require("@mui/material/styles");
@@ -38,9 +38,6 @@ const Root = (0, styles_1.styled)(Widget_1.default, {
  *
  */
 function CategoryTrendingPeopleWidgetSkeleton(props) {
-    return (react_1.default.createElement(Root, Object.assign({ className: classes.root }, props),
-        react_1.default.createElement(material_1.CardContent, null,
-            react_1.default.createElement(List_1.default, { className: classes.list }, [...Array(4)].map((person, index) => (react_1.default.createElement(material_1.ListItem, { key: index },
-                react_1.default.createElement(Skeleton_1.default, { elevation: 0 }))))))));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, props, { children: (0, jsx_runtime_1.jsx)(material_1.CardContent, { children: (0, jsx_runtime_1.jsx)(List_1.default, Object.assign({ className: classes.list }, { children: [...Array(4)].map((person, index) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { elevation: 0 }) }, index))) })) }) })));
 }
 exports.default = CategoryTrendingPeopleWidgetSkeleton;

package/lib/cjs/components/ChangeCover/ChangeCover.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = tslib_1.__importStar(require("react"));
 const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
@@ -168,60 +169,36 @@ function ChangeCover(inProps) {
      * Renders change cover menu items
      */
     function renderMenuItems() {
-        return (react_1.default.createElement(material_1.Box, null, loading ? (react_1.default.createElement(material_1.MenuItem, { sx: { justifyContent: 'center' } },
-            react_1.default.createElement(CircularProgress_1.default, { size: 15 }))) : (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement("input", { type: "file", onChange: handleUpload, ref: fileInput, hidden: true, accept: ".gif,.png,.jpg,.jpeg" }),
-            react_1.default.createElement(material_1.MenuItem, { disabled: loading, onClick: () => fileInput.current.click(), className: classes.addMenuItem },
-                react_1.default.createElement(material_1.ListItemIcon, null,
-                    react_1.default.createElement(Icon_1.default, null, "add_circle_outline")),
-                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.changeCover.button.upload", defaultMessage: "ui.changeCover.button.upload" })),
-            hasCover && (react_1.default.createElement(material_1.MenuItem, { className: classes.delMenuItem, onClick: () => setOpenDeleteCoverDialog(true) },
-                react_1.default.createElement(material_1.ListItemIcon, null,
-                    react_1.default.createElement(Icon_1.default, null, "delete")),
-                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.changeCover.button.delete", defaultMessage: "ui.changeCover.button.delete" })))))));
+        return ((0, jsx_runtime_1.jsx)(material_1.Box, { children: loading ? ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ sx: { justifyContent: 'center' } }, { children: (0, jsx_runtime_1.jsx)(CircularProgress_1.default, { size: 15 }) }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", { type: "file", onChange: handleUpload, ref: fileInput, hidden: true, accept: ".gif,.png,.jpg,.jpeg" }), (0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ disabled: loading, onClick: () => fileInput.current.click(), className: classes.addMenuItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "add_circle_outline" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.changeCover.button.upload", defaultMessage: "ui.changeCover.button.upload" })] })), hasCover && ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ className: classes.delMenuItem, onClick: () => setOpenDeleteCoverDialog(true) }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "delete" }) }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.changeCover.button.delete", defaultMessage: "ui.changeCover.button.delete" })] })))] })) }));
     }
     /**
      * Renders change cover menu
      */
-    const cc = (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(material_1.Button, Object.assign({ size: "small", variant: "contained", disabled: loading, onClick: handleOpen }, rest),
-            react_1.default.createElement(Icon_1.default, null, "photo_camera")),
-        react_1.default.createElement(react_1.default.Fragment, null, isMobile ? (react_1.default.createElement(material_1.SwipeableDrawer, { open: open, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true }, renderMenuItems())) : (react_1.default.createElement(material_1.Menu, { anchorEl: anchorEl, open: open, onClose: handleClose }, renderMenuItems()))),
-        !isMobile && (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(material_1.Button, { className: classes.helpPopover, variant: "contained", onClick: handleClickHelpButton },
-                react_1.default.createElement(Icon_1.default, null, "help_outline")),
-            isOpen && (react_1.default.createElement(material_1.Popover, { open: isOpen, anchorEl: anchorElPopover, onClose: handleCloseHelpPopover, anchorOrigin: {
-                    vertical: 'bottom',
-                    horizontal: 'right'
-                } },
-                react_1.default.createElement(material_1.Box, { sx: { p: '10px' } },
-                    react_1.default.createElement(material_1.Typography, { component: "h3" },
-                        react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.changeCover.button.uploadA", defaultMessage: "ui.changeCover.button.uploadA" })),
-                    react_1.default.createElement(material_1.Divider, null),
-                    react_1.default.createElement(material_1.Typography, { component: "span" },
-                        react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.changeCover.info", defaultMessage: "ui.changeCover.info", values: {
-                                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                // @ts-ignore
-                                li: (chunks) => react_1.default.createElement("li", null, chunks),
-                                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                // @ts-ignore
-                                ul: (chunks) => react_1.default.createElement("ul", null, chunks)
-                            } }))))))),
-        openDeleteCoverDialog && (react_1.default.createElement(ConfirmDialog_1.default, { open: openDeleteCoverDialog, title: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.changeCover.dialog.msg", defaultMessage: "ui.changeCover.dialog.msg" }), onConfirm: deleteCover, isUpdating: isDeletingCover, onClose: () => {
-                setOpenDeleteCoverDialog(false);
-                setAnchorEl(null);
-            } }))));
+    const cc = ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "contained", disabled: loading, onClick: handleOpen }, rest, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "photo_camera" }) })), (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isMobile ? ((0, jsx_runtime_1.jsx)(material_1.SwipeableDrawer, Object.assign({ open: open, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true }, { children: renderMenuItems() }))) : ((0, jsx_runtime_1.jsx)(material_1.Menu, Object.assign({ anchorEl: anchorEl, open: open, onClose: handleClose }, { children: renderMenuItems() }))) }), !isMobile && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ className: classes.helpPopover, variant: "contained", onClick: handleClickHelpButton }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "help_outline" }) })), isOpen && ((0, jsx_runtime_1.jsx)(material_1.Popover, Object.assign({ open: isOpen, anchorEl: anchorElPopover, onClose: handleCloseHelpPopover, anchorOrigin: {
+                            vertical: 'bottom',
+                            horizontal: 'right'
+                        } }, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ sx: { p: '10px' } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "h3" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.changeCover.button.uploadA", defaultMessage: "ui.changeCover.button.uploadA" }) })), (0, jsx_runtime_1.jsx)(material_1.Divider, {}), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.changeCover.info", defaultMessage: "ui.changeCover.info", values: {
+                                            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                                            // @ts-ignore
+                                            li: (chunks) => (0, jsx_runtime_1.jsx)("li", { children: chunks }),
+                                            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                                            // @ts-ignore
+                                            ul: (chunks) => (0, jsx_runtime_1.jsx)("ul", { children: chunks })
+                                        } }) }))] })) })))] })), openDeleteCoverDialog && ((0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: openDeleteCoverDialog, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.changeCover.dialog.msg", defaultMessage: "ui.changeCover.dialog.msg" }), onConfirm: deleteCover, isUpdating: isDeletingCover, onClose: () => {
+                    setOpenDeleteCoverDialog(false);
+                    setAnchorEl(null);
+                } }))] }));
     /**
      * If there is an error
      */
     if (alert) {
-        return (react_1.default.createElement(material_1.Alert, { color: "error", onClose: () => setAlert(null) }, alert));
+        return ((0, jsx_runtime_1.jsx)(material_1.Alert, Object.assign({ color: "error", onClose: () => setAlert(null) }, { children: alert })));
     }
     /**
      * Renders root object (if not hidden by autoHide prop)
      */
     if (!autoHide) {
-        return (react_1.default.createElement(Root, Object.assign({}, rest, { className: (0, classnames_1.default)(classes.root, className) }), cc));
+        return ((0, jsx_runtime_1.jsx)(Root, Object.assign({}, rest, { className: (0, classnames_1.default)(classes.root, className) }, { children: cc })));
     }
     return null;
 }