@selfcommunity/react-ui 0.7.50-alpha.1 → 0.7.50-event.29

package/lib/esm/components/EventLocationWidget/EventLocationWidget.d.ts

@@ -0,0 +1,55 @@
+import { VirtualScrollerItemProps } from '../../types/virtualScroller';
+import { SCEventType } from '@selfcommunity/types';
+export interface EventLocationWidgetProps extends VirtualScrollerItemProps {
+    /**
+     * Event Object
+     * @default null
+     */
+    event?: SCEventType;
+    /**
+     * Id of the event
+     * @default null
+     */
+    eventId?: number | string;
+    /**
+     * Overrides or extends the styles applied to the component.
+     * @default null
+     */
+    className?: string;
+    /**
+     * Other props
+     */
+    [p: string]: any;
+}
+/**
+ * > API documentation for the Community-JS Group Info Widget component. Learn about the available props and the CSS API.
+ *
+ *
+ * This component renders a widget containing the event info.
+ * Take a look at our <strong>demo</strong> component [here](/docs/sdk/community-js/react-ui/Components/EventLocationWidget)
+
+ #### Import
+
+ ```jsx
+ import {EventLocationWidget} from '@selfcommunity/react-ui';
+ ```
+
+ #### Component Name
+
+ The name `SCEventLocationWidget` can be used when providing style overrides in the theme.
+
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SCEventLocationWidget-root|Styles applied to the root element.|
+ |title|.SCEventLocationWidget-title|Styles applied to the title element.|
+ |map|.SCEventLocationWidget-map|Styles applied to the map element.|
+ |locationTitle|.SCEventLocationWidget-location-title|Styles applied to the location title element.|
+ |address|.SCEventLocationWidget-address|Styles applied to the address element.|
+
+ *
+ * @param inProps
+ */
+export default function EventLocationWidget(inProps: EventLocationWidgetProps): JSX.Element;

package/lib/esm/components/EventLocationWidget/EventLocationWidget.js

@@ -0,0 +1,100 @@
+import { __rest } from "tslib";
+import React from 'react';
+import { styled } from '@mui/material/styles';
+import { Box, CardContent, Typography } from '@mui/material';
+import classNames from 'classnames';
+import Widget from '../Widget';
+import { useThemeProps } from '@mui/system';
+import { PREFIX } from './constants';
+import { FormattedMessage } from 'react-intl';
+import EventLocationWidgetSkeleton from './Skeleton';
+import { useSCContext, useSCFetchEvent } from '@selfcommunity/react-core';
+import { SCEventLocationType } from '@selfcommunity/types';
+import { GoogleMap, MarkerF, useLoadScript } from '@react-google-maps/api';
+import HiddenPlaceholder from '../../shared/HiddenPlaceholder';
+import { formatEventLocationGeolocation } from '../../utils/string';
+const classes = {
+    root: `${PREFIX}-root`,
+    title: `${PREFIX}-title`,
+    map: `${PREFIX}-map`,
+    locationTitle: `${PREFIX}-location-title`,
+    address: `${PREFIX}-address`
+};
+const Root = styled(Widget, {
+    name: PREFIX,
+    slot: 'Root'
+})(() => ({}));
+/**
+ * > API documentation for the Community-JS Group Info Widget component. Learn about the available props and the CSS API.
+ *
+ *
+ * This component renders a widget containing the event info.
+ * Take a look at our <strong>demo</strong> component [here](/docs/sdk/community-js/react-ui/Components/EventLocationWidget)
+
+ #### Import
+
+ ```jsx
+ import {EventLocationWidget} from '@selfcommunity/react-ui';
+ ```
+
+ #### Component Name
+
+ The name `SCEventLocationWidget` can be used when providing style overrides in the theme.
+
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SCEventLocationWidget-root|Styles applied to the root element.|
+ |title|.SCEventLocationWidget-title|Styles applied to the title element.|
+ |map|.SCEventLocationWidget-map|Styles applied to the map element.|
+ |locationTitle|.SCEventLocationWidget-location-title|Styles applied to the location title element.|
+ |address|.SCEventLocationWidget-address|Styles applied to the address element.|
+
+ *
+ * @param inProps
+ */
+export default function EventLocationWidget(inProps) {
+    var _a, _b, _c;
+    // PROPS
+    const props = useThemeProps({
+        props: inProps,
+        name: PREFIX
+    });
+    const { className, event, eventId } = props, rest = __rest(props, ["className", "event", "eventId"]);
+    // STATE
+    const { scEvent } = useSCFetchEvent({ id: eventId, event });
+    const scContext = useSCContext();
+    const { isLoaded } = useLoadScript({
+        googleMapsApiKey: scContext.settings.integrations.geocoding.apiKey,
+        libraries: ['maps']
+    });
+    if (!((_c = (_b = (_a = scContext === null || scContext === void 0 ? void 0 : scContext.settings) === null || _a === void 0 ? void 0 : _a.integrations) === null || _b === void 0 ? void 0 : _b.geocoding) === null || _c === void 0 ? void 0 : _c.apiKey) || (scEvent && (scEvent === null || scEvent === void 0 ? void 0 : scEvent.location) === SCEventLocationType.ONLINE)) {
+        return React.createElement(HiddenPlaceholder, null);
+    }
+    /**
+     * Loading event
+     */
+    if (!isLoaded || !scEvent) {
+        return React.createElement(EventLocationWidgetSkeleton, null);
+    }
+    /**
+     * Renders root object
+     */
+    return (React.createElement(Root, Object.assign({ className: classNames(classes.root, className) }, rest),
+        React.createElement(CardContent, null,
+            React.createElement(Typography, { variant: "h4", className: classes.title },
+                React.createElement(FormattedMessage, { id: "ui.eventLocationWidget.title", defaultMessage: "ui.eventLocationWidget.title" })),
+            React.createElement(Box, { className: classes.map },
+                React.createElement(GoogleMap, { mapContainerClassName: classes.map, center: {
+                        lat: scEvent === null || scEvent === void 0 ? void 0 : scEvent.geolocation_lat,
+                        lng: scEvent === null || scEvent === void 0 ? void 0 : scEvent.geolocation_lng
+                    }, zoom: 15 },
+                    React.createElement(MarkerF, { position: {
+                            lat: scEvent === null || scEvent === void 0 ? void 0 : scEvent.geolocation_lat,
+                            lng: scEvent === null || scEvent === void 0 ? void 0 : scEvent.geolocation_lng
+                        } }))),
+            React.createElement(Typography, { variant: "h4", className: classes.locationTitle }, formatEventLocationGeolocation(scEvent === null || scEvent === void 0 ? void 0 : scEvent.geolocation, true)),
+            React.createElement(Typography, { variant: "body1", className: classes.address }, formatEventLocationGeolocation(scEvent === null || scEvent === void 0 ? void 0 : scEvent.geolocation)))));
+}

package/lib/esm/components/EventLocationWidget/Skeleton.d.ts

@@ -0,0 +1,22 @@
+/**
+ * > API documentation for the Community-JS Group Info Widget Skeleton component. Learn about the available props and the CSS API.
+
+ #### Import
+
+ ```jsx
+ import {EventLocationWidgetSkeleton} from '@selfcommunity/react-ui';
+ ```
+
+ #### Component Name
+
+ The name `SCEventLocationWidgetSkeleton-skeleton-root` can be used when providing style overrides in the theme.
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SCEventLocationWidgetSkeleton-skeleton-root|Styles applied to the root element.|
+ |root|.SCEventLocationWidgetSkeleton-skeleton-map|Styles applied to the map element.|
+ *
+ */
+export default function EventLocationWidgetSkeleton(): JSX.Element;

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

@@ -0,0 +1,43 @@
+import React from 'react';
+import { styled } from '@mui/material/styles';
+import { PREFIX } from './constants';
+import Widget from '../Widget';
+import { Box, CardContent, Skeleton } from '@mui/material';
+const classes = {
+    root: `${PREFIX}-skeleton-root`,
+    map: `${PREFIX}-skeleton-map`
+};
+const Root = styled(Widget, {
+    name: PREFIX,
+    slot: 'SkeletonRoot'
+})(() => ({}));
+/**
+ * > API documentation for the Community-JS Group Info Widget Skeleton component. Learn about the available props and the CSS API.
+
+ #### Import
+
+ ```jsx
+ import {EventLocationWidgetSkeleton} from '@selfcommunity/react-ui';
+ ```
+
+ #### Component Name
+
+ The name `SCEventLocationWidgetSkeleton-skeleton-root` can be used when providing style overrides in the theme.
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SCEventLocationWidgetSkeleton-skeleton-root|Styles applied to the root element.|
+ |root|.SCEventLocationWidgetSkeleton-skeleton-map|Styles applied to the map element.|
+ *
+ */
+export default function EventLocationWidgetSkeleton() {
+    return (React.createElement(Root, { className: classes.root },
+        React.createElement(CardContent, null,
+            React.createElement(Skeleton, { animation: "wave", height: 30, width: "20%", variant: 'text' }),
+            React.createElement(Box, { className: classes.map },
+                React.createElement(Skeleton, { variant: "rectangular", animation: "wave", height: '100%', width: '100%' })),
+            React.createElement(Skeleton, { animation: "wave", height: 20, width: "30%", variant: 'text' }),
+            React.createElement(Skeleton, { animation: "wave", height: 20, width: "40%", variant: 'text' }))));
+}

package/lib/esm/components/EventLocationWidget/constants.d.ts

@@ -0,0 +1 @@
+export declare const PREFIX = "SCEventLocationWidget";

package/lib/esm/components/EventLocationWidget/constants.js

@@ -0,0 +1 @@
+export const PREFIX = 'SCEventLocationWidget';

package/lib/esm/components/EventLocationWidget/index.d.ts

@@ -0,0 +1,4 @@
+import EventLocationWidget, { EventLocationWidgetProps } from './EventLocationWidget';
+import EventLocationWidgetSkeleton from './Skeleton';
+export default EventLocationWidget;
+export { EventLocationWidgetProps, EventLocationWidgetSkeleton };

package/lib/esm/components/EventLocationWidget/index.js

@@ -0,0 +1,4 @@
+import EventLocationWidget from './EventLocationWidget';
+import EventLocationWidgetSkeleton from './Skeleton';
+export default EventLocationWidget;
+export { EventLocationWidgetSkeleton };

package/lib/esm/components/Feed/Feed.js

@@ -7,7 +7,7 @@ import { FormattedMessage } from 'react-intl';
 import { GenericSkeleton } from '../Skeleton';
 import CustomAdv from '../CustomAdv';
 import { SCCustomAdvPosition } from '@selfcommunity/types';
-import { CacheStrategies, getQueryStringParameter, updateQueryStringParameter } from '@selfcommunity/utils';
+import { CacheStrategies, getQueryStringParameter, isClientSideRendering, updateQueryStringParameter } from '@selfcommunity/utils';
 import classNames from 'classnames';
 import PubSub from 'pubsub-js';
 import { useThemeProps } from '@mui/system';
@@ -101,7 +101,7 @@ const Feed = (inProps, ref) => {
     }, [scPreferences.preferences]);
     // RENDER
     const theme = useTheme();
-    const oneColLayout = useMediaQuery(theme.breakpoints.down('md'), { noSsr: typeof window !== 'undefined' });
+    const oneColLayout = useMediaQuery(theme.breakpoints.down('md'), { noSsr: isClientSideRendering() });
     const advEnabled = useMemo(() => preferences &&
         preferences[SCPreferences.ADVERTISING_CUSTOM_ADV_ENABLED] &&
         ((preferences[SCPreferences.ADVERTISING_CUSTOM_ADV_ONLY_FOR_ANONYMOUS_USERS_ENABLED] && scUserContext.user === null) ||

package/lib/esm/components/FeedObject/Actions/Share/Share.js

@@ -193,23 +193,23 @@ export default function Share(props) {
             (!feedObject.group || isGroupPublic) && (React.createElement(React.Fragment, null,
                 showShareAction && (React.createElement(MenuItem, { onClick: () => share(false) },
                     React.createElement(ListItemIcon, null,
-                        React.createElement(Icon, { fontSize: "small" }, "redo")),
+                        React.createElement(Icon, null, "redo")),
                     React.createElement(ListItemText, { primary: React.createElement(FormattedMessage, { id: "ui.feedObject.share.shareNow", defaultMessage: "ui.feedObject.share.shareNow" }) }))),
                 facebookShareEnabled && (React.createElement(MenuItem, { onClick: () => window.open(FACEBOOK_SHARE + url, 'facebook-share-dialog', 'width=626,height=436') },
                     React.createElement(ListItemIcon, null,
-                        React.createElement(Icon, { fontSize: "small" }, "facebook")),
+                        React.createElement(Icon, null, "facebook")),
                     React.createElement(ListItemText, { primary: React.createElement(FormattedMessage, { id: "ui.feedObject.share.facebook", defaultMessage: "ui.feedObject.share.facebook" }) }))),
                 xShareEnabled && (React.createElement(MenuItem, { onClick: () => window.open(X_SHARE + url, 'x-share-dialog', 'width=626,height=436') },
                     React.createElement(ListItemIcon, null,
-                        React.createElement(Icon, { fontSize: "small" }, "twitter")),
+                        React.createElement(Icon, null, "twitter")),
                     React.createElement(ListItemText, { primary: React.createElement(FormattedMessage, { id: "ui.feedObject.share.x", defaultMessage: "ui.feedObject.share.x" }) }))),
                 linkedinShareEnabled && (React.createElement(MenuItem, { onClick: () => window.open(LINKEDIN_SHARE + url, 'linkedin-share-dialog', 'width=626,height=436') },
                     React.createElement(ListItemIcon, null,
-                        React.createElement(Icon, { fontSize: "small" }, "linkedin")),
+                        React.createElement(Icon, null, "linkedin")),
                     React.createElement(ListItemText, { primary: React.createElement(FormattedMessage, { id: "ui.feedObject.share.linkedin", defaultMessage: "ui.feedObject.share.linkedin" }) }))))),
             React.createElement(MenuItem, null,
                 React.createElement(ListItemIcon, null,
-                    React.createElement(Icon, { fontSize: "small" }, "link")),
+                    React.createElement(Icon, null, "link")),
                 React.createElement(ListItemText, { primary: React.createElement(FormattedMessage, { id: "ui.feedObject.share.permanentLink", defaultMessage: "ui.feedObject.share.permanentLink" }), onClick: () => getPermalink() }))));
     }
     /**

package/lib/esm/components/GroupForm/GroupForm.js

@@ -18,7 +18,7 @@ import { SCGroupPrivacyType } from '@selfcommunity/types';
 import { SCOPE_SC_UI } from '../../constants/Errors';
 import { formatHttpErrorCode, GroupService } from '@selfcommunity/api-services';
 import { Logger } from '@selfcommunity/utils';
-import { SCEventType, SCTopicType } from '../../constants/PubSub';
+import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
 const messages = defineMessages({
     name: {
         id: 'ui.groupForm.name.placeholder',
@@ -153,11 +153,11 @@ export default function GroupForm(inProps) {
         if (data) {
             if (group) {
                 // Edit group
-                PubSub.publish(`${SCTopicType.GROUP}.${SCEventType.EDIT}`, data);
+                PubSub.publish(`${SCTopicType.GROUP}.${SCGroupEventType.EDIT}`, data);
             }
             else {
                 // Create group
-                PubSub.publish(`${SCTopicType.GROUP}.${SCEventType.CREATE}`, data);
+                PubSub.publish(`${SCTopicType.GROUP}.${SCGroupEventType.CREATE}`, data);
             }
         }
     }

package/lib/esm/components/GroupHeader/GroupHeader.js

@@ -16,7 +16,7 @@ import GroupMembersButton from '../GroupMembersButton';
 import EditGroupButton from '../EditGroupButton';
 import GroupSubscribeButton from '../GroupSubscribeButton';
 import GroupInviteButton from '../GroupInviteButton';
-import { SCEventType, SCTopicType } from '../../constants/PubSub';
+import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
 import PubSub from 'pubsub-js';
 const classes = {
     root: `${PREFIX}-root`,
@@ -117,10 +117,10 @@ export default function GroupHeader(inProps) {
         var _a;
         if (data && ((_a = data === null || data === void 0 ? void 0 : data.group) === null || _a === void 0 ? void 0 : _a.id) === (scGroup === null || scGroup === void 0 ? void 0 : scGroup.id)) {
             let _group = Object.assign({}, scGroup);
-            if (msg === `${SCTopicType.GROUP}.${SCEventType.ADD_MEMBER}`) {
+            if (msg === `${SCTopicType.GROUP}.${SCGroupEventType.ADD_MEMBER}`) {
                 _group.subscribers_counter = _group.subscribers_counter + 1;
             }
-            else if (msg === `${SCTopicType.GROUP}.${SCEventType.REMOVE_MEMBER}`) {
+            else if (msg === `${SCTopicType.GROUP}.${SCGroupEventType.REMOVE_MEMBER}`) {
                 _group.subscribers_counter = Math.max(_group.subscribers_counter - 1, 0);
             }
             setSCGroup(_group);
@@ -131,7 +131,7 @@ export default function GroupHeader(inProps) {
      */
     useEffect(() => {
         if (scGroup) {
-            updatesSubscription.current = PubSub.subscribe(`${SCTopicType.GROUP}.${SCEventType.MEMBERS}`, onChangeGroupMembersHandler);
+            updatesSubscription.current = PubSub.subscribe(`${SCTopicType.GROUP}.${SCGroupEventType.MEMBERS}`, onChangeGroupMembersHandler);
         }
         return () => {
             updatesSubscription.current && PubSub.unsubscribe(updatesSubscription.current);

package/lib/esm/components/GroupInfoWidget/GroupInfoWidget.js

@@ -11,7 +11,7 @@ import { SCGroupPrivacyType } from '@selfcommunity/types';
 import PubSub from 'pubsub-js';
 import { SCPreferences, useSCFetchGroup, useSCPreferences } from '@selfcommunity/react-core';
 import GroupInfoWidgetSkeleton from './Skeleton';
-import { SCEventType, SCTopicType } from '../../constants/PubSub';
+import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
 import User from '../User';
 const classes = {
     root: `${PREFIX}-root`,
@@ -87,7 +87,7 @@ export default function GroupInfoWidget(inProps) {
      */
     useEffect(() => {
         if (scGroup) {
-            updatesSubscription.current = PubSub.subscribe(`${SCTopicType.GROUP}.${SCEventType.EDIT}`, onChangeGroupHandler);
+            updatesSubscription.current = PubSub.subscribe(`${SCTopicType.GROUP}.${SCGroupEventType.EDIT}`, onChangeGroupHandler);
         }
         return () => {
             updatesSubscription.current && PubSub.unsubscribe(updatesSubscription.current);

package/lib/esm/components/GroupInviteButton/GroupInviteButton.js

@@ -13,7 +13,7 @@ import Autocomplete from '@mui/material/Autocomplete';
 import User from '../User';
 import { SCOPE_SC_UI } from '../../constants/Errors';
 import { Logger } from '@selfcommunity/utils';
-import { SCEventType, SCTopicType } from '../../constants/PubSub';
+import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
 import PubSub from 'pubsub-js';
 const messages = defineMessages({
     placeholder: {
@@ -97,7 +97,7 @@ export default function GroupInviteButton(inProps) {
      */
     function notifyChanges(group, usersInvited) {
         if (group && usersInvited) {
-            PubSub.publish(`${SCTopicType.GROUP}.${SCEventType.INVITE_MEMBER}`, usersInvited);
+            PubSub.publish(`${SCTopicType.GROUP}.${SCGroupEventType.INVITE_MEMBER}`, usersInvited);
         }
     }
     function convertToInvitedUsersObject(data) {
@@ -255,11 +255,11 @@ export default function GroupInviteButton(inProps) {
      * Renders root object
      */
     return (React.createElement(React.Fragment, null,
-        React.createElement(Root, Object.assign({ className: classNames(classes.root, className), onClick: handleClose, variant: scGroup ? 'contained' : 'outlined', color: scGroup ? 'secondary' : 'inherit', startIcon: React.createElement(Icon, { fontSize: "small" }, "add") }, rest),
+        React.createElement(Root, Object.assign({ className: classNames(classes.root, className), onClick: handleClose, variant: scGroup ? 'contained' : 'outlined', color: scGroup ? 'secondary' : 'inherit', startIcon: React.createElement(Icon, null, "add") }, rest),
             React.createElement(FormattedMessage, { id: "ui.groupInviteButton", defaultMessage: "ui.groupInviteButton" })),
         open && (React.createElement(DialogRoot, { DialogContentProps: { dividers: false }, open: true, className: classes.dialogRoot, title: React.createElement(React.Fragment, null,
                 React.createElement(IconButton, { onClick: handleClose },
-                    React.createElement(Icon, { fontSize: "medium" }, "arrow_back")),
+                    React.createElement(Icon, null, "arrow_back")),
                 React.createElement(Typography, { className: classes.dialogTitle },
                     React.createElement(FormattedMessage, { id: "ui.groupInviteButton.dialog.title", defaultMessage: "ui.groupInviteButton.dialog.title" })),
                 React.createElement(LoadingButton, { size: "small", color: "secondary", variant: "contained", onClick: handleSendInvitations, loading: isSending, disabled: !invited.length },

package/lib/esm/components/GroupInvitedWidget/GroupInvitedWidget.js

@@ -19,7 +19,7 @@ import HiddenPlaceholder from '../../shared/HiddenPlaceholder';
 import { PREFIX } from './constants';
 import User, { UserSkeleton } from '../User';
 import PubSub from 'pubsub-js';
-import { SCEventType, SCTopicType } from '../../constants/PubSub';
+import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
 const classes = {
     root: `${PREFIX}-root`,
     title: `${PREFIX}-title`,
@@ -170,7 +170,7 @@ export default function GroupInvitedWidget(inProps) {
      */
     useEffect(() => {
         if (scGroup && state.results) {
-            updatesSubscription.current = PubSub.subscribe(`${SCTopicType.GROUP}.${SCEventType.INVITE_MEMBER}`, onChangeGroupHandler);
+            updatesSubscription.current = PubSub.subscribe(`${SCTopicType.GROUP}.${SCGroupEventType.INVITE_MEMBER}`, onChangeGroupHandler);
         }
         return () => {
             updatesSubscription.current && PubSub.unsubscribe(updatesSubscription.current);

package/lib/esm/components/GroupSettingsIconButton/GroupSettingsIconButton.js

@@ -9,7 +9,7 @@ import { useThemeProps } from '@mui/system';
 import { Link, SCRoutes, useSCRouting, useSCUser } from '@selfcommunity/react-core';
 import ConfirmDialog from '../../shared/ConfirmDialog/ConfirmDialog';
 import { GroupService } from '@selfcommunity/api-services';
-import { SCEventType, SCTopicType } from '../../constants/PubSub';
+import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
 import PubSub from 'pubsub-js';
 const PREFIX = 'SCGroupSettingsIconButton';
 const classes = {
@@ -92,7 +92,7 @@ export default function GroupSettingsIconButton(inProps) {
      */
     function notifyChanges(group, user) {
         if (group && user) {
-            PubSub.publish(`${SCTopicType.GROUP}.${SCEventType.REMOVE_MEMBER}`, { group, user });
+            PubSub.publish(`${SCTopicType.GROUP}.${SCGroupEventType.REMOVE_MEMBER}`, { group, user });
         }
     }
     /**

package/lib/esm/components/GroupSubscribeButton/GroupSubscribeButton.js

@@ -9,7 +9,7 @@ import { FormattedMessage } from 'react-intl';
 import classNames from 'classnames';
 import { useThemeProps } from '@mui/system';
 import { SCOPE_SC_UI } from '../../constants/Errors';
-import { SCEventType, SCTopicType } from '../../constants/PubSub';
+import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
 import PubSub from 'pubsub-js';
 const PREFIX = 'SCGroupSubscribeButton';
 const classes = {
@@ -80,7 +80,7 @@ export default function GroupSubscribeButton(inProps) {
      */
     function notifyChanges(group, user) {
         if (group && user) {
-            PubSub.publish(`${SCTopicType.GROUP}.${SCEventType.ADD_MEMBER}`, { group, user });
+            PubSub.publish(`${SCTopicType.GROUP}.${SCGroupEventType.ADD_MEMBER}`, { group, user });
         }
     }
     const subscribe = (user) => {

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

@@ -224,7 +224,7 @@ export default function IncubatorListWidget(inProps) {
             React.createElement(Typography, { className: classes.title, variant: 'h5' },
                 React.createElement(FormattedMessage, { id: "ui.incubatorListWidget.title", defaultMessage: "ui.incubatorListWidget.title" })),
             React.createElement(IconButton, { className: classes.helpPopover, color: "primary", "aria-label": "info", component: "span", onClick: handleClickHelpButton },
-                React.createElement(Icon, { fontSize: "small" }, "help_outline")),
+                React.createElement(Icon, null, "help_outline")),
             isOpen && (React.createElement(Popover, { open: isOpen, anchorEl: anchorEl, onClose: handlePopoverClose, anchorOrigin: {
                     vertical: 'bottom',
                     horizontal: 'right'

package/lib/esm/components/NavigationMenuIconButton/DefaultDrawerContent.d.ts

@@ -1,5 +1,6 @@
+import { BoxProps } from '@mui/material';
 import { CategoryProps } from '../Category';
-export interface DefaultDrawerContentProps {
+export interface DefaultDrawerContentProps extends BoxProps {
     CategoryItemProps?: CategoryProps;
 }
-export default function DefaultDrawerContent(props: DefaultDrawerContentProps): JSX.Element;
+export default function DefaultDrawerContent(inProps: DefaultDrawerContentProps): JSX.Element;

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

@@ -1,11 +1,28 @@
-import { Button, ListItem, Typography, Zoom } from '@mui/material';
+import { __rest } from "tslib";
+import { Box, Button, ListItem, Typography, Zoom } from '@mui/material';
 import { Link, SCRoutes, useSCFetchCategories, useSCRouting } from '@selfcommunity/react-core';
 import React, { useEffect, useState } from 'react';
 import Category from '../Category';
 import { FormattedMessage } from 'react-intl';
 import { sortByAttr } from '@selfcommunity/utils';
-export default function DefaultDrawerContent(props) {
-    const { CategoryItemProps = {} } = props;
+import { styled } from '@mui/material/styles';
+import classNames from 'classnames';
+import { useThemeProps } from '@mui/system';
+const PREFIX = 'SCDefaultDrawerContent';
+const classes = {
+    root: `${PREFIX}-root`
+};
+const Root = styled(Box, {
+    name: PREFIX,
+    slot: 'Root',
+    overridesResolver: (_, styles) => styles.root
+})(() => ({}));
+export default function DefaultDrawerContent(inProps) {
+    const props = useThemeProps({
+        props: inProps,
+        name: PREFIX
+    });
+    const { className, CategoryItemProps = { showTooltip: true } } = props, rest = __rest(props, ["className", "CategoryItemProps"]);
     // HOOKS
     const { categories } = useSCFetchCategories();
     const [categoriesOrdered, setCategoriesOrdered] = useState([]);
@@ -35,7 +52,7 @@ export default function DefaultDrawerContent(props) {
         onTouchMove: mouseLeave
     });
     //order
-    return (React.createElement(React.Fragment, null,
+    return (React.createElement(Root, Object.assign({ className: classNames(className, classes.root) }, rest),
         React.createElement(Typography, { variant: "subtitle1" },
             React.createElement("span", null,
                 React.createElement(FormattedMessage, { id: "ui.navigationMenuIconButton.defaultDrawerContent.category.title", defaultMessage: "ui.navigationMenuIconButton.defaultDrawerContent.category.title" })),

package/lib/esm/components/NavigationMenuIconButton/DefaultHeaderContent.d.ts

@@ -1 +1,3 @@
-export default function DefaultHeaderContent(): JSX.Element;
+import { BoxProps } from '@mui/material';
+export declare type DefaultHeaderContentProps = BoxProps;
+export default function DefaultHeaderContent(inProps: DefaultHeaderContentProps): JSX.Element;

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

@@ -1,12 +1,32 @@
+import { __rest } from "tslib";
 import { Link, SCPreferences, SCRoutes, useSCPreferences, useSCRouting } from '@selfcommunity/react-core';
 import React, { useMemo } from 'react';
-export default function DefaultHeaderContent() {
+import { styled } from '@mui/material/styles';
+import { Box } from '@mui/material';
+import classNames from 'classnames';
+import { useThemeProps } from '@mui/system';
+const PREFIX = 'SCDefaultHeaderContent';
+const classes = {
+    root: `${PREFIX}-root`
+};
+const Root = styled(Box, {
+    name: PREFIX,
+    slot: 'Root',
+    overridesResolver: (_, styles) => styles.root
+})(() => ({}));
+export default function DefaultHeaderContent(inProps) {
+    const props = useThemeProps({
+        props: inProps,
+        name: PREFIX
+    });
+    const { className } = props, rest = __rest(props, ["className"]);
     const scRoutingContext = useSCRouting();
     // PREFERENCES
     const scPreferences = useSCPreferences();
     const _logo = useMemo(() => {
         return SCPreferences.LOGO_NAVBAR_LOGO in scPreferences.preferences ? scPreferences.preferences[SCPreferences.LOGO_NAVBAR_LOGO].value : null;
     }, [scPreferences.preferences]);
-    return (React.createElement(Link, { to: scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {}) },
-        React.createElement("img", { src: _logo, alt: "logo" })));
+    return (React.createElement(Root, Object.assign({ className: classNames(className, classes.root) }, rest),
+        React.createElement(Link, { to: scRoutingContext.url(SCRoutes.HOME_ROUTE_NAME, {}) },
+            React.createElement("img", { src: _logo, alt: "logo" }))));
 }

package/lib/esm/components/NavigationMenuIconButton/index.d.ts

@@ -1,4 +1,5 @@
 import NavigationMenuIconButton, { NavigationMenuIconButtonProps } from './NavigationMenuIconButton';
+import DefaultHeaderContent from './DefaultHeaderContent';
 import DefaultDrawerContent from './DefaultDrawerContent';
 export default NavigationMenuIconButton;
-export { NavigationMenuIconButtonProps, DefaultDrawerContent as NavigationMenuContent };
+export { NavigationMenuIconButtonProps, DefaultDrawerContent as NavigationMenuContent, DefaultHeaderContent as NavigationMenuHeader };

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

@@ -1,4 +1,5 @@
 import NavigationMenuIconButton from './NavigationMenuIconButton';
+import DefaultHeaderContent from './DefaultHeaderContent';
 import DefaultDrawerContent from './DefaultDrawerContent';
 export default NavigationMenuIconButton;
-export { DefaultDrawerContent as NavigationMenuContent };
+export { DefaultDrawerContent as NavigationMenuContent, DefaultHeaderContent as NavigationMenuHeader };

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

@@ -233,7 +233,7 @@ export default function UserNotification(inProps) {
                 notificationObject.aggregated[0].type === SCNotificationTypologyType.CONTRIBUTION)) {
             const contribution = getContribution(notificationObject);
             return (React.createElement(CardHeader, { className: classes.header, titleTypographyProps: { className: classes.title, variant: 'subtitle1' }, title: React.createElement(Link, { to: scRoutingContext.url(getContributionRouteName(contribution), getRouteData(notificationObject[contribution.type])) }, getContributionSnippet(contribution)), action: contribution && (React.createElement(Tooltip, { title: contribution.suspended ? (React.createElement(FormattedMessage, { id: 'ui.notification.notificationSuspended', defaultMessage: 'ui.notification.notificationSuspended' })) : (React.createElement(FormattedMessage, { id: 'ui.notification.notificationSuspend', defaultMessage: 'ui.notification.notificationSuspend' })) },
-                    React.createElement(LoadingButton, { variant: "text", size: "small", loading: loadingSuspendNotification, color: 'inherit', classes: { root: classes.stopButton }, onClick: () => handleStopContentNotification(contribution) }, contribution.suspended ? (React.createElement(Icon, { fontSize: "small", color: 'primary' }, "notifications_off")) : (React.createElement(Icon, { fontSize: "small", color: 'inherit' }, "notifications"))))) }));
+                    React.createElement(LoadingButton, { variant: "text", size: "small", loading: loadingSuspendNotification, color: 'inherit', classes: { root: classes.stopButton }, onClick: () => handleStopContentNotification(contribution) }, contribution.suspended ? React.createElement(Icon, { color: 'primary' }, "notifications_off") : React.createElement(Icon, { color: 'inherit' }, "notifications")))) }));
         }
         return null;
     }

package/lib/esm/components/PlatformWidget/PlatformWidget.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { PlatformWidgetActionType } from '../../types/platformWidget';
 import { VirtualScrollerItemProps } from '../../types/virtualScroller';
 export interface PlatformWidgetProps extends VirtualScrollerItemProps {
     /**
@@ -19,11 +20,18 @@ export interface PlatformWidgetProps extends VirtualScrollerItemProps {
     /**
      * Actions to be inserted before
      */
-    startActions?: React.ReactNode | null;
+    startActions?: PlatformWidgetActionType[];
     /**
      * Actions to be inserted after
      */
-    endActions?: React.ReactNode | null;
+    endActions?: PlatformWidgetActionType[];
+    /**
+     * Hide actions
+     */
+    hideHubAction?: boolean;
+    hideConsoleAction?: boolean;
+    hideModerationAction?: boolean;
+    hideContactUsAction?: boolean;
     /**
      * Other props
      */
@@ -53,6 +61,20 @@ export interface PlatformWidgetProps extends VirtualScrollerItemProps {
  |---|---|---|
  |root|.SCPlatformWidget-root|Styles applied to the root element.|
  |title|.SCPlatformWidget-title|Styles applied to the title element.|
+ |actions|.SCPlatformWidget-actions|Styles applied to the actions container.|
+ |action|.SCPlatformWidget-action|Styles applied to the single action element.|
+ |actionHighlighted|.SCPlatformWidget-action-highlighted|Styles applied to the action highlighted.|
+ |tutorial|.SCPlatformWidget-tutorial|Styles applied to the tutorial element.|
+ |tutorialContent|.SCPlatformWidget-tutorial-content|Styles applied to the content of the tutorial element.|
+ |tutorialTitle|.SCPlatformWidget-tutorial-title|Styles applied to the title element of the tutorial.|
+ |tutorialTitleClose|.SCPlatformWidget-tutorial-title-close|Styles applied to the close button of the title in the tutorial.|
+ |tutorialDesc|.SCPlatformWidget-tutorial-desc|Styles applied to the tutorial description element.|
+ |tutorialOpen|.SCPlatformWidget-tutorial-open|Styles applied to the tutorial element when is active.|
+ |divider|.SCPlatformWidget-divider|Styles applied to the divider element in the tutorial container.|
+ |tutorialControls|.SCPlatformWidget-tutorial-controls|Styles applied to the tutorial bottom controls.|
+ |btnStep|.SCPlatformWidget-btn-step|Styles applied to the button next/previous/skip/close of the tutorial controls.|
+ |btnPreviousStep|.SCPlatformWidget-btn-previous-step|Styles applied to the button previous element of the tutorial controls.|
+ |btnNextStep|.SCPlatformWidget-btn-next-step|Styles applied to the button next element of the tutorial controls.|
 
  *
  * @param inProps