@selfcommunity/react-ui 0.7.0-alpha.349 → 0.7.0-alpha.350

package/lib/cjs/components/FeedObject/Activities/RelevantActivities/VoteUpActivity/VoteUpActivity.js

@@ -8,40 +8,26 @@ const react_core_1 = require("@selfcommunity/react-core");
 const react_intl_1 = require("react-intl");
 const DateTimeAgo_1 = tslib_1.__importDefault(require("../../../../../shared/DateTimeAgo"));
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
-const system_1 = require("@mui/system");
 const BaseItem_1 = tslib_1.__importDefault(require("../../../../../shared/BaseItem"));
 const UserDeletedSnackBar_1 = tslib_1.__importDefault(require("../../../../../shared/UserDeletedSnackBar"));
+const constants_1 = require("../../../constants");
 const messages = (0, react_intl_1.defineMessages)({
     vote: {
         id: 'ui.feedObject.relevantActivities.vote',
         defaultMessage: 'ui.feedObject.relevantActivities.vote'
     }
 });
-const PREFIX = 'SCVoteUpRelevantActivity';
 const classes = {
-    root: `${PREFIX}-root`,
-    avatar: `${PREFIX}-avatar`,
-    username: `${PREFIX}-username`
+    root: `${constants_1.PREFIX}-activity-vote-up-root`,
+    avatar: `${constants_1.PREFIX}-activity-vote-up-avatar`,
+    username: `${constants_1.PREFIX}-activity-vote-up-username`
 };
 const Root = (0, styles_1.styled)(BaseItem_1.default, {
-    name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({
-    [`& .${classes.username}`]: {
-        color: 'inherit'
-    },
-    [`& .${classes.avatar}`]: {
-        width: theme.selfcommunity.user.avatar.sizeMedium,
-        height: theme.selfcommunity.user.avatar.sizeMedium
-    }
-}));
-function VoteUpRelevantActivity(inProps) {
+    name: constants_1.PREFIX,
+    slot: 'ActivityVoteUpRoot'
+})(() => ({}));
+function VoteUpRelevantActivity(props) {
     // PROPS
-    const props = (0, system_1.useThemeProps)({
-        props: inProps,
-        name: PREFIX
-    });
     const { className = null, activityObject = null } = props, rest = tslib_1.__rest(props, ["className", "activityObject"]);
     // CONTEXT
     const scRoutingContext = (0, react_core_1.useSCRouting)();

package/lib/cjs/components/FeedObject/Contributors/Contributors.d.ts

@@ -33,4 +33,4 @@ export interface ContributorsFeedObjectProps {
      */
     [p: string]: any;
 }
-export default function ContributorsFeedObject(inProps: ContributorsFeedObjectProps): JSX.Element;
+export default function ContributorsFeedObject(props: ContributorsFeedObjectProps): JSX.Element;

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

@@ -12,45 +12,19 @@ const CentralProgress_1 = tslib_1.__importDefault(require("../../../shared/Centr
 const InfiniteScroll_1 = tslib_1.__importDefault(require("../../../shared/InfiniteScroll"));
 const User_1 = tslib_1.__importDefault(require("../../User"));
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
-const system_1 = require("@mui/system");
 const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
-const PREFIX = 'SCContributorsFeedObject';
+const constants_1 = require("../constants");
 const classes = {
-    root: `${PREFIX}-root`,
-    avatarGroup: `${PREFIX}-avatarGroup`,
-    btnParticipants: `${PREFIX}-btn-participants`
+    root: `${constants_1.PREFIX}-contributors-root`,
+    avatarGroup: `${constants_1.PREFIX}-contributors-avatarGroup`,
+    btnParticipants: `${constants_1.PREFIX}-contributors-btn-participants`
 };
 const Root = (0, styles_1.styled)(material_1.Box, {
-    name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({
-    minHeight: 28,
-    marginTop: 0,
-    marginBottom: 0,
-    [`& .${classes.btnParticipants}`]: {
-        marginLeft: -10
-    },
-    ['& .MuiAvatarGroup-root']: {
-        justifyContent: 'flex-end'
-    },
-    ['& .MuiAvatar-root']: {
-        backgroundColor: '#d5d5d5',
-        border: '2px solid #FFF !important',
-        color: '#FFF',
-        fontSize: '0.55rem',
-        width: theme.selfcommunity.user.avatar.sizeSmall,
-        height: theme.selfcommunity.user.avatar.sizeSmall,
-        marginLeft: theme.spacing(-1),
-        lineHeight: '24px'
-    }
-}));
-function ContributorsFeedObject(inProps) {
+    name: constants_1.PREFIX,
+    slot: 'ContributorsRoot'
+})(() => ({}));
+function ContributorsFeedObject(props) {
     // PROPS
-    const props = (0, system_1.useThemeProps)({
-        props: inProps,
-        name: PREFIX
-    });
     const { className = null, feedObjectId = null, feedObject = null, feedObjectType = null, ContributorsSkeletonProps = {}, cacheStrategy = utils_1.CacheStrategies.CACHE_FIRST } = props, rest = tslib_1.__rest(props, ["className", "feedObjectId", "feedObject", "feedObjectType", "ContributorsSkeletonProps", "cacheStrategy"]);
     const contributorsObject = (0, react_core_1.useSCFetchContributors)({
         id: feedObjectId,

package/lib/cjs/components/FeedObject/Contributors/Skeleton.d.ts

@@ -21,13 +21,13 @@ export interface ContributorsSkeleton extends BoxProps {
 
  #### Component Name
 
- The name `SCContributorsSkeleton` can be used when providing style overrides in the theme.
+ The name `SCFeedObject-contributors-skeleton-root` can be used when providing style overrides in the theme.
 
  #### CSS
 
  |Rule Name|Global class|Description|
  |---|---|---|
- |root|.SCContributorsSkeleton-root|Styles applied to the root element.|
+ |root|.SCFeedObject-contributors-skeleton-root|Styles applied to the root element.|
  *
  */
 export default function ContributorsSkeleton(props: any): JSX.Element;

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

@@ -7,20 +7,15 @@ const material_1 = require("@mui/material");
 const react_intl_1 = require("react-intl");
 const AvatarGroupSkeleton_1 = tslib_1.__importDefault(require("../../Skeleton/AvatarGroupSkeleton"));
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
-const PREFIX = 'SCContributorsSkeleton';
+const constants_1 = require("../constants");
 const classes = {
-    root: `${PREFIX}-root`,
-    btnParticipants: `${PREFIX}-btn-participants`
+    root: `${constants_1.PREFIX}-contributors-skeleton-root`,
+    btnParticipants: `${constants_1.PREFIX}-btn-participants`
 };
 const Root = (0, styles_1.styled)(material_1.Box, {
-    name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({
-    [`& .${classes.btnParticipants}`]: {
-        marginLeft: -10
-    }
-}));
+    name: constants_1.PREFIX,
+    slot: 'ContributorsSkeletonRoot'
+})(() => ({}));
 /**
  * > API documentation for the Community-JS Contributors Skeleton component. Learn about the available props and the CSS API.
 
@@ -32,13 +27,13 @@ const Root = (0, styles_1.styled)(material_1.Box, {
 
  #### Component Name
 
- The name `SCContributorsSkeleton` can be used when providing style overrides in the theme.
+ The name `SCFeedObject-contributors-skeleton-root` can be used when providing style overrides in the theme.
 
  #### CSS
 
  |Rule Name|Global class|Description|
  |---|---|---|
- |root|.SCContributorsSkeleton-root|Styles applied to the root element.|
+ |root|.SCFeedObject-contributors-skeleton-root|Styles applied to the root element.|
  *
  */
 function ContributorsSkeleton(props) {

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

@@ -37,45 +37,44 @@ const UserAvatar_1 = tslib_1.__importDefault(require("../../shared/UserAvatar"))
 const Feed_1 = require("../../constants/Feed");
 const Composer_1 = tslib_1.__importDefault(require("../Composer"));
 const FeedObjectMediaPreview_1 = tslib_1.__importDefault(require("../FeedObjectMediaPreview"));
+const constants_1 = require("./constants");
 const messages = (0, react_intl_1.defineMessages)({
     visibleToAll: {
         id: 'ui.feedObject.visibleToAll',
         defaultMessage: 'ui.feedObject.visibleToAll'
     }
 });
-const PREFIX = 'SCFeedObject';
 const classes = {
-    root: `${PREFIX}-root`,
-    deleted: `${PREFIX}-deleted`,
-    header: `${PREFIX}-header`,
-    category: `${PREFIX}-category`,
-    avatar: `${PREFIX}-avatar`,
-    username: `${PREFIX}-username`,
-    activityAt: `${PREFIX}-activity-at`,
-    tag: `${PREFIX}-tag`,
-    location: `${PREFIX}-location`,
-    content: `${PREFIX}-content`,
-    showMore: `${PREFIX}-show-more`,
-    error: `${PREFIX}-error`,
-    titleSection: `${PREFIX}-title-section`,
-    title: `${PREFIX}-title`,
-    textSection: `${PREFIX}-text-section`,
-    text: `${PREFIX}-text`,
-    snippet: `${PREFIX}-snippet`,
-    snippetContent: `${PREFIX}-snippet-content`,
-    mediasSection: `${PREFIX}-medias-section`,
-    pollsSection: `${PREFIX}-polls-section`,
-    infoSection: `${PREFIX}-info-section`,
-    actionsSection: `${PREFIX}-actions-section`,
-    replyContent: `${PREFIX}-reply-content`,
-    activitiesSection: `${PREFIX}-activities-section`,
-    activitiesContent: `${PREFIX}-activities-content`,
-    followButton: `${PREFIX}-follow-button`
+    root: `${constants_1.PREFIX}-root`,
+    deleted: `${constants_1.PREFIX}-deleted`,
+    header: `${constants_1.PREFIX}-header`,
+    category: `${constants_1.PREFIX}-category`,
+    avatar: `${constants_1.PREFIX}-avatar`,
+    username: `${constants_1.PREFIX}-username`,
+    activityAt: `${constants_1.PREFIX}-activity-at`,
+    tag: `${constants_1.PREFIX}-tag`,
+    location: `${constants_1.PREFIX}-location`,
+    content: `${constants_1.PREFIX}-content`,
+    showMore: `${constants_1.PREFIX}-show-more`,
+    error: `${constants_1.PREFIX}-error`,
+    titleSection: `${constants_1.PREFIX}-title-section`,
+    title: `${constants_1.PREFIX}-title`,
+    textSection: `${constants_1.PREFIX}-text-section`,
+    text: `${constants_1.PREFIX}-text`,
+    snippet: `${constants_1.PREFIX}-snippet`,
+    snippetContent: `${constants_1.PREFIX}-snippet-content`,
+    mediasSection: `${constants_1.PREFIX}-medias-section`,
+    pollsSection: `${constants_1.PREFIX}-polls-section`,
+    infoSection: `${constants_1.PREFIX}-info-section`,
+    actionsSection: `${constants_1.PREFIX}-actions-section`,
+    replyContent: `${constants_1.PREFIX}-reply-content`,
+    activitiesSection: `${constants_1.PREFIX}-activities-section`,
+    activitiesContent: `${constants_1.PREFIX}-activities-content`,
+    followButton: `${constants_1.PREFIX}-follow-button`
 };
 const Root = (0, styles_1.styled)(Widget_1.default, {
-    name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
+    name: constants_1.PREFIX,
+    slot: 'Root'
 })(() => ({}));
 /**
  * > API documentation for the Community-JS Feed Object component. Learn about the available props and the CSS API.
@@ -132,7 +131,7 @@ function FeedObject(inProps) {
     // PROPS
     const props = (0, system_1.useThemeProps)({
         props: inProps,
-        name: PREFIX
+        name: constants_1.PREFIX
     });
     const { id = `feed_object_${props.feedObjectId ? props.feedObjectId : props.feedObject ? props.feedObject.id : ''}`, className = null, feedObjectId = null, feedObject = null, feedObjectType = null, feedObjectActivities = null, cacheStrategy = utils_1.CacheStrategies.CACHE_FIRST, markRead = false, template = feedObject_1.SCFeedObjectTemplateType.PREVIEW, hideFollowAction = false, summaryExpanded = false, activitiesExpanded = true, activitiesExpandedType, hideParticipantsPreview = false, pollVisible = false, FollowButtonProps = {}, FeedObjectSkeletonProps = { elevation: 0 }, ActionsProps = {}, CommentObjectReplyComponent = CommentObjectReply_1.default, CommentObjectReplyComponentProps = { WidgetProps: { variant: 'outlined' } }, CommentComponentProps = { variant: 'outlined' }, CommentObjectSkeletonProps = { elevation: 0, WidgetProps: { variant: 'outlined' } }, ContributionActionsMenuProps = {}, FeedObjectMediaPreviewProps = {}, ActivitiesProps = { cacheStrategy }, PollObjectProps = { elevation: 0 }, ContributorsFeedObjectProps = {}, onReply, onHeightChange, onStateChange } = props, rest = tslib_1.__rest(props, ["id", "className", "feedObjectId", "feedObject", "feedObjectType", "feedObjectActivities", "cacheStrategy", "markRead", "template", "hideFollowAction", "summaryExpanded", "activitiesExpanded", "activitiesExpandedType", "hideParticipantsPreview", "pollVisible", "FollowButtonProps", "FeedObjectSkeletonProps", "ActionsProps", "CommentObjectReplyComponent", "CommentObjectReplyComponentProps", "CommentComponentProps", "CommentObjectSkeletonProps", "ContributionActionsMenuProps", "FeedObjectMediaPreviewProps", "ActivitiesProps", "PollObjectProps", "ContributorsFeedObjectProps", "onReply", "onHeightChange", "onStateChange"]);
     // CONTEXT
@@ -499,7 +498,7 @@ function FeedObject(inProps) {
      * Renders root object
      */
     return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${PREFIX}-${template}`) }, rest),
+        react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`) }, rest),
             obj && markRead && react_1.default.createElement(MarkRead_1.default, { endpoint: api_services_1.Endpoints.FeedObjectMarkRead, data: { object: [obj.id] } }),
             objElement),
         openAlert && react_1.default.createElement(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })));

package/lib/cjs/components/FeedObject/Poll/Choice/Choice.d.ts

@@ -33,4 +33,4 @@ export interface ChoiceProps {
      */
     [p: string]: any;
 }
-export default function Choice(inProps: ChoiceProps): JSX.Element;
+export default function Choice(props: ChoiceProps): JSX.Element;

package/lib/cjs/components/FeedObject/Poll/Choice/Choice.js

@@ -10,50 +10,25 @@ const Icon_1 = tslib_1.__importDefault(require("@mui/material/Icon"));
 const LinearProgress_1 = tslib_1.__importDefault(require("@mui/material/LinearProgress"));
 const lab_1 = require("@mui/lab");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
-const system_1 = require("@mui/system");
-const PREFIX = 'SCChoices';
+const constants_1 = require("../../constants");
 const classes = {
-    root: `${PREFIX}-root`,
-    label: `${PREFIX}-label`,
-    vote: `${PREFIX}-vote`,
-    progress: `${PREFIX}-progress`
+    root: `${constants_1.PREFIX}-poll-object-choices-root`,
+    label: `${constants_1.PREFIX}-poll-object-choices-label`,
+    vote: `${constants_1.PREFIX}-poll-object-choices-vote`,
+    progress: `${constants_1.PREFIX}-poll-object-choices-progress`
 };
 const Root = (0, styles_1.styled)(material_1.Card, {
-    name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({
-    background: theme.palette.grey['A200'],
-    marginBottom: theme.spacing(2),
-    padding: theme.spacing(2),
-    width: '100%',
-    [`& .${classes.label}, & .${classes.vote}`]: {
-        marginBottom: theme.spacing()
-    },
-    [`& .${classes.progress}`]: {
-        display: 'flex',
-        flexDirection: 'row',
-        alignItems: 'center',
-        marginBottom: theme.spacing(),
-        '& .MuiLinearProgress-root': {
-            flexGrow: 2,
-            marginRight: theme.spacing(2),
-            backgroundColor: theme.palette.common.white
-        }
-    }
-}));
+    name: constants_1.PREFIX,
+    slot: 'PollObjectChoicesRoot'
+})(() => ({}));
 function LinearProgressWithLabel(_a) {
     var { className } = _a, props = tslib_1.__rest(_a, ["className"]);
     return (react_1.default.createElement(material_1.Box, { className: className },
         react_1.default.createElement(LinearProgress_1.default, Object.assign({ variant: "determinate" }, props)),
         react_1.default.createElement(material_1.Typography, { variant: "body2", color: "text.secondary" }, `${Math.round(props.value)}%`)));
 }
-function Choice(inProps) {
+function Choice(props) {
     //PROPS
-    const props = (0, system_1.useThemeProps)({
-        props: inProps,
-        name: PREFIX
-    });
     const { className = null, choiceObj = null, feedObject = null, vote = null, votes = null, isVoting = null, votable = null } = props, rest = tslib_1.__rest(props, ["className", "choiceObj", "feedObject", "vote", "votes", "isVoting", "votable"]);
     const disabled = !feedObject;
     // CONTEXT

package/lib/cjs/components/FeedObject/Poll/Poll.d.ts

@@ -38,4 +38,4 @@ export interface PollObjectProps {
      */
     [p: string]: any;
 }
-export default function PollObject(inProps: PollObjectProps): JSX.Element;
+export default function PollObject(props: PollObjectProps): JSX.Element;

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

@@ -13,7 +13,7 @@ const Choice_1 = tslib_1.__importDefault(require("./Choice"));
 const Icon_1 = tslib_1.__importDefault(require("@mui/material/Icon"));
 const Errors_1 = require("../../../constants/Errors");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
-const system_1 = require("@mui/system");
+const constants_1 = require("../constants");
 const messages = (0, react_intl_1.defineMessages)({
     showPoll: {
         id: 'ui.feedObject.poll.showPoll',
@@ -36,29 +36,23 @@ const messages = (0, react_intl_1.defineMessages)({
         defaultMessage: 'ui.feedObject.poll.votes'
     }
 });
-const PREFIX = 'SCPollObject';
 const classes = {
-    root: `${PREFIX}-root`,
-    voters: `${PREFIX}-voters`,
-    votes: `${PREFIX}-votes`,
-    toggleButton: `${PREFIX}-toggle-button`,
-    title: `${PREFIX}-title`,
-    expiration: `${PREFIX}-expiration`,
-    closed: `${PREFIX}-closed`,
-    expandIcon: `${PREFIX}-expand-icon`,
-    collapsedIcon: `${PREFIX}-collapsed-icon`
+    root: `${constants_1.PREFIX}-poll-object-root`,
+    voters: `${constants_1.PREFIX}-poll-object-voters`,
+    votes: `${constants_1.PREFIX}-poll-object-votes`,
+    toggleButton: `${constants_1.PREFIX}-poll-object-toggle-button`,
+    title: `${constants_1.PREFIX}-poll-object-title`,
+    expiration: `${constants_1.PREFIX}-poll-object-expiration`,
+    closed: `${constants_1.PREFIX}-poll-object-closed`,
+    expandIcon: `${constants_1.PREFIX}-poll-object-expand-icon`,
+    collapsedIcon: `${constants_1.PREFIX}-poll-object-collapsed-icon`
 };
 const Root = (0, styles_1.styled)(Card_1.default, {
-    name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({}));
-function PollObject(inProps) {
+    name: constants_1.PREFIX,
+    slot: 'PollObjectRoot'
+})(() => ({}));
+function PollObject(props) {
     //  PROPS
-    const props = (0, system_1.useThemeProps)({
-        props: inProps,
-        name: PREFIX
-    });
     const { className, feedObject, pollObject, disabled, visible = true, onChange, onToggleVisibility } = props, rest = tslib_1.__rest(props, ["className", "feedObject", "pollObject", "disabled", "visible", "onChange", "onToggleVisibility"]);
     // INTL
     const intl = (0, react_intl_1.useIntl)();

package/lib/cjs/components/FeedObject/Skeleton.d.ts

@@ -22,14 +22,14 @@ export interface FeedObjectSkeletonProps extends CardProps {
 
  #### Component Name
 
- The name `SCFeedObjectSkeleton` can be used when providing style overrides in the theme.
+ The name `SCFeedObject-skeleton-root` can be used when providing style overrides in the theme.
 
  #### CSS
 
  |Rule Name|Global class|Description|
  |---|---|---|
- |root|.SCFeedObjectSkeleton-root|Styles applied to the root element.|
- |media|.SCFeedObjectSkeleton-media|Styles applied to the media element.|
+ |root|.SCFeedObject-skeleton-root|Styles applied to the root element.|
+ |media|.SCFeedObject-media|Styles applied to the media element.|
  *
  */
 export default function FeedObjectSkeleton(props: {

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

@@ -8,15 +8,14 @@ const Skeleton_1 = tslib_1.__importDefault(require("@mui/material/Skeleton"));
 const feedObject_1 = require("../../types/feedObject");
 const material_1 = require("@mui/material");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
-const PREFIX = 'SCFeedObjectSkeleton';
+const constants_1 = require("./constants");
 const classes = {
-    root: `${PREFIX}-root`,
-    media: `${PREFIX}-media`
+    root: `${constants_1.PREFIX}-skeleton-root`,
+    media: `${constants_1.PREFIX}-media`
 };
 const Root = (0, styles_1.styled)(Widget_1.default, {
-    name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
+    name: constants_1.PREFIX,
+    slot: 'SkeletonRoot'
 })(() => ({}));
 /**
  * > API documentation for the Community-JS Feed Object Skeleton component. Learn about the available props and the CSS API.
@@ -29,14 +28,14 @@ const Root = (0, styles_1.styled)(Widget_1.default, {
 
  #### Component Name
 
- The name `SCFeedObjectSkeleton` can be used when providing style overrides in the theme.
+ The name `SCFeedObject-skeleton-root` can be used when providing style overrides in the theme.
 
  #### CSS
 
  |Rule Name|Global class|Description|
  |---|---|---|
- |root|.SCFeedObjectSkeleton-root|Styles applied to the root element.|
- |media|.SCFeedObjectSkeleton-media|Styles applied to the media element.|
+ |root|.SCFeedObject-skeleton-root|Styles applied to the root element.|
+ |media|.SCFeedObject-media|Styles applied to the media element.|
  *
  */
 function FeedObjectSkeleton(props) {
@@ -62,6 +61,6 @@ function FeedObjectSkeleton(props) {
                     react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 10, width: "80%", style: { marginBottom: 6 } }),
                     react_1.default.createElement(Skeleton_1.default, { animation: "wave", height: 10, width: "60%", style: { marginBottom: 6 } })))));
     }
-    return (react_1.default.createElement(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, `${PREFIX}-${template}`) }, rest), obj));
+    return (react_1.default.createElement(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, `${constants_1.PREFIX}-${template}`) }, rest), obj));
 }
 exports.default = FeedObjectSkeleton;

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

@@ -0,0 +1 @@
+export declare const PREFIX = "SCFeedObject";

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

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PREFIX = void 0;
+exports.PREFIX = 'SCFeedObject';

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

@@ -23,13 +23,13 @@ export interface FeedObjectMediaPreviewProps extends BoxProps {
  import {FeedObjectMediaPreview} from '@selfcommunity/react-ui';
  ```
  #### Component Name
- The name `SCFeedObjectMediaPreview` can be used when providing style overrides in the theme.
+ The name `SCFeedObject-media-preview-root` can be used when providing style overrides in the theme.
 
  #### CSS
 
  |Rule Name|Global class|Description|
  |---|---|---|
- |root|.SCFeedObjectMediaPreview-root|Styles applied to the root element.|
+ |root|.SCFeedObject-media-preview-root|Styles applied to the root element.|
 
 
  * @param inProps

package/lib/cjs/components/FeedObjectMediaPreview/FeedObjectMediaPreview.js

@@ -8,14 +8,14 @@ const react_core_1 = require("@selfcommunity/react-core");
 const system_1 = require("@mui/system");
 const Media_1 = require("../../shared/Media");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
-const PREFIX = 'SCFeedObjectMediaPreview';
+const constants_1 = require("../FeedObject/constants");
 const classes = {
-    root: `${PREFIX}-root`
+    root: `${constants_1.PREFIX}-media-preview-root`
 };
 const Root = (0, styles_1.styled)(Box_1.default, {
-    name: PREFIX,
-    slot: 'Root'
-})(({ theme }) => ({}));
+    name: constants_1.PREFIX,
+    slot: 'MediaPreviewRoot'
+})(() => ({}));
 /**
  * > API documentation for the Community-JS FeedObjectMediaPreview component. Learn about the available props and the CSS API.
  *
@@ -27,13 +27,13 @@ const Root = (0, styles_1.styled)(Box_1.default, {
  import {FeedObjectMediaPreview} from '@selfcommunity/react-ui';
  ```
  #### Component Name
- The name `SCFeedObjectMediaPreview` can be used when providing style overrides in the theme.
+ The name `SCFeedObject-media-preview-root` can be used when providing style overrides in the theme.
 
  #### CSS
 
  |Rule Name|Global class|Description|
  |---|---|---|
- |root|.SCFeedObjectMediaPreview-root|Styles applied to the root element.|
+ |root|.SCFeedObject-media-preview-root|Styles applied to the root element.|
 
 
  * @param inProps
@@ -42,7 +42,7 @@ exports.default = (inProps) => {
     //PROPS
     const props = (0, system_1.useThemeProps)({
         props: inProps,
-        name: PREFIX
+        name: constants_1.PREFIX
     });
     const { className, medias, mediaObjectTypes = [Media_1.File, Media_1.Link, Media_1.Share] } = props, rest = tslib_1.__rest(props, ["className", "medias", "mediaObjectTypes"]);
     const { handleMediaClick } = (0, react_core_1.useSCMediaClick)();

package/lib/cjs/components/FeedUpdatesWidget/FeedUpdatesWidget.js

@@ -10,15 +10,14 @@ const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const Widget_1 = tslib_1.__importDefault(require("../Widget"));
 const system_1 = require("@mui/system");
 const HiddenPlaceholder_1 = tslib_1.__importDefault(require("../../shared/HiddenPlaceholder"));
-const PREFIX = 'SCFeedUpdatesWidget';
+const constants_1 = require("./constants");
 const classes = {
-    root: `${PREFIX}-root`,
-    buttonLoadMore: `${PREFIX}-button-load-more`
+    root: `${constants_1.PREFIX}-root`,
+    buttonLoadMore: `${constants_1.PREFIX}-button-load-more`
 };
 const Root = (0, styles_1.styled)(Widget_1.default, {
-    name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
+    name: constants_1.PREFIX,
+    slot: 'Root'
 })(() => ({}));
 /**
  * > API documentation for the Community-JS Feed Updates Widget component. Learn about the available props and the CSS API.
@@ -51,7 +50,7 @@ function FeedUpdatesWidget(inProps) {
     // PROPS
     const props = (0, system_1.useThemeProps)({
         props: inProps,
-        name: PREFIX
+        name: constants_1.PREFIX
     });
     const { id = 'feed_updates', className = null, message = react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.feedUpdatesWidget.message", defaultMessage: "ui.feedUpdatesWidget.message" }), subscriptionChannel, subscriptionChannelUpdatesCallback = (msg, data) => true, publicationChannel = null, onHeightChange } = props, rest = tslib_1.__rest(props, ["id", "className", "message", "subscriptionChannel", "subscriptionChannelUpdatesCallback", "publicationChannel", "onHeightChange"]);
     // STATE

package/lib/cjs/components/FeedUpdatesWidget/Skeleton.d.ts

@@ -9,14 +9,14 @@
 
  #### Component Name
 
- The name `SCFeedUpdatesWidgetSkeleton` can be used when providing style overrides in the theme.
+ The name `SCFeedUpdatesWidget-skeleton-root` can be used when providing style overrides in the theme.
 
  #### CSS
 
  |Rule Name|Global class|Description|
  |---|---|---|
- |root|.SCFeedUpdatesWidgetSkeleton-root|Styles applied to the root element.|
- |list|.SCFeedUpdatesWidgetSkeleton-list|Styles applied to the list element.|
+ |root|.SCFeedUpdatesWidget-skeleton-root|Styles applied to the root element.|
+ |list|.SCFeedUpdatesWidget-list|Styles applied to the list element.|
  *
  */
 export default function FeedUpdatesWidgetSkeleton(props: any): JSX.Element;

package/lib/cjs/components/FeedUpdatesWidget/Skeleton.js

@@ -4,12 +4,15 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const styles_1 = require("@mui/material/styles");
 const GenericSkeleton_1 = tslib_1.__importDefault(require("../Skeleton/GenericSkeleton"));
-const PREFIX = 'SCFeedUpdatesWidgetSkeleton';
+const constants_1 = require("./constants");
 const classes = {
-    root: `${PREFIX}-root`,
-    list: `${PREFIX}-list`
+    root: `${constants_1.PREFIX}-skeleton-root`,
+    list: `${constants_1.PREFIX}-list`
 };
-const Root = (0, styles_1.styled)(GenericSkeleton_1.default)(() => ({}));
+const Root = (0, styles_1.styled)(GenericSkeleton_1.default, {
+    name: constants_1.PREFIX,
+    slot: 'SkeletonRoot'
+})(() => ({}));
 /**
  * > API documentation for the Community-JS Feed Updates Widget Skeleton component. Learn about the available props and the CSS API.
 
@@ -21,14 +24,14 @@ const Root = (0, styles_1.styled)(GenericSkeleton_1.default)(() => ({}));
 
  #### Component Name
 
- The name `SCFeedUpdatesWidgetSkeleton` can be used when providing style overrides in the theme.
+ The name `SCFeedUpdatesWidget-skeleton-root` can be used when providing style overrides in the theme.
 
  #### CSS
 
  |Rule Name|Global class|Description|
  |---|---|---|
- |root|.SCFeedUpdatesWidgetSkeleton-root|Styles applied to the root element.|
- |list|.SCFeedUpdatesWidgetSkeleton-list|Styles applied to the list element.|
+ |root|.SCFeedUpdatesWidget-skeleton-root|Styles applied to the root element.|
+ |list|.SCFeedUpdatesWidget-list|Styles applied to the list element.|
  *
  */
 function FeedUpdatesWidgetSkeleton(props) {

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

@@ -0,0 +1 @@
+export declare const PREFIX = "SCFeedUpdatesWidget";

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

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PREFIX = void 0;
+exports.PREFIX = 'SCFeedUpdatesWidget';

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

@@ -46,7 +46,8 @@ export interface FooterProps {
  |Rule Name|Global class|Description|
  |---|---|---|
  |root|.SCFooter-root|Styles applied to the root element.|
- |link|.SCFooter-link-item|Styles applied to the link item element.|
+ |item|.SCFooter-item|Styles applied to the item element.|
+ |itemList|.SCFooter-item-list|Styles applied to the item list element.|
  |copyright|.SCFooter-copyright|Styles applied to the copyright section.|
 
  * @param inProps