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

package/lib/cjs/components/EditCourse/Lessons.js

@@ -38,7 +38,8 @@ const classes = {
     cellAlignCenter: `${constants_1.PREFIX}-cell-align-center`,
     lessonEmptyStatus: `${constants_1.PREFIX}-lesson-empty-status`,
     emptyStatusButton: `${constants_1.PREFIX}-empty-status-button`,
-    contrastColor: `${constants_1.PREFIX}-contrast-color`
+    defaultContrastColor: `${constants_1.PREFIX}-default-contrast-color`,
+    paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`
 };
 function Lessons(props) {
     // PROPS
@@ -187,10 +188,10 @@ function Lessons(props) {
         }
         handleOpenDialog(null);
     }, [dialog, handleOpenDialog]);
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.lessonTitle, classes.contrastColor), variant: "h4" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons", defaultMessage: "ui.editCourse.tab.lessons" }) })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.lessonInfoWrapper }, { children: [(0, jsx_runtime_1.jsx)(CourseTypePopover_1.default, { course: course }), (0, jsx_runtime_1.jsx)(Status_1.default, { course: course, handleTabChange: handleTabChange })] })), sections.length === 0 && ((0, jsx_runtime_1.jsx)(EmptyStatus_1.default, { icon: "courses", title: "ui.editCourse.tab.lessons.table.empty.title", description: "ui.editCourse.tab.lessons.table.empty.description", actions: (0, jsx_runtime_1.jsx)(AddButton_1.default, { className: classes.emptyStatusButton, label: "ui.editCourse.tab.lessons.table.section", handleAddRow: handleAddTempSection, color: "inherit", variant: "outlined" }), className: classes.lessonEmptyStatus })), sections.length > 0 && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.lessonsInnerWrapper }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.lessonsSectionsWrapper }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.lessonsSections }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.table.sections.title", defaultMessage: "ui.course.table.sections.title", values: {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.lessonTitle, classes.defaultContrastColor), variant: "h4" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons", defaultMessage: "ui.editCourse.tab.lessons" }) })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.lessonInfoWrapper }, { children: [(0, jsx_runtime_1.jsx)(CourseTypePopover_1.default, { course: course }), (0, jsx_runtime_1.jsx)(Status_1.default, { course: course, handleTabChange: handleTabChange })] })), sections.length === 0 && ((0, jsx_runtime_1.jsx)(EmptyStatus_1.default, { icon: "courses", title: "ui.editCourse.tab.lessons.table.empty.title", description: "ui.editCourse.tab.lessons.table.empty.description", actions: (0, jsx_runtime_1.jsx)(AddButton_1.default, { className: classes.emptyStatusButton, label: "ui.editCourse.tab.lessons.table.section", handleAddRow: handleAddTempSection, color: "inherit", variant: "outlined" }), className: classes.lessonEmptyStatus })), sections.length > 0 && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.lessonsInnerWrapper }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.lessonsSectionsWrapper }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.lessonsSections }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.table.sections.title", defaultMessage: "ui.course.table.sections.title", values: {
                                                 sectionsNumber: course.num_sections
-                                            } }) })), (0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.circle }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.table.lessons.title", defaultMessage: "ui.course.table.lessons.title", values: {
+                                            } }) })), (0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.circle }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.table.lessons.title", defaultMessage: "ui.course.table.lessons.title", values: {
                                                 lessonsNumber: course.num_lessons
-                                            } }) }))] })), (0, jsx_runtime_1.jsx)(AddButton_1.default, { label: "ui.editCourse.tab.lessons.table.section", handleAddRow: handleAddTempSection, color: "primary", variant: "contained", disabled: isDisabled })] })), (0, jsx_runtime_1.jsx)(dnd_1.DragDropContext, Object.assign({ onDragEnd: handleDragEnd }, { children: (0, jsx_runtime_1.jsx)(material_1.TableContainer, Object.assign({ className: classes.tableContainer }, { children: (0, jsx_runtime_1.jsxs)(material_1.Table, Object.assign({ className: classes.table }, { children: [(0, jsx_runtime_1.jsx)(material_1.TableHead, Object.assign({ className: classes.tableHeader }, { children: (0, jsx_runtime_1.jsxs)(material_1.TableRow, { children: [(0, jsx_runtime_1.jsx)(material_1.TableCell, { className: classes.cellWidth }), headerCells.map((cell, i) => ((0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ className: cell.className }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.tableHeaderTypography, classes.contrastColor), variant: "overline" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: cell.id, defaultMessage: cell.id }) })) }), i)))] }) })), (0, jsx_runtime_1.jsx)(dnd_1.Droppable, Object.assign({ droppableId: "droppable-1" }, { children: (outerProvider) => ((0, jsx_runtime_1.jsxs)(material_1.TableBody, Object.assign({ ref: outerProvider.innerRef }, outerProvider.droppableProps, { className: classes.tableBody }, { children: [sections.map((section, i, array) => ((0, jsx_runtime_1.jsx)(dnd_1.Draggable, Object.assign({ draggableId: i.toString(), index: i, isDragDisabled: isDisabled }, { children: (innerProvider) => ((0, jsx_runtime_1.jsx)(SectionRow_1.default, { course: course, provider: innerProvider, section: section, isNewRow: isNewRow && i + 1 === array.length, handleManageSection: handleManageSection, handleOpenDialog: handleOpenDialog, ref: ref }, i)) }), i))), outerProvider.placeholder] }))) }))] })) })) })), dialog && (0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: true, onClose: () => handleOpenDialog(null), onConfirm: handleDeleteRow })] })))] }));
+                                            } }) }))] })), (0, jsx_runtime_1.jsx)(AddButton_1.default, { label: "ui.editCourse.tab.lessons.table.section", handleAddRow: handleAddTempSection, color: "primary", variant: "contained", disabled: isDisabled })] })), (0, jsx_runtime_1.jsx)(dnd_1.DragDropContext, Object.assign({ onDragEnd: handleDragEnd }, { children: (0, jsx_runtime_1.jsx)(material_1.TableContainer, Object.assign({ className: classes.tableContainer }, { children: (0, jsx_runtime_1.jsxs)(material_1.Table, Object.assign({ className: classes.table }, { children: [(0, jsx_runtime_1.jsx)(material_1.TableHead, Object.assign({ className: classes.tableHeader }, { children: (0, jsx_runtime_1.jsxs)(material_1.TableRow, { children: [(0, jsx_runtime_1.jsx)(material_1.TableCell, { className: classes.cellWidth }), headerCells.map((cell, i) => ((0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ className: cell.className }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.tableHeaderTypography, classes.paperContrastColor), variant: "overline" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: cell.id, defaultMessage: cell.id }) })) }), i)))] }) })), (0, jsx_runtime_1.jsx)(dnd_1.Droppable, Object.assign({ droppableId: "droppable-1" }, { children: (outerProvider) => ((0, jsx_runtime_1.jsxs)(material_1.TableBody, Object.assign({ ref: outerProvider.innerRef }, outerProvider.droppableProps, { className: classes.tableBody }, { children: [sections.map((section, i, array) => ((0, jsx_runtime_1.jsx)(dnd_1.Draggable, Object.assign({ draggableId: i.toString(), index: i, isDragDisabled: isDisabled }, { children: (innerProvider) => ((0, jsx_runtime_1.jsx)(SectionRow_1.default, { course: course, provider: innerProvider, section: section, isNewRow: isNewRow && i + 1 === array.length, handleManageSection: handleManageSection, handleOpenDialog: handleOpenDialog, ref: ref }, i)) }), i))), outerProvider.placeholder] }))) }))] })) })) })), dialog && (0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: true, onClose: () => handleOpenDialog(null), onConfirm: handleDeleteRow })] })))] }));
 }
 exports.default = (0, react_1.memo)(Lessons);

package/lib/cjs/components/EditCourse/Options/SwitchForm.js

@@ -6,7 +6,7 @@ const react_1 = require("react");
 const react_intl_1 = require("react-intl");
 const constants_1 = require("../constants");
 const classes = {
-    contrastColor: `${constants_1.PREFIX}-contrast-color`
+    paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`
 };
 function SwitchForm(props) {
     // PROPS
@@ -19,6 +19,6 @@ function SwitchForm(props) {
         setValue(_checked);
         handleChangeOptions(name, _checked);
     }, [setValue]);
-    return ((0, jsx_runtime_1.jsxs)(material_1.FormControl, Object.assign({ component: "fieldset", variant: "standard" }, { children: [(0, jsx_runtime_1.jsx)(material_1.FormLabel, Object.assign({ component: "legend" }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: title, defaultMessage: title }) })) })), (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(material_1.Switch, { color: "primary", checked: value, name: name, onChange: handleChange }), label: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: description, defaultMessage: description }) })) })] })));
+    return ((0, jsx_runtime_1.jsxs)(material_1.FormControl, Object.assign({ component: "fieldset", variant: "standard" }, { children: [(0, jsx_runtime_1.jsx)(material_1.FormLabel, Object.assign({ component: "legend" }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: title, defaultMessage: title }) })) })), (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(material_1.Switch, { color: "primary", checked: value, name: name, onChange: handleChange }), label: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: description, defaultMessage: description }) })) })] })));
 }
 exports.default = (0, react_1.memo)(SwitchForm);

package/lib/cjs/components/EditCourse/Options.js

@@ -17,7 +17,7 @@ const classes = {
     optionsWrapper: `${constants_1.PREFIX}-options-wrapper`,
     optionsDivider: `${constants_1.PREFIX}-options-divider`,
     optionsButtonWrapper: `${constants_1.PREFIX}-options-button-wrapper`,
-    contrastColor: `${constants_1.PREFIX}-contrast-color`
+    paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`
 };
 const OPTIONS = {
     enforce_lessons_order: {
@@ -91,6 +91,6 @@ function Options(props) {
             });
         });
     }, [course, tempOptions, setCanSave, setLoading]);
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.optionsContainer }, { children: [(0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.optionsWrapper }, { children: Object.entries(OPTIONS).map(([key, value], i) => ((0, jsx_runtime_1.jsx)(SwitchForm_1.default, { name: key, title: value.title, description: value.description, checked: course[key], handleChangeOptions: handleChange }, i))) })), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.optionsButtonWrapper }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "contained", disabled: !canSave, onClick: handleSubmit, loading: loading }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.options.button.save", defaultMessage: "ui.editCourse.tab.options.button.save" }) })) })) }))] })));
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.optionsContainer }, { children: [(0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.optionsWrapper }, { children: Object.entries(OPTIONS).map(([key, value], i) => ((0, jsx_runtime_1.jsx)(SwitchForm_1.default, { name: key, title: value.title, description: value.description, checked: course[key], handleChangeOptions: handleChange }, i))) })), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.optionsButtonWrapper }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "contained", disabled: !canSave, onClick: handleSubmit, loading: loading }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.options.button.save", defaultMessage: "ui.editCourse.tab.options.button.save" }) })) })) }))] })));
 }
 exports.default = (0, react_1.memo)(Options);

package/lib/cjs/components/EditCourse/Status.js

@@ -1,17 +1,15 @@
 "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 react_intl_1 = require("react-intl");
 const constants_1 = require("./constants");
 const types_1 = require("@selfcommunity/types");
-const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const react_1 = require("react");
 const types_2 = require("../../types");
 const classes = {
     status: `${constants_1.PREFIX}-status`,
-    contrastColor: `${constants_1.PREFIX}-contrast-color`
+    defaultContrastColor: `${constants_1.PREFIX}-default-contrast-color`
 };
 function Status(props) {
     // STATES
@@ -22,12 +20,12 @@ function Status(props) {
     const handleClick = (0, react_1.useCallback)(() => {
         handleTabChange(null, types_2.SCCourseEditTabType.CUSTOMIZE);
     }, [handleTabChange]);
-    return ((0, jsx_runtime_1.jsx)(material_1.Chip, { label: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "text", color: "inherit", onClick: handleClick }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: intl.formatMessage({ id: 'ui.editCourse.tab.lessons.status', defaultMessage: 'ui.editCourse.tab.lessons.status' }, {
+    return ((0, jsx_runtime_1.jsx)(material_1.Chip, { label: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "text", color: "inherit", onClick: handleClick }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.defaultContrastColor }, { children: intl.formatMessage({ id: 'ui.editCourse.tab.lessons.status', defaultMessage: 'ui.editCourse.tab.lessons.status' }, {
                     status: intl.formatMessage({
                         id: `ui.course.privacy.${course.privacy === types_1.SCCoursePrivacyType.DRAFT ? 'draft' : course.privacy}`,
                         defaultMessage: `ui.course.privacy.${course.privacy === types_1.SCCoursePrivacyType.DRAFT ? 'draft' : course.privacy}`
                     }),
                     b: (chunks) => ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "b", fontWeight: "bold" }, { children: chunks }), "ui.editCourse.tab.lessons.status.b"))
-                }) })) })), className: (0, classnames_1.default)(classes.status, classes.contrastColor) }));
+                }) })) })), className: classes.status }));
 }
 exports.default = Status;

package/lib/cjs/components/EditCourse/Users.js

@@ -22,7 +22,7 @@ const PubSub_1 = require("../../constants/PubSub");
 const course_1 = require("../../types/course");
 const classes = {
     usersStatusWrapper: `${constants_1.PREFIX}-users-status-wrapper`,
-    contrastColor: `${constants_1.PREFIX}-contrast-color`
+    defaultContrastColor: `${constants_1.PREFIX}-default-contrast-color`
 };
 const headerCells = [
     {
@@ -127,7 +127,7 @@ function Users(props) {
             });
         });
     }, [course, dispatch]);
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.users.title", defaultMessage: "ui.editCourse.tab.users.title", values: { usersNumber: state.count } }) })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.usersStatusWrapper }, { children: [(0, jsx_runtime_1.jsx)(Status_1.default, { course: course, handleTabChange: handleTabChange }), (0, jsx_runtime_1.jsx)(AddUsersButton_1.default, { label: "ui.editCourse.tab.users.addUsersButton.label", endpoint: {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: classes.defaultContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.users.title", defaultMessage: "ui.editCourse.tab.users.title", values: { usersNumber: state.count } }) })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.usersStatusWrapper }, { children: [(0, jsx_runtime_1.jsx)(Status_1.default, { course: course, handleTabChange: handleTabChange }), (0, jsx_runtime_1.jsx)(AddUsersButton_1.default, { label: "ui.editCourse.tab.users.addUsersButton.label", endpoint: {
                             url: () => api_services_1.Endpoints.GetCourseSuggestedUsers.url({ id: course.id }),
                             method: api_services_1.Endpoints.GetCourseSuggestedUsers.method
                         }, onConfirm: handleConfirm })] })), (0, jsx_runtime_1.jsx)(CourseUsersTable_1.default, { state: state, dispatch: dispatch, course: course, endpointSearch: {

package/lib/cjs/components/EventHeader/EventHeader.js

@@ -113,7 +113,7 @@ function EventHeader(inProps) {
     return (
     // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
     // @ts-ignore
-    (0, jsx_runtime_1.jsxs)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className), isEventAdmin: isEventAdmin, isEventFinished: isEventFinished }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.calendar }, { children: (0, jsx_runtime_1.jsx)(Calendar_1.default, { day: new Date(scEvent.start_date).getDate() }) })) })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.info }, { children: [scEvent.running && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.inProgress }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.inProgress", defaultMessage: "ui.eventHeader.inProgress" }) }))), isEventFinished && ((0, jsx_runtime_1.jsx)(material_1.Chip, { icon: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small", className: classes.chipIcon }, { children: "calendar_off" })), label: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.finished", defaultMessage: "ui.eventHeader.finished" }) })), variant: "outlined", size: "medium", color: "secondary", className: classes.chip })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.time }, { children: scEvent.end_date && scEvent.end_date !== scEvent.start_date ? (new Date(scEvent.start_date).getDate() !== new Date(scEvent.end_date).getDate() ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.startEndTimeDiff", defaultMessage: "ui.eventHeader.startEndTimeDiff", values: {
+    (0, jsx_runtime_1.jsxs)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className), isEventAdmin: isEventAdmin, isEventFinished: isEventFinished }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.calendar }, { children: (0, jsx_runtime_1.jsx)(Calendar_1.default, { day: new Date(scEvent.start_date).getDate() }) })) })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.info }, { children: [scEvent.running && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.inProgress }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.inProgress", defaultMessage: "ui.eventHeader.inProgress" }) }))), isEventFinished && ((0, jsx_runtime_1.jsx)(material_1.Chip, { icon: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small", className: classes.chipIcon }, { children: "calendar_off" })), label: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.finished", defaultMessage: "ui.eventHeader.finished" }) })), variant: "filled", size: "medium", color: "secondary", className: classes.chip })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.time }, { children: scEvent.end_date && scEvent.end_date !== scEvent.start_date ? (new Date(scEvent.start_date).getDate() !== new Date(scEvent.end_date).getDate() ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.startEndTimeDiff", defaultMessage: "ui.eventHeader.startEndTimeDiff", values: {
                                 startDate: intl.formatDate(scEvent.start_date, {
                                     weekday: 'long',
                                     day: 'numeric',

package/lib/cjs/components/FeedObject/Contributors/Contributors.js

@@ -49,6 +49,6 @@ function ContributorsFeedObject(props) {
     if (!contributorsObject.feedObject) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsx)(material_1.Box, { children: contributorsObject.isLoadingNext && !openContributorsDialog ? ((0, jsx_runtime_1.jsx)(Skeleton_1.default, Object.assign({}, ContributorsSkeletonProps))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: contributorsObject.contributors.length > 0 ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Button, Object.assign({ variant: "text", onClick: () => setOpenContributorsDialog(true), classes: { root: classes.btnParticipants }, color: "inherit" }, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.feedObject.contributors.participants", defaultMessage: "ui.feedObject.contributors.participants" }), ":", (0, jsx_runtime_1.jsxs)(material_1.AvatarGroup, Object.assign({}, rest, { children: [contributorsObject.contributors.map((c, i) => ((0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: c.username, src: c.avatar }, i))), [...Array(Math.max(contributorsObject.total - contributorsObject.contributors.length, 0))].map((x, i) => ((0, jsx_runtime_1.jsx)(material_1.Avatar, {}, i)))] }))] })), openContributorsDialog && ((0, jsx_runtime_1.jsx)(BaseDialog_1.default, Object.assign({ title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.feedObject.contributors.title", id: "ui.feedObject.contributors.title", values: { total: contributorsObject.total } }), onClose: () => setOpenContributorsDialog(false), open: openContributorsDialog }, { children: contributorsObject.isLoadingNext ? ((0, jsx_runtime_1.jsx)(CentralProgress_1.default, { size: 50 })) : ((0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: contributorsObject.contributors.length, next: contributorsObject.getNextPage(), hasMoreNext: Boolean(contributorsObject.next), loaderNext: (0, jsx_runtime_1.jsx)(CentralProgress_1.default, { size: 30 }), height: 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", align: "center", fontWeight: "bold" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.feedObject.contributors.noOtherContributors", defaultMessage: "ui.feedObject.contributors.noOtherContributors" }) })) }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: contributorsObject.contributors.map((c, i) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, { elevation: 0, user: c, sx: { m: 0 }, onClick: () => setOpenContributorsDialog(false) }, c.id) }, i))) }) }))) })))] })) : null })) }) })));
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsx)(material_1.Box, { children: contributorsObject.isLoadingNext && !openContributorsDialog ? ((0, jsx_runtime_1.jsx)(Skeleton_1.default, Object.assign({}, ContributorsSkeletonProps))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: contributorsObject.contributors.length > 0 ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Button, Object.assign({ variant: "text", onClick: () => setOpenContributorsDialog(true), classes: { root: classes.btnParticipants }, color: "inherit" }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ component: "span", sx: { '&': { all: 'unset' } } }, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.feedObject.contributors.participants", defaultMessage: "ui.feedObject.contributors.participants" }), ":"] })), (0, jsx_runtime_1.jsxs)(material_1.AvatarGroup, Object.assign({}, rest, { children: [contributorsObject.contributors.map((c, i) => ((0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: c.username, src: c.avatar }, i))), [...Array(Math.max(contributorsObject.total - contributorsObject.contributors.length, 0))].map((_x, i) => ((0, jsx_runtime_1.jsx)(material_1.Avatar, {}, i)))] }))] })), openContributorsDialog && ((0, jsx_runtime_1.jsx)(BaseDialog_1.default, Object.assign({ title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.feedObject.contributors.title", id: "ui.feedObject.contributors.title", values: { total: contributorsObject.total } }), onClose: () => setOpenContributorsDialog(false), open: openContributorsDialog }, { children: contributorsObject.isLoadingNext ? ((0, jsx_runtime_1.jsx)(CentralProgress_1.default, { size: 50 })) : ((0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: contributorsObject.contributors.length, next: contributorsObject.getNextPage(), hasMoreNext: Boolean(contributorsObject.next), loaderNext: (0, jsx_runtime_1.jsx)(CentralProgress_1.default, { size: 30 }), height: 400, endMessage: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", align: "center", fontWeight: "bold" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.feedObject.contributors.noOtherContributors", defaultMessage: "ui.feedObject.contributors.noOtherContributors" }) })) }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: contributorsObject.contributors.map((c, i) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, { elevation: 0, user: c, sx: { m: 0 }, onClick: () => setOpenContributorsDialog(false) }, c.id) }, i))) }) }))) })))] })) : null })) }) })));
 }
 exports.default = ContributorsFeedObject;

package/lib/cjs/components/PaywallsConfigurator/PaywallsConfigurator.js

@@ -244,7 +244,7 @@ function PaywallsConfigurator(inProps) {
                                                         setPendingValue(newValue);
                                                     }, disableCloseOnSelect: true, slots: {
                                                         popper: PopperComponent
-                                                    }, renderTags: () => null, noOptionsText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paywallsConfigurator.noProducts", defaultMessage: "ui.paywallsConfigurator.noProducts" }), renderOption: renderOption, options: getOptions, isOptionEqualToValue: (option, value) => option.id === value.id, getOptionLabel: (option) => option.name.toString(), renderInput: (params) => ((0, jsx_runtime_1.jsx)(FilterInputRoot, { disabled: loadingProducts || loading, ref: params.InputProps.ref, inputProps: params.inputProps, autoFocus: true, placeholder: intl.formatMessage({
+                                                    }, renderValue: () => null, noOptionsText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paywallsConfigurator.noProducts", defaultMessage: "ui.paywallsConfigurator.noProducts" }), renderOption: renderOption, options: getOptions, isOptionEqualToValue: (option, value) => option.id === value.id, getOptionLabel: (option) => option.name.toString(), renderInput: (params) => ((0, jsx_runtime_1.jsx)(FilterInputRoot, { disabled: loadingProducts || loading, ref: params.InputProps.ref, inputProps: params.inputProps, autoFocus: true, placeholder: intl.formatMessage({
                                                             id: 'ui.paywallsConfigurator.filterByName',
                                                             defaultMessage: 'ui.paywallsConfigurator.filterByName'
                                                         }) })) }), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.paymentProductsPopperFooter }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "contained", size: "small", disableRipple: true, onClick: handleClose, startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "check" }) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paywallsConfigurator.popper.btnConfirm", defaultMessage: "ui.paywallsConfigurator.popper.btnConfirm" }) })) }))] }) })) })))] })] }))] }))) })));

package/lib/cjs/components/PrivateMessageSnippetItem/PrivateMessageSnippetItem.js

@@ -18,7 +18,8 @@ const classes = {
     badgeLabel: `${constants_1.PREFIX}-badge-label`,
     time: `${constants_1.PREFIX}-time`,
     menuItem: `${constants_1.PREFIX}-menu-item`,
-    unread: `${constants_1.PREFIX}-unread`
+    unread: `${constants_1.PREFIX}-unread`,
+    contrastColor: `${constants_1.PREFIX}-contrast-color`
 };
 const Root = (0, material_1.styled)(material_1.ListItem, {
     name: constants_1.PREFIX,
@@ -87,7 +88,7 @@ function PrivateMessageSnippetItem(inProps) {
     /**
      * Renders root object
      */
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { secondaryAction: secondaryAction, disablePadding: true }, { children: (0, jsx_runtime_1.jsxs)(material_1.ListItemButton, Object.assign({ onClick: onItemClick, classes: { root: (0, classnames_1.default)({ [classes.unread]: message.thread_status === types_1.SCPrivateMessageStatusType.NEW }) } }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemAvatar, { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !hasBadge() }, { children: message.group ? ((0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: message.group.name, src: message.group.image_big })) : ((0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) === message.receiver.username ? message.sender.username : message.receiver.username, src: ((_b = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _b === void 0 ? void 0 : _b.username) === message.receiver.username ? message.sender.avatar : message.receiver.avatar })) })) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", className: classes.username }, { children: message.group
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { secondaryAction: secondaryAction, disablePadding: true }, { children: (0, jsx_runtime_1.jsxs)(material_1.ListItemButton, Object.assign({ onClick: onItemClick, classes: { root: (0, classnames_1.default)({ [classes.unread]: message.thread_status === types_1.SCPrivateMessageStatusType.NEW }) } }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemAvatar, { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !hasBadge() }, { children: message.group ? ((0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: message.group.name, src: message.group.image_big })) : ((0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) === message.receiver.username ? message.sender.username : message.receiver.username, src: ((_b = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _b === void 0 ? void 0 : _b.username) === message.receiver.username ? message.sender.avatar : message.receiver.avatar })) })) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", className: (0, classnames_1.default)(classes.username, classes.contrastColor) }, { children: message.group
                                     ? message.group.name
                                     : ((_c = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _c === void 0 ? void 0 : _c.username) === message.receiver.username
                                         ? message.sender.username
@@ -95,6 +96,6 @@ function PrivateMessageSnippetItem(inProps) {
                                     day: '2-digit',
                                     month: '2-digit',
                                     year: '2-digit'
-                                })}` }))] }), secondary: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, { component: "span", color: "text.secondary", dangerouslySetInnerHTML: { __html: (_d = message.headline) !== null && _d !== void 0 ? _d : message.message } }) }) })] })) })));
+                                })}` }))] }), secondary: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, { component: "span", color: "text.secondary", dangerouslySetInnerHTML: { __html: (_d = message.headline) !== null && _d !== void 0 ? _d : message.message }, className: classes.contrastColor }) }) })] })) })));
 }
 exports.default = PrivateMessageSnippetItem;

package/lib/cjs/components/PrivateMessageSnippets/PrivateMessageSnippets.js

@@ -234,7 +234,7 @@ function PrivateMessageSnippets(inProps) {
     /**
      * Renders the component
      */
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({}, rest, { className: (0, classnames_1.default)(classes.root, className) }, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "outlined", size: "medium", className: classes.newMessageButton, onClick: handleOpenNewMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.privateMessage.snippets.button.newMessage", defaultMessage: "ui.privateMessage.snippets.button.newMessage" }) })), data.snippets.length !== 0 && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.TextField, { className: classes.searchBar, variant: "outlined", margin: "normal", fullWidth: true, id: `${constants_1.PREFIX}-search`, placeholder: `${intl.formatMessage(messages.placeholder)}`, size: "small", onChange: handleChange, value: search, slotProps: {
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({}, rest, { className: (0, classnames_1.default)(classes.root, className) }, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "contained", size: "medium", className: classes.newMessageButton, onClick: handleOpenNewMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.privateMessage.snippets.button.newMessage", defaultMessage: "ui.privateMessage.snippets.button.newMessage" }) })), data.snippets.length !== 0 && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.TextField, { className: classes.searchBar, variant: "outlined", margin: "normal", fullWidth: true, id: `${constants_1.PREFIX}-search`, placeholder: `${intl.formatMessage(messages.placeholder)}`, size: "small", onChange: handleChange, value: search, slotProps: {
                                 input: {
                                     className: classes.input,
                                     startAdornment: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ className: classes.icon }, { children: "search" })),

package/lib/cjs/components/PrivateMessageThreadItem/PrivateMessageThreadItem.js

@@ -30,6 +30,7 @@ const classes = {
     messageTime: `${constants_1.PREFIX}-message-time`,
     menuItem: `${constants_1.PREFIX}-menu-item`,
     downloadButton: `${constants_1.PREFIX}-download-button`,
+    paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`,
     dialogRoot: `${constants_1.PREFIX}-dialog-root`
 };
 const DialogRoot = (0, material_1.styled)(BaseDialog_1.default, {
@@ -158,7 +159,7 @@ function PrivateMessageThreadItem(inProps) {
      */
     return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, getMouseEvents(mouseEvents.onMouseEnter, mouseEvents.onMouseLeave), rest, { secondaryAction: (isHovering || isMobile) &&
             showMenuIcon &&
-            message.status !== types_1.SCPrivateMessageStatusType.HIDDEN && (0, jsx_runtime_1.jsx)(PrivateMessageSettingsIconButton_1.default, { onMenuItemDeleteClick: handleMenuItemClick }) }, { children: [message.group && ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) !== message.sender.username && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ color: "secondary", variant: "h4", className: classes.username }, { children: message.sender.username }))), (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [hasFile && message.status !== types_1.SCPrivateMessageStatusType.HIDDEN ? (renderMessageFile(message)) : ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.text }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, { component: "span", dangerouslySetInnerHTML: { __html: message.message } }) }))), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.messageTime, color: "text.secondary" }, { children: `${intl.formatDate(message.created_at, {
+            message.status !== types_1.SCPrivateMessageStatusType.HIDDEN && (0, jsx_runtime_1.jsx)(PrivateMessageSettingsIconButton_1.default, { onMenuItemDeleteClick: handleMenuItemClick }) }, { children: [message.group && ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) !== message.sender.username && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ color: "secondary", variant: "h4", className: classes.username }, { children: message.sender.username }))), (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [hasFile && message.status !== types_1.SCPrivateMessageStatusType.HIDDEN ? (renderMessageFile(message)) : ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.text }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, { component: "span", dangerouslySetInnerHTML: { __html: message.message }, className: classes.paperContrastColor }) }))), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.messageTime, classes.paperContrastColor), color: "text.secondary" }, { children: `${intl.formatDate(message.created_at, {
                             hour: 'numeric',
                             minute: 'numeric'
                         })}` }))] }), openDialog && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (message === null || message === void 0 ? void 0 : message.file.mimetype.startsWith(types_1.SCMessageFileType.VIDEO)) ? ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ open: openDialog, onClose: () => setOpenDialog(false), className: classes.dialogRoot }, { children: (0, jsx_runtime_1.jsx)(AutoPlayer_1.default, { url: message === null || message === void 0 ? void 0 : message.file.url, width: "100%" }) }))) : ((0, jsx_runtime_1.jsx)(Lightbox_1.default, { images: [{ src: message === null || message === void 0 ? void 0 : message.file.url, key: message.file.uuid }], onClose: () => setOpenDialog(false), toolbarButtons: (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: () => handleDownload(message === null || message === void 0 ? void 0 : message.file), className: classes.downloadButton }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "download" }) }), "download") })) }))] })));

package/lib/cjs/components/User/User.js

@@ -24,13 +24,14 @@ const classes = {
     root: `${constants_1.PREFIX}-root`,
     avatar: `${constants_1.PREFIX}-avatar`,
     staffBadgeLabel: `${constants_1.PREFIX}-staff-badge-label`,
-    groupAdminBadgeLabel: `${constants_1.PREFIX}-group-admin-badge-label`
+    groupAdminBadgeLabel: `${constants_1.PREFIX}-group-admin-badge-label`,
+    paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`
 };
 const Root = (0, material_1.styled)(BaseItemButton_1.default, {
     name: constants_1.PREFIX,
     slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({}));
+    overridesResolver: (_props, styles) => styles.root
+})(() => ({}));
 const PREFERENCES = [react_core_1.SCPreferences.STAFF_STAFF_BADGE_LABEL, react_core_1.SCPreferences.STAFF_STAFF_BADGE_ICON];
 /**
  * > API documentation for the Community-JS User component. Learn about the available props and the CSS API.
@@ -101,6 +102,6 @@ function User(inProps) {
      */
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ elevation: elevation }, rest, { className: (0, classnames_1.default)(classes.root, className), ButtonBaseProps: buttonProps !== null && buttonProps !== void 0 ? buttonProps : (scUser.deleted
                     ? { onClick: () => setOpenAlert(true) }
-                    : { component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scUser) }), image: badgeContent ? ((0, jsx_runtime_1.jsx)(material_1.Badge, Object.assign({ overlap: "circular", anchorOrigin: { vertical: 'bottom', horizontal: 'right' }, badgeContent: badgeContent }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) }))) : ((0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !hasBadge }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) }))), primary: (hasBadge && preferences) || isGroupAdmin ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [scUser.username, (0, jsx_runtime_1.jsx)(material_1.Chip, { component: "span", className: isGroupAdmin ? classes.groupAdminBadgeLabel : classes.staffBadgeLabel, size: "small", label: isGroupAdmin ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.user.group.admin", id: "ui.user.group.admin" })) : (preferences[react_core_1.SCPreferences.STAFF_STAFF_BADGE_LABEL]) })] })) : (scUser.username), secondary: secondary || (showFollowers ? `${intl.formatMessage(messages.userFollowers, { total: scUser.followers_counter })}` : scUser.description), actions: actions !== null && actions !== void 0 ? actions : renderAuthenticatedActions() })), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
+                    : { component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scUser) }), image: badgeContent ? ((0, jsx_runtime_1.jsx)(material_1.Badge, Object.assign({ overlap: "circular", anchorOrigin: { vertical: 'bottom', horizontal: 'right' }, badgeContent: badgeContent }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) }))) : ((0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !hasBadge }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) }))), primary: (hasBadge && preferences) || isGroupAdmin ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", className: classes.paperContrastColor }, { children: scUser.username })), (0, jsx_runtime_1.jsx)(material_1.Chip, { component: "span", className: (0, classnames_1.default)(isGroupAdmin ? classes.groupAdminBadgeLabel : classes.staffBadgeLabel), size: "small", label: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", sx: { '&': { all: 'unset' } }, className: classes.paperContrastColor }, { children: isGroupAdmin ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.user.group.admin", id: "ui.user.group.admin" })) : (preferences[react_core_1.SCPreferences.STAFF_STAFF_BADGE_LABEL]) })) })] })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", className: classes.paperContrastColor }, { children: scUser.username }))), secondary: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", className: classes.paperContrastColor }, { children: secondary || (showFollowers ? `${intl.formatMessage(messages.userFollowers, { total: scUser.followers_counter })}` : scUser.description) })), actions: actions !== null && actions !== void 0 ? actions : renderAuthenticatedActions() })), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
 }
 exports.default = User;

package/lib/cjs/shared/AccordionLessons/AccordionLessons.js

@@ -22,7 +22,7 @@ const classes = {
     details: `${constants_1.PREFIX}-details`,
     circle: `${constants_1.PREFIX}-circle`,
     link: `${constants_1.PREFIX}-link`,
-    contrastColor: `${constants_1.PREFIX}-contrast-color`
+    paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`
 };
 const Root = (0, material_1.styled)(material_1.Box, {
     name: constants_1.PREFIX,
@@ -53,14 +53,14 @@ function AccordionLessons(inProps) {
     if (!course) {
         return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
     }
-    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, { children: ((_a = course.sections) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (course.sections.map((section) => ((0, jsx_runtime_1.jsxs)(material_1.Accordion, Object.assign({ className: classes.accordion, expanded: expanded === section.id, onChange: handleChange(section.id), disableGutters: true, elevation: 0, square: true }, { children: [(0, jsx_runtime_1.jsxs)(material_1.AccordionSummary, Object.assign({ className: classes.summary, expandIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "expand_more" }) }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.nameWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", variant: "body1", className: classes.contrastColor }, { children: section.name })), viewerJoinStatus !== types_1.SCCourseJoinStatusType.CREATOR && viewerJoinStatus !== types_1.SCCourseJoinStatusType.MANAGER && section.locked && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Bullet_1.default, {}), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", variant: "body1", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.accordionLessons.date", defaultMessage: "ui.course.accordionLessons.date", values: {
+    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, { children: ((_a = course.sections) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (course.sections.map((section) => ((0, jsx_runtime_1.jsxs)(material_1.Accordion, Object.assign({ className: classes.accordion, expanded: expanded === section.id, onChange: handleChange(section.id), disableGutters: true, elevation: 0, square: true }, { children: [(0, jsx_runtime_1.jsxs)(material_1.AccordionSummary, Object.assign({ className: classes.summary, expandIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "expand_more" }) }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.nameWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", variant: "body1", className: classes.paperContrastColor }, { children: section.name })), viewerJoinStatus !== types_1.SCCourseJoinStatusType.CREATOR && viewerJoinStatus !== types_1.SCCourseJoinStatusType.MANAGER && section.locked && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Bullet_1.default, {}), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", variant: "body1", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.accordionLessons.date", defaultMessage: "ui.course.accordionLessons.date", values: {
                                                     date: intl.formatDate(section.available_date, { day: 'numeric', month: 'numeric', year: 'numeric' }),
                                                     hour: intl.formatDate(section.available_date, { hour: 'numeric', minute: 'numeric' })
-                                                } }) }))] }))] })), !isMobile && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", variant: "body1", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.table.lessons.title", defaultMessage: "ui.course.table.lessons.title", values: {
+                                                } }) }))] }))] })), !isMobile && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", variant: "body1", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.table.lessons.title", defaultMessage: "ui.course.table.lessons.title", values: {
                                     lessonsNumber: section.lessons.length
                                 } }) })))] })), section.lessons.map((lesson) => ((0, jsx_runtime_1.jsxs)(material_1.AccordionDetails, Object.assign({ className: classes.details }, { children: [lesson.completion_status === types_1.SCCourseLessonCompletionStatusType.COMPLETED ? ((0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small", color: "primary" }, { children: "circle_checked" }))) : lesson.locked ? ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: "private" })) : ((0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.circle })), course.join_status === null ||
                             viewerJoinStatus === types_1.SCCourseJoinStatusType.CREATOR ||
                             viewerJoinStatus === types_1.SCCourseJoinStatusType.MANAGER ||
-                            lesson.locked ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.contrastColor }, { children: lesson.name }))) : ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ component: react_core_2.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_LESSON_ROUTE_NAME, (0, course_1.getUrlLesson)(course, lesson, section)), variant: "text", color: "inherit", className: classes.link }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.contrastColor }, { children: lesson.name })) })))] }), lesson.id)))] }), section.id)))) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: (0, classnames_1.default)(classes.empty, classes.contrastColor) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.accordionLessons.empty", defaultMessage: "ui.course.accordionLessons.empty" }) }))) })));
+                            lesson.locked ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.paperContrastColor }, { children: lesson.name }))) : ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ component: react_core_2.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_LESSON_ROUTE_NAME, (0, course_1.getUrlLesson)(course, lesson, section)), variant: "text", color: "inherit", className: classes.link }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.paperContrastColor }, { children: lesson.name })) })))] }), lesson.id)))] }), section.id)))) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: (0, classnames_1.default)(classes.empty, classes.paperContrastColor) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.accordionLessons.empty", defaultMessage: "ui.course.accordionLessons.empty" }) }))) })));
 }
 exports.default = AccordionLessons;

package/lib/cjs/shared/AddUsersButton/AddUsersButton.js

@@ -15,11 +15,12 @@ const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const PREFIX = 'SCAddUsersButton';
 const classes = {
     root: `${PREFIX}-root`,
+    defaultContrastColor: `${PREFIX}-default-contrast-color`,
     dialogRoot: `${PREFIX}-dialog-root`,
     dialogAutocompleteWrapper: `${PREFIX}-dialog-autocomplete-wrapper`,
     dialogUserWrapper: `${PREFIX}-dialog-user-wrapper`,
     dialogChipWrapper: `${PREFIX}-dialog-chip-wrapper`,
-    contrastColor: `${PREFIX}-contrast-color`
+    dialogPaperContrastColor: `${PREFIX}-dialog-paper-contrast-color`
 };
 const messages = (0, react_intl_1.defineMessages)({
     placeholder: {
@@ -43,16 +44,18 @@ function AddUsersButton(inProps) {
         props: inProps,
         name: PREFIX
     });
-    const { label, variant = 'outlined', color = 'inherit', size = 'small', endpoint = api_services_1.Endpoints.GetCourseSuggestedUsers, endpointQueryParams = { limit: Pagination_1.DEFAULT_PAGINATION_LIMIT, offset: Pagination_1.DEFAULT_PAGINATION_OFFSET, search: '' }, onConfirm, className } = props, rest = tslib_1.__rest(props, ["label", "variant", "color", "size", "endpoint", "endpointQueryParams", "onConfirm", "className"]);
+    const { label, variant = 'contained', color = 'inherit', size = 'small', endpoint = api_services_1.Endpoints.GetCourseSuggestedUsers, endpointQueryParams = { limit: Pagination_1.DEFAULT_PAGINATION_LIMIT, offset: Pagination_1.DEFAULT_PAGINATION_OFFSET, search: '' }, onConfirm, className } = props, rest = tslib_1.__rest(props, ["label", "variant", "color", "size", "endpoint", "endpointQueryParams", "onConfirm", "className"]);
     // STATES
     const [openDialog, setOpenDialog] = (0, react_1.useState)(false);
     const [invited, setInvited] = (0, react_1.useState)([]);
     const [suggested, setSuggested] = (0, react_1.useState)([]);
     const [value, setValue] = (0, react_1.useState)('');
     const [loading, setLoading] = (0, react_1.useState)(false);
+    // CONTEXTS
+    const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
     // HOOKS
     const intl = (0, react_intl_1.useIntl)();
-    const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
+    const theme = (0, material_1.useTheme)();
     // CALLBACKS
     const fetchUsers = (0, react_1.useCallback)((newValue) => {
         setLoading(true);
@@ -128,9 +131,14 @@ function AddUsersButton(inProps) {
     const handleDelete = (0, react_1.useCallback)((userToDelete) => {
         setInvited((prev) => prev.filter((user) => user.id !== userToDelete.id));
     }, [setInvited]);
-    return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ onClick: handleToggleDialogOpen, variant: variant, color: color, size: size, className: (0, classnames_1.default)(classes.root, classes.contrastColor, className) }, rest, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: label, defaultMessage: label }) })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ DialogContentProps: { dividers: false }, open: true, onClose: handleToggleDialogOpen, title: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.dialog.title", defaultMessage: "ui.addUserButton.dialog.title" }) })), actions: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ onClick: handleConfirm, size: "medium", variant: "contained", autoFocus: true, disabled: !invited.length }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.dialog.confirm", defaultMessage: "ui.addUserButton.dialog.confirm" }) })) })), className: classes.dialogRoot }, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.dialogAutocompleteWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Autocomplete, { loading: loading, size: "small", multiple: true, options: suggested, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, filterOptions: filterOptions, value: invited, getOptionLabel: (option) => (option === null || option === void 0 ? void 0 : option.username) || '...', isOptionEqualToValue: (option, value) => (option === null || option === void 0 ? void 0 : option.id) === value.id, loadingText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.autocomplete.loading", defaultMessage: "ui.addUserButton.autocomplete.loading" }), noOptionsText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.autocomplete.noResults", defaultMessage: "ui.addUserButton.autocomplete.noResults" }), renderTags: () => null, popupIcon: null, disableClearable: true, renderOption: (props, option) => ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ component: "li", flexDirection: "row", gap: "5px" }, props, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: option.username, src: option.avatar }), (0, jsx_runtime_1.jsx)(material_1.Typography, { children: option.username })] }))), renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { variant: "outlined", placeholder: `${intl.formatMessage(messages.placeholder)}`, slotProps: {
-                                    input: Object.assign({}, params.InputProps)
-                                } }))) }), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.dialogChipWrapper }, { children: invited.map((option, index) => ((0, jsx_runtime_1.jsx)(material_1.Chip, { avatar: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: option.username, src: option.avatar }), label: option.username, onDelete: () => {
+    return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ onClick: handleToggleDialogOpen, variant: variant, color: color, size: size, className: (0, classnames_1.default)(classes.root, classes.defaultContrastColor, className) }, rest, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: label, defaultMessage: label }) })), openDialog && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ DialogContentProps: { dividers: false }, open: true, onClose: handleToggleDialogOpen, title: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.dialogPaperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.dialog.title", defaultMessage: "ui.addUserButton.dialog.title" }) })), actions: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ onClick: handleConfirm, size: "medium", variant: "contained", autoFocus: true, disabled: !invited.length }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.dialog.confirm", defaultMessage: "ui.addUserButton.dialog.confirm" }) })) })), className: classes.dialogRoot }, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.dialogAutocompleteWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Autocomplete, { loading: loading, size: "small", multiple: true, options: suggested, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, filterOptions: filterOptions, value: invited, getOptionLabel: (option) => (option === null || option === void 0 ? void 0 : option.username) || '...', isOptionEqualToValue: (option, value) => (option === null || option === void 0 ? void 0 : option.id) === value.id, loadingText: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", sx: { color: theme.palette.getContrastText(theme.palette.background.paper) } }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.autocomplete.loading", defaultMessage: "ui.addUserButton.autocomplete.loading" }) })), noOptionsText: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", sx: { color: theme.palette.getContrastText(theme.palette.background.paper) } }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.addUserButton.autocomplete.noResults", defaultMessage: "ui.addUserButton.autocomplete.noResults" }) })), renderValue: () => null, popupIcon: null, disableClearable: true, renderOption: (props, option) => ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ component: "li", flexDirection: "row", gap: "5px" }, props, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: option.username, src: option.avatar }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ sx: { color: theme.palette.getContrastText(theme.palette.background.paper) } }, { children: option.username }))] }))), renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { variant: "outlined", placeholder: `${intl.formatMessage(messages.placeholder)}`, slotProps: {
+                                    input: Object.assign(Object.assign({}, params.InputProps), { sx: {
+                                            '&::placeholder': {
+                                                color: theme.palette.getContrastText(theme.palette.background.paper)
+                                            },
+                                            color: theme.palette.getContrastText(theme.palette.background.paper)
+                                        } })
+                                } }))) }), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.dialogChipWrapper }, { children: invited.map((option, index) => ((0, jsx_runtime_1.jsx)(material_1.Chip, { avatar: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: option.username, src: option.avatar }), label: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span", sx: { color: theme.palette.getContrastText(theme.palette.background.paper) } }, { children: option.username })), onDelete: () => {
                                     handleDelete(option);
                                 } }, index))) }))] })) })))] }));
 }

package/lib/cjs/shared/ConfirmDialog/ConfirmDialog.js

@@ -6,7 +6,7 @@ const material_1 = require("@mui/material");
 const react_intl_1 = require("react-intl");
 const PREFIX = 'SCConfirmDialog';
 const classes = {
-    contrastColor: `${PREFIX}-contrast-color`
+    paperContrastColor: `${PREFIX}-paper-contrast-color`
 };
 const Root = (0, material_1.styled)(material_1.Card, {
     name: PREFIX,
@@ -14,11 +14,15 @@ const Root = (0, material_1.styled)(material_1.Card, {
     overridesResolver: (_props, styles) => styles.root
 })(({ theme }) => ({
     maxWidth: 800,
-    marginBottom: theme.spacing(2),
-    [`& .${PREFIX}-contrast-color`]: {
-        color: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
-            ? (0, material_1.lighten)(theme.palette.common.white, 0.5)
-            : (0, material_1.darken)(theme.palette.common.white, 0.5)
+    marginBottom: theme.spacing(2)
+}));
+const DialogRoot = (0, material_1.styled)(material_1.Dialog, {
+    name: PREFIX,
+    slot: 'DialogRoot',
+    overridesResolver: (_props, styles) => styles.dialogRoot
+})(({ theme }) => ({
+    [`& .${classes.paperContrastColor}`]: {
+        color: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5 ? (0, material_1.lighten)(theme.palette.common.white, 0.5) : undefined
     }
 }));
 function ConfirmDialog(props) {
@@ -45,6 +49,6 @@ function ConfirmDialog(props) {
     /**
      * Renders root object
      */
-    return ((0, jsx_runtime_1.jsx)(Root, { children: (0, jsx_runtime_1.jsxs)(material_1.Dialog, Object.assign({ open: open, onClose: handleClose }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.DialogTitle, Object.assign({ className: classes.contrastColor }, { children: title || (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.confirmDialog.title", defaultMessage: "ui.confirmDialog.title" }) })), content && ((0, jsx_runtime_1.jsx)(material_1.DialogContent, { children: (0, jsx_runtime_1.jsx)(material_1.DialogContentText, Object.assign({ component: "div", className: classes.contrastColor }, { children: content })) })), (0, jsx_runtime_1.jsxs)(material_1.DialogActions, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ onClick: handleClose, className: classes.contrastColor }, { children: btnCancel || (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.confirmDialog.btnCancel", defaultMessage: "ui.confirmDialog.btnCancel" }) })), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ onClick: handleConfirm, variant: "contained", autoFocus: true, loading: isUpdating, className: classes.contrastColor }, { children: btnConfirm || (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.confirmDialog.btnConfirm", defaultMessage: "ui.confirmDialog.btnConfirm" }) }))] })] })) }));
+    return ((0, jsx_runtime_1.jsx)(Root, { children: (0, jsx_runtime_1.jsxs)(DialogRoot, Object.assign({ open: open, onClose: handleClose }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.DialogTitle, Object.assign({ className: classes.paperContrastColor }, { children: title || (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.confirmDialog.title", defaultMessage: "ui.confirmDialog.title" }) })), content && ((0, jsx_runtime_1.jsx)(material_1.DialogContent, { children: (0, jsx_runtime_1.jsx)(material_1.DialogContentText, Object.assign({ component: "div", className: classes.paperContrastColor }, { children: content })) })), (0, jsx_runtime_1.jsxs)(material_1.DialogActions, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ onClick: handleClose }, { children: btnCancel || (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.confirmDialog.btnCancel", defaultMessage: "ui.confirmDialog.btnCancel" }) })), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ onClick: handleConfirm, variant: "contained", autoFocus: true, loading: isUpdating }, { children: btnConfirm || (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.confirmDialog.btnConfirm", defaultMessage: "ui.confirmDialog.btnConfirm" }) }))] })] })) }));
 }
 exports.default = ConfirmDialog;

package/lib/cjs/shared/CourseUsersTable/ChangeUsersStatus.js

@@ -9,11 +9,7 @@ const api_services_1 = require("@selfcommunity/api-services");
 const utils_1 = require("@selfcommunity/utils");
 const Errors_1 = require("../../constants/Errors");
 const notistack_1 = require("notistack");
-const constants_1 = require("./constants");
 const OPTIONS = ['ui.editCourse.tab.users.table.select.joined', 'ui.editCourse.tab.users.table.select.manager'];
-const classes = {
-    contrastColor: `${constants_1.PREFIX}-contrast-color`
-};
 function ChangeUserStatus(props) {
     // PROPS
     const { course, user } = props;
@@ -22,6 +18,8 @@ function ChangeUserStatus(props) {
     const [loading, setLoading] = (0, react_1.useState)(false);
     // CONTEXTS
     const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
+    // HOOKS
+    const theme = (0, material_1.useTheme)();
     // EFFECTS
     (0, react_1.useEffect)(() => {
         setValue(`ui.editCourse.tab.users.table.select.${user.join_status || 'joined'}`);
@@ -56,6 +54,6 @@ function ChangeUserStatus(props) {
                     ':hover': {
                         backgroundColor: 'unset'
                     }
-                } }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: option, defaultMessage: option }) })) })) }), i))) })));
+                } }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", sx: { color: theme.palette.getContrastText(theme.palette.background.paper) } }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: option, defaultMessage: option }) })) })) }), i))) })));
 }
 exports.default = (0, react_1.memo)(ChangeUserStatus);

package/lib/cjs/shared/CourseUsersTable/CourseUsersTable.js

@@ -22,6 +22,7 @@ const course_1 = require("../../types/course");
 const RemoveButton_1 = tslib_1.__importDefault(require("./RemoveButton"));
 const ConfirmDialog_1 = tslib_1.__importDefault(require("../ConfirmDialog/ConfirmDialog"));
 const course_2 = require("../../types/course");
+const course_3 = require("../../utils/course");
 const classes = {
     root: `${constants_1.PREFIX}-root`,
     search: `${constants_1.PREFIX}-search`,
@@ -31,7 +32,7 @@ const classes = {
     progressWrapper: `${constants_1.PREFIX}-progress-wrapper`,
     progress: `${constants_1.PREFIX}-progress`,
     loadingButton: `${constants_1.PREFIX}-loading-button`,
-    contrastColor: `${constants_1.PREFIX}-contrast-color`
+    paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`
 };
 const Root = (0, material_1.styled)(material_1.Box, {
     name: constants_1.PREFIX,
@@ -55,6 +56,7 @@ function CourseUsersTable(inProps) {
     const inputRef = (0, react_1.useRef)(null);
     // CONTEXTS
     const scUserContext = (0, react_core_1.useSCUser)();
+    const scRoutingContext = (0, react_core_1.useSCRouting)();
     // INTL
     const intl = (0, react_intl_1.useIntl)();
     // HANDLERS
@@ -148,10 +150,10 @@ function CourseUsersTable(inProps) {
                                     if (i === array.length - 1) {
                                         return (0, jsx_runtime_1.jsx)(material_1.TableCell, { width: "14%" }, i);
                                     }
-                                    return ((0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ width: mode === course_1.SCCourseUsersTableModeType.DASHBOARD ? '20%' : '25%' }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: cell.id, defaultMessage: cell.id }) })) }), i));
+                                    return ((0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ width: mode === course_1.SCCourseUsersTableModeType.DASHBOARD ? '20%' : '25%' }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: cell.id, defaultMessage: cell.id }) })) }), i));
                                 }) }) }), (0, jsx_runtime_1.jsxs)(material_1.TableBody, { children: [users.length > 0 &&
-                                    users.map((user, i) => ((0, jsx_runtime_1.jsxs)(material_1.TableRow, { children: [(0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.avatarWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: user.username, src: user.avatar }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.contrastColor }, { children: user.username }))] })) }), mode === course_1.SCCourseUsersTableModeType.DASHBOARD && ((0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.progressWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.LinearProgress, { className: classes.progress, variant: "determinate", value: user.user_completion_rate }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.contrastColor }, { children: `${Math.round(user.user_completion_rate)}%` }))] })) })), mode === course_1.SCCourseUsersTableModeType.EDIT && ((0, jsx_runtime_1.jsx)(material_1.TableCell, { children: user.join_status !== types_1.SCCourseJoinStatusType.CREATOR && scUserContext.user.id !== user.id ? ((0, jsx_runtime_1.jsx)(ChangeUsersStatus_1.default, { course: course, user: user })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.editCourse.tab.users.table.select.${user.join_status}`, defaultMessage: `ui.editCourse.tab.users.table.select.${user.join_status}` }) }))) })), (0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedDate, { value: mode === course_1.SCCourseUsersTableModeType.REQUESTS ? user.date_joined : user.joined_at || new Date() }) })) }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedDate, { value: mode === course_1.SCCourseUsersTableModeType.REQUESTS ? user.date_joined : user.last_active_at || new Date() }) })) }), mode === course_1.SCCourseUsersTableModeType.EDIT &&
+                                    users.map((user, i) => ((0, jsx_runtime_1.jsxs)(material_1.TableRow, { children: [(0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.avatarWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: user.username, src: user.avatar }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.paperContrastColor }, { children: user.username }))] })) }), mode === course_1.SCCourseUsersTableModeType.DASHBOARD && ((0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.progressWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.LinearProgress, { className: classes.progress, variant: "determinate", value: user.user_completion_rate }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.paperContrastColor }, { children: `${Math.round(user.user_completion_rate)}%` }))] })) })), mode === course_1.SCCourseUsersTableModeType.EDIT && ((0, jsx_runtime_1.jsx)(material_1.TableCell, { children: user.join_status !== types_1.SCCourseJoinStatusType.CREATOR && scUserContext.user.id !== user.id ? ((0, jsx_runtime_1.jsx)(ChangeUsersStatus_1.default, { course: course, user: user })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.editCourse.tab.users.table.select.${user.join_status}`, defaultMessage: `ui.editCourse.tab.users.table.select.${user.join_status}` }) }))) })), (0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedDate, { value: mode === course_1.SCCourseUsersTableModeType.REQUESTS ? user.date_joined : user.joined_at || new Date() }) })) }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedDate, { value: mode === course_1.SCCourseUsersTableModeType.REQUESTS ? user.date_joined : user.last_active_at || new Date() }) })) }), mode === course_1.SCCourseUsersTableModeType.EDIT &&
                                                 user.join_status !== types_1.SCCourseJoinStatusType.CREATOR &&
-                                                scUserContext.user.id !== user.id ? ((0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsx)(RemoveButton_1.default, { ref: buttonRef, course: course, user: user, handleOpenDialog: handleOpenDialog }) })) : (mode === course_1.SCCourseUsersTableModeType.EDIT && (0, jsx_runtime_1.jsx)(material_1.TableCell, {})), mode === course_1.SCCourseUsersTableModeType.DASHBOARD && ((0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsx)(SeeProgressButton_1.default, { course: course, user: user }) })), mode === course_1.SCCourseUsersTableModeType.REQUESTS && ((0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsx)(RequestButton_1.default, { ref: buttonRef, course: course, user: user, handleOpenDialog: handleOpenDialog }) }))] }, i))), state.isLoadingNext && (0, jsx_runtime_1.jsx)(RowSkeleton_1.default, { editMode: mode !== course_1.SCCourseUsersTableModeType.DASHBOARD })] })] }) }), users.length > 0 && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "contained", color: "inherit", loading: state.isLoadingNext, disabled: value.length > 0 || !state.next, className: classes.loadingButton, onClick: handleNext }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseUsersTable.btn.label", defaultMessage: "ui.courseUsersTable.btn.label" }) })) }))), users.length === 0 && ((0, jsx_runtime_1.jsx)(EmptyStatus_1.default, { icon: "face", title: value.length > 0 ? 'ui.courseUsersTable.empty.search.title' : emptyStatusTitle, description: value.length > 0 ? 'ui.courseUsersTable.empty.search.description' : emptyStatusDescription })), dialog && (0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: true, onClose: () => handleOpenDialog(null), onConfirm: handleConfirm })] })));
+                                                scUserContext.user.id !== user.id ? ((0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsx)(RemoveButton_1.default, { ref: buttonRef, course: course, user: user, handleOpenDialog: handleOpenDialog }) })) : (mode === course_1.SCCourseUsersTableModeType.EDIT && (0, jsx_runtime_1.jsx)(material_1.TableCell, {})), mode === course_1.SCCourseUsersTableModeType.DASHBOARD && ((0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsx)(SeeProgressButton_1.default, { course: course, user: user }) })), mode === course_1.SCCourseUsersTableModeType.REQUESTS && ((0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsx)(RequestButton_1.default, { ref: buttonRef, course: course, user: user, handleOpenDialog: handleOpenDialog }) }))] }, i))), state.isLoadingNext && (0, jsx_runtime_1.jsx)(RowSkeleton_1.default, { editMode: mode !== course_1.SCCourseUsersTableModeType.DASHBOARD })] })] }) }), users.length > 0 && state.next && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "contained", color: "inherit", loading: state.isLoadingNext, disabled: value.length > 0, className: classes.loadingButton, onClick: handleNext }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseUsersTable.btn.label", defaultMessage: "ui.courseUsersTable.btn.label" }) })) }))), users.length === 0 && ((0, jsx_runtime_1.jsx)(EmptyStatus_1.default, { icon: "face", title: value.length > 0 ? 'ui.courseUsersTable.empty.search.title' : emptyStatusTitle, description: value.length > 0 ? 'ui.courseUsersTable.empty.search.description' : emptyStatusDescription, actions: value.length === 0 && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_EDIT_ROUTE_NAME, (0, course_3.getUrlEditDashboard)(course, course_2.SCCourseEditTabType.USERS)), size: "small", variant: "contained", color: "primary" }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseUsersTable.empty.btn.label", defaultMessage: "ui.courseUsersTable.empty.btn.label" }) })) }))) })), dialog && (0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: true, onClose: () => handleOpenDialog(null), onConfirm: handleConfirm })] })));
 }
 exports.default = (0, react_1.memo)(CourseUsersTable);

package/lib/cjs/shared/CourseUsersTable/SeeProgressButton.js

@@ -20,7 +20,8 @@ const classes = {
     infoInnerWrapper: `${constants_1.PREFIX}-info-inner-wrapper`,
     avatarWrapper: `${constants_1.PREFIX}-avatar-wrapper`,
     avatar: `${constants_1.PREFIX}-avatar`,
-    contrastColor: `${constants_1.PREFIX}-contrast-color`
+    paperContrastColor: `${constants_1.PREFIX}-paper-contrast-color`,
+    dialogPaperContrastColor: `${constants_1.PREFIX}-dialog-paper-contrast-color`
 };
 const DialogRoot = (0, material_1.styled)(BaseDialog_1.default, {
     name: constants_1.PREFIX,
@@ -53,8 +54,8 @@ function SeeProgressButton(props) {
     const handleToggleOpen = (0, react_1.useCallback)(() => {
         setOpen((prev) => !prev);
     }, [setOpen]);
-    return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [isMobile ? ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ size: "small", color: "inherit", onClick: handleToggleOpen }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "chevron_right" }) }))) : ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "contained", size: "small", color: "inherit", onClick: handleToggleOpen }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseUsersTable.action.btn.label", defaultMessage: "ui.courseUsersTable.action.btn.label" }) })) }))), open && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ DialogContentProps: { dividers: isMobile }, open: true, scroll: "paper", onClose: handleToggleOpen, title: intl.formatMessage({ id: 'ui.courseUsersTable.dialog.title', defaultMessage: 'ui.courseUsersTable.dialog.title' }), className: classes.dialogRoot }, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.contentWrapper }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.infoOuterWrapper }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.infoInnerWrapper }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.avatarWrapper }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!course.created_by.deleted && {
+    return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [isMobile ? ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ size: "small", color: "inherit", onClick: handleToggleOpen }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "chevron_right" }) }))) : ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "contained", size: "small", color: "inherit", onClick: handleToggleOpen }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.paperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseUsersTable.action.btn.label", defaultMessage: "ui.courseUsersTable.action.btn.label" }) })) }))), open && ((0, jsx_runtime_1.jsx)(DialogRoot, Object.assign({ DialogContentProps: { dividers: isMobile }, open: true, scroll: "paper", onClose: handleToggleOpen, title: intl.formatMessage({ id: 'ui.courseUsersTable.dialog.title', defaultMessage: 'ui.courseUsersTable.dialog.title' }), className: classes.dialogRoot }, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.contentWrapper }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.infoOuterWrapper }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.infoInnerWrapper }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.avatarWrapper }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!course.created_by.deleted && {
                                                     to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, course.created_by)
-                                                }), { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !course.created_by.community_badge, smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { className: classes.avatar, src: user.avatar, alt: user.username }) })) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.contrastColor }, { children: user.username }))] })), privateMessagingEnabled && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, user), variant: "contained", size: "small", color: "inherit" }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseUsersTable.dialog.btn.label", defaultMessage: "ui.courseUsersTable.dialog.btn.label" }) })) })))] })), student ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseUsersTable.dialog.info.text1", defaultMessage: "ui.courseUsersTable.dialog.info.text1", values: { lessonsCompleted: student.num_lessons_completed } }) }))) : ((0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", variant: "text", width: "100px", height: "21px" })), student ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseUsersTable.dialog.info.text2", defaultMessage: "ui.courseUsersTable.dialog.info.text2", values: { courseCompleted: student.user_completion_rate } }) }))) : ((0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", variant: "text", width: "100px", height: "21px" }))] })), (0, jsx_runtime_1.jsx)(AccordionLessons_1.default, { course: student, viewerJoinStatus: course.join_status })] })) })))] }));
+                                                }), { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !course.created_by.community_badge, smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { className: classes.avatar, src: user.avatar, alt: user.username }) })) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.dialogPaperContrastColor }, { children: user.username }))] })), privateMessagingEnabled && ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, user), variant: "contained", size: "small", color: "inherit" }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", className: classes.dialogPaperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseUsersTable.dialog.btn.label", defaultMessage: "ui.courseUsersTable.dialog.btn.label" }) })) })))] })), student ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.dialogPaperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseUsersTable.dialog.info.text1", defaultMessage: "ui.courseUsersTable.dialog.info.text1", values: { lessonsCompleted: student.num_lessons_completed } }) }))) : ((0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", variant: "text", width: "100px", height: "21px" })), student ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.dialogPaperContrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseUsersTable.dialog.info.text2", defaultMessage: "ui.courseUsersTable.dialog.info.text2", values: { courseCompleted: student.user_completion_rate } }) }))) : ((0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", variant: "text", width: "100px", height: "21px" }))] })), (0, jsx_runtime_1.jsx)(AccordionLessons_1.default, { course: student, viewerJoinStatus: course.join_status })] })) })))] }));
 }
 exports.default = (0, react_1.memo)(SeeProgressButton);

package/lib/cjs/types/course.d.ts

@@ -38,3 +38,8 @@ export interface SCCourseGetUrlLessonData {
     section_id: number;
     lesson_id: number;
 }
+export interface SCDataUrlEditDashboard {
+    id: number;
+    slug: string;
+    tab: SCCourseEditTabType;
+}