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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/lib/cjs/components/EventHeader/EventHeader.js +1 -1
  2. package/lib/cjs/components/PrivateMessageSnippetItem/PrivateMessageSnippetItem.js +4 -3
  3. package/lib/cjs/components/PrivateMessageSnippets/PrivateMessageSnippets.js +1 -1
  4. package/lib/cjs/components/User/User.js +5 -4
  5. package/lib/esm/components/EventHeader/EventHeader.js +1 -1
  6. package/lib/esm/components/PrivateMessageSnippetItem/PrivateMessageSnippetItem.js +4 -3
  7. package/lib/esm/components/PrivateMessageSnippets/PrivateMessageSnippets.js +1 -1
  8. package/lib/esm/components/User/User.js +5 -4
  9. package/lib/umd/react-ui.js +1 -1
  10. package/package.json +3 -3
package/lib/cjs/components/EventHeader/EventHeader.js CHANGED
@@ -113,7 +113,7 @@ function EventHeader(inProps) {
113
113
  return (
114
114
  // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
115
115
  // @ts-ignore
116
- (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: {
116
+ (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: {
117
117
  startDate: intl.formatDate(scEvent.start_date, {
118
118
  weekday: 'long',
119
119
  day: 'numeric',
package/lib/cjs/components/PrivateMessageSnippetItem/PrivateMessageSnippetItem.js CHANGED
@@ -18,7 +18,8 @@ const classes = {
18
18
  badgeLabel: `${constants_1.PREFIX}-badge-label`,
19
19
  time: `${constants_1.PREFIX}-time`,
20
20
  menuItem: `${constants_1.PREFIX}-menu-item`,
21
- unread: `${constants_1.PREFIX}-unread`
21
+ unread: `${constants_1.PREFIX}-unread`,
22
+ contrastColor: `${constants_1.PREFIX}-contrast-color`
22
23
  };
23
24
  const Root = (0, material_1.styled)(material_1.ListItem, {
24
25
  name: constants_1.PREFIX,
@@ -87,7 +88,7 @@ function PrivateMessageSnippetItem(inProps) {
87
88
  /**
88
89
  * Renders root object
89
90
  */
90
- 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
91
+ 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
91
92
  ? message.group.name
92
93
  : ((_c = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _c === void 0 ? void 0 : _c.username) === message.receiver.username
93
94
  ? message.sender.username
@@ -95,6 +96,6 @@ function PrivateMessageSnippetItem(inProps) {
95
96
  day: '2-digit',
96
97
  month: '2-digit',
97
98
  year: '2-digit'
98
- })}` }))] }), 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 } }) }) })] })) })));
99
+ })}` }))] }), 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 }) }) })] })) })));
99
100
  }
100
101
  exports.default = PrivateMessageSnippetItem;
package/lib/cjs/components/PrivateMessageSnippets/PrivateMessageSnippets.js CHANGED
@@ -234,7 +234,7 @@ function PrivateMessageSnippets(inProps) {
234
234
  /**
235
235
  * Renders the component
236
236
  */
237
- 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: {
237
+ 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: {
238
238
  input: {
239
239
  className: classes.input,
240
240
  startAdornment: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ className: classes.icon }, { children: "search" })),
package/lib/cjs/components/User/User.js CHANGED
@@ -24,13 +24,14 @@ const classes = {
24
24
  root: `${constants_1.PREFIX}-root`,
25
25
  avatar: `${constants_1.PREFIX}-avatar`,
26
26
  staffBadgeLabel: `${constants_1.PREFIX}-staff-badge-label`,
27
- groupAdminBadgeLabel: `${constants_1.PREFIX}-group-admin-badge-label`
27
+ groupAdminBadgeLabel: `${constants_1.PREFIX}-group-admin-badge-label`,
28
+ contrastColor: `${constants_1.PREFIX}-contrast-color`
28
29
  };
29
30
  const Root = (0, material_1.styled)(BaseItemButton_1.default, {
30
31
  name: constants_1.PREFIX,
31
32
  slot: 'Root',
32
- overridesResolver: (props, styles) => styles.root
33
- })(({ theme }) => ({}));
33
+ overridesResolver: (_props, styles) => styles.root
34
+ })(() => ({}));
34
35
  const PREFERENCES = [react_core_1.SCPreferences.STAFF_STAFF_BADGE_LABEL, react_core_1.SCPreferences.STAFF_STAFF_BADGE_ICON];
35
36
  /**
36
37
  * > API documentation for the Community-JS User component. Learn about the available props and the CSS API.
@@ -101,6 +102,6 @@ function User(inProps) {
101
102
  */
102
103
  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
103
104
  ? { onClick: () => setOpenAlert(true) }
104
- : { 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) })] }));
105
+ : { 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: (0, classnames_1.default)(classes.contrastColor, 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) })] }));
105
106
  }
106
107
  exports.default = User;
package/lib/esm/components/EventHeader/EventHeader.js CHANGED
@@ -111,7 +111,7 @@ export default function EventHeader(inProps) {
111
111
  return (
112
112
  // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
113
113
  // @ts-ignore
114
- _jsxs(Root, Object.assign({ id: id, className: classNames(classes.root, className), isEventAdmin: isEventAdmin, isEventFinished: isEventFinished }, rest, { children: [_jsx(Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: _jsx(Box, Object.assign({ className: classes.calendar }, { children: _jsx(Calendar, { day: new Date(scEvent.start_date).getDate() }) })) })), _jsxs(Box, Object.assign({ className: classes.info }, { children: [scEvent.running && (_jsx(Typography, Object.assign({ variant: "body1", className: classes.inProgress }, { children: _jsx(FormattedMessage, { id: "ui.eventHeader.inProgress", defaultMessage: "ui.eventHeader.inProgress" }) }))), isEventFinished && (_jsx(Chip, { icon: _jsx(Icon, Object.assign({ fontSize: "small", className: classes.chipIcon }, { children: "calendar_off" })), label: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.eventHeader.finished", defaultMessage: "ui.eventHeader.finished" }) })), variant: "outlined", size: "medium", color: "secondary", className: classes.chip })), _jsx(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() ? (_jsx(FormattedMessage, { id: "ui.eventHeader.startEndTimeDiff", defaultMessage: "ui.eventHeader.startEndTimeDiff", values: {
114
+ _jsxs(Root, Object.assign({ id: id, className: classNames(classes.root, className), isEventAdmin: isEventAdmin, isEventFinished: isEventFinished }, rest, { children: [_jsx(Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: _jsx(Box, Object.assign({ className: classes.calendar }, { children: _jsx(Calendar, { day: new Date(scEvent.start_date).getDate() }) })) })), _jsxs(Box, Object.assign({ className: classes.info }, { children: [scEvent.running && (_jsx(Typography, Object.assign({ variant: "body1", className: classes.inProgress }, { children: _jsx(FormattedMessage, { id: "ui.eventHeader.inProgress", defaultMessage: "ui.eventHeader.inProgress" }) }))), isEventFinished && (_jsx(Chip, { icon: _jsx(Icon, Object.assign({ fontSize: "small", className: classes.chipIcon }, { children: "calendar_off" })), label: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.eventHeader.finished", defaultMessage: "ui.eventHeader.finished" }) })), variant: "filled", size: "medium", color: "secondary", className: classes.chip })), _jsx(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() ? (_jsx(FormattedMessage, { id: "ui.eventHeader.startEndTimeDiff", defaultMessage: "ui.eventHeader.startEndTimeDiff", values: {
115
115
  startDate: intl.formatDate(scEvent.start_date, {
116
116
  weekday: 'long',
117
117
  day: 'numeric',
package/lib/esm/components/PrivateMessageSnippetItem/PrivateMessageSnippetItem.js CHANGED
@@ -16,7 +16,8 @@ const classes = {
16
16
  badgeLabel: `${PREFIX}-badge-label`,
17
17
  time: `${PREFIX}-time`,
18
18
  menuItem: `${PREFIX}-menu-item`,
19
- unread: `${PREFIX}-unread`
19
+ unread: `${PREFIX}-unread`,
20
+ contrastColor: `${PREFIX}-contrast-color`
20
21
  };
21
22
  const Root = styled(ListItem, {
22
23
  name: PREFIX,
@@ -85,7 +86,7 @@ export default function PrivateMessageSnippetItem(inProps) {
85
86
  /**
86
87
  * Renders root object
87
88
  */
88
- return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { secondaryAction: secondaryAction, disablePadding: true }, { children: _jsxs(ListItemButton, Object.assign({ onClick: onItemClick, classes: { root: classNames({ [classes.unread]: message.thread_status === SCPrivateMessageStatusType.NEW }) } }, { children: [_jsx(ListItemAvatar, { children: _jsx(UserAvatar, Object.assign({ hide: !hasBadge() }, { children: message.group ? (_jsx(Avatar, { alt: message.group.name, src: message.group.image_big })) : (_jsx(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 })) })) }), _jsx(ListItemText, { primary: _jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ component: "span", className: classes.username }, { children: message.group
89
+ return (_jsx(Root, Object.assign({ className: classNames(classes.root, className) }, rest, { secondaryAction: secondaryAction, disablePadding: true }, { children: _jsxs(ListItemButton, Object.assign({ onClick: onItemClick, classes: { root: classNames({ [classes.unread]: message.thread_status === SCPrivateMessageStatusType.NEW }) } }, { children: [_jsx(ListItemAvatar, { children: _jsx(UserAvatar, Object.assign({ hide: !hasBadge() }, { children: message.group ? (_jsx(Avatar, { alt: message.group.name, src: message.group.image_big })) : (_jsx(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 })) })) }), _jsx(ListItemText, { primary: _jsxs(_Fragment, { children: [_jsx(Typography, Object.assign({ component: "span", className: classNames(classes.username, classes.contrastColor) }, { children: message.group
89
90
  ? message.group.name
90
91
  : ((_c = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _c === void 0 ? void 0 : _c.username) === message.receiver.username
91
92
  ? message.sender.username
@@ -93,5 +94,5 @@ export default function PrivateMessageSnippetItem(inProps) {
93
94
  day: '2-digit',
94
95
  month: '2-digit',
95
96
  year: '2-digit'
96
- })}` }))] }), secondary: _jsx(_Fragment, { children: _jsx(Typography, { component: "span", color: "text.secondary", dangerouslySetInnerHTML: { __html: (_d = message.headline) !== null && _d !== void 0 ? _d : message.message } }) }) })] })) })));
97
+ })}` }))] }), secondary: _jsx(_Fragment, { children: _jsx(Typography, { component: "span", color: "text.secondary", dangerouslySetInnerHTML: { __html: (_d = message.headline) !== null && _d !== void 0 ? _d : message.message }, className: classes.contrastColor }) }) })] })) })));
97
98
  }
package/lib/esm/components/PrivateMessageSnippets/PrivateMessageSnippets.js CHANGED
@@ -232,7 +232,7 @@ export default function PrivateMessageSnippets(inProps) {
232
232
  /**
233
233
  * Renders the component
234
234
  */
235
- return (_jsx(Root, Object.assign({}, rest, { className: classNames(classes.root, className) }, { children: _jsxs(CardContent, { children: [_jsx(Button, Object.assign({ variant: "outlined", size: "medium", className: classes.newMessageButton, onClick: handleOpenNewMessage }, { children: _jsx(FormattedMessage, { id: "ui.privateMessage.snippets.button.newMessage", defaultMessage: "ui.privateMessage.snippets.button.newMessage" }) })), data.snippets.length !== 0 && (_jsxs(_Fragment, { children: [_jsx(TextField, { className: classes.searchBar, variant: "outlined", margin: "normal", fullWidth: true, id: `${PREFIX}-search`, placeholder: `${intl.formatMessage(messages.placeholder)}`, size: "small", onChange: handleChange, value: search, slotProps: {
235
+ return (_jsx(Root, Object.assign({}, rest, { className: classNames(classes.root, className) }, { children: _jsxs(CardContent, { children: [_jsx(Button, Object.assign({ variant: "contained", size: "medium", className: classes.newMessageButton, onClick: handleOpenNewMessage }, { children: _jsx(FormattedMessage, { id: "ui.privateMessage.snippets.button.newMessage", defaultMessage: "ui.privateMessage.snippets.button.newMessage" }) })), data.snippets.length !== 0 && (_jsxs(_Fragment, { children: [_jsx(TextField, { className: classes.searchBar, variant: "outlined", margin: "normal", fullWidth: true, id: `${PREFIX}-search`, placeholder: `${intl.formatMessage(messages.placeholder)}`, size: "small", onChange: handleChange, value: search, slotProps: {
236
236
  input: {
237
237
  className: classes.input,
238
238
  startAdornment: _jsx(Icon, Object.assign({ className: classes.icon }, { children: "search" })),
package/lib/esm/components/User/User.js CHANGED
@@ -22,13 +22,14 @@ const classes = {
22
22
  root: `${PREFIX}-root`,
23
23
  avatar: `${PREFIX}-avatar`,
24
24
  staffBadgeLabel: `${PREFIX}-staff-badge-label`,
25
- groupAdminBadgeLabel: `${PREFIX}-group-admin-badge-label`
25
+ groupAdminBadgeLabel: `${PREFIX}-group-admin-badge-label`,
26
+ contrastColor: `${PREFIX}-contrast-color`
26
27
  };
27
28
  const Root = styled(BaseItemButton, {
28
29
  name: PREFIX,
29
30
  slot: 'Root',
30
- overridesResolver: (props, styles) => styles.root
31
- })(({ theme }) => ({}));
31
+ overridesResolver: (_props, styles) => styles.root
32
+ })(() => ({}));
32
33
  const PREFERENCES = [SCPreferences.STAFF_STAFF_BADGE_LABEL, SCPreferences.STAFF_STAFF_BADGE_ICON];
33
34
  /**
34
35
  * > API documentation for the Community-JS User component. Learn about the available props and the CSS API.
@@ -99,5 +100,5 @@ export default function User(inProps) {
99
100
  */
100
101
  return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ elevation: elevation }, rest, { className: classNames(classes.root, className), ButtonBaseProps: buttonProps !== null && buttonProps !== void 0 ? buttonProps : (scUser.deleted
101
102
  ? { onClick: () => setOpenAlert(true) }
102
- : { component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scUser) }), image: badgeContent ? (_jsx(Badge, Object.assign({ overlap: "circular", anchorOrigin: { vertical: 'bottom', horizontal: 'right' }, badgeContent: badgeContent }, { children: _jsx(Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) }))) : (_jsx(UserAvatar, Object.assign({ hide: !hasBadge }, { children: _jsx(Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) }))), primary: (hasBadge && preferences) || isGroupAdmin ? (_jsxs(_Fragment, { children: [scUser.username, _jsx(Chip, { component: "span", className: isGroupAdmin ? classes.groupAdminBadgeLabel : classes.staffBadgeLabel, size: "small", label: isGroupAdmin ? (_jsx(FormattedMessage, { defaultMessage: "ui.user.group.admin", id: "ui.user.group.admin" })) : (preferences[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 && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
103
+ : { component: Link, to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, scUser) }), image: badgeContent ? (_jsx(Badge, Object.assign({ overlap: "circular", anchorOrigin: { vertical: 'bottom', horizontal: 'right' }, badgeContent: badgeContent }, { children: _jsx(Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) }))) : (_jsx(UserAvatar, Object.assign({ hide: !hasBadge }, { children: _jsx(Avatar, { alt: scUser.username, src: scUser.avatar, className: classes.avatar }) }))), primary: (hasBadge && preferences) || isGroupAdmin ? (_jsxs(_Fragment, { children: [scUser.username, _jsx(Chip, { component: "span", className: classNames(classes.contrastColor, isGroupAdmin ? classes.groupAdminBadgeLabel : classes.staffBadgeLabel), size: "small", label: isGroupAdmin ? (_jsx(FormattedMessage, { defaultMessage: "ui.user.group.admin", id: "ui.user.group.admin" })) : (preferences[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 && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
103
104
  }