@selfcommunity/react-ui 0.11.0-alpha.2 → 0.11.0-alpha.4

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

@@ -498,8 +498,6 @@ function Composer(inProps) {
     }, [scUserContext.user, feedObjectType, id, type, title, html, categories, event, group, addressing, audience, medias, poll, location, hasPoll]);
     //edited here
     const handleClose = (0, react_1.useCallback)((e, reason) => {
-        console.log(e);
-        console.log(reason);
         if (unloadRef.current) {
             window.onbeforeunload = null;
         }
@@ -564,7 +562,7 @@ function Composer(inProps) {
             case Composer_1.COMPOSER_TYPE_POLL:
                 return ((0, jsx_runtime_1.jsx)(ContentPoll_1.default, { onChange: handleChangePoll, value: { html, event, group, addressing, medias, poll, location }, error: pollError, disabled: isSubmitting }, key));
             case types_1.SCContributionType.DISCUSSION:
-                return ((0, jsx_runtime_1.jsx)(ContentDiscussion_1.default, { value: { title, html, categories, event, group, addressing, medias, poll, location }, error: { titleError, error }, onChange: handleChangeDiscussion, disabled: isSubmitting, EditorProps: Object.assign({ toolbar: true, uploadImage: true }, EditorProps) }, key));
+                return ((0, jsx_runtime_1.jsx)(ContentDiscussion_1.default, { value: { title, html, categories, event, group, addressing, medias, poll, location }, error: { titleError, error }, onChange: handleChangeDiscussion, disabled: isSubmitting, isContentSwitchButtonVisible: !canSubmit && !editMode, EditorProps: Object.assign({ toolbar: true, uploadImage: true }, EditorProps) }, key));
             default:
                 return ((0, jsx_runtime_1.jsx)(ContentPost_1.default, { value: { html, categories, event, group, addressing, medias, poll, location }, error: { error }, onChange: handleChangePost, disabled: isSubmitting, EditorProps: Object.assign({ toolbar: false, uploadImage: false }, EditorProps) }, key));
         }
@@ -584,7 +582,9 @@ function Composer(inProps) {
         error,
         handleChangePoll,
         handleChangePost,
-        isSubmitting
+        isSubmitting,
+        canSubmit,
+        editMode
     ]);
     if (!scUserContext.user && !(scUserContext.loading && open)) {
         return null;

package/lib/cjs/components/Composer/Content/ContentDiscussion/ContentDiscussion.d.ts

@@ -22,6 +22,24 @@ export interface ContentDiscussionProps extends Omit<BoxProps, 'value' | 'onChan
      * @default empty object
      */
     onChange: (value: ComposerContentType) => void;
+    /**
+     * Value indicating the initial height
+     * @default 370
+     */
+    defaultInitialMaxHeightContentEditor?: number;
+    /**
+     * Value indicating the amount of space to take into account to dynamically
+     * calculate the max-height of the editor content (div.content)
+     * Default is :
+     * 90 (dialog topbar + bottombar) + 55 (editor toolbar) + 45 (selector content type) + 20 (title padding top/bottom)
+     * @default 210
+     */
+    defaultExtraSpaceContentEditor?: number;
+    /**
+     * Props indicate if the content switch button is visible
+     * @default true
+     */
+    isContentSwitchButtonVisible?: boolean;
     /**
      * Props to spread into the editor object
      * @default empty object

package/lib/cjs/components/Composer/Content/ContentDiscussion/ContentDiscussion.js

@@ -10,6 +10,8 @@ const Editor_1 = tslib_1.__importDefault(require("../../../Editor"));
 const react_intl_1 = require("react-intl");
 const Composer_1 = require("../../../../constants/Composer");
 const constants_1 = require("../../constants");
+const constants_2 = require("../../../Editor/constants");
+const utils_1 = require("@selfcommunity/utils");
 const classes = {
     root: `${constants_1.PREFIX}-content-discussion-root`,
     generalError: `${constants_1.PREFIX}-general-error`,
@@ -35,22 +37,52 @@ const DEFAULT_DISCUSSION = {
 };
 exports.default = (props) => {
     // PROPS
-    const { className = null, value = Object.assign({}, DEFAULT_DISCUSSION), error = {}, disabled = false, onChange, EditorProps = {} } = props;
+    const { className = null, value = Object.assign({}, DEFAULT_DISCUSSION), defaultInitialMaxHeightContentEditor = constants_1.DEFAULT_INITIAL_MAX_HEIGHT_CONTENT_EDITOR, defaultExtraSpaceContentEditor = constants_1.DEFAULT_EXTRA_SPACE_CONTENT_EDITOR, isContentSwitchButtonVisible = true, error = {}, disabled = false, onChange, EditorProps = {} } = props;
     const { titleError = null, error: generalError = null } = Object.assign({}, error);
+    const titleRef = (0, react_1.useRef)(null);
+    const [editorMaxHeight, setEditorMaxHeight] = (0, react_1.useState)(defaultInitialMaxHeightContentEditor + (isContentSwitchButtonVisible ? 0 : constants_1.DEFAULT_HEIGHT_SWITCH_CONTENT_TYPE));
     // HOOKS
     const intl = (0, react_intl_1.useIntl)();
+    const theme = (0, material_1.useTheme)();
+    const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
+    const isIOS = (0, react_1.useMemo)(() => (0, utils_1.iOS)(), []);
     // HANDLERS
     const handleChangeTitle = (0, react_1.useCallback)((event) => {
         onChange(Object.assign(Object.assign({}, value), { title: event.target.value }));
     }, [value]);
+    const handleKeyDownTitle = (0, react_1.useCallback)((event) => {
+        if (event.key === 'Enter') {
+            event.preventDefault();
+        }
+        else if (value.title.length > Composer_1.COMPOSER_TITLE_MAX_LENGTH &&
+            ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'Delete', 'Backspace', 'Shift', 'Home', 'End'].indexOf(event.key) < 0) {
+            event.preventDefault();
+        }
+    }, [value]);
     const handleChangeHtml = (0, react_1.useCallback)((html) => {
         onChange(Object.assign(Object.assign({}, value), { html }));
     }, [value]);
+    const computeEditorContentHeight = (0, react_1.useCallback)(() => {
+        if (titleRef.current) {
+            if (isMobile) {
+                // Measure title input height
+                const rect = titleRef.current.getBoundingClientRect();
+                const _delta = defaultExtraSpaceContentEditor + rect.height + (isIOS ? 30 : 0) - (isContentSwitchButtonVisible ? 0 : constants_1.DEFAULT_HEIGHT_SWITCH_CONTENT_TYPE);
+                setEditorMaxHeight(`calc(100vh - ${_delta}px)`);
+            }
+            else {
+                setEditorMaxHeight(constants_1.DEFAULT_INITIAL_MAX_HEIGHT_CONTENT_EDITOR + (isContentSwitchButtonVisible ? 0 : constants_1.DEFAULT_HEIGHT_SWITCH_CONTENT_TYPE) + 'px');
+            }
+        }
+    }, [isMobile, titleRef.current, setEditorMaxHeight, isIOS, isContentSwitchButtonVisible]);
+    (0, react_1.useEffect)(() => {
+        computeEditorContentHeight();
+    }, [value, isContentSwitchButtonVisible, computeEditorContentHeight, isMobile]);
     // RENDER
-    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, { children: [generalError && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.generalError }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.composer.error.${generalError}`, defaultMessage: `ui.composer.error.${generalError}` }) }))), (0, jsx_runtime_1.jsx)(material_1.TextField, { className: classes.title, placeholder: intl.formatMessage({
+    return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, { children: [generalError && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.generalError }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.composer.error.${generalError}`, defaultMessage: `ui.composer.error.${generalError}` }) }))), (0, jsx_runtime_1.jsx)(material_1.TextField, { className: classes.title, ref: titleRef, placeholder: intl.formatMessage({
                     id: 'ui.composer.content.discussion.title.label',
                     defaultMessage: 'ui.composer.content.discussion.title.label'
-                }), autoFocus: true, fullWidth: true, variant: "outlined", value: value.title, multiline: true, onChange: handleChangeTitle, InputProps: {
+                }), autoFocus: true, fullWidth: true, variant: "outlined", value: value.title, onChange: handleChangeTitle, onKeyDown: handleKeyDownTitle, multiline: true, InputProps: {
                     endAdornment: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: Composer_1.COMPOSER_TITLE_MAX_LENGTH - value.title.length }))
-                }, error: Boolean(titleError), helperText: titleError, disabled: disabled }), (0, jsx_runtime_1.jsx)(Editor_1.default, Object.assign({}, EditorProps, { editable: !disabled, className: classes.editor, onChange: handleChangeHtml, defaultValue: value.html }))] })));
+                }, error: Boolean(titleError), helperText: titleError, disabled: disabled }), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ sx: { [`& .${constants_2.PREFIX}-content`]: { maxHeight: `${editorMaxHeight} !important` } } }, { children: (0, jsx_runtime_1.jsx)(Editor_1.default, Object.assign({}, EditorProps, { editable: !disabled, className: classes.editor, onChange: handleChangeHtml, defaultValue: value.html })) }))] })));
 };

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

@@ -1 +1,4 @@
 export declare const PREFIX = "SCComposer";
+export declare const DEFAULT_INITIAL_MAX_HEIGHT_CONTENT_EDITOR = 370;
+export declare const DEFAULT_EXTRA_SPACE_CONTENT_EDITOR = 210;
+export declare const DEFAULT_HEIGHT_SWITCH_CONTENT_TYPE = 45;

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

@@ -1,4 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PREFIX = void 0;
+exports.DEFAULT_HEIGHT_SWITCH_CONTENT_TYPE = exports.DEFAULT_EXTRA_SPACE_CONTENT_EDITOR = exports.DEFAULT_INITIAL_MAX_HEIGHT_CONTENT_EDITOR = exports.PREFIX = void 0;
 exports.PREFIX = 'SCComposer';
+exports.DEFAULT_INITIAL_MAX_HEIGHT_CONTENT_EDITOR = 370;
+exports.DEFAULT_EXTRA_SPACE_CONTENT_EDITOR = 210;
+exports.DEFAULT_HEIGHT_SWITCH_CONTENT_TYPE = 45;

package/lib/cjs/components/ComposerIconButton/ComposerIconButton.js

@@ -88,9 +88,9 @@ exports.default = react_1.default.forwardRef(function ComposerIconButton(inProps
     const canCreateEvent = (0, react_1.useMemo)(() => { var _a, _b; return (_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; }, [(_b = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _b === void 0 ? void 0 : _b.permission]);
     const canCreateLiveStream = (0, react_1.useMemo)(() => { var _a, _b; return (_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_live_stream; }, [(_c = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _c === void 0 ? void 0 : _c.permission]);
     const renderContent = (0, react_1.useMemo)(() => {
-        return ((0, jsx_runtime_1.jsx)(material_1.MenuList, { children: listItem.map((item, i) => ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ onClick: item.onClick }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: item.icon })) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: item.text, defaultMessage: item.text }) })) })] }), i))) }));
+        return ((0, jsx_runtime_1.jsx)(material_1.MenuList, { children: listItem.map((item, i) => ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ onClick: item.onClick }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: item.icon })) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: item.text, defaultMessage: item.text }) })) })] }), i))) }));
     }, [listItem]);
-    // EFFETCS
+    // EFFECTS
     (0, react_1.useEffect)(() => {
         if (canCreateGroup) {
             setListItem((prev) => [

package/lib/cjs/shared/AutoPlayer/index.js

@@ -22,7 +22,7 @@ function AutoPlayer(props) {
     const [played, setPlayed] = (0, react_1.useState)(0);
     (0, react_1.useEffect)(() => {
         if (played >= 10 && played <= 11) {
-            onVideoWatch();
+            onVideoWatch === null || onVideoWatch === void 0 ? void 0 : onVideoWatch();
         }
     }, [played]);
     /**

package/lib/esm/components/Composer/Composer.js

@@ -496,8 +496,6 @@ export default function Composer(inProps) {
     }, [scUserContext.user, feedObjectType, id, type, title, html, categories, event, group, addressing, audience, medias, poll, location, hasPoll]);
     //edited here
     const handleClose = useCallback((e, reason) => {
-        console.log(e);
-        console.log(reason);
         if (unloadRef.current) {
             window.onbeforeunload = null;
         }
@@ -562,7 +560,7 @@ export default function Composer(inProps) {
             case COMPOSER_TYPE_POLL:
                 return (_jsx(ContentPoll, { onChange: handleChangePoll, value: { html, event, group, addressing, medias, poll, location }, error: pollError, disabled: isSubmitting }, key));
             case SCContributionType.DISCUSSION:
-                return (_jsx(ContentDiscussion, { value: { title, html, categories, event, group, addressing, medias, poll, location }, error: { titleError, error }, onChange: handleChangeDiscussion, disabled: isSubmitting, EditorProps: Object.assign({ toolbar: true, uploadImage: true }, EditorProps) }, key));
+                return (_jsx(ContentDiscussion, { value: { title, html, categories, event, group, addressing, medias, poll, location }, error: { titleError, error }, onChange: handleChangeDiscussion, disabled: isSubmitting, isContentSwitchButtonVisible: !canSubmit && !editMode, EditorProps: Object.assign({ toolbar: true, uploadImage: true }, EditorProps) }, key));
             default:
                 return (_jsx(ContentPost, { value: { html, categories, event, group, addressing, medias, poll, location }, error: { error }, onChange: handleChangePost, disabled: isSubmitting, EditorProps: Object.assign({ toolbar: false, uploadImage: false }, EditorProps) }, key));
         }
@@ -582,7 +580,9 @@ export default function Composer(inProps) {
         error,
         handleChangePoll,
         handleChangePost,
-        isSubmitting
+        isSubmitting,
+        canSubmit,
+        editMode
     ]);
     if (!scUserContext.user && !(scUserContext.loading && open)) {
         return null;

package/lib/esm/components/Composer/Content/ContentDiscussion/ContentDiscussion.d.ts

@@ -22,6 +22,24 @@ export interface ContentDiscussionProps extends Omit<BoxProps, 'value' | 'onChan
      * @default empty object
      */
     onChange: (value: ComposerContentType) => void;
+    /**
+     * Value indicating the initial height
+     * @default 370
+     */
+    defaultInitialMaxHeightContentEditor?: number;
+    /**
+     * Value indicating the amount of space to take into account to dynamically
+     * calculate the max-height of the editor content (div.content)
+     * Default is :
+     * 90 (dialog topbar + bottombar) + 55 (editor toolbar) + 45 (selector content type) + 20 (title padding top/bottom)
+     * @default 210
+     */
+    defaultExtraSpaceContentEditor?: number;
+    /**
+     * Props indicate if the content switch button is visible
+     * @default true
+     */
+    isContentSwitchButtonVisible?: boolean;
     /**
      * Props to spread into the editor object
      * @default empty object

package/lib/esm/components/Composer/Content/ContentDiscussion/ContentDiscussion.js

@@ -1,12 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback } from 'react';
-import { Box, TextField, Typography } from '@mui/material';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { Box, TextField, Typography, useMediaQuery, useTheme } from '@mui/material';
 import { styled } from '@mui/material/styles';
 import classNames from 'classnames';
 import Editor from '../../../Editor';
 import { FormattedMessage, useIntl } from 'react-intl';
 import { COMPOSER_TITLE_MAX_LENGTH } from '../../../../constants/Composer';
-import { PREFIX } from '../../constants';
+import { DEFAULT_EXTRA_SPACE_CONTENT_EDITOR, DEFAULT_HEIGHT_SWITCH_CONTENT_TYPE, DEFAULT_INITIAL_MAX_HEIGHT_CONTENT_EDITOR, PREFIX } from '../../constants';
+import { PREFIX as SCEDITOR_PREFIX } from '../../../Editor/constants';
+import { iOS } from '@selfcommunity/utils';
 const classes = {
     root: `${PREFIX}-content-discussion-root`,
     generalError: `${PREFIX}-general-error`,
@@ -32,22 +34,52 @@ const DEFAULT_DISCUSSION = {
 };
 export default (props) => {
     // PROPS
-    const { className = null, value = Object.assign({}, DEFAULT_DISCUSSION), error = {}, disabled = false, onChange, EditorProps = {} } = props;
+    const { className = null, value = Object.assign({}, DEFAULT_DISCUSSION), defaultInitialMaxHeightContentEditor = DEFAULT_INITIAL_MAX_HEIGHT_CONTENT_EDITOR, defaultExtraSpaceContentEditor = DEFAULT_EXTRA_SPACE_CONTENT_EDITOR, isContentSwitchButtonVisible = true, error = {}, disabled = false, onChange, EditorProps = {} } = props;
     const { titleError = null, error: generalError = null } = Object.assign({}, error);
+    const titleRef = useRef(null);
+    const [editorMaxHeight, setEditorMaxHeight] = useState(defaultInitialMaxHeightContentEditor + (isContentSwitchButtonVisible ? 0 : DEFAULT_HEIGHT_SWITCH_CONTENT_TYPE));
     // HOOKS
     const intl = useIntl();
+    const theme = useTheme();
+    const isMobile = useMediaQuery(theme.breakpoints.down('md'));
+    const isIOS = useMemo(() => iOS(), []);
     // HANDLERS
     const handleChangeTitle = useCallback((event) => {
         onChange(Object.assign(Object.assign({}, value), { title: event.target.value }));
     }, [value]);
+    const handleKeyDownTitle = useCallback((event) => {
+        if (event.key === 'Enter') {
+            event.preventDefault();
+        }
+        else if (value.title.length > COMPOSER_TITLE_MAX_LENGTH &&
+            ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'Delete', 'Backspace', 'Shift', 'Home', 'End'].indexOf(event.key) < 0) {
+            event.preventDefault();
+        }
+    }, [value]);
     const handleChangeHtml = useCallback((html) => {
         onChange(Object.assign(Object.assign({}, value), { html }));
     }, [value]);
+    const computeEditorContentHeight = useCallback(() => {
+        if (titleRef.current) {
+            if (isMobile) {
+                // Measure title input height
+                const rect = titleRef.current.getBoundingClientRect();
+                const _delta = defaultExtraSpaceContentEditor + rect.height + (isIOS ? 30 : 0) - (isContentSwitchButtonVisible ? 0 : DEFAULT_HEIGHT_SWITCH_CONTENT_TYPE);
+                setEditorMaxHeight(`calc(100vh - ${_delta}px)`);
+            }
+            else {
+                setEditorMaxHeight(DEFAULT_INITIAL_MAX_HEIGHT_CONTENT_EDITOR + (isContentSwitchButtonVisible ? 0 : DEFAULT_HEIGHT_SWITCH_CONTENT_TYPE) + 'px');
+            }
+        }
+    }, [isMobile, titleRef.current, setEditorMaxHeight, isIOS, isContentSwitchButtonVisible]);
+    useEffect(() => {
+        computeEditorContentHeight();
+    }, [value, isContentSwitchButtonVisible, computeEditorContentHeight, isMobile]);
     // RENDER
-    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [generalError && (_jsx(Typography, Object.assign({ className: classes.generalError }, { children: _jsx(FormattedMessage, { id: `ui.composer.error.${generalError}`, defaultMessage: `ui.composer.error.${generalError}` }) }))), _jsx(TextField, { className: classes.title, placeholder: intl.formatMessage({
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [generalError && (_jsx(Typography, Object.assign({ className: classes.generalError }, { children: _jsx(FormattedMessage, { id: `ui.composer.error.${generalError}`, defaultMessage: `ui.composer.error.${generalError}` }) }))), _jsx(TextField, { className: classes.title, ref: titleRef, placeholder: intl.formatMessage({
                     id: 'ui.composer.content.discussion.title.label',
                     defaultMessage: 'ui.composer.content.discussion.title.label'
-                }), autoFocus: true, fullWidth: true, variant: "outlined", value: value.title, multiline: true, onChange: handleChangeTitle, InputProps: {
+                }), autoFocus: true, fullWidth: true, variant: "outlined", value: value.title, onChange: handleChangeTitle, onKeyDown: handleKeyDownTitle, multiline: true, InputProps: {
                     endAdornment: _jsx(Typography, Object.assign({ variant: "body2" }, { children: COMPOSER_TITLE_MAX_LENGTH - value.title.length }))
-                }, error: Boolean(titleError), helperText: titleError, disabled: disabled }), _jsx(Editor, Object.assign({}, EditorProps, { editable: !disabled, className: classes.editor, onChange: handleChangeHtml, defaultValue: value.html }))] })));
+                }, error: Boolean(titleError), helperText: titleError, disabled: disabled }), _jsx(Box, Object.assign({ sx: { [`& .${SCEDITOR_PREFIX}-content`]: { maxHeight: `${editorMaxHeight} !important` } } }, { children: _jsx(Editor, Object.assign({}, EditorProps, { editable: !disabled, className: classes.editor, onChange: handleChangeHtml, defaultValue: value.html })) }))] })));
 };

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

@@ -1 +1,4 @@
 export declare const PREFIX = "SCComposer";
+export declare const DEFAULT_INITIAL_MAX_HEIGHT_CONTENT_EDITOR = 370;
+export declare const DEFAULT_EXTRA_SPACE_CONTENT_EDITOR = 210;
+export declare const DEFAULT_HEIGHT_SWITCH_CONTENT_TYPE = 45;

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

@@ -1 +1,4 @@
 export const PREFIX = 'SCComposer';
+export const DEFAULT_INITIAL_MAX_HEIGHT_CONTENT_EDITOR = 370;
+export const DEFAULT_EXTRA_SPACE_CONTENT_EDITOR = 210;
+export const DEFAULT_HEIGHT_SWITCH_CONTENT_TYPE = 45;

package/lib/esm/components/ComposerIconButton/ComposerIconButton.js

@@ -86,9 +86,9 @@ export default React.forwardRef(function ComposerIconButton(inProps, ref) {
     const canCreateEvent = useMemo(() => { var _a, _b; return (_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; }, [(_b = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _b === void 0 ? void 0 : _b.permission]);
     const canCreateLiveStream = useMemo(() => { var _a, _b; return (_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_live_stream; }, [(_c = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _c === void 0 ? void 0 : _c.permission]);
     const renderContent = useMemo(() => {
-        return (_jsx(MenuList, { children: listItem.map((item, i) => (_jsxs(MenuItem, Object.assign({ onClick: item.onClick }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, Object.assign({ fontSize: "small" }, { children: item.icon })) }), _jsx(ListItemText, { primary: _jsx(Typography, Object.assign({ variant: "h5" }, { children: _jsx(FormattedMessage, { id: item.text, defaultMessage: item.text }) })) })] }), i))) }));
+        return (_jsx(MenuList, { children: listItem.map((item, i) => (_jsxs(MenuItem, Object.assign({ onClick: item.onClick }, { children: [_jsx(ListItemIcon, { children: _jsx(Icon, Object.assign({ fontSize: "small" }, { children: item.icon })) }), _jsx(ListItemText, { primary: _jsx(Typography, Object.assign({ variant: "h6" }, { children: _jsx(FormattedMessage, { id: item.text, defaultMessage: item.text }) })) })] }), i))) }));
     }, [listItem]);
-    // EFFETCS
+    // EFFECTS
     useEffect(() => {
         if (canCreateGroup) {
             setListItem((prev) => [

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

@@ -20,7 +20,7 @@ export default function AutoPlayer(props) {
     const [played, setPlayed] = useState(0);
     useEffect(() => {
         if (played >= 10 && played <= 11) {
-            onVideoWatch();
+            onVideoWatch === null || onVideoWatch === void 0 ? void 0 : onVideoWatch();
         }
     }, [played]);
     /**