@selfcommunity/react-ui 0.7.50-events.71 → 0.7.50-events.76

package/lib/esm/components/OnBoardingWidget/Steps/Appearance/reducer.d.ts

@@ -0,0 +1,15 @@
+export declare const actionTypes: {
+    LOADING: string;
+    SET_COLORS: string;
+    SET_LOGOS: string;
+    SET_SLOGANS: string;
+};
+export declare const initialState: {
+    loading: boolean;
+    colors: any[];
+    logos: any[];
+    slogans: any[];
+    modified: boolean;
+};
+export declare function getInitialState(data: any): any;
+export declare function reducer(state: any, action: any): any;

package/lib/esm/components/OnBoardingWidget/Steps/Appearance/reducer.js

@@ -0,0 +1,37 @@
+export const actionTypes = {
+    LOADING: '_loading',
+    SET_COLORS: '_set_colors',
+    SET_LOGOS: '_set_logos',
+    SET_SLOGANS: '_set_slogans'
+};
+export const initialState = {
+    loading: false,
+    colors: [],
+    logos: [],
+    slogans: [],
+    modified: false
+};
+export function getInitialState(data) {
+    if (data) {
+        return Object.assign(Object.assign({}, initialState), data);
+    }
+    return initialState;
+}
+export function reducer(state, action) {
+    let _state = Object.assign({}, state);
+    switch (action.type) {
+        case actionTypes.LOADING:
+            _state = Object.assign(Object.assign({}, state), { loading: action.payload.loading });
+            break;
+        case actionTypes.SET_COLORS:
+            _state = Object.assign(Object.assign(Object.assign(Object.assign({}, state), { colors: action.payload.colors, logos: state.logos }), (action.payload.loading !== undefined && { loading: action.payload.loading })), { modified: true });
+            break;
+        case actionTypes.SET_LOGOS:
+            _state = Object.assign(Object.assign(Object.assign(Object.assign({}, state), { logos: action.payload.logos, colors: state.colors }), (action.payload.loading !== undefined && { loading: action.payload.loading })), { modified: true });
+            break;
+        case actionTypes.SET_SLOGANS:
+            _state = Object.assign(Object.assign(Object.assign(Object.assign({}, state), { slogans: action.payload.slogans, logos: state.logos, colors: state.colors }), (action.payload.loading !== undefined && { loading: action.payload.loading })), { modified: true });
+            break;
+    }
+    return _state;
+}

package/lib/esm/components/OnBoardingWidget/Steps/Category/Category.d.ts

@@ -0,0 +1,18 @@
+import { SCStepType } from '@selfcommunity/types';
+export interface CategoryProps {
+    /**
+     * The category step
+     */
+    step: SCStepType;
+    /**
+     * Overrides or extends the styles applied to the component.
+     * @default null
+     */
+    className?: string;
+    /**
+     * Callback triggered on success category content generation
+     * @default null
+     */
+    handleCategoriesCreation?: () => void;
+}
+export default function Category(inProps: CategoryProps): JSX.Element;

package/lib/esm/components/OnBoardingWidget/Steps/Category/Category.js

@@ -0,0 +1,77 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { styled } from '@mui/material/styles';
+import { Alert, Button, CardMedia, Icon, Typography } from '@mui/material';
+import Box from '@mui/material/Box';
+import { useThemeProps } from '@mui/system';
+import classNames from 'classnames';
+import { useEffect, useState } from 'react';
+import { FormattedMessage } from 'react-intl';
+import { PREFIX } from '../../constants';
+import CategoryA from '../../../../assets/onBoarding/CategoryA';
+import CategoryB from '../../../../assets/onBoarding/CategoryB';
+import ProgressBar from '../../../../shared/ProgressBar';
+import { SCOnBoardingStepStatusType } from '@selfcommunity/types';
+const classes = {
+    root: `${PREFIX}-category-root`,
+    title: `${PREFIX}-category-title`,
+    summary: `${PREFIX}-category-summary`,
+    image: `${PREFIX}-category-image`,
+    action: `${PREFIX}-category-action`,
+    button: `${PREFIX}-category-button`,
+    success: `${PREFIX}-success`
+};
+function CircledLetter({ letter, statement }) {
+    return (_jsxs(Box, Object.assign({ component: "span", sx: { display: 'flex', alignItems: 'center', gap: 1, mb: 1.5 } }, { children: [_jsx(Box, Object.assign({ component: "span", sx: {
+                    width: 22,
+                    height: 22,
+                    borderRadius: '50%',
+                    backgroundColor: 'black',
+                    display: 'flex',
+                    justifyContent: 'center',
+                    alignItems: 'center'
+                } }, { children: _jsx(Typography, Object.assign({ component: "span", sx: {
+                        color: 'white',
+                        textTransform: 'uppercase',
+                        fontWeight: 'bold'
+                    } }, { children: letter })) })), statement] })));
+}
+const Root = styled(Box, {
+    name: PREFIX,
+    slot: 'CategoryRoot'
+})(() => ({}));
+export default function Category(inProps) {
+    // PROPS
+    const props = useThemeProps({
+        props: inProps,
+        name: PREFIX
+    });
+    const { className, step, handleCategoriesCreation } = props;
+    // STATE
+    const [hover, setHover] = useState(false);
+    const [progress, setProgress] = useState(step.completion_percentage);
+    useEffect(() => {
+        if (step.status === SCOnBoardingStepStatusType.IN_PROGRESS) {
+            const intervalId = setInterval(() => {
+                setProgress((prev) => {
+                    if (prev >= 90) {
+                        clearInterval(intervalId);
+                        return prev;
+                    }
+                    return prev + 1;
+                });
+            }, 1000);
+            return () => clearInterval(intervalId);
+        }
+    }, [step.status]);
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [_jsx(Typography, Object.assign({ variant: "h4", className: classes.title }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.categories", defaultMessage: "ui.onBoardingWidget.categories" }) })), _jsx(Typography, Object.assign({ className: classes.summary }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.category.summary", defaultMessage: "ui.onBoardingWidget.step.category.summary" }) })), _jsx(Typography, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.category.generation.steps", defaultMessage: "ui.onBoardingWidget.step.category.generation.steps", values: {
+                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                        // @ts-ignore
+                        iconA: (...chunks) => _jsx(CircledLetter, { letter: "a", statement: chunks }),
+                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                        // @ts-ignore
+                        iconB: (...chunks) => _jsx(CircledLetter, { letter: "b", statement: chunks }),
+                        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                        // @ts-ignore
+                        iconC: (...chunks) => _jsx(CircledLetter, { letter: "c", statement: chunks })
+                    } }) }), _jsx(CardMedia, Object.assign({ className: classes.image, component: "div" }, { children: _jsx(CategoryA, {}) })), _jsx(CardMedia, Object.assign({ className: classes.image, component: "div" }, { children: _jsx(CategoryB, {}) })), _jsx(Box, Object.assign({ component: "span", className: classes.action }, { children: (step === null || step === void 0 ? void 0 : step.status) === SCOnBoardingStepStatusType.COMPLETED ? (_jsx(Alert, Object.assign({ severity: "success" }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.categories.success", defaultMessage: "ui.onBoardingWidget.step.categories.success" }) }))) : (step === null || step === void 0 ? void 0 : step.status) === SCOnBoardingStepStatusType.IN_PROGRESS ? (_jsx(ProgressBar, { value: progress, loadingMessage: _jsx(Typography, Object.assign({ variant: "h4" }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.categories.loading", defaultMessage: "ui.onBoardingWidget.step.categories.loading" }) })) })) : (_jsx(Button, Object.assign({ size: "small", variant: "contained", color: "secondary", onClick: handleCategoriesCreation, endIcon: _jsx(Icon, { children: hover ? 'ai_stars' : 'magic_wand' }), onMouseEnter: () => setHover(true), onMouseLeave: () => setHover(false) }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.onBoardingWidget.step.category.button", id: "ui.onBoardingWidget.step.category.button" }) }))) }))] })));
+}

package/lib/esm/components/OnBoardingWidget/Steps/Category/index.d.ts

@@ -0,0 +1,3 @@
+import Category, { CategoryProps } from './Category';
+export { CategoryProps };
+export default Category;

package/lib/esm/components/OnBoardingWidget/Steps/Category/index.js

@@ -0,0 +1,2 @@
+import Category from './Category';
+export default Category;

package/lib/esm/components/OnBoardingWidget/Steps/Content/Content.d.ts

@@ -0,0 +1,18 @@
+import { SCStepType } from '@selfcommunity/types';
+export interface ContentProps {
+    /**
+     * The content step
+     */
+    step: SCStepType;
+    /**
+     * Overrides or extends the styles applied to the component.
+     * @default null
+     */
+    className?: string;
+    /**
+     * Callback triggered on success category content generation
+     * @default null
+     */
+    handleContentCreation?: () => void;
+}
+export default function Content(inProps: ContentProps): JSX.Element;

package/lib/esm/components/OnBoardingWidget/Steps/Content/Content.js

@@ -0,0 +1,47 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { styled } from '@mui/material/styles';
+import { Alert, Button, Icon, Typography } from '@mui/material';
+import Box from '@mui/material/Box';
+import { useThemeProps } from '@mui/system';
+import classNames from 'classnames';
+import { useEffect, useState } from 'react';
+import { PREFIX } from '../../constants';
+import { FormattedMessage } from 'react-intl';
+import { SCOnBoardingStepStatusType } from '@selfcommunity/types';
+import ProgressBar from '../../../../shared/ProgressBar';
+const classes = {
+    root: `${PREFIX}-content-root`,
+    title: `${PREFIX}-content-title`,
+    summary: `${PREFIX}-content-summary`,
+    action: `${PREFIX}-content-action`
+};
+const Root = styled(Box, {
+    name: PREFIX,
+    slot: 'ContentRoot'
+})(() => ({}));
+export default function Content(inProps) {
+    // PROPS
+    const props = useThemeProps({
+        props: inProps,
+        name: PREFIX
+    });
+    const { className, step, handleContentCreation } = props;
+    // STATE
+    const [hover, setHover] = useState(false);
+    const [progress, setProgress] = useState(step.completion_percentage);
+    useEffect(() => {
+        if (step.status === SCOnBoardingStepStatusType.IN_PROGRESS) {
+            const intervalId = setInterval(() => {
+                setProgress((prev) => {
+                    if (prev >= 90) {
+                        clearInterval(intervalId);
+                        return prev;
+                    }
+                    return prev + 1;
+                });
+            }, 1000);
+            return () => clearInterval(intervalId);
+        }
+    }, [step.status]);
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [_jsx(Typography, Object.assign({ variant: "h4", className: classes.title }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.contents", defaultMessage: "ui.onBoardingWidget.contents" }) })), _jsx(Typography, Object.assign({ className: classes.summary }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.content.summary", defaultMessage: "ui.onBoardingWidget.step.content.summary" }) })), _jsx(Box, Object.assign({ component: "span", className: classes.action }, { children: (step === null || step === void 0 ? void 0 : step.status) === SCOnBoardingStepStatusType.COMPLETED ? (_jsx(Alert, Object.assign({ severity: "success" }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.contents.success", defaultMessage: "ui.onBoardingWidget.step.contents.success" }) }))) : (step === null || step === void 0 ? void 0 : step.status) === SCOnBoardingStepStatusType.IN_PROGRESS ? (_jsx(ProgressBar, { value: progress, loadingMessage: _jsx(Typography, Object.assign({ variant: "h4" }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.contents.loading", defaultMessage: "ui.onBoardingWidget.step.contents.loading" }) })) })) : (_jsx(Button, Object.assign({ size: "small", variant: "contained", color: "secondary", onClick: handleContentCreation, endIcon: _jsx(Icon, { children: hover ? 'ai_stars' : 'magic_wand' }), onMouseEnter: () => setHover(true), onMouseLeave: () => setHover(false) }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.onBoardingWidget.step.content.button", id: "ui.onBoardingWidget.step.content.button" }) }))) }))] })));
+}

package/lib/esm/components/OnBoardingWidget/Steps/Content/index.d.ts

@@ -0,0 +1,3 @@
+import Content, { ContentProps } from './Content';
+export { ContentProps };
+export default Content;

package/lib/esm/components/OnBoardingWidget/Steps/Content/index.js

@@ -0,0 +1,2 @@
+import Content from './Content';
+export default Content;

package/lib/esm/components/OnBoardingWidget/Steps/Invite/Invite.d.ts

@@ -0,0 +1,13 @@
+export interface InviteProps {
+    /**
+     * Overrides or extends the styles applied to the component.
+     * @default null
+     */
+    className?: string;
+    /**
+     * Callback triggered on complete action click
+     * @default null
+     */
+    onCompleteAction: () => void;
+}
+export default function Invite(inProps: InviteProps): JSX.Element;

package/lib/esm/components/OnBoardingWidget/Steps/Invite/Invite.js

@@ -0,0 +1,50 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useContext } from 'react';
+import { styled } from '@mui/material/styles';
+import Box from '@mui/material/Box';
+import { useThemeProps } from '@mui/system';
+import classNames from 'classnames';
+import { PREFIX } from '../../constants';
+import { Button, Icon, IconButton, Typography } from '@mui/material';
+import { FormattedMessage } from 'react-intl';
+import { Link, SCPreferences, SCPreferencesContext, useSCContext } from '@selfcommunity/react-core';
+import { FACEBOOK_SHARE, LINKEDIN_SHARE, X_SHARE } from '../../../../constants/SocialShare';
+import { MAKE_MARKETING_PROD, MAKE_MARKETING_STAGE } from '../../../PlatformWidget/constants';
+const classes = {
+    root: `${PREFIX}-invite-root`,
+    title: `${PREFIX}-invite-title`,
+    social: `${PREFIX}-invite-social`,
+    email: `${PREFIX}-invite-email`,
+    iconContainer: `${PREFIX}-invite-social-icon-container`,
+    icon: `${PREFIX}-invite-social-icon`,
+    action: `${PREFIX}-invite-action`
+};
+const Root = styled(Box, {
+    name: PREFIX,
+    slot: 'InviteRoot'
+})(() => ({}));
+export default function Invite(inProps) {
+    // PROPS
+    const props = useThemeProps({
+        props: inProps,
+        name: PREFIX
+    });
+    const { className, onCompleteAction = null } = props;
+    // CONTEXT
+    const scContext = useSCContext();
+    const scPreferencesContext = useContext(SCPreferencesContext);
+    const facebookShareEnabled = SCPreferences.ADDONS_SHARE_POST_ON_FACEBOOK_ENABLED in scPreferencesContext.preferences &&
+        scPreferencesContext.preferences[SCPreferences.ADDONS_SHARE_POST_ON_FACEBOOK_ENABLED].value;
+    const xShareEnabled = SCPreferences.ADDONS_SHARE_POST_ON_TWITTER_ENABLED in scPreferencesContext.preferences &&
+        scPreferencesContext.preferences[SCPreferences.ADDONS_SHARE_POST_ON_TWITTER_ENABLED].value;
+    const linkedinShareEnabled = SCPreferences.ADDONS_SHARE_POST_ON_LINKEDIN_ENABLED in scPreferencesContext.preferences &&
+        scPreferencesContext.preferences[SCPreferences.ADDONS_SHARE_POST_ON_LINKEDIN_ENABLED].value;
+    const url = scContext.settings.portal;
+    const isStage = scContext.settings.portal.includes('stage');
+    // HANDLERS
+    const handleShare = (shareUrl, shareType) => {
+        window.open(shareUrl, `${shareType}-share-dialog`, 'width=626,height=436');
+        onCompleteAction();
+    };
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [_jsx(Typography, Object.assign({ variant: "h4", className: classes.title }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.invite", defaultMessage: "ui.onBoardingWidget.invite" }) })), _jsxs(Box, Object.assign({ className: classes.social }, { children: [_jsx(Typography, Object.assign({ className: classes.title, variant: "h4" }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.invite.social.title", defaultMessage: "ui.onBoardingWidget.step.invite.social.title" }) })), _jsx(Typography, Object.assign({ variant: "subtitle1" }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.invite.social.subtitle", defaultMessage: "ui.onBoardingWidget.step.invite.social.subtitle" }) })), _jsxs(Box, Object.assign({ className: classes.iconContainer }, { children: [facebookShareEnabled && (_jsx(IconButton, Object.assign({ onClick: () => handleShare(FACEBOOK_SHARE + url, 'facebook') }, { children: _jsx(Icon, Object.assign({ classes: { root: classes.icon } }, { children: "facebook" })) }))), xShareEnabled && (_jsx(IconButton, Object.assign({ onClick: () => handleShare(X_SHARE + url, 'x') }, { children: _jsx(Icon, Object.assign({ classes: { root: classes.icon } }, { children: "twitter" })) }))), linkedinShareEnabled && (_jsx(IconButton, Object.assign({ onClick: () => handleShare(LINKEDIN_SHARE + url, 'linkedin') }, { children: _jsx(Icon, Object.assign({ classes: { root: classes.icon } }, { children: "linkedin" })) })))] }))] })), _jsxs(Box, Object.assign({ className: classes.email }, { children: [_jsx(Typography, Object.assign({ className: classes.title, variant: "h4" }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.invite.email.title", defaultMessage: "ui.onBoardingWidget.step.invite.email.title" }) })), _jsx(Typography, Object.assign({ variant: "subtitle1" }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.invite.email.subtitle", defaultMessage: "ui.onBoardingWidget.step.invite.email.subtitle" }) }))] })), _jsx(Box, Object.assign({ component: "span", className: classes.action }, { children: _jsx(Button, Object.assign({ variant: "outlined", size: "small", component: Link, to: isStage ? MAKE_MARKETING_STAGE : MAKE_MARKETING_PROD, target: "_blank", onClick: onCompleteAction }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.onBoardingWidget.step.invite.button", id: "ui.onBoardingWidget.step.invite.button" }) })) }))] })));
+}

package/lib/esm/components/OnBoardingWidget/Steps/Invite/index.d.ts

@@ -0,0 +1,3 @@
+import Invite, { InviteProps } from './Invite';
+export default Invite;
+export { InviteProps };

package/lib/esm/components/OnBoardingWidget/Steps/Invite/index.js

@@ -0,0 +1,2 @@
+import Invite from './Invite';
+export default Invite;

package/lib/esm/components/OnBoardingWidget/Steps/Profile/Profile.d.ts

@@ -0,0 +1,25 @@
+import { SCUserType } from '@selfcommunity/types';
+import { SCUserProfileFields } from '../../../../types/user';
+export interface ProfileProps {
+    /**
+     * Overrides or extends the styles applied to the component.
+     * @default null
+     */
+    className?: string;
+    /**
+     * User fields to display in the profile
+     * @default [real_name, date_joined, date_of_birth, website, description, bio]
+     */
+    fields?: SCUserProfileFields[];
+    /**
+     * User Object
+     * @default null
+     */
+    user?: SCUserType;
+    /**
+     * Callback triggered on complete action click
+     * @default null
+     */
+    onCompleteAction: () => void;
+}
+export default function Profile(inProps: ProfileProps): JSX.Element;

package/lib/esm/components/OnBoardingWidget/Steps/Profile/Profile.js

@@ -0,0 +1,91 @@
+import { __rest } from "tslib";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useState } from 'react';
+import { styled } from '@mui/material/styles';
+import Box from '@mui/material/Box';
+import { useThemeProps } from '@mui/system';
+import classNames from 'classnames';
+import { PREFIX } from '../../constants';
+import { Button, Dialog, DialogActions, IconButton, Paper, Slide, Typography } from '@mui/material';
+import { FormattedMessage } from 'react-intl';
+import PublicInfo from '../../../UserProfileEdit/Section/PublicInfo';
+import { SCPreferences, useSCContext, useSCFetchUser, useSCPreferences, useSCUser } from '@selfcommunity/react-core';
+import UserAvatar from '../../../../shared/UserAvatar';
+import ChangePicture from '../../../ChangePicture';
+import ChangeCover from '../../../ChangeCover';
+import { DEFAULT_FIELDS } from '../../../../constants/UserProfile';
+import Icon from '@mui/material/Icon';
+const classes = {
+    root: `${PREFIX}-profile-root`,
+    title: `${PREFIX}-profile-title`,
+    header: `${PREFIX}-profile-header`,
+    cover: `${PREFIX}-profile-cover`,
+    avatar: `${PREFIX}-profile-avatar`,
+    changePicture: `${PREFIX}-profile-change-picture`,
+    changeCover: `${PREFIX}-profile-change-cover`,
+    publicInfo: `${PREFIX}-profile-public-info`
+};
+const Transition = React.forwardRef(function Transition(props, ref) {
+    return _jsx(Slide, Object.assign({ direction: "up", ref: ref }, props));
+});
+const Root = styled(Box, {
+    name: PREFIX,
+    slot: 'ProfileRoot'
+})(() => ({}));
+const DialogRoot = styled(Dialog, {
+    name: PREFIX,
+    slot: 'ProfileDialogRoot'
+})(() => ({}));
+export default function Profile(inProps) {
+    var _a;
+    // PROPS
+    const props = useThemeProps({
+        props: inProps,
+        name: PREFIX
+    });
+    const { className, fields = [...DEFAULT_FIELDS], user = null, onCompleteAction } = props, rest = __rest(props, ["className", "fields", "user", "onCompleteAction"]);
+    // STATE
+    const [open, setOpen] = useState(false);
+    // PREFERENCES
+    const scPreferences = useSCPreferences();
+    // CONTEXT
+    const scContext = useSCContext();
+    const scUserContext = useSCUser();
+    // HOOKS
+    const { scUser, setSCUser } = useSCFetchUser({ id: (_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.id, user });
+    const hasBadge = scUser && scUser.community_badge;
+    // HANDLERS
+    const handleClickOpen = () => {
+        setOpen(true);
+    };
+    const handleClose = () => {
+        setOpen(false);
+    };
+    /**
+     * Handles Change Avatar
+     * If avatar === null reset the avatar with auto-generated image
+     * @param avatar
+     */
+    function handleChangeAvatar(avatar) {
+        if (avatar) {
+            setSCUser(Object.assign({}, scUser, { avatar: avatar.avatar }));
+        }
+        else {
+            setSCUser(Object.assign({}, scUser, { avatar: `${scContext.settings.portal}/api/v2/avatar/${scUser.id}` }));
+        }
+        onCompleteAction();
+    }
+    const _backgroundCover = Object.assign({}, ((scUser === null || scUser === void 0 ? void 0 : scUser.cover)
+        ? { background: `url('${scUser.cover}') center / cover` }
+        : { background: `url('${scPreferences.preferences[SCPreferences.IMAGES_USER_DEFAULT_COVER].value}') center / cover` }));
+    /**
+     * Handles Change Cover
+     * Only if scUser.id === scUserContext.user.id
+     * @param cover
+     */
+    function handleChangeCover(cover) {
+        setSCUser(Object.assign({}, scUser, { cover: cover }));
+        onCompleteAction();
+    }
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsx(Typography, Object.assign({ variant: "h4", className: classes.title, alignSelf: "self-start" }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.profile", defaultMessage: "ui.onBoardingWidget.profile" }) })), _jsx(Typography, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.profile.summary", defaultMessage: "ui.onBoardingWidget.step.profile.summary" }) }), _jsx(Button, Object.assign({ variant: "outlined", size: "small", color: "primary", onClick: handleClickOpen }, { children: _jsx(FormattedMessage, { id: "ui.onBoardingWidget.step.profile.button", defaultMessage: "ui.onBoardingWidget.step.profile.button" }) })), _jsxs(DialogRoot, Object.assign({ fullScreen: true }, rest, { open: open, onClose: handleClose, TransitionComponent: Transition }, { children: [_jsx(DialogActions, { children: _jsx(IconButton, Object.assign({ onClick: handleClose }, { children: _jsx(Icon, { children: "close" }) })) }), _jsxs(Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: [_jsx(Box, Object.assign({ className: classes.avatar }, { children: _jsx(UserAvatar, Object.assign({ hide: !hasBadge }, { children: _jsx("img", { src: (scUser === null || scUser === void 0 ? void 0 : scUser.avatar) ? scUser.avatar : '' }) })) })), _jsxs(_Fragment, { children: [_jsx(ChangePicture, { iconButton: true, onChange: handleChangeAvatar, className: classes.changePicture }), _jsx("div", Object.assign({ className: classes.changeCover }, { children: _jsx(ChangeCover, { onChange: handleChangeCover }) }))] })] })), _jsx(Box, Object.assign({ className: classes.publicInfo }, { children: _jsx(PublicInfo, { fields: fields, onEditSuccess: onCompleteAction }) }))] }))] })));
+}

package/lib/esm/components/OnBoardingWidget/Steps/Profile/index.d.ts

@@ -0,0 +1,3 @@
+import Profile, { ProfileProps } from './Profile';
+export { ProfileProps };
+export default Profile;

package/lib/esm/components/OnBoardingWidget/Steps/Profile/index.js

@@ -0,0 +1,2 @@
+import Profile from './Profile';
+export default Profile;

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

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

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

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

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

@@ -0,0 +1,4 @@
+import OnBoardingWidget, { OnBoardingWidgetProps } from './OnBoardingWidget';
+import OnBoardingWidgetSkeleton from './Skeleton';
+export default OnBoardingWidget;
+export { OnBoardingWidgetProps, OnBoardingWidgetSkeleton };

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

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

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

@@ -3,3 +3,7 @@ export declare const HUB_STAGE = "https://hub.stage.quentrix.com/";
 export declare const HUB_PROD = "https://hub.selfcommunity.com/";
 export declare const CONTACT_STAGE = "https://hub.stage.quentrix.com/dashboard/account/contact-us";
 export declare const CONTACT_PROD = "https://hub.selfcommunity.com/dashboard/account/contact-us";
+export declare const MAKE_MARKETING_STAGE = "https://make.selfcommunity.io/marketing/invitation";
+export declare const MAKE_MARKETING_PROD = "https://make.stage.quentrix.com/marketing/invitation";
+export declare const CONSOLE_STAGE = "https://make.selfcommunity.io/contents/interests";
+export declare const CONSOLE_PROD = "https://make.stage.quentrix.com/contents/interests";

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

@@ -3,3 +3,7 @@ export const HUB_STAGE = 'https://hub.stage.quentrix.com/';
 export const HUB_PROD = 'https://hub.selfcommunity.com/';
 export const CONTACT_STAGE = 'https://hub.stage.quentrix.com/dashboard/account/contact-us';
 export const CONTACT_PROD = 'https://hub.selfcommunity.com/dashboard/account/contact-us';
+export const MAKE_MARKETING_STAGE = 'https://make.selfcommunity.io/marketing/invitation';
+export const MAKE_MARKETING_PROD = 'https://make.stage.quentrix.com/marketing/invitation';
+export const CONSOLE_STAGE = 'https://make.selfcommunity.io/contents/interests';
+export const CONSOLE_PROD = 'https://make.stage.quentrix.com/contents/interests';

package/lib/esm/index.d.ts

@@ -118,6 +118,8 @@ import UserProfileHeader, { UserProfileHeaderProps, UserProfileHeaderSkeleton }
 import UserSocialAssociation, { UserSocialAssociationProps } from './components/UserSocialAssociation';
 import UserSubscribedGroupsWidget, { UserSubscribedGroupsWidgetProps, UserSubscribedGroupsWidgetSkeleton } from './components/UserSubscribedGroupsWidget';
 import UserSuggestionWidget, { UserSuggestionWidgetProps, UserSuggestionWidgetSkeleton } from './components/UserSuggestionWidget';
+import OnBoardingWidget, { OnBoardingWidgetProps, OnBoardingWidgetSkeleton } from './components/OnBoardingWidget';
+import ProgressBar, { ProgressBarProps } from './shared/ProgressBar';
 import Widget, { WidgetProps } from './components/Widget';
 import { MEDIA_EMBED_SC_LINK_TYPE, MEDIA_EMBED_SC_SHARED_EVENT, MEDIA_EMBED_SC_SHARED_OBJECT, MEDIA_TYPE_DOCUMENT, MEDIA_TYPE_EMBED, MEDIA_TYPE_EVENT, MEDIA_TYPE_IMAGE, MEDIA_TYPE_LINK, MEDIA_TYPE_SHARE, MEDIA_TYPE_URL, MEDIA_TYPE_VIDEO } from './constants/Media';
 import BaseDialog, { BaseDialogProps } from './shared/BaseDialog';
@@ -169,4 +171,4 @@ import LogoSelfCommunity from './assets/logo';
 /**
  * List all exports
  */
-export { AccountChangeMailValidation, AccountChangeMailValidationProps, AccountDataPortability, AccountDataPortabilityButton, AccountDataPortabilityButtonProps, AccountDataPortabilityProps, AccountDelete, AccountDeleteButton, AccountDeleteButtonProps, AccountDeleteProps, AccountRecover, AccountRecoverProps, AccountReset, AccountResetProps, AccountVerify, AccountVerifyProps, AvatarGroupSkeleton, BaseDialog, BaseDialogProps, BaseItem, BaseItemProps, BottomNavigation, BottomNavigationProps, BroadcastMessages, BroadcastMessagesProps, BroadcastMessagesSkeleton, bytesToSize, Calendar, CalendarProps, Categories, CategoriesPopularWidget, CategoriesPopularWidgetSkeleton, CategoriesProps, CategoriesSkeleton, CategoriesSkeletonProps, CategoriesSuggestionWidget, CategoriesSuggestionWidgetProps, CategoriesSuggestionWidgetSkeleton, Category, CategoryAutocomplete, CategoryAutocompleteProps, CategoryFollowButton, CategoryFollowButtonProps, CategoryFollowersButton, CategoryFollowersButtonProps, CategoryHeader, CategoryHeaderProps, CategoryHeaderSkeleton, CategoryProps, CategorySkeleton, CategoryTrendingFeedWidget, CategoryTrendingFeedWidgetProps, CategoryTrendingFeedWidgetSkeleton, CategoryTrendingPeopleWidgetSkeleton, CategoryTrendingUsersWidget, CategoryTrendingUsersWidgetProps, CentralProgress, ChangeCover, ChangeCoverProps, ChangeGroupCover, ChangeGroupCoverProps, ChangeGroupPicture, ChangeGroupPictureProps, ChangePicture, ChangePictureProps, CommentObject, CommentObjectProps, CommentObjectReply, CommentObjectReplyProps, CommentObjectSkeleton, CommentsFeedObject, CommentsFeedObjectProps, CommentsFeedObjectSkeleton, CommentsObject, CommentsObjectProps, CommentsObjectSkeleton, Composer, ComposerIconButton, ComposerIconButtonProps, ComposerProps, ConfirmDialog, ConnectionUserButton, ConsentSolution, ConsentSolutionButton, ConsentSolutionButtonProps, ConsentSolutionProps, ConsentSolutionSkeleton, ContributionUtils, CreateEventButton, CreateEventButtonProps, CreateEventWidget, CreateEventWidgetProps, CreateEventWidgetSkeleton, CreateGroupButton, CreateGroupButtonProps, CustomAdv, CustomAdvProps, CustomAdvSkeleton, DEFAULT_FIELDS, DEFAULT_PAGINATION_LIMIT, DEFAULT_PAGINATION_OFFSET, DEFAULT_PAGINATION_QUERY_PARAM_NAME, DEFAULT_PRELOAD_OFFSET_VIEWPORT, DEFAULT_WIDGETS_NUMBER, DefaultDrawerContent, DefaultDrawerContentProps, DefaultHeaderContent, DefaultHeaderContentProps, EditEventButton, EditEventButtonProps, EditGroupButton, EditGroupButtonProps, EditMediaProps, Editor, EditorProps, EditorSkeleton, EmailTextField, Event, EventActionsMenu, EventActionsMenuProps, EventHeader, EventHeaderProps, EventHeaderSkeleton, EventInfoDetails, EventInfoDetailsProps, EventInfoWidget, EventInfoWidgetProps, EventInviteButton, EventInviteButtonProps, EventLocationWidget, EventLocationWidgetProps, EventLocationWidgetSkeleton, EventMembersWidget, EventMembersWidgetProps, EventMembersWidgetSkeleton, EventParticipantsButton, EventParticipantsButtonProps, EventProps, Events, EventSkeleton, EventSkeletonProps, EventsProps, EventsSkeleton, EventsSkeletonProps, FACEBOOK_SHARE, Feed, FeedObject, FeedObjectMediaPreview, FeedObjectMediaPreviewProps, FeedObjectProps, FeedObjectSkeleton, FeedProps, FeedRef, FeedSidebarProps, FeedSkeleton, FeedUpdatesWidget, FeedUpdatesWidgetProps, FeedUpdatesWidgetSkeleton, File, FollowUserButton, FollowUserButtonProps, Footer, FooterProps, FooterSkeleton, FriendshipButtonProps, FriendshipUserButton, GenericSkeleton, getRelativeTime, getUnseenNotification, getUnseenNotificationCounter, Group, GroupForm, GroupFormProps, GroupHeader, GroupHeaderProps, GroupHeaderSkeleton, GroupInfoWidget, GroupInfoWidgetProps, GroupInfoWidgetSkeleton, GroupInviteButton, GroupInviteButtonProps, GroupInvitedWidget, GroupInvitedWidgetProps, GroupInvitedWidgetSkeleton, GroupMembersButton, GroupMembersButtonProps, GroupMembersWidget, GroupMembersWidgetProps, GroupMembersWidgetSkeleton, GroupProps, GroupRequestsWidget, GroupRequestsWidgetProps, GroupRequestsWidgetSkeleton, Groups, GroupSettingsIconButton, GroupSettingsIconButtonProps, GroupSkeleton, GroupsProps, GroupsSkeleton, GroupSubscribeButton, GroupSubscribeButtonProps, HiddenPlaceholder, Incubator, IncubatorDetail, IncubatorDetailProps, IncubatorListWidget, IncubatorListWidgetProps, IncubatorProps, IncubatorSubscribeButton, IncubatorSubscribeButtonProps, IncubatorSuggestionWidget, IncubatorSuggestionWidgetProps, InfiniteScroll, InlineComposerWidget, InlineComposerWidgetProps, InlineComposerWidgetSkeleton, InviteUserEventButton, InviteUserEventButtonProps, LanguageSwitcher, LEGAL_POLICIES, Lightbox, Link, LINKEDIN_SHARE, LocationAutocomplete, LocationAutocompleteProps, LogoSelfCommunity, LoyaltyProgramWidget, LoyaltyProgramWidgetProps, LoyaltyProgramWidgetSkeleton, MAX_PRELOAD_OFFSET_VIEWPORT, MEDIA_EMBED_SC_LINK_TYPE, MEDIA_EMBED_SC_SHARED_EVENT, MEDIA_EMBED_SC_SHARED_OBJECT, MEDIA_TYPE_DOCUMENT, MEDIA_TYPE_EMBED, MEDIA_TYPE_EVENT, MEDIA_TYPE_IMAGE, MEDIA_TYPE_LINK, MEDIA_TYPE_SHARE, MEDIA_TYPE_URL, MEDIA_TYPE_VIDEO, MediaChunkUploader, MediaChunkUploaderProps, MessageUploaderUtils, MetadataField, MetadataFieldProps, MIN_PRELOAD_OFFSET_VIEWPORT, MyEventsWidget, MyEventsWidgetProps, MyEventsWidgetSkeleton, NavigationMenuContent, NavigationMenuHeader, NavigationMenuIconButton, NavigationMenuIconButtonProps, NavigationSettingsIconButton, NavigationSettingsIconButtonProps, NavigationSettingsItem, NavigationToolbar, NavigationToolbarMobile, NavigationToolbarMobileProps, NavigationToolbarMobileSkeleton, NavigationToolbarProps, NavigationToolbarSkeleton, Notification, NotificationProps, NotificationSkeleton, PasswordTextField, PhoneTextField, PlatformWidget, PlatformWidgetActionType, PlatformWidgetProps, PlatformWidgetSkeleton, PollSuggestionWidget, PollSuggestionWidgetProps, PrivateMessageComponent, PrivateMessageComponentProps, PrivateMessageComponentSkeleton, PrivateMessageEditor, PrivateMessageEditorProps, PrivateMessageEditorSkeleton, PrivateMessageSettingsIconButton, PrivateMessageSettingsIconButtonProps, PrivateMessageSnippetItem, PrivateMessageSnippetItemProps, PrivateMessageSnippetItemSkeleton, PrivateMessageSnippets, PrivateMessageSnippetsProps, PrivateMessageSnippetsSkeleton, PrivateMessageThread, PrivateMessageThreadItem, PrivateMessageThreadItemProps, PrivateMessageThreadItemSkeleton, PrivateMessageThreadProps, PrivateMessageThreadSkeleton, RelatedEventsWidget, RelatedEventsWidgetProps, RelatedEventsWidgetSkeleton, RelatedFeedObjectsWidget, RelatedFeedObjectsWidgetSkeleton, RelatedFeedObjectWidgetProps, ReplyComment, SCBroadcastMessageTemplateType, SCCommentsOrderBy, SCFeedObjectActivitiesType, SCFeedObjectTemplateType, SCFeedWidgetType, SCMediaChunkType, SCMediaObjectType, SCNotificationObjectTemplateType, SCUserProfileFields, SCUserProfileSettings, SCUserSocialAssociations, SearchAutocomplete, SearchAutocompleteProps, SearchDialog, SearchDialogProps, Share, SnippetNotifications, SnippetNotificationsProps, SnippetNotificationsSkeleton, StickyBox, StickyBoxComponent, StickyBoxProps, SuggestedEventsWidget, SuggestedEventsWidgetProps, SuggestedEventsWidgetSkeleton, TagChip, TagChipProps, ToastNotifications, ToastNotificationsProps, ToastNotificationsSkeleton, UrlTextField, User, UserActionIconButton, UserActionIconButtonProps, UserAvatar, UserAvatarProps, UserConnectionsRequestsSentWidget, UserConnectionsRequestsSentWidgetProps, UserConnectionsRequestsSentWidgetSkeleton, UserConnectionsRequestsWidget, UserConnectionsRequestsWidgetProps, UserConnectionsRequestsWidgetSkeleton, UserConnectionsWidget, UserConnectionsWidgetProps, UserConnectionsWidgetSkeleton, UserCounters, UserCountersProps, UserDeletedSnackBar, UserDeletedSnackBarProps, UserFollowedCategoriesWidget, UserFollowedCategoriesWidgetProps, UserFollowedCategoriesWidgetSkeleton, UserFollowedUsersWidget, UserFollowedUsersWidgetProps, UserFollowedUsersWidgetSkeleton, UserFollowersWidget, UserFollowersWidgetProps, UserFollowersWidgetSkeleton, UserInfo, UserInfoDialog, UserInfoDialogProps, UserInfoProps, UserInfoSkeleton, UsernameTextField, UserProfileBlocked, UserProfileBlockedProps, UserProfileEdit, UserProfileEditProps, UserProfileEditSectionAccount, UserProfileEditSectionAccountProps, UserProfileEditSectionPublicInfo, UserProfileEditSectionPublicInfoProps, UserProfileEditSectionSettings, UserProfileEditSectionSettingsProps, UserProfileEditSkeleton, UserProfileHeader, UserProfileHeaderProps, UserProfileHeaderSkeleton, UserProps, UserSkeleton, UserSocialAssociation, UserSocialAssociationProps, UserSubscribedGroupsWidget, UserSubscribedGroupsWidgetProps, UserSubscribedGroupsWidgetSkeleton, UserSuggestionWidget, UserSuggestionWidgetProps, UserSuggestionWidgetSkeleton, useStickyBox, UseStickyBoxProps, VirtualScrollerItemProps, Widget, WidgetProps, X_SHARE };
+export { AccountChangeMailValidation, AccountChangeMailValidationProps, AccountDataPortability, AccountDataPortabilityButton, AccountDataPortabilityButtonProps, AccountDataPortabilityProps, AccountDelete, AccountDeleteButton, AccountDeleteButtonProps, AccountDeleteProps, AccountRecover, AccountRecoverProps, AccountReset, AccountResetProps, AccountVerify, AccountVerifyProps, AvatarGroupSkeleton, BaseDialog, BaseDialogProps, BaseItem, BaseItemProps, BottomNavigation, BottomNavigationProps, BroadcastMessages, BroadcastMessagesProps, BroadcastMessagesSkeleton, bytesToSize, Calendar, CalendarProps, Categories, CategoriesPopularWidget, CategoriesPopularWidgetSkeleton, CategoriesProps, CategoriesSkeleton, CategoriesSkeletonProps, CategoriesSuggestionWidget, CategoriesSuggestionWidgetProps, CategoriesSuggestionWidgetSkeleton, Category, CategoryAutocomplete, CategoryAutocompleteProps, CategoryFollowButton, CategoryFollowButtonProps, CategoryFollowersButton, CategoryFollowersButtonProps, CategoryHeader, CategoryHeaderProps, CategoryHeaderSkeleton, CategoryProps, CategorySkeleton, CategoryTrendingFeedWidget, CategoryTrendingFeedWidgetProps, CategoryTrendingFeedWidgetSkeleton, CategoryTrendingPeopleWidgetSkeleton, CategoryTrendingUsersWidget, CategoryTrendingUsersWidgetProps, CentralProgress, ChangeCover, ChangeCoverProps, ChangeGroupCover, ChangeGroupCoverProps, ChangeGroupPicture, ChangeGroupPictureProps, ChangePicture, ChangePictureProps, CommentObject, CommentObjectProps, CommentObjectReply, CommentObjectReplyProps, CommentObjectSkeleton, CommentsFeedObject, CommentsFeedObjectProps, CommentsFeedObjectSkeleton, CommentsObject, CommentsObjectProps, CommentsObjectSkeleton, Composer, ComposerIconButton, ComposerIconButtonProps, ComposerProps, ConfirmDialog, ConnectionUserButton, ConsentSolution, ConsentSolutionButton, ConsentSolutionButtonProps, ConsentSolutionProps, ConsentSolutionSkeleton, ContributionUtils, CreateEventButton, CreateEventButtonProps, CreateEventWidget, CreateEventWidgetProps, CreateEventWidgetSkeleton, CreateGroupButton, CreateGroupButtonProps, CustomAdv, CustomAdvProps, CustomAdvSkeleton, DEFAULT_FIELDS, DEFAULT_PAGINATION_LIMIT, DEFAULT_PAGINATION_OFFSET, DEFAULT_PAGINATION_QUERY_PARAM_NAME, DEFAULT_PRELOAD_OFFSET_VIEWPORT, DEFAULT_WIDGETS_NUMBER, DefaultDrawerContent, DefaultDrawerContentProps, DefaultHeaderContent, DefaultHeaderContentProps, EditEventButton, EditEventButtonProps, EditGroupButton, EditGroupButtonProps, EditMediaProps, Editor, EditorProps, EditorSkeleton, EmailTextField, Event, EventActionsMenu, EventActionsMenuProps, EventHeader, EventHeaderProps, EventHeaderSkeleton, EventInfoDetails, EventInfoDetailsProps, EventInfoWidget, EventInfoWidgetProps, EventInviteButton, EventInviteButtonProps, EventLocationWidget, EventLocationWidgetProps, EventLocationWidgetSkeleton, EventMembersWidget, EventMembersWidgetProps, EventMembersWidgetSkeleton, EventParticipantsButton, EventParticipantsButtonProps, EventProps, Events, EventSkeleton, EventSkeletonProps, EventsProps, EventsSkeleton, EventsSkeletonProps, Feed, FeedObject, FeedObjectMediaPreview, FeedObjectMediaPreviewProps, FeedObjectProps, FeedObjectSkeleton, FeedProps, FeedRef, FeedSidebarProps, FeedSkeleton, FeedUpdatesWidget, FeedUpdatesWidgetProps, FeedUpdatesWidgetSkeleton, File, FollowUserButton, FollowUserButtonProps, Footer, FooterProps, FooterSkeleton, FriendshipButtonProps, FriendshipUserButton, GenericSkeleton, getRelativeTime, getUnseenNotification, getUnseenNotificationCounter, Group, GroupForm, GroupFormProps, GroupHeader, GroupHeaderProps, GroupHeaderSkeleton, GroupInfoWidget, GroupInfoWidgetProps, GroupInfoWidgetSkeleton, GroupInviteButton, GroupInviteButtonProps, GroupInvitedWidget, GroupInvitedWidgetProps, GroupInvitedWidgetSkeleton, GroupMembersButton, GroupMembersButtonProps, GroupMembersWidget, GroupMembersWidgetProps, GroupMembersWidgetSkeleton, GroupProps, GroupRequestsWidget, GroupRequestsWidgetProps, GroupRequestsWidgetSkeleton, Groups, GroupSettingsIconButton, GroupSettingsIconButtonProps, GroupSkeleton, GroupsProps, GroupsSkeleton, GroupSubscribeButton, GroupSubscribeButtonProps, HiddenPlaceholder, Incubator, IncubatorDetail, IncubatorDetailProps, IncubatorListWidget, IncubatorListWidgetProps, IncubatorProps, IncubatorSubscribeButton, IncubatorSubscribeButtonProps, IncubatorSuggestionWidget, IncubatorSuggestionWidgetProps, InfiniteScroll, InlineComposerWidget, InlineComposerWidgetProps, InlineComposerWidgetSkeleton, InviteUserEventButton, InviteUserEventButtonProps, LanguageSwitcher, LEGAL_POLICIES, Lightbox, Link, FACEBOOK_SHARE, LINKEDIN_SHARE, X_SHARE, LocationAutocomplete, LocationAutocompleteProps, LoyaltyProgramWidget, LoyaltyProgramWidgetProps, LoyaltyProgramWidgetSkeleton, MAX_PRELOAD_OFFSET_VIEWPORT, MEDIA_EMBED_SC_LINK_TYPE, MEDIA_EMBED_SC_SHARED_EVENT, MEDIA_EMBED_SC_SHARED_OBJECT, MEDIA_TYPE_DOCUMENT, MEDIA_TYPE_EMBED, MEDIA_TYPE_EVENT, MEDIA_TYPE_IMAGE, MEDIA_TYPE_LINK, MEDIA_TYPE_SHARE, MEDIA_TYPE_URL, MEDIA_TYPE_VIDEO, MediaChunkUploader, MediaChunkUploaderProps, MessageUploaderUtils, MetadataField, MetadataFieldProps, MIN_PRELOAD_OFFSET_VIEWPORT, MyEventsWidget, MyEventsWidgetProps, MyEventsWidgetSkeleton, NavigationMenuContent, NavigationMenuHeader, NavigationMenuIconButton, NavigationMenuIconButtonProps, NavigationSettingsIconButton, NavigationSettingsIconButtonProps, NavigationSettingsItem, NavigationToolbar, NavigationToolbarMobile, NavigationToolbarMobileProps, NavigationToolbarMobileSkeleton, NavigationToolbarProps, NavigationToolbarSkeleton, Notification, NotificationProps, NotificationSkeleton, PasswordTextField, PhoneTextField, PlatformWidget, PlatformWidgetActionType, PlatformWidgetProps, PlatformWidgetSkeleton, PollSuggestionWidget, PollSuggestionWidgetProps, PrivateMessageComponent, PrivateMessageComponentProps, PrivateMessageComponentSkeleton, PrivateMessageEditor, PrivateMessageEditorProps, PrivateMessageEditorSkeleton, PrivateMessageSettingsIconButton, PrivateMessageSettingsIconButtonProps, PrivateMessageSnippetItem, PrivateMessageSnippetItemProps, PrivateMessageSnippetItemSkeleton, PrivateMessageSnippets, PrivateMessageSnippetsProps, PrivateMessageSnippetsSkeleton, PrivateMessageThread, PrivateMessageThreadItem, PrivateMessageThreadItemProps, PrivateMessageThreadItemSkeleton, PrivateMessageThreadProps, PrivateMessageThreadSkeleton, RelatedEventsWidget, RelatedEventsWidgetProps, RelatedEventsWidgetSkeleton, RelatedFeedObjectsWidget, RelatedFeedObjectsWidgetSkeleton, RelatedFeedObjectWidgetProps, ReplyComment, SCBroadcastMessageTemplateType, SCCommentsOrderBy, SCFeedObjectActivitiesType, SCFeedObjectTemplateType, SCFeedWidgetType, SCMediaChunkType, SCMediaObjectType, SCNotificationObjectTemplateType, SCUserProfileFields, SCUserProfileSettings, SCUserSocialAssociations, SearchAutocomplete, SearchAutocompleteProps, SearchDialog, SearchDialogProps, Share, SnippetNotifications, SnippetNotificationsProps, SnippetNotificationsSkeleton, StickyBox, StickyBoxComponent, StickyBoxProps, SuggestedEventsWidget, SuggestedEventsWidgetProps, SuggestedEventsWidgetSkeleton, TagChip, TagChipProps, ToastNotifications, ToastNotificationsProps, ToastNotificationsSkeleton, UrlTextField, User, UserActionIconButton, UserActionIconButtonProps, UserAvatar, UserAvatarProps, UserConnectionsRequestsSentWidget, UserConnectionsRequestsSentWidgetProps, UserConnectionsRequestsSentWidgetSkeleton, UserConnectionsRequestsWidget, UserConnectionsRequestsWidgetProps, UserConnectionsRequestsWidgetSkeleton, UserConnectionsWidget, UserConnectionsWidgetProps, UserConnectionsWidgetSkeleton, UserCounters, UserCountersProps, UserDeletedSnackBar, UserDeletedSnackBarProps, UserFollowedCategoriesWidget, UserFollowedCategoriesWidgetProps, UserFollowedCategoriesWidgetSkeleton, UserFollowedUsersWidget, UserFollowedUsersWidgetProps, UserFollowedUsersWidgetSkeleton, UserFollowersWidget, UserFollowersWidgetProps, UserFollowersWidgetSkeleton, UserInfo, UserInfoDialog, UserInfoDialogProps, UserInfoProps, UserInfoSkeleton, UsernameTextField, UserProfileBlocked, UserProfileBlockedProps, UserProfileEdit, UserProfileEditProps, UserProfileEditSectionAccount, UserProfileEditSectionAccountProps, UserProfileEditSectionPublicInfo, UserProfileEditSectionPublicInfoProps, UserProfileEditSectionSettings, UserProfileEditSectionSettingsProps, UserProfileEditSkeleton, UserProfileHeader, UserProfileHeaderProps, UserProfileHeaderSkeleton, UserProps, UserSkeleton, UserSocialAssociation, UserSocialAssociationProps, UserSubscribedGroupsWidget, UserSubscribedGroupsWidgetProps, UserSubscribedGroupsWidgetSkeleton, UserSuggestionWidget, UserSuggestionWidgetProps, UserSuggestionWidgetSkeleton, useStickyBox, UseStickyBoxProps, VirtualScrollerItemProps, Widget, WidgetProps, OnBoardingWidget, OnBoardingWidgetProps, OnBoardingWidgetSkeleton, ProgressBar, ProgressBarProps, LogoSelfCommunity };

package/lib/esm/index.js

@@ -118,6 +118,8 @@ import UserProfileHeader, { UserProfileHeaderSkeleton } from './components/UserP
 import UserSocialAssociation from './components/UserSocialAssociation';
 import UserSubscribedGroupsWidget, { UserSubscribedGroupsWidgetSkeleton } from './components/UserSubscribedGroupsWidget';
 import UserSuggestionWidget, { UserSuggestionWidgetSkeleton } from './components/UserSuggestionWidget';
+import OnBoardingWidget, { OnBoardingWidgetSkeleton } from './components/OnBoardingWidget';
+import ProgressBar from './shared/ProgressBar';
 import Widget from './components/Widget';
 import { MEDIA_EMBED_SC_LINK_TYPE, MEDIA_EMBED_SC_SHARED_EVENT, MEDIA_EMBED_SC_SHARED_OBJECT, MEDIA_TYPE_DOCUMENT, MEDIA_TYPE_EMBED, MEDIA_TYPE_EVENT, MEDIA_TYPE_IMAGE, MEDIA_TYPE_LINK, MEDIA_TYPE_SHARE, MEDIA_TYPE_URL, MEDIA_TYPE_VIDEO } from './constants/Media';
 import BaseDialog from './shared/BaseDialog';
@@ -173,8 +175,8 @@ export { AccountChangeMailValidation, AccountDataPortability, AccountDataPortabi
 /* SC CONSENT SOLUTION */
 ConsentSolution, ConsentSolutionButton, ConsentSolutionSkeleton, ContributionUtils, CreateEventButton, CreateEventWidget, CreateEventWidgetSkeleton, CreateGroupButton, CustomAdv, CustomAdvSkeleton, DEFAULT_FIELDS, DEFAULT_PAGINATION_LIMIT, DEFAULT_PAGINATION_OFFSET, 
 /* SC UI PAGINATION */
-DEFAULT_PAGINATION_QUERY_PARAM_NAME, DEFAULT_PRELOAD_OFFSET_VIEWPORT, DEFAULT_WIDGETS_NUMBER, DefaultDrawerContent, DefaultHeaderContent, EditEventButton, EditGroupButton, Editor, EditorSkeleton, EmailTextField, Event, EventActionsMenu, EventHeader, EventHeaderSkeleton, EventInfoDetails, EventInfoWidget, EventInviteButton, EventLocationWidget, EventLocationWidgetSkeleton, EventMembersWidget, EventMembersWidgetSkeleton, EventParticipantsButton, Events, EventSkeleton, EventsSkeleton, FACEBOOK_SHARE, Feed, FeedObject, FeedObjectMediaPreview, FeedObjectSkeleton, FeedSkeleton, FeedUpdatesWidget, FeedUpdatesWidgetSkeleton, File, FollowUserButton, Footer, FooterSkeleton, FriendshipUserButton, GenericSkeleton, getRelativeTime, getUnseenNotification, getUnseenNotificationCounter, Group, GroupForm, GroupHeader, GroupHeaderSkeleton, GroupInfoWidget, GroupInfoWidgetSkeleton, GroupInviteButton, GroupInvitedWidget, GroupInvitedWidgetSkeleton, GroupMembersButton, GroupMembersWidget, GroupMembersWidgetSkeleton, GroupRequestsWidget, GroupRequestsWidgetSkeleton, Groups, GroupSettingsIconButton, GroupSkeleton, GroupsSkeleton, GroupSubscribeButton, 
+DEFAULT_PAGINATION_QUERY_PARAM_NAME, DEFAULT_PRELOAD_OFFSET_VIEWPORT, DEFAULT_WIDGETS_NUMBER, DefaultDrawerContent, DefaultHeaderContent, EditEventButton, EditGroupButton, Editor, EditorSkeleton, EmailTextField, Event, EventActionsMenu, EventHeader, EventHeaderSkeleton, EventInfoDetails, EventInfoWidget, EventInviteButton, EventLocationWidget, EventLocationWidgetSkeleton, EventMembersWidget, EventMembersWidgetSkeleton, EventParticipantsButton, Events, EventSkeleton, EventsSkeleton, Feed, FeedObject, FeedObjectMediaPreview, FeedObjectSkeleton, FeedSkeleton, FeedUpdatesWidget, FeedUpdatesWidgetSkeleton, File, FollowUserButton, Footer, FooterSkeleton, FriendshipUserButton, GenericSkeleton, getRelativeTime, getUnseenNotification, getUnseenNotificationCounter, Group, GroupForm, GroupHeader, GroupHeaderSkeleton, GroupInfoWidget, GroupInfoWidgetSkeleton, GroupInviteButton, GroupInvitedWidget, GroupInvitedWidgetSkeleton, GroupMembersButton, GroupMembersWidget, GroupMembersWidgetSkeleton, GroupRequestsWidget, GroupRequestsWidgetSkeleton, Groups, GroupSettingsIconButton, GroupSkeleton, GroupsSkeleton, GroupSubscribeButton, 
 /* SC UI SHARED */
-HiddenPlaceholder, Incubator, IncubatorDetail, IncubatorListWidget, IncubatorSubscribeButton, IncubatorSuggestionWidget, InfiniteScroll, InlineComposerWidget, InlineComposerWidgetSkeleton, InviteUserEventButton, LanguageSwitcher, LEGAL_POLICIES, Lightbox, Link, LINKEDIN_SHARE, LocationAutocomplete, 
+HiddenPlaceholder, Incubator, IncubatorDetail, IncubatorListWidget, IncubatorSubscribeButton, IncubatorSuggestionWidget, InfiniteScroll, InlineComposerWidget, InlineComposerWidgetSkeleton, InviteUserEventButton, LanguageSwitcher, LEGAL_POLICIES, Lightbox, Link, FACEBOOK_SHARE, LINKEDIN_SHARE, X_SHARE, LocationAutocomplete, LoyaltyProgramWidget, LoyaltyProgramWidgetSkeleton, MAX_PRELOAD_OFFSET_VIEWPORT, MEDIA_EMBED_SC_LINK_TYPE, MEDIA_EMBED_SC_SHARED_EVENT, MEDIA_EMBED_SC_SHARED_OBJECT, MEDIA_TYPE_DOCUMENT, MEDIA_TYPE_EMBED, MEDIA_TYPE_EVENT, MEDIA_TYPE_IMAGE, MEDIA_TYPE_LINK, MEDIA_TYPE_SHARE, MEDIA_TYPE_URL, MEDIA_TYPE_VIDEO, MediaChunkUploader, MessageUploaderUtils, MetadataField, MIN_PRELOAD_OFFSET_VIEWPORT, MyEventsWidget, MyEventsWidgetSkeleton, NavigationMenuContent, NavigationMenuHeader, NavigationMenuIconButton, NavigationSettingsIconButton, NavigationToolbar, NavigationToolbarMobile, NavigationToolbarMobileSkeleton, NavigationToolbarSkeleton, Notification, NotificationSkeleton, PasswordTextField, PhoneTextField, PlatformWidget, PlatformWidgetSkeleton, PollSuggestionWidget, PrivateMessageComponent, PrivateMessageComponentSkeleton, PrivateMessageEditor, PrivateMessageEditorSkeleton, PrivateMessageSettingsIconButton, PrivateMessageSnippetItem, PrivateMessageSnippetItemSkeleton, PrivateMessageSnippets, PrivateMessageSnippetsSkeleton, PrivateMessageThread, PrivateMessageThreadItem, PrivateMessageThreadItemSkeleton, PrivateMessageThreadSkeleton, RelatedEventsWidget, RelatedEventsWidgetSkeleton, RelatedFeedObjectsWidget, RelatedFeedObjectsWidgetSkeleton, ReplyComment, SCBroadcastMessageTemplateType, SCCommentsOrderBy, SCFeedObjectActivitiesType, SCFeedObjectTemplateType, SCNotificationObjectTemplateType, SCUserProfileFields, SCUserProfileSettings, SCUserSocialAssociations, SearchAutocomplete, SearchDialog, Share, SnippetNotifications, SnippetNotificationsSkeleton, StickyBox, SuggestedEventsWidget, SuggestedEventsWidgetSkeleton, TagChip, ToastNotifications, ToastNotificationsSkeleton, UrlTextField, User, UserActionIconButton, UserAvatar, UserConnectionsRequestsSentWidget, UserConnectionsRequestsSentWidgetSkeleton, UserConnectionsRequestsWidget, UserConnectionsRequestsWidgetSkeleton, UserConnectionsWidget, UserConnectionsWidgetSkeleton, UserCounters, UserDeletedSnackBar, UserFollowedCategoriesWidget, UserFollowedCategoriesWidgetSkeleton, UserFollowedUsersWidget, UserFollowedUsersWidgetSkeleton, UserFollowersWidget, UserFollowersWidgetSkeleton, UserInfo, UserInfoDialog, UserInfoSkeleton, UsernameTextField, UserProfileBlocked, UserProfileEdit, UserProfileEditSectionAccount, UserProfileEditSectionPublicInfo, UserProfileEditSectionSettings, UserProfileEditSkeleton, UserProfileHeader, UserProfileHeaderSkeleton, UserSkeleton, UserSocialAssociation, UserSubscribedGroupsWidget, UserSubscribedGroupsWidgetSkeleton, UserSuggestionWidget, UserSuggestionWidgetSkeleton, useStickyBox, Widget, OnBoardingWidget, OnBoardingWidgetSkeleton, ProgressBar, 
 /* Assets */
-LogoSelfCommunity, LoyaltyProgramWidget, LoyaltyProgramWidgetSkeleton, MAX_PRELOAD_OFFSET_VIEWPORT, MEDIA_EMBED_SC_LINK_TYPE, MEDIA_EMBED_SC_SHARED_EVENT, MEDIA_EMBED_SC_SHARED_OBJECT, MEDIA_TYPE_DOCUMENT, MEDIA_TYPE_EMBED, MEDIA_TYPE_EVENT, MEDIA_TYPE_IMAGE, MEDIA_TYPE_LINK, MEDIA_TYPE_SHARE, MEDIA_TYPE_URL, MEDIA_TYPE_VIDEO, MediaChunkUploader, MessageUploaderUtils, MetadataField, MIN_PRELOAD_OFFSET_VIEWPORT, MyEventsWidget, MyEventsWidgetSkeleton, NavigationMenuContent, NavigationMenuHeader, NavigationMenuIconButton, NavigationSettingsIconButton, NavigationToolbar, NavigationToolbarMobile, NavigationToolbarMobileSkeleton, NavigationToolbarSkeleton, Notification, NotificationSkeleton, PasswordTextField, PhoneTextField, PlatformWidget, PlatformWidgetSkeleton, PollSuggestionWidget, PrivateMessageComponent, PrivateMessageComponentSkeleton, PrivateMessageEditor, PrivateMessageEditorSkeleton, PrivateMessageSettingsIconButton, PrivateMessageSnippetItem, PrivateMessageSnippetItemSkeleton, PrivateMessageSnippets, PrivateMessageSnippetsSkeleton, PrivateMessageThread, PrivateMessageThreadItem, PrivateMessageThreadItemSkeleton, PrivateMessageThreadSkeleton, RelatedEventsWidget, RelatedEventsWidgetSkeleton, RelatedFeedObjectsWidget, RelatedFeedObjectsWidgetSkeleton, ReplyComment, SCBroadcastMessageTemplateType, SCCommentsOrderBy, SCFeedObjectActivitiesType, SCFeedObjectTemplateType, SCNotificationObjectTemplateType, SCUserProfileFields, SCUserProfileSettings, SCUserSocialAssociations, SearchAutocomplete, SearchDialog, Share, SnippetNotifications, SnippetNotificationsSkeleton, StickyBox, SuggestedEventsWidget, SuggestedEventsWidgetSkeleton, TagChip, ToastNotifications, ToastNotificationsSkeleton, UrlTextField, User, UserActionIconButton, UserAvatar, UserConnectionsRequestsSentWidget, UserConnectionsRequestsSentWidgetSkeleton, UserConnectionsRequestsWidget, UserConnectionsRequestsWidgetSkeleton, UserConnectionsWidget, UserConnectionsWidgetSkeleton, UserCounters, UserDeletedSnackBar, UserFollowedCategoriesWidget, UserFollowedCategoriesWidgetSkeleton, UserFollowedUsersWidget, UserFollowedUsersWidgetSkeleton, UserFollowersWidget, UserFollowersWidgetSkeleton, UserInfo, UserInfoDialog, UserInfoSkeleton, UsernameTextField, UserProfileBlocked, UserProfileEdit, UserProfileEditSectionAccount, UserProfileEditSectionPublicInfo, UserProfileEditSectionSettings, UserProfileEditSkeleton, UserProfileHeader, UserProfileHeaderSkeleton, UserSkeleton, UserSocialAssociation, UserSubscribedGroupsWidget, UserSubscribedGroupsWidgetSkeleton, UserSuggestionWidget, UserSuggestionWidgetSkeleton, useStickyBox, Widget, X_SHARE };
+LogoSelfCommunity };

package/lib/esm/shared/ProgressBar/index.d.ts

@@ -0,0 +1,23 @@
+import { LinearProgressProps } from '@mui/material/LinearProgress';
+import React from 'react';
+export interface ProgressBarProps extends LinearProgressProps {
+    /**
+     * Overrides or extends the styles applied to the component.
+     * @default null
+     */
+    className?: string;
+    /**
+     * The progress percentage value
+     */
+    value: number;
+    /**
+     * The progress bar loading message
+     * @default null
+     */
+    loadingMessage?: React.ReactNode;
+    /**
+     * Any other properties
+     */
+    [p: string]: any;
+}
+export default function ProgressBar(props: ProgressBarProps): JSX.Element;

package/lib/esm/shared/ProgressBar/index.js

@@ -0,0 +1,22 @@
+import { __rest } from "tslib";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import LinearProgress from '@mui/material/LinearProgress';
+import { Box, Typography } from '@mui/material';
+import { styled } from '@mui/material/styles';
+import classNames from 'classnames';
+const PREFIX = 'SCProgressBar';
+const classes = {
+    root: `${PREFIX}-root`,
+    bar: `${PREFIX}-bar`,
+    progress: `${PREFIX}-progress`,
+    message: `${PREFIX}-message`
+};
+const Root = styled(Box, {
+    name: PREFIX,
+    slot: 'Root',
+    overridesResolver: (props, styles) => styles.root
+})(() => ({}));
+export default function ProgressBar(props) {
+    const { className, value, loadingMessage = null } = props, rest = __rest(props, ["className", "value", "loadingMessage"]);
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [_jsx(Box, Object.assign({ className: classes.message }, { children: loadingMessage })), _jsx(LinearProgress, Object.assign({ variant: "determinate", color: "success", className: classes.bar, value: value }, rest)), _jsx(Box, Object.assign({ className: classes.progress }, { children: _jsx(Typography, Object.assign({ variant: "body2", color: "text.secondary" }, { children: `${Math.round(value)}%` })) }))] })));
+}