@selfcommunity/react-ui 0.8.0-embeds.17 → 0.8.0-live.41

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

@@ -1,5 +1,5 @@
 import { BottomNavigationProps as MuiBottomNavigationProps } from '@mui/material';
-export declare type BottomNavigationProps = MuiBottomNavigationProps;
+export type BottomNavigationProps = MuiBottomNavigationProps;
 /**
  * > API documentation for the Community-JS Bottom Navigation component. Learn about the available props and the CSS API.
  *

package/lib/cjs/components/Categories/Categories.js

@@ -16,6 +16,8 @@ const Errors_1 = require("../../constants/Errors");
 const utils_1 = require("@selfcommunity/utils");
 const HiddenPlaceholder_1 = tslib_1.__importDefault(require("../../shared/HiddenPlaceholder"));
 const constants_1 = require("./constants");
+const pubsub_js_1 = tslib_1.__importDefault(require("pubsub-js"));
+const PubSub_1 = require("../../constants/PubSub");
 const classes = {
     root: `${constants_1.PREFIX}-root`,
     filters: `${constants_1.PREFIX}-filter`,
@@ -73,6 +75,7 @@ function Categories(inProps) {
     const authUserId = scUserContext.user ? scUserContext.user.id : null;
     // REFS
     const isMountedRef = (0, react_core_1.useIsComponentMountedRef)();
+    const updatesSubscription = (0, react_1.useRef)(null);
     /**
      * Fetches categories list
      */
@@ -104,6 +107,25 @@ function Categories(inProps) {
             });
         }
     }, [contentAvailability, authUserId, prefetchedCategories.length]);
+    /**
+     * Subscriber for pubsub callback
+     */
+    const onEditCategoryHandler = (0, react_1.useCallback)((_msg, edited) => {
+        setCategories((prev) => {
+            return prev.map((c) => (c.id === edited.id ? Object.assign(Object.assign({}, c), edited) : c));
+        });
+    }, [categories]);
+    /**
+     * On mount, subscribe to receive event updates (only edit)
+     */
+    (0, react_1.useEffect)(() => {
+        if (categories) {
+            updatesSubscription.current = pubsub_js_1.default.subscribe(`${PubSub_1.SCTopicType.CATEGORY}.${PubSub_1.SCCategoryEventType.EDIT}`, onEditCategoryHandler);
+        }
+        return () => {
+            updatesSubscription.current && pubsub_js_1.default.unsubscribe(updatesSubscription.current);
+        };
+    }, [categories]);
     /**
      * Get categories filtered
      */

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

@@ -20,6 +20,8 @@ const HiddenPlaceholder_1 = tslib_1.__importDefault(require("../../shared/Hidden
 const react_core_1 = require("@selfcommunity/react-core");
 const widget_1 = require("../../utils/widget");
 const constants_1 = require("./constants");
+const pubsub_js_1 = tslib_1.__importDefault(require("pubsub-js"));
+const PubSub_1 = require("../../constants/PubSub");
 const classes = {
     root: `${constants_1.PREFIX}-root`,
     title: `${constants_1.PREFIX}-title`,
@@ -89,6 +91,8 @@ function CategoriesPopularWidget(inProps) {
     // HOOKS
     const theme = (0, material_1.useTheme)();
     const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
+    // REFS
+    const updatesSubscription = (0, react_1.useRef)(null);
     /**
      * Initialize component
      * Fetch data only if the component is not initialized and it is not loading data
@@ -106,6 +110,23 @@ function CategoriesPopularWidget(inProps) {
             });
         }
     }, [state.isLoadingNext, state.initialized, limit, dispatch]);
+    /**
+     * Subscriber for pubsub callback
+     */
+    const onEditCategoryHandler = (0, react_1.useCallback)((_msg, edited) => {
+        const _categories = [...state.results];
+        const updatedCategories = _categories.map((c) => (c.id === edited.id ? Object.assign(Object.assign({}, c), edited) : c));
+        dispatch({ type: widget_1.actionWidgetTypes.SET_RESULTS, payload: { results: updatedCategories } });
+    }, [dispatch, state.results]);
+    /**
+     * On mount, subscribe to receive event updates (only edit)
+     */
+    (0, react_1.useEffect)(() => {
+        updatesSubscription.current = pubsub_js_1.default.subscribe(`${PubSub_1.SCTopicType.CATEGORY}.${PubSub_1.SCCategoryEventType.EDIT}`, onEditCategoryHandler);
+        return () => {
+            updatesSubscription.current && pubsub_js_1.default.unsubscribe(updatesSubscription.current);
+        };
+    }, [onEditCategoryHandler]);
     // EFFECTS
     (0, react_1.useEffect)(() => {
         var _a;

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

@@ -20,6 +20,8 @@ const BaseDialog_1 = tslib_1.__importDefault(require("../../shared/BaseDialog"))
 const Errors_1 = require("../../constants/Errors");
 const InfiniteScroll_1 = tslib_1.__importDefault(require("../../shared/InfiniteScroll"));
 const constants_1 = require("./constants");
+const pubsub_js_1 = tslib_1.__importDefault(require("pubsub-js"));
+const PubSub_1 = require("../../constants/PubSub");
 const classes = {
     root: `${constants_1.PREFIX}-root`,
     title: `${constants_1.PREFIX}-title`,
@@ -85,6 +87,8 @@ function CategoriesSuggestionWidget(inProps) {
     // HOOKS
     const theme = (0, material_1.useTheme)();
     const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
+    // REFS
+    const updatesSubscription = (0, react_1.useRef)(null);
     /**
      * Initialize component
      * Fetch data only if the component is not initialized and it is not loading data
@@ -102,6 +106,23 @@ function CategoriesSuggestionWidget(inProps) {
             });
         }
     }, [state.isLoadingNext, state.initialized, limit, dispatch]);
+    /**
+     * Subscriber for pubsub callback
+     */
+    const onEditCategoryHandler = (0, react_1.useCallback)((_msg, edited) => {
+        const _categories = [...state.results];
+        const updatedCategories = _categories.map((c) => (c.id === edited.id ? Object.assign(Object.assign({}, c), edited) : c));
+        dispatch({ type: widget_1.actionWidgetTypes.SET_RESULTS, payload: { results: updatedCategories } });
+    }, [dispatch, state.results]);
+    /**
+     * On mount, subscribe to receive event updates (only edit)
+     */
+    (0, react_1.useEffect)(() => {
+        updatesSubscription.current = pubsub_js_1.default.subscribe(`${PubSub_1.SCTopicType.CATEGORY}.${PubSub_1.SCCategoryEventType.EDIT}`, onEditCategoryHandler);
+        return () => {
+            updatesSubscription.current && pubsub_js_1.default.unsubscribe(updatesSubscription.current);
+        };
+    }, [onEditCategoryHandler]);
     // EFFECTS
     (0, react_1.useEffect)(() => {
         let _t;

package/lib/cjs/components/Composer/TypeSwitchButtonGroup/TypeSwitchButtonGroup.js

@@ -37,6 +37,6 @@ function ComposerTypeButtonGroup(props) {
     const handleChange = (0, react_1.useCallback)((event, value) => {
         onChange && onChange(value);
     }, [onChange]);
-    return (0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), onChange: handleChange, exclusive: true, value: value }, rest, { children: [hasPostType && (0, jsx_runtime_1.jsx)(material_1.ToggleButton, Object.assign({ value: Composer_1.COMPOSER_TYPE_POST }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.typeSwitch.post", defaultMessage: "ui.composer.typeSwitch.post" }) })), hasDiscussionType && (0, jsx_runtime_1.jsx)(material_1.ToggleButton, Object.assign({ value: Composer_1.COMPOSER_TYPE_DISCUSSION }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.typeSwitch.discussion", defaultMessage: "ui.composer.typeSwitch.discussion" }) })), hasPollType && (0, jsx_runtime_1.jsx)(material_1.ToggleButton, Object.assign({ value: Composer_1.COMPOSER_TYPE_POLL }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.typeSwitch.poll", defaultMessage: "ui.composer.typeSwitch.poll" }) }))] }));
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), onChange: handleChange, exclusive: true, value: value }, rest, { children: [hasPostType && ((0, jsx_runtime_1.jsx)(material_1.ToggleButton, Object.assign({ value: Composer_1.COMPOSER_TYPE_POST }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.typeSwitch.post", defaultMessage: "ui.composer.typeSwitch.post" }) }))), hasDiscussionType && ((0, jsx_runtime_1.jsx)(material_1.ToggleButton, Object.assign({ value: Composer_1.COMPOSER_TYPE_DISCUSSION }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.typeSwitch.discussion", defaultMessage: "ui.composer.typeSwitch.discussion" }) }))), hasPostType && hasPollType && ((0, jsx_runtime_1.jsx)(material_1.ToggleButton, Object.assign({ value: Composer_1.COMPOSER_TYPE_POLL }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.typeSwitch.poll", defaultMessage: "ui.composer.typeSwitch.poll" }) })))] })));
 }
 exports.default = ComposerTypeButtonGroup;

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

@@ -1,5 +1,5 @@
 import { ButtonProps } from '@mui/material/Button/Button';
-import { EventFormProps } from '../EventForm';
+import { EventFormDialogProps } from '../EventFormDialog';
 export interface CreateEventButtonProps extends ButtonProps {
     /**
      * Overrides or extends the styles applied to the component.
@@ -10,7 +10,7 @@ export interface CreateEventButtonProps extends ButtonProps {
      * Props to spread to CreateGroup component
      * @default empty object
      */
-    EventFormProps?: EventFormProps;
+    EventFormDialogComponentProps?: EventFormDialogProps;
     /**
      * Any other properties
      */

package/lib/cjs/components/CreateEventButton/CreateEventButton.js

@@ -9,7 +9,7 @@ const react_core_1 = require("@selfcommunity/react-core");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const react_1 = tslib_1.__importStar(require("react"));
 const react_intl_1 = require("react-intl");
-const EventForm_1 = tslib_1.__importDefault(require("../EventForm"));
+const EventFormDialog_1 = tslib_1.__importDefault(require("../EventFormDialog"));
 const types_1 = require("@selfcommunity/types");
 const PREFIX = 'SCCreateEventButton';
 const classes = {
@@ -40,13 +40,13 @@ const Root = (0, styles_1.styled)(material_1.Button, {
  * @param inProps
  */
 function CreateEventButton(inProps) {
-    var _a;
+    var _a, _b;
     //PROPS
     const props = (0, system_1.useThemeProps)({
         props: inProps,
         name: PREFIX
     });
-    const { className, EventFormProps = {}, children } = props, rest = tslib_1.__rest(props, ["className", "EventFormProps", "children"]);
+    const { className, EventFormDialogComponentProps = {}, children } = props, rest = tslib_1.__rest(props, ["className", "EventFormDialogComponentProps", "children"]);
     // CONTEXT
     const scUserContext = (0, react_1.useContext)(react_core_1.SCUserContext);
     // STATE
@@ -78,6 +78,6 @@ function CreateEventButton(inProps) {
     /**
      * Renders root object
      */
-    return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), onClick: handleClick, variant: "contained", color: "secondary", startIcon: !EventFormProps.event && (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: "add" })) }, rest, { children: children !== null && children !== void 0 ? children : (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.createEventButton", defaultMessage: "ui.createEventButton" }) })), open && (0, jsx_runtime_1.jsx)(EventForm_1.default, Object.assign({}, EventFormProps, { open: true, onClose: handleClick }))] }));
+    return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), onClick: handleClick, variant: "contained", color: "secondary", startIcon: !((_b = EventFormDialogComponentProps.EventFormComponentProps) === null || _b === void 0 ? void 0 : _b.event) && (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: "add" })) }, rest, { children: children !== null && children !== void 0 ? children : (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.createEventButton", defaultMessage: "ui.createEventButton" }) })), open && (0, jsx_runtime_1.jsx)(EventFormDialog_1.default, Object.assign({}, EventFormDialogComponentProps, { open: true, onClose: handleClick }))] }));
 }
 exports.default = CreateEventButton;

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

@@ -0,0 +1,49 @@
+import { ButtonProps } from '@mui/material/Button/Button';
+import { SCEventType, SCLiveStreamType } from '@selfcommunity/types';
+import { CreateLiveStreamDialogProps } from '../CreateLiveStreamDialog';
+export interface CreateLiveStreamButtonProps extends ButtonProps {
+    /**
+     * Overrides or extends the styles applied to the component.
+     * @default null
+     */
+    className?: string;
+    /**
+     * Props to spread to CreateGroup component
+     * @default empty object
+     */
+    CreateLiveStreamDialogComponentProps?: CreateLiveStreamDialogProps;
+    /**
+     * On click callback function
+     * @default null
+     */
+    onButtonClick?: (event: any, reason: any) => void;
+    /**
+     * On success callback function
+     * @default null
+     */
+    onSuccess?: (data: SCEventType | SCLiveStreamType) => void;
+    /**
+     * Any other properties
+     */
+    [p: string]: any;
+}
+/**
+ *> API documentation for the Community-JS CreateLiveStreamButton component. Learn about the available props and the CSS API.
+ *
+ #### Import
+ ```jsx
+ import {CreateLiveStreamButton} from '@selfcommunity/react-ui';
+ ```
+
+ #### Component Name
+ The name `SCCreateLiveStreamButton` can be used when providing style overrides in the theme.
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SCCreateLivestreamButton-root|Styles applied to the root element.|
+
+ * @param inProps
+ */
+export default function CreateLiveStreamButton(inProps: CreateLiveStreamButtonProps): JSX.Element;

package/lib/cjs/components/CreateLiveStreamButton/CreateLiveStreamButton.js

@@ -0,0 +1,94 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const styles_1 = require("@mui/material/styles");
+const system_1 = require("@mui/system");
+const react_core_1 = require("@selfcommunity/react-core");
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const react_1 = tslib_1.__importStar(require("react"));
+const react_intl_1 = require("react-intl");
+const CreateLiveStreamDialog_1 = tslib_1.__importDefault(require("../CreateLiveStreamDialog"));
+const PREFIX = 'SCCreateLivestreamButton';
+const classes = {
+    root: `${PREFIX}-root`
+};
+const Root = (0, styles_1.styled)(material_1.Button, {
+    name: PREFIX,
+    slot: 'Root',
+    overridesResolver: (props, styles) => styles.root
+})(() => ({}));
+/**
+ *> API documentation for the Community-JS CreateLiveStreamButton component. Learn about the available props and the CSS API.
+ *
+ #### Import
+ ```jsx
+ import {CreateLiveStreamButton} from '@selfcommunity/react-ui';
+ ```
+
+ #### Component Name
+ The name `SCCreateLiveStreamButton` can be used when providing style overrides in the theme.
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SCCreateLivestreamButton-root|Styles applied to the root element.|
+
+ * @param inProps
+ */
+function CreateLiveStreamButton(inProps) {
+    var _a;
+    //PROPS
+    const props = (0, system_1.useThemeProps)({
+        props: inProps,
+        name: PREFIX
+    });
+    const { className, CreateLiveStreamDialogComponentProps = {}, onSuccess, children } = props, rest = tslib_1.__rest(props, ["className", "CreateLiveStreamDialogComponentProps", "onSuccess", "children"]);
+    // CONTEXT
+    const scUserContext = (0, react_1.useContext)(react_core_1.SCUserContext);
+    // STATE
+    const [open, setOpen] = react_1.default.useState(false);
+    // CONST
+    const authUserId = scUserContext.user ? scUserContext.user.id : null;
+    const { preferences, features } = (0, react_core_1.useSCPreferences)();
+    // TODO
+    const liveStreamEnabled = true;
+    /* const liveStreamEnabled = useMemo(
+          () =>
+              preferences &&
+              features &&
+              features.includes(SCFeatureName.LIVE_STREAM) &&
+              SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED in preferences &&
+              preferences[SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED].value,
+          [preferences, features]
+      ); */
+    // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+    // @ts-ignore
+    const canCreateLiveStream = (0, react_1.useMemo)(() => true /* scUserContext?.user?.permission?.create_livestream */, [(_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission]);
+    /**
+     * Handle close
+     */
+    const handleClose = () => {
+        setOpen((o) => !o);
+    };
+    /**
+     * Handle close
+     */
+    const handleSuccess = (data) => {
+        onSuccess && onSuccess(data);
+        setOpen((o) => !o);
+    };
+    /**
+     * If there's no authUserId, component is hidden.
+     */
+    if (!liveStreamEnabled || !canCreateLiveStream || !authUserId) {
+        return null;
+    }
+    /**
+     * Renders root object
+     */
+    return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className), onClick: handleClose, variant: "contained", color: "secondary", startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "photo_camera" }) }, rest, { children: children !== null && children !== void 0 ? children : (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.createEventButton.goLive", defaultMessage: "ui.createEventButton.goLive" }) })), open && (0, jsx_runtime_1.jsx)(CreateLiveStreamDialog_1.default, Object.assign({ open: true, onClose: handleClose, onSuccess: handleSuccess }, CreateLiveStreamDialogComponentProps))] }));
+}
+exports.default = CreateLiveStreamButton;

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

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

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

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

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

@@ -0,0 +1,51 @@
+import { SCEventType, SCLiveStreamType } from '@selfcommunity/types';
+import { BaseDialogProps } from '../../shared/BaseDialog';
+export interface CreateLiveStreamDialogProps extends BaseDialogProps {
+    /**
+     * Overrides or extends the styles applied to the component.
+     * @default null
+     */
+    className?: string;
+    /**
+     * Open dialog
+     * @default true
+     */
+    open?: boolean;
+    /**
+     * On dialog close callback function
+     * @default null
+     */
+    onClose?: () => void;
+    /**
+     * On success callback function
+     * @default null
+     */
+    onSuccess?: (data: SCEventType | SCLiveStreamType) => void;
+    /**
+     * Any other properties
+     */
+    [p: string]: any;
+}
+/**
+ *> API documentation for the Community-JS CreateLiveStreamDialog component. Learn about the available props and the CSS API.
+ *
+ #### Import
+ ```jsx
+ import {CreateLivestreamDialog} from '@selfcommunity/react-ui';
+ ```
+
+ #### Component Name
+ The name `SCCreateLivestreamDialog` can be used when providing style overrides in the theme.
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SCCreateLivestreamDialog-root|Styles applied to the root element.|
+ |content|.SCCreateLivestreamDialog-content|Styles applied to the content element.|
+
+
+
+ * @param inProps
+ */
+export default function CreateLiveStreamDialog(inProps: CreateLiveStreamDialogProps): JSX.Element;

package/lib/cjs/components/CreateLiveStreamDialog/CreateLiveStreamDialog.js

@@ -0,0 +1,123 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = tslib_1.__importStar(require("react"));
+const styles_1 = require("@mui/material/styles");
+const system_1 = require("@mui/system");
+const react_core_1 = require("@selfcommunity/react-core");
+const types_1 = require("@selfcommunity/types");
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const react_intl_1 = require("react-intl");
+const BaseDialog_1 = tslib_1.__importDefault(require("../../shared/BaseDialog"));
+const constants_1 = require("./constants");
+const EventForm_1 = tslib_1.__importDefault(require("../EventForm"));
+const LiveStreamSelector_1 = tslib_1.__importDefault(require("./LiveStreamSelector/LiveStreamSelector"));
+const types_2 = require("./types");
+const LiveStreamForm_1 = tslib_1.__importDefault(require("../LiveStreamForm"));
+const Slide_1 = tslib_1.__importDefault(require("@mui/material/Slide"));
+const material_1 = require("@mui/material");
+const classes = {
+    root: `${constants_1.PREFIX}-root`,
+    title: `${constants_1.PREFIX}-title`,
+    content: `${constants_1.PREFIX}-content`
+};
+const Root = (0, styles_1.styled)(BaseDialog_1.default, {
+    name: constants_1.PREFIX,
+    slot: 'Root'
+})(({ theme }) => ({
+    paddingBottom: '0px !important',
+    [`& .${classes.title}`]: {
+        display: 'flex'
+    },
+    [`& .${classes.content}`]: {
+        paddingBottom: 0
+    }
+}));
+const Transition = react_1.default.forwardRef(function Transition(props, ref) {
+    return (0, jsx_runtime_1.jsx)(Slide_1.default, Object.assign({ direction: "up", ref: ref }, props));
+});
+/**
+ *> API documentation for the Community-JS CreateLiveStreamDialog component. Learn about the available props and the CSS API.
+ *
+ #### Import
+ ```jsx
+ import {CreateLivestreamDialog} from '@selfcommunity/react-ui';
+ ```
+
+ #### Component Name
+ The name `SCCreateLivestreamDialog` can be used when providing style overrides in the theme.
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SCCreateLivestreamDialog-root|Styles applied to the root element.|
+ |content|.SCCreateLivestreamDialog-content|Styles applied to the content element.|
+
+
+
+ * @param inProps
+ */
+function CreateLiveStreamDialog(inProps) {
+    //PROPS
+    const props = (0, system_1.useThemeProps)({
+        props: inProps,
+        name: constants_1.PREFIX
+    });
+    const { className, open = true, onClose, onSuccess } = props, rest = tslib_1.__rest(props, ["className", "open", "onClose", "onSuccess"]);
+    // CONTEXT
+    const scContext = (0, react_core_1.useSCContext)();
+    const scUserContext = (0, react_core_1.useSCUser)();
+    const { preferences, features } = (0, react_core_1.useSCPreferences)();
+    const liveStreamEnabled = (0, react_1.useMemo)(() => true, 
+    /* preferences &&
+            features &&
+            features.includes(SCFeatureName.LIVE_STREAM) &&
+            SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED in preferences &&
+            preferences[SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED].value*/ [preferences, features]);
+    const onlyStaffLiveStreamEnabled = (0, react_1.useMemo)(() => true /* preferences[SCPreferences.CONFIGURATIONS_LIVESTREAM_ONLY_STAFF_ENABLED].value */, [preferences]);
+    const canCreateLiveStream = (0, react_1.useMemo)(() => true /* liveStreamEnabled && (scUserContext?.user?.permission?.create_livestream || (onlyStaffLiveStreamEnabled && UserUtils.isStaff(scUserContext.user)))*/, [scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user, onlyStaffLiveStreamEnabled]);
+    console.log(canCreateLiveStream);
+    const eventsEnabled = (0, react_1.useMemo)(() => preferences &&
+        features &&
+        features.includes(types_1.SCFeatureName.TAGGING) &&
+        react_core_1.SCPreferences.CONFIGURATIONS_EVENTS_ENABLED in preferences &&
+        preferences[react_core_1.SCPreferences.CONFIGURATIONS_EVENTS_ENABLED].value, [preferences, features]);
+    const onlyStaffEventEnabled = (0, react_1.useMemo)(() => preferences[react_core_1.SCPreferences.CONFIGURATIONS_EVENTS_ONLY_STAFF_ENABLED].value, [preferences]);
+    const canCreateEvent = (0, react_1.useMemo)(() => { var _a, _b; return eventsEnabled && (((_b = (_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission) === null || _b === void 0 ? void 0 : _b.create_event) || true || (onlyStaffEventEnabled && react_core_1.UserUtils.isStaff(scUserContext.user))); }, [scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user, eventsEnabled, onlyStaffEventEnabled]);
+    console.log(canCreateEvent);
+    const canCreateLiveStreamEvent = (0, react_1.useMemo)(() => Boolean(canCreateLiveStream && canCreateEvent), [canCreateEvent, canCreateLiveStream]);
+    console.log(canCreateLiveStreamEvent);
+    // STATE
+    const [step, setStep] = (0, react_1.useState)(canCreateLiveStreamEvent ? types_2.CreateLiveStreamStep.SELECT_TYPE : types_2.CreateLiveStreamStep.CREATE_LIVE);
+    const [liveType, setLiveType] = (0, react_1.useState)(canCreateLiveStreamEvent ? null : types_2.LiveStreamType.DIRECT_LIVE);
+    // HANDLER
+    const handleLiveTypeSelected = (0, react_1.useCallback)((l) => {
+        setLiveType(l);
+    }, []);
+    const handleLiveTypeSelectedNext = (0, react_1.useCallback)((l) => {
+        setLiveType(l);
+        setStep(types_2.CreateLiveStreamStep.CREATE_LIVE);
+    }, []);
+    const handleBack = (0, react_1.useCallback)((l) => {
+        setStep(types_2.CreateLiveStreamStep.SELECT_TYPE);
+    }, []);
+    const handleSubmit = (0, react_1.useCallback)((e) => {
+        onSuccess && onSuccess(e);
+    }, []);
+    (0, react_1.useEffect)(() => {
+        if (!canCreateLiveStreamEvent) {
+            setLiveType(types_2.LiveStreamType.DIRECT_LIVE);
+        }
+    }, [canCreateLiveStreamEvent]);
+    // user must be logged
+    if (!scUserContext.user) {
+        return null;
+    }
+    /**
+     * Renders root object
+     */
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ DialogContentProps: { dividers: false }, maxWidth: 'md', title: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.title, component: 'span' }, { children: [step === types_2.CreateLiveStreamStep.CREATE_LIVE && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "text", onClick: handleBack, startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "arrow_back" }) }, { children: "Back" }))), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: 'span' }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.createLivestreamDialog.title", defaultMessage: "ui.createLivestreamDialog.title" }) }))] })), fullWidth: true, open: open, onClose: onClose, className: (0, classnames_1.default)(classes.root, className), TransitionComponent: Transition, PaperProps: { elevation: 0 } }, rest, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.content }, { children: [step === types_2.CreateLiveStreamStep.SELECT_TYPE && ((0, jsx_runtime_1.jsx)(LiveStreamSelector_1.default, { liveSelected: liveType, onLiveSelected: handleLiveTypeSelected, onNext: handleLiveTypeSelectedNext })), step === types_2.CreateLiveStreamStep.CREATE_LIVE && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: liveType === types_2.LiveStreamType.EVENT_LIVE ? (0, jsx_runtime_1.jsx)(EventForm_1.default, { onSuccess: handleSubmit }) : (0, jsx_runtime_1.jsx)(LiveStreamForm_1.default, { onSuccess: handleSubmit }) }))] })) })));
+}
+exports.default = CreateLiveStreamDialog;

package/lib/cjs/components/CreateLiveStreamDialog/LiveStreamSelector/LiveStreamSelector.d.ts

@@ -0,0 +1,46 @@
+import { LiveStreamType } from '../types';
+export interface LiveStreamSelectorProps {
+    /**
+     * Overrides or extends the styles applied to the component.
+     * @default null
+     */
+    className?: string;
+    /**
+     * Option selected
+     */
+    liveSelected?: LiveStreamType;
+    /**
+     * Callback on selected option
+     * @param LiveStreamType
+     */
+    onLiveSelected?: (live: LiveStreamType) => void;
+    /**
+     * On success callback function
+     * @default null
+     */
+    onNext?: (live: LiveStreamType) => void;
+    /**
+     * Any other properties
+     */
+    [p: string]: any;
+}
+/**
+ *> API documentation for the Community-JS LiveStreamSelector component. Learn about the available props and the CSS API.
+ *
+ #### Import
+ ```jsx
+ import {LiveStreamSelector} from '@selfcommunity/react-ui';
+ ```
+
+ #### Component Name
+ The name `SCLiveStreamSelector` can be used when providing style overrides in the theme.
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SCCreateLivestreamDialog-root|Styles applied to the root element.|
+
+ * @param inProps
+ */
+export default function LiveStreamSelector(inProps: LiveStreamSelectorProps): JSX.Element;