@selfcommunity/react-ui 0.11.0-alpha.99 → 0.11.0-mui7.14

package/lib/esm/components/CourseForm/CourseForm.js

@@ -281,10 +281,14 @@ export default function CourseForm(inProps) {
     /**
      * Renders root object
      */
-    return (_jsxs(Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsxs(Box, Object.assign({ className: _step === SCCourseFormStepType.GENERAL ? classes.stepOne : classes.stepTwo }, { children: [_step === SCCourseFormStepType.GENERAL && (_jsx(Fragment, { children: Object.values(SCCourseTypologyType).map((option, index) => (_jsx(Card, Object.assign({ className: classNames(classes.card, { [classes.selected]: option === field.type }, { [classes.disabled]: !courseAdvancedEnabled && option !== SCCourseTypologyType.SELF }) }, { children: _jsx(CardActionArea, Object.assign({ onClick: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['type']: option }))) }, { children: _jsxs(CardContent, { children: [_jsxs(Typography, Object.assign({ variant: "subtitle2", className: classes.cardTitle }, { children: [_jsx(FormattedMessage, { id: `ui.courseForm.${option}.title`, defaultMessage: `ui.courseForm.${option}.title` }), !courseAdvancedEnabled && option !== SCCourseTypologyType.SELF && (_jsx(Chip, { variant: "outlined", color: "warning", size: "small", label: _jsx(FormattedMessage, { id: "ui.courseForm.comingSoon.chip", defaultMessage: "ui.courseForm.comingSoon.chip" }) }))] })), _jsx(Typography, Object.assign({ variant: "body2" }, { children: _jsx(FormattedMessage, { id: `ui.courseForm.${option}.info`, defaultMessage: `ui.courseForm.${option}.info` }) }))] }) })) }), index))) })), _step === SCCourseFormStepType.CUSTOMIZATION && (_jsxs(Fragment, { children: [course && (_jsx(Typography, Object.assign({ variant: "h5", className: classes.contrastColor }, { children: _jsx(FormattedMessage, { id: "ui.courseForm.edit.title.general", defaultMessage: "ui.courseForm.edit.title.general" }) }))), _jsxs(FormGroup, Object.assign({ className: classNames(classes.form, _step === SCCourseFormStepType.CUSTOMIZATION && course ? classes.stepCustomization : undefined) }, { children: [_jsx(Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: _jsx(UploadCourseCover, { isUploading: field.isSubmitting, onChange: handleChangeCover }) })), _jsx(TextField, { required: true, className: classes.name, placeholder: `${intl.formatMessage(messages.name)}`, margin: "normal", value: field.name, name: "name", onChange: handleChange, InputProps: {
-                                                endAdornment: _jsx(Typography, Object.assign({ variant: "body2" }, { children: COURSE_TITLE_MAX_LENGTH - field.name.length }))
-                                            }, error: Boolean((!!course && !field.name) || field.name.length > COURSE_TITLE_MAX_LENGTH) || Boolean(error['nameError']), helperText: !!course && !field.name ? (_jsx(FormattedMessage, { id: "ui.courseForm.required", defaultMessage: "ui.courseForm.required" })) : field.name.length > COURSE_TITLE_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.courseForm.name.error.maxLength", defaultMessage: "ui.courseForm.name.error.maxLength" })) : error['nameError'] ? (error['nameError']) : null }), _jsx(TextField, { multiline: true, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
-                                                endAdornment: (_jsx(Typography, Object.assign({ variant: "body2" }, { children: ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) ? COURSE_DESCRIPTION_MAX_LENGTH - field.description.length : COURSE_DESCRIPTION_MAX_LENGTH })))
+    return (_jsxs(Fragment, { children: [_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsxs(Box, Object.assign({ className: _step === SCCourseFormStepType.GENERAL ? classes.stepOne : classes.stepTwo }, { children: [_step === SCCourseFormStepType.GENERAL && (_jsx(Fragment, { children: Object.values(SCCourseTypologyType).map((option, index) => (_jsx(Card, Object.assign({ className: classNames(classes.card, { [classes.selected]: option === field.type }, { [classes.disabled]: !courseAdvancedEnabled && option !== SCCourseTypologyType.SELF }) }, { children: _jsx(CardActionArea, Object.assign({ onClick: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['type']: option }))) }, { children: _jsxs(CardContent, { children: [_jsxs(Typography, Object.assign({ variant: "subtitle2", className: classes.cardTitle }, { children: [_jsx(FormattedMessage, { id: `ui.courseForm.${option}.title`, defaultMessage: `ui.courseForm.${option}.title` }), !courseAdvancedEnabled && option !== SCCourseTypologyType.SELF && (_jsx(Chip, { variant: "outlined", color: "warning", size: "small", label: _jsx(FormattedMessage, { id: "ui.courseForm.comingSoon.chip", defaultMessage: "ui.courseForm.comingSoon.chip" }) }))] })), _jsx(Typography, Object.assign({ variant: "body2" }, { children: _jsx(FormattedMessage, { id: `ui.courseForm.${option}.info`, defaultMessage: `ui.courseForm.${option}.info` }) }))] }) })) }), index))) })), _step === SCCourseFormStepType.CUSTOMIZATION && (_jsxs(Fragment, { children: [course && (_jsx(Typography, Object.assign({ variant: "h5", className: classes.contrastColor }, { children: _jsx(FormattedMessage, { id: "ui.courseForm.edit.title.general", defaultMessage: "ui.courseForm.edit.title.general" }) }))), _jsxs(FormGroup, Object.assign({ className: classNames(classes.form, _step === SCCourseFormStepType.CUSTOMIZATION && course ? classes.stepCustomization : undefined) }, { children: [_jsx(Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: _jsx(UploadCourseCover, { isUploading: field.isSubmitting, onChange: handleChangeCover }) })), _jsx(TextField, { required: true, className: classes.name, placeholder: `${intl.formatMessage(messages.name)}`, margin: "normal", value: field.name, name: "name", onChange: handleChange, slotProps: {
+                                                input: {
+                                                    endAdornment: _jsx(Typography, Object.assign({ variant: "body2" }, { children: COURSE_TITLE_MAX_LENGTH - field.name.length }))
+                                                }
+                                            }, error: Boolean((!!course && !field.name) || field.name.length > COURSE_TITLE_MAX_LENGTH) || Boolean(error['nameError']), helperText: !!course && !field.name ? (_jsx(FormattedMessage, { id: "ui.courseForm.required", defaultMessage: "ui.courseForm.required" })) : field.name.length > COURSE_TITLE_MAX_LENGTH ? (_jsx(FormattedMessage, { id: "ui.courseForm.name.error.maxLength", defaultMessage: "ui.courseForm.name.error.maxLength" })) : error['nameError'] ? (error['nameError']) : null }), _jsx(TextField, { multiline: true, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, slotProps: {
+                                                input: {
+                                                    endAdornment: (_jsx(Typography, Object.assign({ variant: "body2" }, { children: ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) ? COURSE_DESCRIPTION_MAX_LENGTH - field.description.length : COURSE_DESCRIPTION_MAX_LENGTH })))
+                                                }
                                             }, error: Boolean((!!field.privacy && !field.description) || ((_d = field.description) === null || _d === void 0 ? void 0 : _d.length) > COURSE_DESCRIPTION_MAX_LENGTH), helperText: !!field.privacy && !field.description ? (_jsx(FormattedMessage, { id: "ui.courseForm.required", defaultMessage: "ui.courseForm.required" })) : (((_e = field.description) === null || _e === void 0 ? void 0 : _e.length) > COURSE_DESCRIPTION_MAX_LENGTH && (_jsx(FormattedMessage, { id: "ui.courseForm.description.error.maxLength", defaultMessage: "ui.courseForm.description.error.maxLength" }))) }), _jsx(CategoryAutocomplete, { defaultValue: field.categories, TextFieldProps: { label: intl.formatMessage(Object.keys(field.categories).length ? messages.category : messages.categoryEmpty) }, multiple: true, onChange: handleOnChangeCategory }), course && _jsx(CourseEdit, { course: course, onPrivacyChange: (privacy) => setField((prev) => (Object.assign(Object.assign({}, prev), { ['privacy']: privacy }))) }), isPaymentsEnabled && isStaff && !hidePaywalls && (_jsx(Box, Object.assign({ className: classes.paywallsConfiguratorWrap }, { children: _jsx(PaywallsConfigurator, Object.assign({}, (course && { contentId: course.id }), { contentType: SCContentType.COURSE, onChangeContentAccessType: handleChangeContentAccessType, onChangePaymentProducts: handleChangePaymentsProducts })) })))] }))] })), _jsx(Box, Object.assign({ className: classNames(classes.actions, _step === SCCourseFormStepType.CUSTOMIZATION && course ? classes.stepCustomization : undefined) }, { children: _jsx(LoadingButton, Object.assign({ size: "small", loading: field.isSubmitting, disabled: _step === SCCourseFormStepType.GENERAL
                                     ? !field.type || Object.keys(error).length !== 0
                                     : _step === SCCourseFormStepType.CUSTOMIZATION &&

package/lib/esm/components/CourseForm/Dialog.d.ts

@@ -3,6 +3,6 @@ interface CoursePublicationDialogProps {
     onSubmit: () => void;
     onClose: () => void;
 }
-declare function CoursePublicationDialog(props: CoursePublicationDialogProps): JSX.Element;
+declare function CoursePublicationDialog(props: CoursePublicationDialogProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof CoursePublicationDialog>;
 export default _default;

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

@@ -1 +1 @@
-export default function CourseFormSkeleton(): JSX.Element;
+export default function CourseFormSkeleton(): import("react/jsx-runtime").JSX.Element;

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

@@ -50,4 +50,4 @@ export interface CourseParticipantsButtonProps extends Pick<ButtonProps, Exclude
  
  * @param inProps
  */
-export default function CourseParticipantsButton(inProps: CourseParticipantsButtonProps): JSX.Element;
+export default function CourseParticipantsButton(inProps: CourseParticipantsButtonProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1,11 +1,7 @@
 import { GridProps } from '@mui/material';
-import React from 'react';
 import { CourseProps, CourseSkeletonProps } from '../Course';
 import { CoursesSkeletonProps } from '../Courses/Skeleton';
 import { CreateCourseButtonProps } from '../CreateCourseButton';
-export declare const CoursesChipRoot: import("@emotion/styled").StyledComponent<import("@mui/material").ChipOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
-    ref?: React.Ref<HTMLDivElement>;
-}, "avatar" | "className" | "style" | "classes" | "label" | "tabIndex" | "color" | "children" | "sx" | "variant" | "disabled" | "size" | "icon" | "clickable" | "deleteIcon" | "onDelete" | "skipFocusWhenDisabled"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export interface CoursesProps {
     /**
      * Overrides or extends the styles applied to the component.

package/lib/esm/components/Courses/Courses.js

@@ -39,7 +39,7 @@ const Root = styled(Box, {
     name: PREFIX,
     slot: 'Root'
 })(() => ({}));
-export const CoursesChipRoot = styled(Chip, {
+const CoursesChipRoot = styled(Chip, {
     name: PREFIX,
     slot: 'CoursesChipRoot',
     shouldForwardProp: (prop) => prop !== 'showMine' && prop !== 'showManagedCourses'
@@ -204,22 +204,22 @@ export default function Courses(inProps) {
     /**
      * Renders courses list
      */
-    const c = (_jsxs(_Fragment, { children: [showFilters && (_jsx(Grid, Object.assign({ container: true, className: classes.filters, gap: 2 }, { children: filters ? (filters) : (_jsxs(_Fragment, { children: [_jsx(Grid, Object.assign({ item: true, xs: 12, md: 3 }, { children: _jsx(TextField, { className: classes.search, size: 'small', fullWidth: true, value: query, label: _jsx(FormattedMessage, { id: "ui.courses.filterByName", defaultMessage: "ui.courses.filterByName" }), variant: "outlined", onChange: handleOnChangeFilterName, disabled: loading, onKeyUp: (e) => {
+    const c = (_jsxs(_Fragment, { children: [showFilters && (_jsx(Grid, Object.assign({ container: true, width: "100%", className: classes.filters, gap: 2 }, { children: filters ? (filters) : (_jsxs(_Fragment, { children: [_jsx(Grid, Object.assign({ size: { md: 3 } }, { children: _jsx(TextField, { className: classes.search, size: 'small', fullWidth: true, value: query, label: _jsx(FormattedMessage, { id: "ui.courses.filterByName", defaultMessage: "ui.courses.filterByName" }), variant: "outlined", onChange: handleOnChangeFilterName, disabled: loading, onKeyUp: (e) => {
                                     e.preventDefault();
                                     if (e.key === 'Enter') {
                                         fetchCourses();
                                     }
-                                }, InputProps: {
-                                    endAdornment: (_jsx(InputAdornment, Object.assign({ position: "end" }, { children: isMobile ? (_jsx(IconButton, Object.assign({ onClick: () => fetchCourses(), disabled: loading }, { children: _jsx(Icon, { children: "search" }) }))) : (_jsx(Button, { size: "small", variant: "contained", color: "secondary", onClick: () => fetchCourses(), endIcon: _jsx(Icon, { children: "search" }), disabled: loading })) })))
-                                } }) })), authUserId && ((onlyStaffEnabled && canCreateCourse) || !onlyStaffEnabled) && (_jsx(Grid, Object.assign({ item: true }, { children: _jsx(CoursesChipRoot, { color: showManagedCourses ? 'primary' : 'default', variant: showManagedCourses ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.courses.filterByManagedByMe", defaultMessage: "ui.courses.filterByManagedByMe" }), onClick: () => setShowManagedCourses(!showManagedCourses), 
+                                }, slotProps: {
+                                    input: {
+                                        endAdornment: (_jsx(InputAdornment, Object.assign({ position: "end" }, { children: isMobile ? (_jsx(IconButton, Object.assign({ onClick: () => fetchCourses(), disabled: loading }, { children: _jsx(Icon, { children: "search" }) }))) : (_jsx(Button, { size: "small", variant: "contained", color: "secondary", onClick: () => fetchCourses(), endIcon: _jsx(Icon, { children: "search" }), disabled: loading })) })))
+                                    }
+                                } }) })), authUserId && ((onlyStaffEnabled && canCreateCourse) || !onlyStaffEnabled) && (_jsx(Grid, Object.assign({ size: "grow" }, { children: _jsx(CoursesChipRoot, { color: showManagedCourses ? 'primary' : 'default', variant: showManagedCourses ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.courses.filterByManagedByMe", defaultMessage: "ui.courses.filterByManagedByMe" }), onClick: () => setShowManagedCourses(!showManagedCourses), 
                                 // @ts-expect-error this is needed to use showMine into SCCourses
-                                showManagedCourses: showManagedCourses, deleteIcon: showManagedCourses ? _jsx(Icon, { children: "close" }) : null, onDelete: showManagedCourses ? () => setShowManagedCourses(false) : null, disabled: loading || showMine }) }))), _jsx(Grid, Object.assign({ item: true, xs: 12, md: "auto" }, { children: _jsx(FormControl, Object.assign({ fullWidth: true }, { children: _jsx(CategoryAutocomplete, { onChange: handleOnChangeCategory, className: classes.category, size: "small", multiple: true }) })) })), authUserId && (_jsx(Grid, Object.assign({ item: true }, { children: _jsx(CoursesChipRoot, { color: showMine ? 'primary' : 'default', variant: showMine ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.courses.filterByMine", defaultMessage: "ui.courses.filterByMine" }), onClick: handleChipClick, 
+                                showManagedCourses: showManagedCourses, deleteIcon: showManagedCourses ? _jsx(Icon, { children: "close" }) : null, onDelete: showManagedCourses ? () => setShowManagedCourses(false) : null, disabled: loading || showMine }) }))), _jsx(Grid, Object.assign({ size: { md: 'auto' } }, { children: _jsx(FormControl, Object.assign({ fullWidth: true }, { children: _jsx(CategoryAutocomplete, { onChange: handleOnChangeCategory, className: classes.category, size: "small", multiple: true }) })) })), authUserId && (_jsx(Grid, Object.assign({ size: { xs: 12 } }, { children: _jsx(CoursesChipRoot, { color: showMine ? 'primary' : 'default', variant: showMine ? 'filled' : 'outlined', label: _jsx(FormattedMessage, { id: "ui.courses.filterByMine", defaultMessage: "ui.courses.filterByMine" }), onClick: handleChipClick, 
                                 // @ts-expect-error this is needed to use showMine into SCCourses
                                 showMine: showMine, deleteIcon: showMine ? _jsx(Icon, { children: "close" }) : null, onDelete: showMine ? handleDeleteClick : null, disabled: loading || showManagedCourses }) })))] })) }))), _jsx(_Fragment, { children: !courses.length ? (_jsx(Box, Object.assign({ className: classes.noResults }, { children: !canCreateCourse && onlyStaffEnabled ? (_jsxs(Stack, Object.assign({ className: classes.studentEmptyView }, { children: [_jsx(Stack, Object.assign({ className: classes.emptyBox }, { children: _jsx(Stack, Object.assign({ className: classes.emptyRotatedBox }, { children: _jsx(Icon, Object.assign({ className: classes.emptyIcon, color: "disabled", fontSize: "large" }, { children: "courses" })) })) })), _jsx(Typography, Object.assign({ variant: "h5", textAlign: "center" }, { children: _jsx(FormattedMessage, { id: "ui.courses.empty.title", defaultMessage: "ui.courses.empty.title" }) })), _jsx(Typography, Object.assign({ variant: "body1", textAlign: "center" }, { children: _jsx(FormattedMessage, { id: "ui.courses.empty.info", defaultMessage: "ui.courses.empty.info" }) }))] }))) : (_jsx(Box, Object.assign({ className: classes.teacherEmptyView }, { children: _jsx(Skeleton, Object.assign({ teacherView: (onlyStaffEnabled && canCreateCourse) || !onlyStaffEnabled, coursesNumber: 1 }, CoursesSkeletonComponentProps, { CourseSkeletonProps: CourseSkeletonComponentProps })) }))) }))) : (_jsx(InfiniteScroll, Object.assign({ dataLength: courses.length, next: handleNext, hasMoreNext: Boolean(next), loaderNext: isMobile ? (_jsx(CourseSkeleton, { template: SCCourseTemplateType.PREVIEW })) : (_jsx(Skeleton, Object.assign({ coursesNumber: 4 }, CoursesSkeletonComponentProps, { CourseSkeletonProps: CourseSkeletonComponentProps }))), endMessage: _jsx(Typography, Object.assign({ component: "div", className: classes.endMessage }, { children: _jsx(FormattedMessage, { id: "ui.courses.endMessage", defaultMessage: "ui.courses.endMessage", values: {
-                                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                                // @ts-ignore
                                 button: (chunk) => (_jsx(Button, Object.assign({ color: "secondary", variant: "text", onClick: handleScrollUp }, { children: chunk })))
-                            } }) })) }, { children: _jsx(Grid, Object.assign({ container: true, spacing: { xs: 3 }, className: classes.courses }, GridContainerComponentProps, { children: _jsxs(_Fragment, { children: [courses.map((course) => (_jsx(Grid, Object.assign({ item: true, xs: 12, sm: 12, md: 6, lg: 3, className: classes.item }, GridItemComponentProps, { children: _jsx(Course, Object.assign({ courseId: course.id }, CourseComponentProps)) }), course.id))), authUserId && ((onlyStaffEnabled && canCreateCourse) || !onlyStaffEnabled) && courses.length % 2 !== 0 && (_jsx(Grid, Object.assign({ item: true, xs: 12, sm: 12, md: 6, lg: 3, className: classes.itemPlaceholder }, GridItemComponentProps, { children: _jsx(CourseCreatePlaceholder, { CreateCourseButtonComponentProps: CreateCourseButtonComponentProps }) }), "placeholder-item"))] }) })) }))) })] }));
+                            } }) })) }, { children: _jsx(Grid, Object.assign({ container: true, width: "100%", spacing: { xs: 3 }, className: classes.courses }, GridContainerComponentProps, { children: _jsxs(_Fragment, { children: [courses.map((course) => (_jsx(Grid, Object.assign({ size: { md: 6, lg: 3 }, className: classes.item }, GridItemComponentProps, { children: _jsx(Course, Object.assign({ courseId: course.id }, CourseComponentProps)) }), course.id))), authUserId && ((onlyStaffEnabled && canCreateCourse) || !onlyStaffEnabled) && courses.length % 2 !== 0 && (_jsx(Grid, Object.assign({ size: { md: 6, lg: 3 }, className: classes.itemPlaceholder }, GridItemComponentProps, { children: _jsx(CourseCreatePlaceholder, { CreateCourseButtonComponentProps: CreateCourseButtonComponentProps }) }), "placeholder-item"))] }) })) }))) })] }));
     /**
      * Renders root object (if content availability community option is false and user is anonymous, component is hidden)
      */

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

@@ -37,5 +37,5 @@ const Root = styled(Box, {
  */
 export default function CoursesSkeleton(inProps) {
     const { className, CourseSkeletonProps = {}, coursesNumber = 8, GridContainerComponentProps = {}, GridItemComponentProps = {}, teacherView = false } = inProps, rest = __rest(inProps, ["className", "CourseSkeletonProps", "coursesNumber", "GridContainerComponentProps", "GridItemComponentProps", "teacherView"]);
-    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsx(Grid, Object.assign({ container: true, spacing: { xs: 3 }, className: classes.courses }, GridContainerComponentProps, { children: [...Array(coursesNumber)].map((course, index) => (_jsx(Grid, Object.assign({ item: true, xs: 12, sm: 12, md: 6, lg: 3 }, GridItemComponentProps, { className: classes.item }, { children: teacherView ? _jsx(CourseCreatePlaceholder, {}) : _jsx(CourseSkeleton, Object.assign({}, CourseSkeletonProps)) }), index))) })) })));
+    return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: _jsx(Grid, Object.assign({ container: true, width: "100%", spacing: { xs: 3 }, className: classes.courses }, GridContainerComponentProps, { children: [...Array(coursesNumber)].map((_course, index) => (_jsx(Grid, Object.assign({ size: { md: 6, lg: 3 } }, GridItemComponentProps, { className: classes.item }, { children: teacherView ? _jsx(CourseCreatePlaceholder, {}) : _jsx(CourseSkeleton, Object.assign({}, CourseSkeletonProps)) }), index))) })) })));
 }

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

@@ -11,4 +11,4 @@ export interface CreateEventWidgetProps extends WidgetProps {
      */
     [p: string]: any;
 }
-export default function CreateEventWidget(inProps: CreateEventWidgetProps): JSX.Element;
+export default function CreateEventWidget(inProps: CreateEventWidgetProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1 +1 @@
-export default function CreateEventWidgetSkeleton(): JSX.Element;
+export default function CreateEventWidgetSkeleton(): import("react/jsx-runtime").JSX.Element;

package/lib/esm/components/CreateLiveStreamDialog/CreateLiveStreamDialog.js

@@ -100,5 +100,11 @@ export default function CreateLiveStreamDialog(inProps) {
     /**
      * Renders root object
      */
-    return (_jsx(Root, Object.assign({ DialogContentProps: { dividers: false }, maxWidth: "md", title: _jsxs(Box, Object.assign({ className: classes.title, component: "span" }, { children: [canShowBackButton && (_jsx(Button, Object.assign({ variant: "text", onClick: handleBack, startIcon: _jsx(Icon, { children: "arrow_back" }) }, { children: _jsx(FormattedMessage, { id: "ui.createLivestreamDialog.button.back", defaultMessage: "ui.createLivestreamDialog.button.back" }) }))), _jsx(Box, Object.assign({ component: "span" }, { children: _jsx(FormattedMessage, { id: "ui.createLivestreamDialog.title", defaultMessage: "ui.createLivestreamDialog.title" }) }))] })), fullWidth: true, open: open, scroll: "body", onClose: !canShowBackButton ? onClose : undefined, className: classNames(classes.root, className), TransitionComponent: Transition, PaperProps: { elevation: 0 } }, rest, { children: _jsxs(Box, Object.assign({ className: classes.content }, { children: [step === CreateLiveStreamStep.SELECT_TYPE && (_jsx(LiveStreamSelector, { liveSelected: liveType, onLiveSelected: handleLiveTypeSelected, onNext: handleLiveTypeSelectedNext })), step === CreateLiveStreamStep.CREATE_LIVE && (_jsx(_Fragment, { children: liveType === LiveStreamType.EVENT_LIVE ? (_jsx(EventForm, Object.assign({}, EventFormComponentProps, { EventAddressComponentProps: { locations: [SCEventLocationType.LIVESTREAM] }, onSuccess: handleSubmit }))) : (_jsx(LiveStreamForm, Object.assign({}, LiveStreamFormComponentProps, { onSuccess: handleSubmit }))) }))] })) })));
+    return (_jsx(Root, Object.assign({ DialogContentProps: { dividers: false }, maxWidth: "md", title: _jsxs(Box, Object.assign({ className: classes.title, component: "span" }, { children: [canShowBackButton && (_jsx(Button, Object.assign({ variant: "text", onClick: handleBack, startIcon: _jsx(Icon, { children: "arrow_back" }) }, { children: _jsx(FormattedMessage, { id: "ui.createLivestreamDialog.button.back", defaultMessage: "ui.createLivestreamDialog.button.back" }) }))), _jsx(Box, Object.assign({ component: "span" }, { children: _jsx(FormattedMessage, { id: "ui.createLivestreamDialog.title", defaultMessage: "ui.createLivestreamDialog.title" }) }))] })), fullWidth: true, open: open, scroll: "body", onClose: !canShowBackButton ? onClose : undefined, className: classNames(classes.root, className), slots: {
+            transition: Transition
+        }, slotProps: {
+            paper: {
+                elevation: 0
+            }
+        } }, rest, { children: _jsxs(Box, Object.assign({ className: classes.content }, { children: [step === CreateLiveStreamStep.SELECT_TYPE && (_jsx(LiveStreamSelector, { liveSelected: liveType, onLiveSelected: handleLiveTypeSelected, onNext: handleLiveTypeSelectedNext })), step === CreateLiveStreamStep.CREATE_LIVE && (_jsx(_Fragment, { children: liveType === LiveStreamType.EVENT_LIVE ? (_jsx(EventForm, Object.assign({}, EventFormComponentProps, { EventAddressComponentProps: { locations: [SCEventLocationType.LIVESTREAM] }, onSuccess: handleSubmit }))) : (_jsx(LiveStreamForm, Object.assign({}, LiveStreamFormComponentProps, { onSuccess: handleSubmit }))) }))] })) })));
 }

package/lib/esm/components/CreateLiveStreamDialog/LiveStreamSelector/LiveStreamSelector.js

@@ -10,7 +10,7 @@ import EventImage from '../../../assets/liveStream/event';
 import LiveImage from '../../../assets/liveStream/live';
 import { LiveStreamApiClient } from '@selfcommunity/api-services';
 import { WARNING_THRESHOLD_EXPIRING_SOON } from '../../LiveStreamRoom/constants';
-import { Link, SCPreferences, useSCContext, useSCPreferences, useSCUser } from '@selfcommunity/react-core';
+import { Link, SCPreferences, useSCPreferences, useSCUser } from '@selfcommunity/react-core';
 import { SCCommunityEnvironment, SCCommunitySubscriptionTier } from '@selfcommunity/types';
 import { HUB_PROD, HUB_STAGE } from '../../PlatformWidget/constants';
 export const PREFIX = 'SCLiveStreamSelector';
@@ -23,13 +23,13 @@ const classes = {
 const Root = styled(Container, {
     name: PREFIX,
     slot: 'Root'
-})(({ theme }) => ({}));
+})(() => ({}));
 // Styled components
 const OptionCard = styled(Paper, {
     name: PREFIX,
     slot: 'optionCardRoot',
     shouldForwardProp: (prop) => prop !== 'selected'
-})(({ theme, selected }) => ({
+})(() => ({
     '& h6': {
         fontWeight: 'bold',
         textTransform: 'uppercase'
@@ -38,7 +38,7 @@ const OptionCard = styled(Paper, {
 const FeatureItem = styled(Box, {
     name: PREFIX,
     slot: 'featureItemRoot'
-})(({ theme }) => ({}));
+})(() => ({}));
 /**
  *> API documentation for the Community-JS LiveStreamSelector component. Learn about the available props and the CSS API.
  *
@@ -66,7 +66,6 @@ export default function LiveStreamSelector(inProps) {
     });
     const { className, liveSelected, onLiveSelected, onNext } = props;
     // CONTEXT
-    const scContext = useSCContext();
     const scUserContext = useSCUser();
     const { enqueueSnackbar } = useSnackbar();
     // STATE
@@ -162,8 +161,6 @@ export default function LiveStreamSelector(inProps) {
         let _message;
         if (isFreeTrialTier && isCommunityOwner && !isEnterpriseTier) {
             _message = (_jsx(FormattedMessage, { id: "ui.liveStreamForm.selector.warningSubscriptionRequired", defaultMessage: "ui.liveStreamForm.selector.warningSubscriptionRequired", values: {
-                    // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                    // @ts-ignore
                     link: (...chunks) => (_jsx(Link, Object.assign({ target: "_blank", to: `${isStage ? HUB_STAGE : HUB_PROD}dashboard/community/${communityStackId}/subscription` }, { children: chunks })))
                 } }));
         }
@@ -186,6 +183,6 @@ export default function LiveStreamSelector(inProps) {
                             e.preventDefault();
                         }
                     } }, { children: [_jsxs(Box, { children: [_jsx(Typography, Object.assign({ variant: "h6" }, { children: option.title })), _jsx(Radio, { checked: selectedOption === option.type })] }), _jsx("img", { src: option.image, alt: "option-image" }), _jsx(Box, Object.assign({ component: "ul" }, { children: option.features.map((feature, featureIndex) => {
-                                return (_jsx(FeatureItem, Object.assign({ component: "li" }, { children: _jsx(Typography, Object.assign({ variant: "body2", color: "text.secondary", sx: { flex: 1 } }, { children: feature })) }), featureIndex));
+                                return (_jsx(FeatureItem, Object.assign({ as: "li" }, { children: _jsx(Typography, Object.assign({ variant: "body2", color: "text.secondary", sx: { flex: 1 } }, { children: feature })) }), featureIndex));
                             }) }))] }), index))) })), _jsx(Box, Object.assign({ className: classes.actions }, { children: _jsx(Button, Object.assign({ disabled: !selectedOption || !timeRemaining || isFreeTrialTier, variant: "contained", onClick: handleNext, color: "secondary" }, { children: _jsx(FormattedMessage, { id: "ui.liveStreamForm.selector.next", defaultMessage: "ui.liveStreamForm.selector.next" }) })) }))] })));
 }

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

@@ -7,4 +7,4 @@ export interface CreatePaymentProductFormProps extends BoxProps {
     onError?: (e: any) => void;
     onChange?: (p: any) => void;
 }
-export default function CreatePaymentProductForm(inProps: CreatePaymentProductFormProps): JSX.Element;
+export default function CreatePaymentProductForm(inProps: CreatePaymentProductFormProps): import("react/jsx-runtime").JSX.Element;

package/lib/esm/components/CreatePaymentProductForm/CreatePaymentProductForm.js

@@ -134,8 +134,10 @@ export default function CreatePaymentProductForm(inProps) {
         return null;
     }
     console.log(fieldsError);
-    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsx(Typography, Object.assign({ mb: 1 }, { children: _jsx(FormattedMessage, { id: "ui.createPaymentProductForm.title", defaultMessage: "ui.createPaymentProductForm.title" }) })), _jsx(TextField, Object.assign({ size: "small", id: "name", label: _jsx(FormattedMessage, { id: "ui.createPaymentProductForm.name", defaultMessage: "ui.createPaymentProductForm.name" }), variant: "outlined", fullWidth: true, value: name, error: Boolean(fieldsError && fieldsError.name) }, (Boolean(fieldsError && fieldsError.name) && { helperText: fieldsError.name }), { onChange: (e) => handleChange('name', e) })), _jsx(TextField, Object.assign({ size: "small", id: "description", label: _jsx(FormattedMessage, { id: "ui.createPaymentProductForm.description", defaultMessage: "ui.createPaymentProductForm.description" }), variant: "outlined", fullWidth: true, value: description, onChange: (e) => handleChange('description', e), multiline: true, maxRows: 2, error: Boolean(fieldsError && fieldsError.description) }, (Boolean(fieldsError && fieldsError.description) && { helperText: fieldsError.description }))), _jsx(TextField, { label: _jsx(FormattedMessage, { id: "ui.createPaymentProductForm.price", defaultMessage: "ui.createPaymentProductForm.price" }), variant: "outlined", value: unitAmount, onChange: (e) => handleChange('unitAmount', e), name: "unitAmount", id: "unitAmount", helperText: fieldsError && fieldsError.unitAmount ? (_jsx(_Fragment, { children: fieldsError.unitAmount })) : (_jsx(_Fragment, { children: intl.formatMessage({ id: 'ui.createPaymentProductForm.minPrice', defaultMessage: 'ui.createPaymentProductForm.minPrice' }, { min: DEFAULT_MIN_PRICE }) })), InputProps: {
-                    startAdornment: _jsx(InputAdornment, Object.assign({ position: "start" }, { children: "\u20AC" })),
-                    inputComponent: NumericFormatCustom
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsx(Typography, Object.assign({ mb: 1 }, { children: _jsx(FormattedMessage, { id: "ui.createPaymentProductForm.title", defaultMessage: "ui.createPaymentProductForm.title" }) })), _jsx(TextField, Object.assign({ size: "small", id: "name", label: _jsx(FormattedMessage, { id: "ui.createPaymentProductForm.name", defaultMessage: "ui.createPaymentProductForm.name" }), variant: "outlined", fullWidth: true, value: name, error: Boolean(fieldsError && fieldsError.name) }, (Boolean(fieldsError && fieldsError.name) && { helperText: fieldsError.name }), { onChange: (e) => handleChange('name', e) })), _jsx(TextField, Object.assign({ size: "small", id: "description", label: _jsx(FormattedMessage, { id: "ui.createPaymentProductForm.description", defaultMessage: "ui.createPaymentProductForm.description" }), variant: "outlined", fullWidth: true, value: description, onChange: (e) => handleChange('description', e), multiline: true, maxRows: 2, error: Boolean(fieldsError && fieldsError.description) }, (Boolean(fieldsError && fieldsError.description) && { helperText: fieldsError.description }))), _jsx(TextField, { label: _jsx(FormattedMessage, { id: "ui.createPaymentProductForm.price", defaultMessage: "ui.createPaymentProductForm.price" }), variant: "outlined", value: unitAmount, onChange: (e) => handleChange('unitAmount', e), name: "unitAmount", id: "unitAmount", helperText: fieldsError && fieldsError.unitAmount ? (_jsx(_Fragment, { children: fieldsError.unitAmount })) : (_jsx(_Fragment, { children: intl.formatMessage({ id: 'ui.createPaymentProductForm.minPrice', defaultMessage: 'ui.createPaymentProductForm.minPrice' }, { min: DEFAULT_MIN_PRICE }) })), slotProps: {
+                    input: {
+                        startAdornment: _jsx(InputAdornment, Object.assign({ position: "start" }, { children: "\u20AC" })),
+                        inputComponent: NumericFormatCustom
+                    }
                 }, fullWidth: true, error: Boolean(fieldsError && fieldsError.unitAmount) }), error && (_jsx(Typography, Object.assign({ component: "div", className: classes.error, variant: "body2" }, { children: error }))), _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "flex-end", alignItems: "flex-end", spacing: 1 }, { children: [onCancel && (_jsx(Button, Object.assign({ variant: "text", size: "small", color: "inherit", onClick: onCancel }, { children: _jsx(FormattedMessage, { id: "ui.createPaymentProductForm.btn.cancel", defaultMessage: "ui.createPaymentProductForm.btn.cancel" }) }))), _jsx(LoadingButton, Object.assign({ loading: loading, variant: "contained", size: "small", color: "error", onClick: handleCreateProduct }, { children: _jsx(FormattedMessage, { id: "ui.createPaymentProductForm.btn.create", defaultMessage: "ui.createPaymentProductForm.btn.create" }) }))] }))] })));
 }

package/lib/esm/components/EditCourse/Customize.d.ts

@@ -4,6 +4,6 @@ interface CustomizeProps {
     course: SCCourseType;
     setCourse: (course: SCCourseType) => void;
 }
-declare function Customize(props: CustomizeProps): JSX.Element;
+declare function Customize(props: CustomizeProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof Customize>;
 export default _default;

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

@@ -10,4 +10,4 @@ export interface EditCourseProps {
     className?: HTMLAttributes<HTMLDivElement>['className'];
     [p: string]: any;
 }
-export default function EditCourse(inProps: EditCourseProps): JSX.Element;
+export default function EditCourse(inProps: EditCourseProps): import("react/jsx-runtime").JSX.Element;

package/lib/esm/components/EditCourse/EditCourse.js

@@ -103,5 +103,5 @@ export default function EditCourse(inProps) {
     if (!scCourse) {
         return _jsx(EditCourseSkeleton, { tab: tab });
     }
-    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsxs(Stack, Object.assign({ className: classes.header }, { children: [_jsx(IconButton, Object.assign({ href: scRoutingContext.url(SCRoutes.COURSE_DASHBOARD_ROUTE_NAME, scCourse), size: "small" }, { children: _jsx(Icon, Object.assign({ className: classes.contrastColor }, { children: "arrow_back" })) })), _jsx(Typography, Object.assign({ variant: "h5", className: classes.contrastColor }, { children: scCourse.name }))] })), _jsxs(TabContext, Object.assign({ value: tabValue }, { children: [_jsx(TabList, Object.assign({ className: classes.tabList, onChange: handleTabChange, textColor: "primary", indicatorColor: "primary", variant: isMobile ? 'scrollable' : 'standard', scrollButtons: isMobile, centered: !isMobile }, { children: TAB_DATA.map((data, i) => (_jsx(Tab, { label: _jsx(Typography, Object.assign({ variant: "h6" }, { children: _jsx(FormattedMessage, { id: data.label, defaultMessage: data.label }) })), value: data.value, className: classNames(classes.tab, classes.contrastColor) }, i))) })), panelData.map((data, i) => (_jsx(TabPanel, Object.assign({ className: classes.tabPanel, value: data.value }, { children: data.children }), i)))] }))] })));
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { children: [_jsxs(Stack, Object.assign({ className: classes.header }, { children: [_jsx(IconButton, Object.assign({ href: scRoutingContext.url(SCRoutes.COURSE_DASHBOARD_ROUTE_NAME, scCourse), size: "small" }, { children: _jsx(Icon, Object.assign({ className: classes.contrastColor }, { children: "arrow_back" })) })), _jsx(Typography, Object.assign({ variant: "h5", className: classes.contrastColor }, { children: scCourse.name }))] })), _jsxs(TabContext, Object.assign({ value: tabValue }, { children: [_jsx(TabList, Object.assign({ className: classes.tabList, onChange: handleTabChange, textColor: "primary", indicatorColor: "primary", variant: isMobile ? 'scrollable' : 'standard', scrollButtons: isMobile, centered: !isMobile }, { children: TAB_DATA.map((data, i) => (_jsx(Tab, { label: _jsx(Typography, Object.assign({ variant: "h6" }, { children: _jsx(FormattedMessage, { id: data.label, defaultMessage: data.label }) })), value: data.value, className: classNames(classes.tab, classes.contrastColor) }, i))) })), panelData.map((data, i) => (_jsx(TabPanel, Object.assign({ sx: { className: classes.tabPanel }, value: data.value }, { children: data.children }), i)))] }))] })));
 }

package/lib/esm/components/EditCourse/Lessons/AddButton.d.ts

@@ -4,6 +4,6 @@ interface AddButtonProps extends ButtonProps {
     label: string;
     handleAddRow: () => void;
 }
-declare function AddButton(props: AddButtonProps): JSX.Element;
+declare function AddButton(props: AddButtonProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof AddButton>;
 export default _default;

package/lib/esm/components/EditCourse/Lessons/ChangeLessonStatus.d.ts

@@ -8,6 +8,6 @@ interface ChangeLessonStatusProps {
     onChange: (lesson: SCCourseLessonType, type: ActionLessonType) => void;
     disabled?: boolean;
 }
-declare function ChangeLessonStatus(props: ChangeLessonStatusProps): JSX.Element;
+declare function ChangeLessonStatus(props: ChangeLessonStatusProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof ChangeLessonStatus>;
 export default _default;

package/lib/esm/components/EditCourse/Lessons/FieldName.d.ts

@@ -10,6 +10,6 @@ interface FieldNameProps<T> {
     editMode: boolean;
     handleDisableEditMode: () => void;
 }
-declare function FieldName<T extends SCCourseSectionType>(props: FieldNameProps<T>): JSX.Element;
+declare function FieldName<T extends SCCourseSectionType>(props: FieldNameProps<T>): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof FieldName>;
 export default _default;

package/lib/esm/components/EditCourse/Lessons/Skeleton.d.ts

@@ -1 +1 @@
-export default function LessonsSkeleton(): JSX.Element;
+export default function LessonsSkeleton(): import("react/jsx-runtime").JSX.Element;

package/lib/esm/components/EditCourse/Lessons.d.ts

@@ -6,6 +6,6 @@ interface LessonsProps {
     setCourse: (course: SCCourseType) => void;
     handleTabChange: (_e: SyntheticEvent, newTabValue: SCCourseEditTabType) => void;
 }
-declare function Lessons(props: LessonsProps): JSX.Element;
+declare function Lessons(props: LessonsProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof Lessons>;
 export default _default;

package/lib/esm/components/EditCourse/MenuRow.d.ts

@@ -4,6 +4,6 @@ interface MenuRowProps extends PropsWithChildren {
     buttonClassName?: HTMLAttributes<HTMLButtonElement>['className'];
     disabled?: boolean;
 }
-declare function MenuRow(props: MenuRowProps): JSX.Element;
+declare function MenuRow(props: MenuRowProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof MenuRow>;
 export default _default;

package/lib/esm/components/EditCourse/Options/Skeleton.d.ts

@@ -1 +1 @@
-export default function OptionsSkeleton(): JSX.Element;
+export default function OptionsSkeleton(): import("react/jsx-runtime").JSX.Element;

package/lib/esm/components/EditCourse/Options/SwitchForm.d.ts

@@ -6,6 +6,6 @@ interface SwitchFormProps {
     checked: boolean;
     handleChangeOptions: (key: string, value: boolean) => void;
 }
-declare function SwitchForm(props: SwitchFormProps): JSX.Element;
+declare function SwitchForm(props: SwitchFormProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof SwitchForm>;
 export default _default;

package/lib/esm/components/EditCourse/Options.d.ts

@@ -4,6 +4,6 @@ interface OptionsProps {
     course: SCCourseType;
     setCourse: (course: SCCourseType) => void;
 }
-declare function Options(props: OptionsProps): JSX.Element;
+declare function Options(props: OptionsProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof Options>;
 export default _default;

package/lib/esm/components/EditCourse/Requests.d.ts

@@ -7,6 +7,6 @@ interface RequestsProps {
     endpointQueryParams?: BaseGetParams;
     handleTabChange: (_e: SyntheticEvent, newTabValue: SCCourseEditTabType) => void;
 }
-declare function Requests(props: RequestsProps): JSX.Element;
+declare function Requests(props: RequestsProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof Requests>;
 export default _default;

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

@@ -3,6 +3,6 @@ import { SCCourseEditTabType } from '../../types';
 interface EditCourseSkeletonProps {
     tab?: SCCourseEditTabType;
 }
-declare function EditCourseSkeleton(props: EditCourseSkeletonProps): JSX.Element;
+declare function EditCourseSkeleton(props: EditCourseSkeletonProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof EditCourseSkeleton>;
 export default _default;

package/lib/esm/components/EditCourse/Status.d.ts

@@ -5,5 +5,5 @@ interface StatusProps {
     course: SCCourseType;
     handleTabChange: (_e: SyntheticEvent, newTabValue: SCCourseEditTabType) => void;
 }
-export default function Status(props: StatusProps): JSX.Element;
+export default function Status(props: StatusProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/esm/components/EditCourse/Users/Skeleton.d.ts

@@ -1 +1 @@
-export default function UsersSkeleton(): JSX.Element;
+export default function UsersSkeleton(): import("react/jsx-runtime").JSX.Element;

package/lib/esm/components/EditCourse/Users.d.ts

@@ -6,6 +6,6 @@ interface UsersProps {
     endpointQueryParams?: Record<string, string | number>;
     handleTabChange: (_e: SyntheticEvent, newTabValue: SCCourseEditTabType) => void;
 }
-declare function Users(props: UsersProps): JSX.Element;
+declare function Users(props: UsersProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof Users>;
 export default _default;

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

@@ -2,7 +2,7 @@ import React from 'react';
 import { ToolbarPluginProps } from './plugins/ToolbarPlugin';
 import { MediaPluginProps } from './plugins';
 import { SCMediaType } from '@selfcommunity/types';
-export declare type EditorRef = {
+export type EditorRef = {
     focus: () => void;
 };
 export interface EditorProps {

package/lib/esm/components/Editor/Editor.js

@@ -34,7 +34,7 @@ const Root = styled(Box, {
     overridesResolver: (props, styles) => {
         return [styles.root, props.className.includes(classes.toolbar) && styles.toolbar];
     }
-})(({ theme }) => ({}));
+})(() => ({}));
 const editorTheme = {
     heading: {
         h1: `${PREFIX}-h1`,
@@ -104,7 +104,7 @@ const Editor = (inProps, ref) => {
         name: PREFIX
     });
     const { id = 'editor', className = null, defaultValue = '', toolbar = false, uploadImage = false, uploadFile = false, editable = true, onChange = null, onMediaChange = null, onFocus = null, onBlur = null, action = null, ToolBarProps = {}, MediaPluginProps = {}, placeholder = _jsx(FormattedMessage, { id: "ui.editor.placeholder", defaultMessage: "ui.editor.placeholder" }), isLessonCommentEditor = false } = props;
-    const apiRef = useRef();
+    const apiRef = useRef(null);
     // STATE
     const [focused, setFocused] = useState(false);
     // HANDLERS
@@ -114,7 +114,7 @@ const Editor = (inProps, ref) => {
     const handleMediaChange = (media) => {
         onMediaChange && onMediaChange(media);
     };
-    const handleError = (error, editor) => {
+    const handleError = (error) => {
         console.log(error);
     };
     const handleFocus = () => {

package/lib/esm/components/Editor/nodes/HashtagNode.d.ts

@@ -1,7 +1,7 @@
 import { DOMExportOutput, EditorConfig, LexicalNode, NodeKey, SerializedTextNode, Spread, TextNode } from 'lexical';
 import { SCCategoryType } from '@selfcommunity/types';
 import { DOMConversionMap } from 'lexical/LexicalNode';
-export declare type SerializedHashtagNode = Spread<{
+export type SerializedHashtagNode = Spread<{
     category: SCCategoryType;
     type: 'hashtag';
     version: 1;

package/lib/esm/components/Editor/nodes/HashtagNode.js

@@ -9,16 +9,16 @@ function convertHashtagElement(domNode) {
     };
 }
 export class HashtagNode extends TextNode {
-    constructor(category, text, key) {
-        super(text !== null && text !== void 0 ? text : `#${category.name}`, key);
-        this.__category = category;
-    }
     static getType() {
         return 'hashtag';
     }
     static clone(node) {
         return new HashtagNode(node.__category, node.__text, node.__key);
     }
+    constructor(category, text, key) {
+        super(text !== null && text !== void 0 ? text : `#${category.name}`, key);
+        this.__category = category;
+    }
     createDOM(config) {
         const tag = 'hashtag';
         const dom = document.createElement(tag);

package/lib/esm/components/Editor/nodes/ImageNode.d.ts

@@ -12,7 +12,7 @@ export interface ImagePayload {
 declare function convertImageElement(domNode: any): {
     node: ImageNode;
 };
-export declare type SerializedImageNode = Spread<{
+export type SerializedImageNode = Spread<{
     altText: string;
     maxWidth: number | string;
     src: string;

package/lib/esm/components/Editor/nodes/ImageNode.js

@@ -104,18 +104,18 @@ function convertImageElement(domNode) {
 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
 // @ts-ignore
 export class ImageNode extends DecoratorNode {
-    constructor(src, altText, maxWidth, key) {
-        super(key);
-        this.__src = src;
-        this.__altText = altText;
-        this.__maxWidth = maxWidth;
-    }
     static getType() {
         return 'image';
     }
     static clone(node) {
         return new ImageNode(node.__src, node.__altText, node.__maxWidth, node.__key);
     }
+    constructor(src, altText, maxWidth, key) {
+        super(key);
+        this.__src = src;
+        this.__altText = altText;
+        this.__maxWidth = maxWidth;
+    }
     setWidthAndHeight(width, height) {
         const writable = this.getWritable();
         // eslint-disable-next-line @typescript-eslint/ban-ts-ignore

package/lib/esm/components/Editor/nodes/MentionNode.d.ts

@@ -1,7 +1,7 @@
 import { DOMExportOutput, EditorConfig, LexicalNode, NodeKey, SerializedTextNode, Spread, TextNode } from 'lexical';
 import { SCUserType } from '@selfcommunity/types';
 import { DOMConversionMap } from 'lexical/LexicalNode';
-export declare type SerializedMentionNode = Spread<{
+export type SerializedMentionNode = Spread<{
     user: SCUserType;
     type: 'mention';
     version: 1;

package/lib/esm/components/Editor/nodes/MentionNode.js

@@ -22,16 +22,16 @@ function convertMentionElement(domNode) {
     };
 }
 export class MentionNode extends TextNode {
-    constructor(user, text, key) {
-        super(text !== null && text !== void 0 ? text : `@${user.username}`, key);
-        this.__user = user;
-    }
     static getType() {
         return 'mention';
     }
     static clone(node) {
         return new MentionNode(node.__user, node.__text, node.__key);
     }
+    constructor(user, text, key) {
+        super(text !== null && text !== void 0 ? text : `@${user.username}`, key);
+        this.__user = user;
+    }
     createDOM(config) {
         const tag = 'mention';
         const dom = document.createElement(tag);

package/lib/esm/components/Editor/plugins/ApiPlugin.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-export declare type ApiRef = {
+export type ApiRef = {
     focus: () => void;
 };
-declare const _default: React.ForwardRefExoticComponent<Pick<any, string | number | symbol> & React.RefAttributes<ApiRef>>;
+declare const _default: React.ForwardRefExoticComponent<Omit<any, "ref"> & React.RefAttributes<ApiRef>>;
 export default _default;

package/lib/esm/components/Editor/plugins/EmojiPlugin.js

@@ -14,14 +14,16 @@ function Emoji({ editor, className = '', isLessonCommentEditor = false }) {
     const handleOpen = (event) => {
         setEmojiAnchorEl(event.currentTarget);
     };
-    const handleEmojiClick = (emojiData, event) => {
+    const handleEmojiClick = (emojiData) => {
         editor.focus();
         editor.dispatchCommand(CONTROLLED_TEXT_INSERTION_COMMAND, emojiData.emoji);
     };
     if (isMobile) {
         return null;
     }
-    return (_jsxs(_Fragment, { children: [_jsx(IconButton, Object.assign({ className: className, onClick: handleOpen }, { children: _jsx(Icon, { children: "sentiment_satisfied_alt" }) })), _jsx(Popover, Object.assign({ open: Boolean(emojiAnchorEl), anchorEl: emojiAnchorEl, onClose: () => setEmojiAnchorEl(null), TransitionComponent: Fade, anchorOrigin: isLessonCommentEditor ? { vertical: 'bottom', horizontal: 'left' } : { vertical: 'top', horizontal: 'right' }, transformOrigin: isLessonCommentEditor ? { vertical: 'top', horizontal: 'right' } : { vertical: 'bottom', horizontal: 'left' }, sx: (theme) => {
+    return (_jsxs(_Fragment, { children: [_jsx(IconButton, Object.assign({ className: className, onClick: handleOpen }, { children: _jsx(Icon, { children: "sentiment_satisfied_alt" }) })), _jsx(Popover, Object.assign({ open: Boolean(emojiAnchorEl), anchorEl: emojiAnchorEl, onClose: () => setEmojiAnchorEl(null), slots: {
+                    transition: Fade
+                }, anchorOrigin: isLessonCommentEditor ? { vertical: 'bottom', horizontal: 'left' } : { vertical: 'top', horizontal: 'right' }, transformOrigin: isLessonCommentEditor ? { vertical: 'top', horizontal: 'right' } : { vertical: 'bottom', horizontal: 'left' }, sx: (theme) => {
                     return { zIndex: theme.zIndex.tooltip };
                 } }, { children: _jsx(EmojiPicker, { onEmojiClick: handleEmojiClick }) }))] }));
 }

package/lib/esm/components/Editor/plugins/FloatingLinkPlugin.js

@@ -93,10 +93,12 @@ function FloatingLinkPlugin({ editor, isLink, setIsLink }) {
     }
     return (_jsx(Root, Object.assign({ className: classes.root, open: Boolean(anchorEl), anchorEl: anchorEl, placement: "right" }, { children: _jsx(Paper, { children: _jsx(TextField, { size: "small", value: linkUrl, variant: "outlined", onChange: (event) => {
                     setLinkUrl(event.target.value);
-                }, InputProps: {
-                    endAdornment: (_jsxs(InputAdornment, Object.assign({ position: "end" }, { children: [_jsx(IconButton, Object.assign({ size: "small", tabIndex: 0, onClick: () => {
-                                    setIsLink(false);
-                                } }, { children: _jsx(Icon, { children: "close" }) })), _jsx(IconButton, Object.assign({ size: "small", tabIndex: 1, onClick: handleLinkSubmission }, { children: _jsx(Icon, { children: "check" }) }))] })))
+                }, slotProps: {
+                    input: {
+                        endAdornment: (_jsxs(InputAdornment, Object.assign({ position: "end" }, { children: [_jsx(IconButton, Object.assign({ size: "small", tabIndex: 0, onClick: () => {
+                                        setIsLink(false);
+                                    } }, { children: _jsx(Icon, { children: "close" }) })), _jsx(IconButton, Object.assign({ size: "small", tabIndex: 1, onClick: handleLinkSubmission }, { children: _jsx(Icon, { children: "check" }) }))] })))
+                    }
                 } }) }) })));
 }
 function useFloatingLinkEditorToolbar(editor) {

package/lib/esm/components/Editor/plugins/MediaPlugin.d.ts

@@ -11,4 +11,4 @@ export interface MediaPluginProps {
     onMediaAdd?: (media: SCMediaType) => void | null;
     isUploading?: (boolean: any) => void;
 }
-export default function MediaPlugin(props: MediaPluginProps): JSX.Element;
+export default function MediaPlugin(props: MediaPluginProps): import("react/jsx-runtime").JSX.Element;