@selfcommunity/react-ui 0.7.50-events.40 → 0.7.50-events.43

package/lib/cjs/components/UserProfileEdit/Section/PublicInfo.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 Icon_1 = tslib_1.__importDefault(require("@mui/material/Icon"));
@@ -105,7 +106,7 @@ function PublicInfo(props) {
             scUserContext.updateUser(res.data);
             setEditing([]);
             setSaving([]);
-            enqueueSnackbar(react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userInfo.save.success", defaultMessage: "ui.userInfo.save.success" }), {
+            enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userInfo.save.success", defaultMessage: "ui.userInfo.save.success" }), {
                 variant: 'success',
                 autoHideDuration: 3000
             });
@@ -114,7 +115,7 @@ function PublicInfo(props) {
             .catch((e) => {
             setError(Object.assign(Object.assign({}, error), (0, api_services_1.formatHttpErrorCode)(e)));
             setSaving([]);
-            enqueueSnackbar(react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.common.error.action", defaultMessage: "ui.common.error.action" }), {
+            enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.common.error.action", defaultMessage: "ui.common.error.action" }), {
                 variant: 'error',
                 autoHideDuration: 3000
             });
@@ -149,7 +150,7 @@ function PublicInfo(props) {
             });
         let props = {
             InputProps: {
-                endAdornment: react_1.default.createElement(material_1.InputAdornment, { position: "end" }, isSaving && react_1.default.createElement(material_1.CircularProgress, { size: 10 }))
+                endAdornment: (0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: isSaving && (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 10 }) }))
             }
         };
         let content = null;
@@ -160,8 +161,7 @@ function PublicInfo(props) {
             case types_1.SCUserProfileFields.DATE_JOINED:
                 return null;
             case types_1.SCUserProfileFields.DATE_OF_BIRTH:
-                return (react_1.default.createElement(x_date_pickers_1.LocalizationProvider, { dateAdapter: AdapterDateFns_1.AdapterDateFns, key: field, adapterLocale: scContext.settings.locale.default === 'it' ? it_1.default : en_US_1.default },
-                    react_1.default.createElement(x_date_pickers_1.DatePicker, { label: intl.formatMessage({
+                return ((0, jsx_runtime_1.jsx)(x_date_pickers_1.LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns_1.AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? it_1.default : en_US_1.default }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.DatePicker, { label: intl.formatMessage({
                             id: `ui.userInfo.${(0, utils_1.camelCase)(field)}`,
                             defaultMessage: `ui.userInfo.${field}`
                         }), defaultValue: user[field] ? (0, date_fns_1.parseISO)(user[field]) : null, minDate: DATEPICKER_MINDATE, onChange: (newValue) => {
@@ -191,9 +191,7 @@ function PublicInfo(props) {
                                 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
                                 // @ts-ignore
                                 const _a = params.children.props, { children } = _a, rest = tslib_1.__rest(_a, ["children"]);
-                                return (react_1.default.createElement(material_1.InputAdornment, { position: 'end' },
-                                    react_1.default.createElement(material_1.IconButton, Object.assign({}, rest), children),
-                                    isSaving && react_1.default.createElement(material_1.CircularProgress, { size: 10 })));
+                                return ((0, jsx_runtime_1.jsxs)(material_1.InputAdornment, Object.assign({ position: 'end' }, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({}, rest, { children: children })), isSaving && (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 10 })] })));
                             }
                         }, 
                         // onAccept={isMobile ? handleSave(SCUserProfileFields.DATE_OF_BIRTH) : null}
@@ -204,13 +202,10 @@ function PublicInfo(props) {
                                 variant: 'outlined',
                                 helperText: _error || null,
                                 InputProps: {
-                                    endAdornment: isMobile && (react_1.default.createElement(react_1.default.Fragment, null,
-                                        react_1.default.createElement(material_1.IconButton, { disabled: !isEditing },
-                                            react_1.default.createElement(Icon_1.default, null, "CalendarIcon")),
-                                        isSaving ? react_1.default.createElement(material_1.CircularProgress, { size: 10 }) : null))
+                                    endAdornment: isMobile && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ disabled: !isEditing }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "CalendarIcon" }) })), isSaving ? (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 10 }) : null] }))
                                 }
                             }
-                        } })));
+                        } }) }), field));
             case types_1.SCUserProfileFields.BIO:
                 props.multiline = true;
                 break;
@@ -221,30 +216,25 @@ function PublicInfo(props) {
                 break;
             case types_1.SCUserProfileFields.GENDER:
                 props.select = true;
-                content = GENDERS.map((gender) => (react_1.default.createElement(material_1.MenuItem, { key: gender, value: gender }, intl.formatMessage(messages[`gender${gender}`]))));
+                content = GENDERS.map((gender) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ value: gender }, { children: intl.formatMessage(messages[`gender${gender}`]) }), gender)));
                 break;
             case types_1.SCUserProfileFields.TAGS:
                 return null;
             default:
                 if (metadataDefinitions && metadataDefinitions[field]) {
-                    return (react_1.default.createElement(MetadataField_1.default, Object.assign({ id: field, key: field, className: classes.field, name: field, fullWidth: true, label: label, value: user[field] || '', onChange: handleChange(field), disabled: isSaving, error: Boolean(_error), helperText: _error && react_1.default.createElement(react_intl_1.FormattedMessage, { id: `ui.userInfo.metadata.error.${_error}`, defaultMessage: `ui.userInfo.metadata.error.${_error}` }), metadata: metadataDefinitions[field] }, props)));
+                    return ((0, jsx_runtime_1.jsx)(MetadataField_1.default, Object.assign({ id: field, className: classes.field, name: field, fullWidth: true, label: label, value: user[field] || '', onChange: handleChange(field), disabled: isSaving, error: Boolean(_error), helperText: _error && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.userInfo.metadata.error.${_error}`, defaultMessage: `ui.userInfo.metadata.error.${_error}` }), metadata: metadataDefinitions[field] }, props), field));
                 }
                 break;
         }
-        return (react_1.default.createElement(component.element, Object.assign({ id: field, key: field }, props, { className: classes.field, name: field, fullWidth: true, label: label, value: user[field] || '', onChange: handleChange(field), disabled: isSaving, error: Boolean(_error), helperText: _error && react_1.default.createElement(react_intl_1.FormattedMessage, { id: `ui.userInfo.${camelField}.error.${_error}`, defaultMessage: `ui.userInfo.${camelField}.error.${_error}` }) }), content));
+        return ((0, jsx_runtime_1.jsx)(component.element, Object.assign({ id: field }, props, { className: classes.field, name: field, fullWidth: true, label: label, value: user[field] || '', onChange: handleChange(field), disabled: isSaving, error: Boolean(_error), helperText: _error && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.userInfo.${camelField}.error.${_error}`, defaultMessage: `ui.userInfo.${camelField}.error.${_error}` }) }, { children: content }), field));
     };
     // FIELDS
     const _fields = [...fields, ...Object.keys(metadataDefinitions)];
     if (_fields.length === 0 || !user) {
         return null;
     }
-    return (react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest),
-        startActions,
-        _fields.map((field) => {
-            return renderField(field);
-        }),
-        react_1.default.createElement(lab_1.LoadingButton, { className: classes.btnSave, fullWidth: true, variant: "contained", color: "secondary", onClick: handleSave, loading: saving.length > 0, disabled: saving.length > 0 || !editing.length || Object.keys(error).length > 0 },
-            react_1.default.createElement(react_intl_1.FormattedMessage, { id: 'ui.userInfo.button.save', defaultMessage: 'ui.userInfo.button.save' })),
-        endActions));
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [startActions, _fields.map((field) => {
+                return renderField(field);
+            }), (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ className: classes.btnSave, fullWidth: true, variant: "contained", color: "secondary", onClick: handleSave, loading: saving.length > 0, disabled: saving.length > 0 || !editing.length || Object.keys(error).length > 0 }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: 'ui.userInfo.button.save', defaultMessage: 'ui.userInfo.button.save' }) })), endActions] })));
 }
 exports.default = PublicInfo;

package/lib/cjs/components/UserProfileEdit/Section/Settings.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");
@@ -45,7 +46,7 @@ function Settings(props) {
                 onEditSuccess();
             }
             else {
-                enqueueSnackbar(react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.saved", defaultMessage: "ui.userProfileEditSettings.saved" }), {
+                enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.saved", defaultMessage: "ui.userProfileEditSettings.saved" }), {
                     variant: 'success',
                     autoHideDuration: 3000
                 });
@@ -60,51 +61,20 @@ function Settings(props) {
         return null;
     }
     if (_settings === null) {
-        return react_1.default.createElement(SettingsSkeleton_1.default, null);
+        return (0, jsx_runtime_1.jsx)(SettingsSkeleton_1.default, {});
     }
     const renderSetting = (setting) => {
         switch (setting) {
             case types_1.SCUserProfileSettings.NOTIFICATION:
-                return (react_1.default.createElement(react_1.default.Fragment, { key: setting },
-                    react_1.default.createElement(material_1.Typography, { gutterBottom: true, variant: "body1" },
-                        react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.notification.title", defaultMessage: "ui.userProfileEditSettings.notification.title" })),
-                    react_1.default.createElement(material_1.Box, { className: classes.control },
-                        react_1.default.createElement(material_1.FormControl, null,
-                            react_1.default.createElement(material_1.FormLabel, null,
-                                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.notification.label", defaultMessage: "ui.userProfileEditSettings.notification.label" })),
-                            react_1.default.createElement(material_1.RadioGroup, { "aria-labelledby": "notification settings", value: _settings.show_toast_notifications, name: react_core_1.SCNotification.NOTIFICATIONS_SETTINGS_SHOW_TOAST, onChange: handleChange },
-                                react_1.default.createElement(material_1.FormControlLabel, { value: 1, control: react_1.default.createElement(material_1.Radio, { size: "small" }), label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.common.yes", defaultMessage: "ui.common.yes" }) }),
-                                react_1.default.createElement(material_1.FormControlLabel, { value: 0, control: react_1.default.createElement(material_1.Radio, { size: "small" }), label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.common.no", defaultMessage: "ui.common.no" }) }))))));
+                return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ gutterBottom: true, variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.notification.title", defaultMessage: "ui.userProfileEditSettings.notification.title" }) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.control }, { children: (0, jsx_runtime_1.jsxs)(material_1.FormControl, { children: [(0, jsx_runtime_1.jsx)(material_1.FormLabel, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.notification.label", defaultMessage: "ui.userProfileEditSettings.notification.label" }) }), (0, jsx_runtime_1.jsxs)(material_1.RadioGroup, Object.assign({ "aria-labelledby": "notification settings", value: _settings.show_toast_notifications, name: react_core_1.SCNotification.NOTIFICATIONS_SETTINGS_SHOW_TOAST, onChange: handleChange }, { children: [(0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: 1, control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.common.yes", defaultMessage: "ui.common.yes" }) }), (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: 0, control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.common.no", defaultMessage: "ui.common.no" }) })] }))] }) }))] }, setting));
             case types_1.SCUserProfileSettings.INTERACTION:
-                return (react_1.default.createElement(react_1.default.Fragment, { key: setting },
-                    react_1.default.createElement(material_1.Typography, { gutterBottom: true, variant: "body1" },
-                        react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.interaction.title", defaultMessage: "ui.userProfileEditSettings.interaction.title" })),
-                    react_1.default.createElement(material_1.Box, { className: classes.control },
-                        react_1.default.createElement(material_1.FormControl, null,
-                            react_1.default.createElement(material_1.FormLabel, null,
-                                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.interaction.label", defaultMessage: "ui.userProfileEditSettings.interaction.label" })),
-                            react_1.default.createElement(material_1.RadioGroup, { "aria-labelledby": "email notification settings", value: _settings.qa_frequency, name: react_core_1.SCNotification.NOTIFICATIONS_SETTINGS_QA_FREQUENCY, onChange: handleChange },
-                                react_1.default.createElement(material_1.FormControlLabel, { value: -1, control: react_1.default.createElement(material_1.Radio, { size: "small" }), label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.interaction.immediatly", defaultMessage: "ui.userProfileEditSettings.interaction.immediatly" }) }),
-                                react_1.default.createElement(material_1.FormControlLabel, { value: 1, control: react_1.default.createElement(material_1.Radio, { size: "small" }), label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.interaction.daily", defaultMessage: "ui.userProfileEditSettings.interaction.daily" }) }),
-                                react_1.default.createElement(material_1.FormControlLabel, { value: 0, control: react_1.default.createElement(material_1.Radio, { size: "small" }), label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.interaction.never", defaultMessage: "ui.userProfileEditSettings.interaction.never" }) }))))));
+                return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ gutterBottom: true, variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.interaction.title", defaultMessage: "ui.userProfileEditSettings.interaction.title" }) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.control }, { children: (0, jsx_runtime_1.jsxs)(material_1.FormControl, { children: [(0, jsx_runtime_1.jsx)(material_1.FormLabel, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.interaction.label", defaultMessage: "ui.userProfileEditSettings.interaction.label" }) }), (0, jsx_runtime_1.jsxs)(material_1.RadioGroup, Object.assign({ "aria-labelledby": "email notification settings", value: _settings.qa_frequency, name: react_core_1.SCNotification.NOTIFICATIONS_SETTINGS_QA_FREQUENCY, onChange: handleChange }, { children: [(0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: -1, control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.interaction.immediatly", defaultMessage: "ui.userProfileEditSettings.interaction.immediatly" }) }), (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: 1, control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.interaction.daily", defaultMessage: "ui.userProfileEditSettings.interaction.daily" }) }), (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: 0, control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.interaction.never", defaultMessage: "ui.userProfileEditSettings.interaction.never" }) })] }))] }) }))] }, setting));
             case types_1.SCUserProfileSettings.PRIVATE_MESSAGE:
-                return (react_1.default.createElement(react_1.default.Fragment, { key: setting },
-                    react_1.default.createElement(material_1.Typography, { gutterBottom: true, variant: "body1" },
-                        react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.privateMessage.title", defaultMessage: "ui.userProfileEditSettings.privateMessage.title" })),
-                    react_1.default.createElement(material_1.Box, { className: classes.control },
-                        react_1.default.createElement(material_1.FormControl, null,
-                            react_1.default.createElement(material_1.FormLabel, null,
-                                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.privateMessage.label", defaultMessage: "ui.userProfileEditSettings.privateMessage.label" })),
-                            react_1.default.createElement(material_1.RadioGroup, { "aria-labelledby": "email notification settings", value: _settings.email_notification_not_qa, name: react_core_1.SCNotification.NOTIFICATIONS_SETTINGS_EMAIL_NOT_QA, onChange: handleChange },
-                                react_1.default.createElement(material_1.FormControlLabel, { value: 1, control: react_1.default.createElement(material_1.Radio, { size: "small" }), label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.privateMessage.email", defaultMessage: "ui.userProfileEditSettings.privateMessage.email" }) }),
-                                react_1.default.createElement(material_1.FormControlLabel, { value: 0, control: react_1.default.createElement(material_1.Radio, { size: "small" }), label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.privateMessage.frontend", defaultMessage: "ui.userProfileEditSettings.privateMessage.frontend" }) }))))));
+                return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ gutterBottom: true, variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.privateMessage.title", defaultMessage: "ui.userProfileEditSettings.privateMessage.title" }) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.control }, { children: (0, jsx_runtime_1.jsxs)(material_1.FormControl, { children: [(0, jsx_runtime_1.jsx)(material_1.FormLabel, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.privateMessage.label", defaultMessage: "ui.userProfileEditSettings.privateMessage.label" }) }), (0, jsx_runtime_1.jsxs)(material_1.RadioGroup, Object.assign({ "aria-labelledby": "email notification settings", value: _settings.email_notification_not_qa, name: react_core_1.SCNotification.NOTIFICATIONS_SETTINGS_EMAIL_NOT_QA, onChange: handleChange }, { children: [(0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: 1, control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.privateMessage.email", defaultMessage: "ui.userProfileEditSettings.privateMessage.email" }) }), (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: 0, control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.privateMessage.frontend", defaultMessage: "ui.userProfileEditSettings.privateMessage.frontend" }) })] }))] }) }))] }, setting));
             default:
                 return null;
         }
     };
-    return (react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest),
-        startActions,
-        settings.map((setting) => renderSetting(setting)),
-        endActions));
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [startActions, settings.map((setting) => renderSetting(setting)), endActions] })));
 }
 exports.default = Settings;

package/lib/cjs/components/UserProfileEdit/Section/SettingsSkeleton.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,9 +35,6 @@ const Root = (0, styles_1.styled)(material_1.Box, {
  *
  */
 function SettingsSkeleton() {
-    return (react_1.default.createElement(Root, { className: classes.root },
-        react_1.default.createElement(Skeleton_1.default, null),
-        react_1.default.createElement(Skeleton_1.default, null),
-        react_1.default.createElement(Skeleton_1.default, null)));
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, {}), (0, jsx_runtime_1.jsx)(Skeleton_1.default, {}), (0, jsx_runtime_1.jsx)(Skeleton_1.default, {})] })));
 }
 exports.default = SettingsSkeleton;

package/lib/cjs/components/UserProfileEdit/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"));
@@ -34,10 +34,6 @@ const Root = (0, styles_1.styled)(material_1.Box, {
  *
  */
 function UserProfileEditSkeleton() {
-    return (react_1.default.createElement(Root, { className: classes.root },
-        react_1.default.createElement(material_1.Grid, { container: true },
-            react_1.default.createElement(material_1.Grid, { item: true, md: 12, sm: 12 },
-                react_1.default.createElement(Skeleton_1.default, { animation: "wave", sx: { height: 20, width: '100%' } }),
-                react_1.default.createElement(Skeleton_1.default, { animation: "wave", sx: { height: 20, width: '100%' } })))));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root }, { children: (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ container: true }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ item: true, md: 12, sm: 12 }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", sx: { height: 20, width: '100%' } }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", sx: { height: 20, width: '100%' } })] })) })) })));
 }
 exports.default = UserProfileEditSkeleton;

package/lib/cjs/components/UserProfileEdit/UserProfileEdit.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.__importDefault(require("react"));
 const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
@@ -68,14 +69,6 @@ function UserProfileEdit(inProps) {
         setTab(newValue);
     };
     // RENDER
-    return (react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest),
-        react_1.default.createElement(material_1.Tabs, { className: classes.tabs, value: tab, onChange: handleChange, variant: "scrollable", scrollButtons: "auto", allowScrollButtonsMobile: true },
-            react_1.default.createElement(material_1.Tab, { label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userProfileEdit.info", defaultMessage: "ui.userProfileEdit.info" }) }),
-            react_1.default.createElement(material_1.Tab, { label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userProfileEdit.account", defaultMessage: "ui.userProfileEdit.account" }) }),
-            react_1.default.createElement(material_1.Tab, { label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userProfileEdit.notification", defaultMessage: "ui.userProfileEdit.notification" }) })),
-        react_1.default.createElement(material_1.Box, { className: classes.tabContent },
-            tab === 0 && react_1.default.createElement(PublicInfo_1.default, Object.assign({ className: classes.publicInfo, fields: fields }, UserProfileEditSectionPublicInfoProps)),
-            tab === 1 && react_1.default.createElement(Account_1.default, Object.assign({ className: classes.account }, UserProfileEditSectionAccountProps)),
-            tab === 2 && react_1.default.createElement(Settings_1.default, Object.assign({ settings: settings, className: classes.settings }, UserProfileEditSectionSettingsProps)))));
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.Tabs, Object.assign({ className: classes.tabs, value: tab, onChange: handleChange, variant: "scrollable", scrollButtons: "auto", allowScrollButtonsMobile: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEdit.info", defaultMessage: "ui.userProfileEdit.info" }) }), (0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEdit.account", defaultMessage: "ui.userProfileEdit.account" }) }), (0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEdit.notification", defaultMessage: "ui.userProfileEdit.notification" }) })] })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.tabContent }, { children: [tab === 0 && (0, jsx_runtime_1.jsx)(PublicInfo_1.default, Object.assign({ className: classes.publicInfo, fields: fields }, UserProfileEditSectionPublicInfoProps)), tab === 1 && (0, jsx_runtime_1.jsx)(Account_1.default, Object.assign({ className: classes.account }, UserProfileEditSectionAccountProps)), tab === 2 && (0, jsx_runtime_1.jsx)(Settings_1.default, Object.assign({ settings: settings, className: classes.settings }, UserProfileEditSectionSettingsProps))] }))] })));
 }
 exports.default = UserProfileEdit;

package/lib/cjs/components/UserProfileHeader/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"));
@@ -45,17 +45,6 @@ const Root = (0, styles_1.styled)(material_1.Box, {
  */
 function UserProfileHeaderSkeleton() {
     const theme = (0, material_1.useTheme)();
-    return (react_1.default.createElement(Root, { className: classes.root },
-        react_1.default.createElement(Skeleton_1.default, { className: classes.cover, animation: "wave", variant: "rectangular" }),
-        react_1.default.createElement(material_1.Box, { className: classes.avatar },
-            react_1.default.createElement(Skeleton_1.default, { animation: "wave", variant: "circular", width: theme.selfcommunity.user.avatar.sizeXLarge, height: theme.selfcommunity.user.avatar.sizeXLarge })),
-        react_1.default.createElement(material_1.Box, { className: classes.section },
-            react_1.default.createElement(material_1.Typography, { variant: "h5", className: classes.username },
-                react_1.default.createElement(Skeleton_1.default, { animation: "wave", sx: { height: 30, width: 100, margin: '0 auto' } })),
-            react_1.default.createElement(material_1.Stack, { direction: "row", className: classes.actions },
-                react_1.default.createElement(material_1.Button, { variant: "contained", disabled: true },
-                    react_1.default.createElement(Skeleton_1.default, { animation: "wave", sx: { height: 20, width: 60 } })),
-                react_1.default.createElement(material_1.IconButton, { disabled: true },
-                    react_1.default.createElement(material_1.Icon, null, "more_vert"))))));
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { className: classes.cover, animation: "wave", variant: "rectangular" }), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.avatar }, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", variant: "circular", width: theme.selfcommunity.user.avatar.sizeXLarge, height: theme.selfcommunity.user.avatar.sizeXLarge }) })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.section }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.username }, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", sx: { height: 30, width: 100, margin: '0 auto' } }) })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", className: classes.actions }, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "contained", disabled: true }, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: "wave", sx: { height: 20, width: 60 } }) })), (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ disabled: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "more_vert" }) }))] }))] }))] })));
 }
 exports.default = UserProfileHeaderSkeleton;

package/lib/cjs/components/UserProfileHeader/UserProfileHeader.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 ChangeCover_1 = tslib_1.__importDefault(require("../ChangeCover"));
@@ -105,31 +106,13 @@ function UserProfileHeader(inProps) {
     }
     // RENDER
     if (!scUser) {
-        return react_1.default.createElement(Skeleton_1.default, null);
+        return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
     }
     const _backgroundCover = Object.assign({}, (scUser.cover
         ? { background: `url('${scUser.cover}') center / cover` }
         : { background: `url('${scPreferences.preferences[react_core_1.SCPreferences.IMAGES_USER_DEFAULT_COVER].value}') center / cover` }));
     const realName = (isMe && scUserContext.user.real_name) || scUser.real_name;
     const hasBadge = scUser && scUser.community_badge;
-    return (react_1.default.createElement(Root, Object.assign({ id: id, 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.avatar },
-                react_1.default.createElement(UserAvatar_1.default, { hide: !hasBadge },
-                    react_1.default.createElement("img", { src: scUser.avatar ? scUser.avatar : '' }))),
-            isMe && (react_1.default.createElement(react_1.default.Fragment, null,
-                react_1.default.createElement(ChangePicture_1.default, Object.assign({ iconButton: true, onChange: handleChangeAvatar, className: classes.changePicture }, ChangePictureProps)),
-                react_1.default.createElement("div", { className: classes.changeCover },
-                    react_1.default.createElement(ChangeCover_1.default, Object.assign({ onChange: handleChangeCover }, ChangeCoverProps)))))),
-        react_1.default.createElement(material_1.Box, { className: classes.infOpsSection },
-            react_1.default.createElement(material_1.Box, { className: classes.info },
-                react_1.default.createElement(material_1.Typography, { variant: "h5", className: classes.username },
-                    "@",
-                    isMe ? scUserContext.user.username : scUser.username),
-                realName && (react_1.default.createElement(material_1.Typography, { variant: "subtitle1", className: classes.realname }, realName)),
-                scUser.bio && (react_1.default.createElement(material_1.Typography, { variant: "subtitle2", className: classes.bio }, scUser.bio)),
-                scUser.website && (react_1.default.createElement(react_core_1.Link, { className: classes.website, target: "blank", to: scUser.website },
-                    react_1.default.createElement(material_1.Typography, { variant: "body2" }, scUser.website)))),
-            actions && actions)));
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.avatar }, { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !hasBadge }, { children: (0, jsx_runtime_1.jsx)("img", { src: scUser.avatar ? scUser.avatar : '' }) })) })), isMe && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(ChangePicture_1.default, Object.assign({ iconButton: true, onChange: handleChangeAvatar, className: classes.changePicture }, ChangePictureProps)), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: classes.changeCover }, { children: (0, jsx_runtime_1.jsx)(ChangeCover_1.default, Object.assign({ onChange: handleChangeCover }, ChangeCoverProps)) }))] }))] })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.infOpsSection }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.info }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ variant: "h5", className: classes.username }, { children: ["@", isMe ? scUserContext.user.username : scUser.username] })), realName && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "subtitle1", className: classes.realname }, { children: realName }))), scUser.bio && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "subtitle2", className: classes.bio }, { children: scUser.bio }))), scUser.website && ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ className: classes.website, target: "blank", to: scUser.website }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: scUser.website })) })))] })), actions && actions] }))] })));
 }
 exports.default = UserProfileHeader;

package/lib/cjs/components/UserSocialAssociation/UserSocialAssociation.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");
@@ -102,21 +103,6 @@ function UserSocialAssociation(inProps) {
     if (!providersEnabled) {
         return null;
     }
-    return (react_1.default.createElement(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { direction: "column" }),
-        providersLinked.length !== 0 || (providersToLink.length !== 0 && onCreateAssociation) ? children : null,
-        providersToLink.length !== 0 && onCreateAssociation && (react_1.default.createElement(material_1.Box, null,
-            react_1.default.createElement(material_1.Typography, { variant: "body2" },
-                " ",
-                intl.formatMessage(messages.socialAdd)),
-            providersToLink.map((p, index) => (react_1.default.createElement(react_1.default.Fragment, { key: index },
-                react_1.default.createElement(material_1.IconButton, { onClick: onCreateAssociation ? () => onCreateAssociation(p) : null },
-                    react_1.default.createElement(Icon_1.default, null, p))))))),
-        providersLinked.length !== 0 && (react_1.default.createElement(material_1.Box, null,
-            react_1.default.createElement(material_1.Typography, { variant: "body2" },
-                " ",
-                intl.formatMessage(messages.socialRemove)),
-            providersLinked.map((p, index) => (react_1.default.createElement(react_1.default.Fragment, { key: index },
-                react_1.default.createElement(material_1.IconButton, { color: "primary", onClick: () => onDeleteAssociation(p) },
-                    react_1.default.createElement(Icon_1.default, null, p.provider)))))))));
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { direction: "column" }, { children: [providersLinked.length !== 0 || (providersToLink.length !== 0 && onCreateAssociation) ? children : null, providersToLink.length !== 0 && onCreateAssociation && ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ variant: "body2" }, { children: [" ", intl.formatMessage(messages.socialAdd)] })), providersToLink.map((p, index) => ((0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: onCreateAssociation ? () => onCreateAssociation(p) : null }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: p }) })) }, index)))] })), providersLinked.length !== 0 && ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ variant: "body2" }, { children: [" ", intl.formatMessage(messages.socialRemove)] })), providersLinked.map((p, index) => ((0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ color: "primary", onClick: () => onDeleteAssociation(p) }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: p.provider }) })) }, index)))] }))] })));
 }
 exports.default = UserSocialAssociation;

package/lib/cjs/components/UserSubscribedGroupsWidget/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 styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
@@ -37,10 +37,6 @@ const Root = (0, styles_1.styled)(Widget_1.default, {
  *
  */
 function UserSubscribedGroupsWidgetSkeleton(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(3)].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.jsxs)(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(3)].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 = UserSubscribedGroupsWidgetSkeleton;

package/lib/cjs/components/UserSubscribedGroupsWidget/UserSubscribedGroupsWidget.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"));
@@ -154,30 +155,14 @@ function UserSubscribedGroupsWidget(inProps) {
     };
     // RENDER
     if (!groupsEnabled || (autoHide && !state.count && state.initialized) || !userId) {
-        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.userSubscribedGroupsWidget.title", defaultMessage: "ui.userSubscribedGroupsWidget.title", values: {
-                    total: isMe ? state.results.filter((g) => g.subscription_status === types_1.SCGroupSubscriptionStatusType.SUBSCRIBED).length : state.count
-                } })),
-        !state.count ? (react_1.default.createElement(material_1.Typography, { className: classes.noResults, variant: "body2" },
-            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userSubscribedGroupsWidget.subtitle.noResults", defaultMessage: "ui.userSubscribedGroupsWidget.subtitle.noResults" }))) : (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(List_1.default, null, state.results.slice(0, limit).map((group) => (react_1.default.createElement(material_1.ListItem, { key: group.id },
-                react_1.default.createElement(Group_1.default, Object.assign({ elevation: 0, group: group, groupSubscribeButtonProps: { onSubscribe: handleOnSubscribe } }, GroupProps)))))),
-            limit < state.count && (react_1.default.createElement(material_1.Button, { className: classes.showMore, onClick: handleToggleDialogOpen },
-                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userSubscribedGroupsWidget.button.showAll", defaultMessage: "ui.userSubscribedGroupsWidget.button.showAll" }))),
-            openDialog && (react_1.default.createElement(DialogRoot, Object.assign({ className: classes.dialogRoot, title: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userSubscribedGroupsWidget.title", defaultMessage: "ui.userSubscribedGroupsWidget.title", values: { total: state.count } }), onClose: handleToggleDialogOpen, open: openDialog, scroll: "paper" }, DialogProps),
-                react_1.default.createElement(List_1.default, null,
-                    state.results.map((g) => (react_1.default.createElement(material_1.ListItem, { key: g.id },
-                        react_1.default.createElement(Group_1.default, Object.assign({ elevation: 0, group: g, groupSubscribeButtonProps: { onSubscribe: handleOnSubscribe } }, GroupProps))))),
-                    state.isLoadingNext && (react_1.default.createElement(material_1.ListItem, null,
-                        react_1.default.createElement(Group_1.GroupSkeleton, Object.assign({ elevation: 0 }, GroupProps))))),
-                react_1.default.createElement(material_1.Typography, { className: classes.endMessage },
-                    react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.userSubscribedGroupsWidget.noMoreResults", defaultMessage: "ui.userSubscribedGroupsWidget.noMoreResults" }))))))));
-    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.userSubscribedGroupsWidget.title", defaultMessage: "ui.userSubscribedGroupsWidget.title", values: {
+                        total: isMe ? state.results.filter((g) => g.subscription_status === types_1.SCGroupSubscriptionStatusType.SUBSCRIBED).length : state.count
+                    } }) })), !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.userSubscribedGroupsWidget.subtitle.noResults", defaultMessage: "ui.userSubscribedGroupsWidget.subtitle.noResults" }) }))) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(List_1.default, { children: state.results.slice(0, limit).map((group) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Group_1.default, Object.assign({ elevation: 0, group: group, groupSubscribeButtonProps: { onSubscribe: handleOnSubscribe } }, GroupProps)) }, group.id))) }), limit < state.count && ((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.userSubscribedGroupsWidget.button.showAll", defaultMessage: "ui.userSubscribedGroupsWidget.button.showAll" }) }))), openDialog && ((0, jsx_runtime_1.jsxs)(DialogRoot, Object.assign({ className: classes.dialogRoot, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userSubscribedGroupsWidget.title", defaultMessage: "ui.userSubscribedGroupsWidget.title", values: { total: state.count } }), onClose: handleToggleDialogOpen, open: openDialog, scroll: "paper" }, DialogProps, { children: [(0, jsx_runtime_1.jsxs)(List_1.default, { children: [state.results.map((g) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Group_1.default, Object.assign({ elevation: 0, group: g, groupSubscribeButtonProps: { onSubscribe: handleOnSubscribe } }, GroupProps)) }, g.id))), state.isLoadingNext && ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Group_1.GroupSkeleton, Object.assign({ elevation: 0 }, GroupProps)) }))] }), (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.userSubscribedGroupsWidget.noMoreResults", defaultMessage: "ui.userSubscribedGroupsWidget.noMoreResults" }) }))] })))] }))] }));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: content })));
 }
 exports.default = UserSubscribedGroupsWidget;

package/lib/cjs/components/UserSuggestionWidget/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("../User/Skeleton"));
 const Widget_1 = tslib_1.__importDefault(require("../Widget"));
@@ -37,9 +37,6 @@ const Root = (0, styles_1.styled)(Widget_1.default, {
  *
  */
 function UserSuggestionWidgetSkeleton(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(material_1.List, { className: classes.list }, [...Array(4)].map((user, 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)(material_1.List, Object.assign({ className: classes.list }, { children: [...Array(4)].map((user, index) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { elevation: 0 }) }, index))) })) }) })));
 }
 exports.default = UserSuggestionWidgetSkeleton;

package/lib/cjs/components/UserSuggestionWidget/UserSuggestionWidget.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");
@@ -161,25 +162,12 @@ function UserSuggestionWidget(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.userSuggestionWidget.title", defaultMessage: "ui.userSuggestionWidget.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.userSuggestionWidget.noResults", defaultMessage: "ui.userSuggestionWidget.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((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.userSuggestionWidget.button.showAll", defaultMessage: "ui.userSuggestionWidget.button.showAll" }))))),
-        openDialog && (react_1.default.createElement(DialogRoot, Object.assign({ className: classes.dialogRoot, title: react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.userSuggestionWidget.title", id: "ui.userSuggestionWidget.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(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.userSuggestionWidget.noMoreResults", defaultMessage: "ui.userSuggestionWidget.noMoreResults" })) },
-                react_1.default.createElement(material_1.List, 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.userSuggestionWidget.title", defaultMessage: "ui.userSuggestionWidget.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.userSuggestionWidget.noResults", defaultMessage: "ui.userSuggestionWidget.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((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.userSuggestionWidget.button.showAll", defaultMessage: "ui.userSuggestionWidget.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.userSuggestionWidget.title", id: "ui.userSuggestionWidget.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)(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.userSuggestionWidget.noMoreResults", defaultMessage: "ui.userSuggestionWidget.noMoreResults" }) })) }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { 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 = UserSuggestionWidget;