@selfcommunity/react-ui 0.7.0-alpha.98 → 0.7.0

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

@@ -1,22 +1,23 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
-const List_1 = __importDefault(require("@mui/material/List"));
-const ListItem_1 = __importDefault(require("@mui/material/ListItem"));
-const ListItemText_1 = __importDefault(require("@mui/material/ListItemText"));
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
 const styles_1 = require("@mui/material/styles");
-const Skeleton_1 = __importDefault(require("@mui/material/Skeleton"));
-const Widget_1 = __importDefault(require("../Widget"));
+const Skeleton_1 = tslib_1.__importDefault(require("@mui/material/Skeleton"));
+const Widget_1 = tslib_1.__importDefault(require("../Widget"));
 const material_1 = require("@mui/material");
-const PREFIX = 'SCIncubatorSkeleton';
+const constants_1 = require("./constants");
 const classes = {
-    root: `${PREFIX}-root`,
-    list: `${PREFIX}-list`
+    root: `${constants_1.PREFIX}-skeleton-root`,
+    primary: `${constants_1.PREFIX}-primary`,
+    secondary: `${constants_1.PREFIX}-secondary`,
+    progressBar: `${constants_1.PREFIX}-progress-bar`,
+    action: `${constants_1.PREFIX}-action`
 };
-const Root = (0, styles_1.styled)(Widget_1.default)(({ theme }) => ({}));
+const Root = (0, styles_1.styled)(Widget_1.default, {
+    name: constants_1.PREFIX,
+    slot: 'SkeletonRoot'
+})(() => ({}));
 /**
  * > API documentation for the Community-JS Incubator Skeleton component. Learn about the available props and the CSS API.
 
@@ -28,24 +29,38 @@ const Root = (0, styles_1.styled)(Widget_1.default)(({ theme }) => ({}));
 
  #### Component Name
 
- The name `SCIncubatorSkeleton` can be used when providing style overrides in the theme.
+ The name `SCIncubator-skeleton-root` can be used when providing style overrides in the theme.
 
  #### CSS
 
  |Rule Name|Global class|Description|
  |---|---|---|
- |root|.SCIncubatorSkeleton-root|Styles applied to the root element.|
- |list|.SCIncubatorSkeleton-list|Styles applied to the list element.|
+ |root|.SCIncubator-skeleton-root|Styles applied to the root element.|
+ |primary|.SCIncubator-primary|Styles applied to the primary text element.|
+ |secondary|.SCIncubator-secondary|Styles applied to the secondary text element.|
+ |progressBar|.SCIncubator-progress-bar|Styles applied to the progress bar section.|
+ |action|.SCIncubator-action|Styles applied to the action button element.|
  *
  */
 function IncubatorSkeleton(props) {
-    const incubator = (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(ListItem_1.default, null,
-            react_1.default.createElement(ListItemText_1.default, { primary: react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 10, width: 120, style: { marginBottom: 10 } }), secondary: react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 10, width: 70, style: { marginBottom: 10 } }) })),
-        react_1.default.createElement(material_1.Button, { size: "small", variant: "outlined", disabled: true, sx: { marginLeft: 2 } },
-            react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 10, width: 50, style: { marginTop: 5, marginBottom: 5 } }))));
     return (react_1.default.createElement(Root, Object.assign({ className: classes.root }, props),
-        react_1.default.createElement(List_1.default, null, incubator)));
+        react_1.default.createElement(material_1.CardContent, null,
+            react_1.default.createElement(material_1.Typography, { className: classes.primary },
+                react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 20, width: "40%", variant: "text" })),
+            react_1.default.createElement(material_1.Typography, { className: classes.secondary },
+                react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 10, width: "50%", variant: "text" }),
+                react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 10, width: "80%", variant: "text" })),
+            react_1.default.createElement(material_1.Grid, { container: true, spacing: 1, className: classes.progressBar },
+                react_1.default.createElement(material_1.Grid, { item: true, xs: 12, md: 12 },
+                    react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 20, width: "100%", variant: "rectangular" })),
+                react_1.default.createElement(material_1.Grid, { item: true, xs: true },
+                    react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 10, width: "100%", variant: "text" })),
+                react_1.default.createElement(material_1.Grid, { item: true, xs: true },
+                    react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 10, width: "100%", variant: "text" })),
+                react_1.default.createElement(material_1.Grid, { item: true, xs: true },
+                    react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 10, width: "100%", variant: "text" })))),
+        react_1.default.createElement(material_1.CardActions, { className: classes.action },
+            react_1.default.createElement(material_1.Button, { disabled: true, variant: 'outlined', size: 'small' },
+                react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 20, width: 50, variant: "text" })))));
 }
 exports.default = IncubatorSkeleton;
-//# sourceMappingURL=Skeleton.js.map

package/lib/cjs/components/Incubator/constants.d.ts

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

package/lib/cjs/components/Incubator/constants.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PREFIX = void 0;
+exports.PREFIX = 'SCIncubator';

package/lib/cjs/components/Incubator/index.d.ts

@@ -2,4 +2,3 @@ import Incubator, { IncubatorProps } from './Incubator';
 import IncubatorSkeleton from './Skeleton';
 export default Incubator;
 export { IncubatorProps, IncubatorSkeleton };
-//# sourceMappingURL=index.d.ts.map

package/lib/cjs/components/Incubator/index.js

@@ -1,11 +1,8 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.IncubatorSkeleton = void 0;
-const Incubator_1 = __importDefault(require("./Incubator"));
-const Skeleton_1 = __importDefault(require("./Skeleton"));
+const tslib_1 = require("tslib");
+const Incubator_1 = tslib_1.__importDefault(require("./Incubator"));
+const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
 exports.IncubatorSkeleton = Skeleton_1.default;
 exports.default = Incubator_1.default;
-//# sourceMappingURL=index.js.map

package/lib/cjs/components/IncubatorDetail/IncubatorDetail.d.ts

@@ -39,8 +39,8 @@ export interface IncubatorDetailProps {
 }
 /**
  * > API documentation for the Community-JS Incubator Detail component. Learn about the available props and the CSS API.
- *
- * #### Import
+
+ #### Import
  ```jsx
  import {IncubatorDetail} from '@selfcommunity/react-ui';
  ```
@@ -65,4 +65,3 @@ export interface IncubatorDetailProps {
 * @param inProps
 */
 export default function IncubatorDetail(inProps: IncubatorDetailProps): JSX.Element;
-//# sourceMappingURL=IncubatorDetail.d.ts.map

package/lib/cjs/components/IncubatorDetail/IncubatorDetail.js

@@ -1,70 +1,26 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importStar(require("react"));
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
 const styles_1 = require("@mui/material/styles");
 const react_intl_1 = require("react-intl");
 const material_1 = require("@mui/material");
 const api_services_1 = require("@selfcommunity/api-services");
 const utils_1 = require("@selfcommunity/utils");
 const react_core_1 = require("@selfcommunity/react-core");
-const BaseDialog_1 = __importDefault(require("../../shared/BaseDialog"));
-const classnames_1 = __importDefault(require("classnames"));
+const BaseDialog_1 = tslib_1.__importDefault(require("../../shared/BaseDialog"));
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const system_1 = require("@mui/system");
-const Incubator_1 = __importDefault(require("../Incubator"));
-const Widget_1 = __importDefault(require("../Widget"));
-const AvatarGroupSkeleton_1 = __importDefault(require("../Skeleton/AvatarGroupSkeleton"));
-const CentralProgress_1 = __importDefault(require("../../shared/CentralProgress"));
-const InfiniteScroll_1 = __importDefault(require("../../shared/InfiniteScroll"));
-const User_1 = __importDefault(require("../User"));
+const Incubator_1 = tslib_1.__importDefault(require("../Incubator"));
+const Widget_1 = tslib_1.__importDefault(require("../Widget"));
+const AvatarGroupSkeleton_1 = tslib_1.__importDefault(require("../Skeleton/AvatarGroupSkeleton"));
+const CentralProgress_1 = tslib_1.__importDefault(require("../../shared/CentralProgress"));
+const InfiniteScroll_1 = tslib_1.__importDefault(require("../../shared/InfiniteScroll"));
+const User_1 = tslib_1.__importDefault(require("../User"));
 const Errors_1 = require("../../constants/Errors");
-const Icon_1 = __importDefault(require("@mui/material/Icon"));
+const Icon_1 = tslib_1.__importDefault(require("@mui/material/Icon"));
 const SocialShare_1 = require("../../constants/SocialShare");
+const UserDeletedSnackBar_1 = tslib_1.__importDefault(require("../../shared/UserDeletedSnackBar"));
 const messages = (0, react_intl_1.defineMessages)({
     intro: {
         id: 'ui.incubatorDetail.intro',
@@ -125,15 +81,15 @@ const Root = (0, styles_1.styled)(BaseDialog_1.default, {
     },
     [`& .${classes.shareSection}`]: {
         display: 'flex',
-        gap: theme.spacing(1),
-        marginTop: theme.spacing(1),
-        marginBottom: theme.spacing(1)
+        gap: theme.spacing(),
+        marginTop: theme.spacing(),
+        marginBottom: theme.spacing(3)
     },
     [`& .${classes.socialShareButton}`]: {
-        marginRight: theme.spacing(1)
+        marginRight: theme.spacing()
     },
     [`& .${classes.subscribers}`]: {
-        marginTop: theme.spacing(1),
+        marginTop: theme.spacing(),
         '& .MuiAvatar-root': {
             color: theme.palette.common.white,
             border: '2px solid #FFF'
@@ -142,8 +98,8 @@ const Root = (0, styles_1.styled)(BaseDialog_1.default, {
 }));
 /**
  * > API documentation for the Community-JS Incubator Detail component. Learn about the available props and the CSS API.
- *
- * #### Import
+
+ #### Import
  ```jsx
  import {IncubatorDetail} from '@selfcommunity/react-ui';
  ```
@@ -173,7 +129,7 @@ function IncubatorDetail(inProps) {
         props: inProps,
         name: PREFIX
     });
-    const { incubator, incubatorId, className, open, onClose, IncubatorProps = {}, onSubscriptionsUpdate } = props, rest = __rest(props, ["incubator", "incubatorId", "className", "open", "onClose", "IncubatorProps", "onSubscriptionsUpdate"]);
+    const { incubator, incubatorId, className, open, onClose, IncubatorProps = {}, onSubscriptionsUpdate } = props, rest = tslib_1.__rest(props, ["incubator", "incubatorId", "className", "open", "onClose", "IncubatorProps", "onSubscriptionsUpdate"]);
     // STATE
     const [alert, setAlert] = (0, react_1.useState)(false);
     const { scIncubator, setSCIncubator } = (0, react_core_1.useSCFetchIncubator)({ id: incubator.id, incubator });
@@ -182,6 +138,7 @@ function IncubatorDetail(inProps) {
     const [total, setTotal] = (0, react_1.useState)(0);
     const [subscribers, setSubscribers] = (0, react_1.useState)([]);
     const [openSubscribersDialog, setOpenSubscribersDialog] = (0, react_1.useState)(false);
+    const [openAlert, setOpenAlert] = (0, react_1.useState)(false);
     // CONTEXT
     const scUserContext = (0, react_core_1.useSCUser)();
     const scContext = (0, react_core_1.useSCContext)();
@@ -201,7 +158,7 @@ function IncubatorDetail(inProps) {
     /**
      * Copies incubator path on clipboard and notifies user
      */
-    const copy = () => __awaiter(this, void 0, void 0, function* () {
+    const copy = () => tslib_1.__awaiter(this, void 0, void 0, function* () {
         yield navigator.clipboard.writeText(portal);
         setAlert(true);
     });
@@ -279,50 +236,50 @@ function IncubatorDetail(inProps) {
     /**
      * Renders root element
      */
-    return (react_1.default.createElement(Root, Object.assign({ title: react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(material_1.Avatar, { className: classes.avatar, alt: scIncubator.user.avatar, src: scIncubator.user.avatar }),
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(Root, Object.assign({ title: react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement(material_1.Avatar, { className: classes.avatar, alt: scIncubator.user.avatar, src: scIncubator.user.avatar }),
+                react_1.default.createElement(material_1.Box, null,
+                    react_1.default.createElement(material_1.Typography, { className: classes.title },
+                        `${intl.formatMessage(messages.intro, { name: scIncubator.name })}`,
+                        " "),
+                    react_1.default.createElement(material_1.Typography, { component: 'span' },
+                        react_1.default.createElement(react_core_1.Link, Object.assign({}, (!scIncubator.user.deleted && { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scIncubator.user) }), { onClick: scIncubator.user.deleted ? () => setOpenAlert(true) : null }),
+                            "@",
+                            scIncubator.user.username)))), open: open, onClose: onClose, className: (0, classnames_1.default)(classes.root, className) }, rest),
             react_1.default.createElement(material_1.Box, null,
-                react_1.default.createElement(material_1.Typography, { className: classes.title },
-                    `${intl.formatMessage(messages.intro, { name: scIncubator.name })}`,
-                    " "),
-                react_1.default.createElement(material_1.Typography, { component: 'span' },
-                    react_1.default.createElement(react_core_1.Link, { to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scIncubator.user) },
-                        "@",
-                        scIncubator.user.username)))), open: open, onClose: onClose, className: (0, classnames_1.default)(classes.root, className) }, rest),
-        react_1.default.createElement(material_1.Box, null,
-            react_1.default.createElement(Incubator_1.default, Object.assign({ elevation: 0, incubator: scIncubator, detailView: true, subscribeButtonProps: { onSubscribe: handleUpdates } }, IncubatorProps)),
-            react_1.default.createElement(material_1.Box, { className: classes.subscribers }, loading && !scIncubator ? (react_1.default.createElement(AvatarGroupSkeleton_1.default, Object.assign({}, rest))) : (react_1.default.createElement(react_1.default.Fragment, null, total > 0 ? (react_1.default.createElement(material_1.Button, { onClick: handleToggleSubscribersDialog, disabled: loading || !scIncubator },
-                react_1.default.createElement(material_1.AvatarGroup, Object.assign({}, rest),
-                    subscribers.map((u) => (react_1.default.createElement(material_1.Avatar, { key: u.id, alt: u.username, src: u.avatar }))),
-                    [...Array(Math.max(0, total - subscribers.length))].map((x, i // Add max to 0 to prevent creation of array with negative index during state update
-                    ) => (react_1.default.createElement(material_1.Avatar, { key: i })))))) : null))),
-            openSubscribersDialog && (react_1.default.createElement(BaseDialog_1.default, { title: react_1.default.createElement(react_1.default.Fragment, null,
-                    react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.incubatorDetail.subscribersSection.title", id: "ui.incubatorDetail.subscribersSection.title" }),
-                    " (",
-                    total,
-                    ")"), onClose: handleToggleSubscribersDialog, open: openSubscribersDialog }, loading ? (react_1.default.createElement(CentralProgress_1.default, { size: 50 })) : (react_1.default.createElement(InfiniteScroll_1.default, { dataLength: total, next: fetchSubscribers, hasMoreNext: next !== null, loaderNext: react_1.default.createElement(CentralProgress_1.default, { size: 30 }), height: 400, endMessage: react_1.default.createElement("p", { style: { textAlign: 'center' } },
-                    react_1.default.createElement("b", null,
-                        react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorDetail.subscribersSection.noMoreSubscribers", defaultMessage: "ui.incubatorDetail.subscribersSection.noMoreSubscribers" }))) },
-                react_1.default.createElement(material_1.List, null, subscribers.map((s, index) => (react_1.default.createElement(material_1.ListItem, { key: (s.id, index) },
-                    react_1.default.createElement(User_1.default, { elevation: 0, user: s, key: index }))))))))),
-            react_1.default.createElement(Widget_1.default, { elevation: 1, className: classes.shareCard },
-                react_1.default.createElement(material_1.CardContent, null,
-                    react_1.default.createElement(material_1.Typography, { variant: 'h6' },
-                        react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorDetail.shareSection.title", defaultMessage: "ui.incubatorDetail.shareSection.title" })),
-                    react_1.default.createElement(material_1.Typography, { variant: 'subtitle1' },
-                        react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorDetail.shareSection.share", defaultMessage: "ui.incubatorDetail.shareSection.share" })),
-                    react_1.default.createElement(material_1.FormGroup, { className: classes.copyUrlForm },
-                        react_1.default.createElement(material_1.TextField, { className: classes.copyText, variant: "outlined", value: portal }),
-                        react_1.default.createElement(material_1.Button, { className: classes.copyButton, variant: "contained", onClick: copy },
-                            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorDetail.shareSection.button.copy", defaultMessage: "ui.incubatorDetail.shareSection.button.copy" }))),
-                    alert && (react_1.default.createElement(material_1.Alert, { onClose: () => setAlert(false) },
-                        react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorDetail.shareSection.copied", defaultMessage: "ui.incubatorDetail.shareSection.copied" }))),
-                    isSocialShareEnabled && (react_1.default.createElement(material_1.Typography, { variant: 'subtitle2' },
-                        react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorDetail.shareSection.invite", defaultMessage: "ui.incubatorDetail.shareSection.invite" }))),
-                    react_1.default.createElement(material_1.Box, { className: classes.shareSection },
-                        facebookShareEnabled && (react_1.default.createElement(Icon_1.default, { classes: { root: classes.shareMenuIcon }, fontSize: "small", onClick: () => window.open(SocialShare_1.FACEBOOK_SHARE + portal, 'facebook-share-dialog', 'width=626,height=436') }, "facebook")),
-                        twitterShareEnabled && (react_1.default.createElement(Icon_1.default, { classes: { root: classes.shareMenuIcon }, fontSize: "small", onClick: () => window.open(SocialShare_1.TWITTER_SHARE + portal, 'twitter-share-dialog', 'width=626,height=436') }, "twitter")),
-                        linkedinShareEnabled && (react_1.default.createElement(Icon_1.default, { classes: { root: classes.shareMenuIcon }, fontSize: "small", onClick: () => window.open(SocialShare_1.LINKEDIN_SHARE + portal, 'linkedin-share-dialog', 'width=626,height=436') }, "linkedin"))))))));
+                react_1.default.createElement(Incubator_1.default, Object.assign({ elevation: 0, incubator: scIncubator, detailView: true, subscribeButtonProps: { onSubscribe: handleUpdates } }, IncubatorProps)),
+                react_1.default.createElement(material_1.Box, { className: classes.subscribers }, loading && !scIncubator ? (react_1.default.createElement(AvatarGroupSkeleton_1.default, Object.assign({}, rest))) : (react_1.default.createElement(react_1.default.Fragment, null, total > 0 ? (react_1.default.createElement(material_1.Button, { onClick: handleToggleSubscribersDialog, disabled: loading || !scIncubator },
+                    react_1.default.createElement(material_1.AvatarGroup, Object.assign({}, rest),
+                        subscribers.map((u) => (react_1.default.createElement(material_1.Avatar, { key: u.id, alt: u.username, src: u.avatar }))),
+                        [...Array(Math.max(0, total - subscribers.length))].map((x, i // Add max to 0 to prevent creation of array with negative index during state update
+                        ) => (react_1.default.createElement(material_1.Avatar, { key: i })))))) : null))),
+                openSubscribersDialog && (react_1.default.createElement(BaseDialog_1.default, { title: react_1.default.createElement(react_1.default.Fragment, null,
+                        react_1.default.createElement(react_intl_1.FormattedMessage, { defaultMessage: "ui.incubatorDetail.subscribersSection.title", id: "ui.incubatorDetail.subscribersSection.title" }),
+                        " (",
+                        total,
+                        ")"), onClose: handleToggleSubscribersDialog, open: openSubscribersDialog }, loading ? (react_1.default.createElement(CentralProgress_1.default, { size: 50 })) : (react_1.default.createElement(InfiniteScroll_1.default, { dataLength: total, next: fetchSubscribers, hasMoreNext: next !== null, loaderNext: react_1.default.createElement(CentralProgress_1.default, { size: 30 }), height: 400, endMessage: react_1.default.createElement(material_1.Typography, { variant: "body2", align: "center", fontWeight: "bold" },
+                        react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorDetail.subscribersSection.noMoreSubscribers", defaultMessage: "ui.incubatorDetail.subscribersSection.noMoreSubscribers" })) },
+                    react_1.default.createElement(material_1.List, null, subscribers.map((s, index) => (react_1.default.createElement(material_1.ListItem, { key: (s.id, index) },
+                        react_1.default.createElement(User_1.default, { elevation: 0, user: s, key: index }))))))))),
+                react_1.default.createElement(Widget_1.default, { elevation: 1, className: classes.shareCard },
+                    react_1.default.createElement(material_1.CardContent, null,
+                        react_1.default.createElement(material_1.Typography, { variant: 'h6' },
+                            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorDetail.shareSection.title", defaultMessage: "ui.incubatorDetail.shareSection.title" })),
+                        react_1.default.createElement(material_1.Typography, { variant: 'subtitle1' },
+                            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorDetail.shareSection.share", defaultMessage: "ui.incubatorDetail.shareSection.share" })),
+                        react_1.default.createElement(material_1.FormGroup, { className: classes.copyUrlForm },
+                            react_1.default.createElement(material_1.TextField, { className: classes.copyText, variant: "outlined", value: portal }),
+                            react_1.default.createElement(material_1.Button, { className: classes.copyButton, variant: "contained", onClick: copy },
+                                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorDetail.shareSection.button.copy", defaultMessage: "ui.incubatorDetail.shareSection.button.copy" }))),
+                        alert && (react_1.default.createElement(material_1.Alert, { onClose: () => setAlert(false) },
+                            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorDetail.shareSection.copied", defaultMessage: "ui.incubatorDetail.shareSection.copied" }))),
+                        isSocialShareEnabled && (react_1.default.createElement(material_1.Typography, { variant: 'subtitle2' },
+                            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorDetail.shareSection.invite", defaultMessage: "ui.incubatorDetail.shareSection.invite" }))),
+                        react_1.default.createElement(material_1.Box, { className: classes.shareSection },
+                            facebookShareEnabled && (react_1.default.createElement(Icon_1.default, { classes: { root: classes.shareMenuIcon }, fontSize: "small", onClick: () => window.open(SocialShare_1.FACEBOOK_SHARE + portal, 'facebook-share-dialog', 'width=626,height=436') }, "facebook")),
+                            twitterShareEnabled && (react_1.default.createElement(Icon_1.default, { classes: { root: classes.shareMenuIcon }, fontSize: "small", onClick: () => window.open(SocialShare_1.TWITTER_SHARE + portal, 'twitter-share-dialog', 'width=626,height=436') }, "twitter")),
+                            linkedinShareEnabled && (react_1.default.createElement(Icon_1.default, { classes: { root: classes.shareMenuIcon }, fontSize: "small", onClick: () => window.open(SocialShare_1.LINKEDIN_SHARE + portal, 'linkedin-share-dialog', 'width=626,height=436') }, "linkedin"))))))),
+        openAlert && react_1.default.createElement(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })));
 }
 exports.default = IncubatorDetail;
-//# sourceMappingURL=IncubatorDetail.js.map

package/lib/cjs/components/IncubatorDetail/index.d.ts

@@ -1,4 +1,3 @@
 import IncubatorDetail, { IncubatorDetailProps } from './IncubatorDetail';
 export default IncubatorDetail;
 export { IncubatorDetailProps };
-//# sourceMappingURL=index.d.ts.map

package/lib/cjs/components/IncubatorDetail/index.js

@@ -1,8 +1,5 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-const IncubatorDetail_1 = __importDefault(require("./IncubatorDetail"));
+const tslib_1 = require("tslib");
+const IncubatorDetail_1 = tslib_1.__importDefault(require("./IncubatorDetail"));
 exports.default = IncubatorDetail_1.default;
-//# sourceMappingURL=index.js.map

package/lib/cjs/components/IncubatorListWidget/CreateIncubatorDialog/CreateIncubatorDialog.d.ts

@@ -0,0 +1,18 @@
+export interface CreateIncubatorDialogProps {
+    /**
+     * Overrides or extends the styles applied to the component.
+     * @default null
+     */
+    className?: string;
+    /**
+     * Opens dialog
+     * @default false
+     */
+    open: boolean;
+    /**
+     * On dialog close callback function
+     * @default null
+     */
+    onClose?: () => void;
+}
+export default function CreateIncubatorDialog(props: CreateIncubatorDialogProps): JSX.Element;

package/lib/cjs/components/IncubatorListWidget/CreateIncubatorDialog/CreateIncubatorDialog.js

@@ -0,0 +1,95 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
+const styles_1 = require("@mui/material/styles");
+const react_intl_1 = require("react-intl");
+const material_1 = require("@mui/material");
+const api_services_1 = require("@selfcommunity/api-services");
+const utils_1 = require("@selfcommunity/utils");
+const react_core_1 = require("@selfcommunity/react-core");
+const BaseDialog_1 = tslib_1.__importDefault(require("../../../shared/BaseDialog"));
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const Errors_1 = require("../../../constants/Errors");
+const lab_1 = require("@mui/lab");
+const constants_1 = require("../constants");
+const messages = (0, react_intl_1.defineMessages)({
+    name: {
+        id: 'ui.incubatorListWidget.createIncubatorDialog.formPlaceholder.name',
+        defaultMessage: 'ui.incubatorListWidget.createIncubatorDialog.formPlaceholder.name'
+    },
+    slogan: {
+        id: 'ui.incubatorListWidget.createIncubatorDialog.formPlaceholder.slogan',
+        defaultMessage: 'ui.incubatorListWidget.createIncubatorDialog.formPlaceholder.slogan'
+    }
+});
+const classes = {
+    root: `${constants_1.PREFIX}-create-dialog-root`,
+    form: `${constants_1.PREFIX}-form`,
+    name: `${constants_1.PREFIX}-name`,
+    slogan: `${constants_1.PREFIX}-slogan`,
+    intro: `${constants_1.PREFIX}-intro`,
+    submittedMessage: `${constants_1.PREFIX}-submitted-message`
+};
+const Root = (0, styles_1.styled)(BaseDialog_1.default, {
+    name: constants_1.PREFIX,
+    slot: 'CreateDialogRoot'
+})(() => ({}));
+function CreateIncubatorDialog(props) {
+    // PROPS
+    const { className, open, onClose } = props, rest = tslib_1.__rest(props, ["className", "open", "onClose"]);
+    // CONTEXT
+    const scUserContext = (0, react_core_1.useSCUser)();
+    // INTL
+    const intl = (0, react_intl_1.useIntl)();
+    // STATE
+    const [name, setName] = (0, react_1.useState)('');
+    const [slogan, setSlogan] = (0, react_1.useState)('');
+    const [isSubmitting, setIsSubmitting] = (0, react_1.useState)(false);
+    const [submitted, setSubmitted] = (0, react_1.useState)(false);
+    const [error, setError] = (0, react_1.useState)('');
+    // HANDLERS
+    const handleSubmit = (event) => {
+        event.preventDefault();
+        setIsSubmitting(true);
+        api_services_1.http
+            .request({
+            url: api_services_1.Endpoints.CreateAnIncubator.url(),
+            method: api_services_1.Endpoints.CreateAnIncubator.method,
+            data: {
+                name: name,
+                slogan: slogan
+            }
+        })
+            .then((res) => {
+            setIsSubmitting(false);
+            setSubmitted(true);
+        })
+            .catch((error) => {
+            setError(error);
+            setIsSubmitting(false);
+            utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
+        });
+    };
+    if (!scUserContext.user) {
+        return null;
+    }
+    let dialogContent;
+    if (submitted) {
+        dialogContent = (react_1.default.createElement(material_1.Typography, { variant: 'subtitle2', className: classes.submittedMessage },
+            react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorListWidget.createIncubatorDialog.propose.success", defaultMessage: "ui.incubatorListWidget.createIncubatorDialog.propose.success" })));
+    }
+    else {
+        dialogContent = (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement(material_1.Typography, { component: 'span', className: classes.intro },
+                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorsListDialog.createIncubatorDialog.intro", defaultMessage: "ui.incubatorsListDialog.createIncubatorDialog.intro" })),
+            react_1.default.createElement(material_1.FormGroup, { className: classes.form },
+                react_1.default.createElement(material_1.TextField, { required: true, error: Boolean(error), className: classes.name, placeholder: `${intl.formatMessage(messages.name)}`, margin: "normal", value: name, onChange: (event) => setName(event.target.value) }),
+                react_1.default.createElement(material_1.TextField, { multiline: true, error: Boolean(error), className: classes.slogan, placeholder: `${intl.formatMessage(messages.slogan)}`, margin: "normal", value: slogan, onChange: (event) => setSlogan(event.target.value) })),
+            react_1.default.createElement(lab_1.LoadingButton, { loading: isSubmitting, disabled: !name || Boolean(error), variant: "contained", onClick: handleSubmit },
+                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorListWidget.createIncubatorDialog.button", defaultMessage: "ui.incubatorListWidget.createIncubatorDialog.button" }))));
+    }
+    // RENDER
+    return (react_1.default.createElement(Root, Object.assign({ title: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.incubatorListWidget.createIncubatorDialog.title", defaultMessage: "ui.incubatorListWidget.createIncubatorDialog.title" }), open: open, onClose: onClose, className: (0, classnames_1.default)(classes.root, className) }, rest), dialogContent));
+}
+exports.default = CreateIncubatorDialog;

package/lib/cjs/components/IncubatorListWidget/CreateIncubatorDialog/index.d.ts

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

package/lib/cjs/components/IncubatorListWidget/CreateIncubatorDialog/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const CreateIncubatorDialog_1 = tslib_1.__importDefault(require("./CreateIncubatorDialog"));
+exports.default = CreateIncubatorDialog_1.default;

package/lib/cjs/components/IncubatorListWidget/IncubatorListWidget.d.ts

@@ -0,0 +1,73 @@
+import { CacheStrategies } from '@selfcommunity/utils';
+import { BaseDialogProps } from '../../shared/BaseDialog';
+import { IncubatorProps } from '../Incubator';
+import { VirtualScrollerItemProps } from '../../types/virtualScroller';
+export interface IncubatorListWidgetProps extends VirtualScrollerItemProps {
+    /**
+     * Hides this component
+     * @default false
+     */
+    autoHide?: boolean;
+    /**
+     * Limit the number of incubators to show
+     * @default false
+     */
+    limit?: number;
+    /**
+     * Overrides or extends the styles applied to the component.
+     * @default null
+     */
+    className?: string;
+    /**
+     * Props to spread to single incubator object
+     * @default {}
+     */
+    IncubatorProps?: IncubatorProps;
+    /**
+     * Caching strategies
+     * @default CacheStrategies.CACHE_FIRST
+     */
+    cacheStrategy?: CacheStrategies;
+    /**
+     * Props to spread to users suggestion dialog
+     * @default {}
+     */
+    DialogProps?: BaseDialogProps;
+    /**
+     * Other props
+     */
+    [p: string]: any;
+}
+/**
+ * > API documentation for the Community-JS Incubator List Widget component. Learn about the available props and the CSS API.
+ *
+ *
+ * This component renders a list of incubators.
+ * Take a look at our <strong>demo</strong> component [here](/docs/sdk/community-js/react-ui/Components/IncubatorsList)
+
+ #### Import
+ ```jsx
+ import {IncubatorListWidget} from '@selfcommunity/react-ui';
+ ```
+
+ #### Component Name
+ The name `IncubatorListWidget` can be used when providing style overrides in the theme.
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SCIncubatorListWidget-root|Styles applied to the root element.|
+ |header|.SCIncubatorListWidget-header|Styles applied to the header element.|
+ |title|.SCIncubatorListWidget-title|Styles applied to the title element.|
+ |noResults|.SCIncubatorListWidget-no-results|Styles applied to the no results section.|
+ |showMore|.SCIncubatorListWidget-show-more|Styles applied to the show more button element.|
+ |actions|.SCIncubatorListWidget-actions|Styles applied to the actions section.|
+ |helpPopover|.SCIncubatorListWidget-help-popover|Styles applied to the help popover element.|
+ |dialogRoot|.SCIncubatorListWidget-dialog-root|Styles applied to the root dialog element.|
+ |endMessage|.SCIncubatorListWidget-end-message|Styles applied to the end message element.|
+ |createDialog|.SCIncubatorListWidget-create-dialog|Styles applied to the create dialog element.|
+
+ * @param inProps
+ */
+export default function IncubatorListWidget(inProps: IncubatorListWidgetProps): JSX.Element;