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

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

@@ -1,14 +1,13 @@
 import React from 'react';
 import { GenericSkeleton } from '../Skeleton';
 import { styled } from '@mui/material/styles';
-const PREFIX = 'SCCustomAdvSkeleton';
+import { PREFIX } from './constants';
 const classes = {
-    root: `${PREFIX}-root`
+    root: `${PREFIX}-skeleton-root`
 };
 const Root = styled(GenericSkeleton, {
     name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
+    slot: 'SkeletonRoot'
 })(({ theme }) => ({}));
 /**
  * > API documentation for the Community-JS Custom Adv Skeleton component. Learn about the available props and the CSS API.
@@ -21,13 +20,13 @@ const Root = styled(GenericSkeleton, {
 
  #### Component Name
 
- The name `SCCustomAdvSkeleton` can be used when providing style overrides in the theme.
+ The name `SCCustomAdv-skeleton-root` can be used when providing style overrides in the theme.
 
  #### CSS
 
  |Rule Name|Global class|Description|
  |---|---|---|
- |root|.SCCustomAdvSkeleton-root|Styles applied to the root element.|
+ |root|.SCCustomAdv-skeleton-root|Styles applied to the root element.|
  *
  */
 export default function CustomAdvSkeleton() {

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

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

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

@@ -0,0 +1 @@
+export const PREFIX = 'SCCustomAdv';

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

@@ -1,4 +1,4 @@
-import React, { forwardRef, useCallback, useImperativeHandle, useMemo, useRef, useState, } from 'react';
+import React, { forwardRef, useCallback, useImperativeHandle, useMemo, useRef, useState } from 'react';
 import { styled } from '@mui/material/styles';
 import { FormattedMessage } from 'react-intl';
 import { Box, Stack } from '@mui/material';
@@ -19,7 +19,7 @@ import { ListPlugin } from '@lexical/react/LexicalListPlugin';
 import FloatingLinkPlugin from './plugins/FloatingLinkPlugin';
 import OnBlurPlugin from './plugins/OnBlurPlugin';
 import OnFocusPlugin from './plugins/OnFocusPlugin';
-const PREFIX = 'SCEditor';
+import { PREFIX } from './constants';
 const classes = {
     root: `${PREFIX}-root`,
     focused: `${PREFIX}-focused`,

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

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

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

@@ -1,15 +1,14 @@
 import React from 'react';
 import { GenericSkeleton } from '../Skeleton';
 import { styled } from '@mui/material/styles';
-const PREFIX = 'SCEditorSkeleton';
+import { PREFIX } from './constants';
 const classes = {
-    root: `${PREFIX}-root`
+    root: `${PREFIX}-skeleton-root`
 };
 const Root = styled(GenericSkeleton, {
     name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({}));
+    slot: 'SkeletonRoot'
+})(() => ({}));
 /**
  * > API documentation for the Community-JS Editor Skeleton component. Learn about the available props and the CSS API.
 
@@ -21,13 +20,13 @@ const Root = styled(GenericSkeleton, {
 
  #### Component Name
 
- The name `SCEditorSkeleton` can be used when providing style overrides in the theme.
+ The name `SCEditor-skeleton-root` can be used when providing style overrides in the theme.
 
  #### CSS
 
  |Rule Name|Global class|Description|
  |---|---|---|
- |root|.SCEditorSkeleton-root|Styles applied to the root element.|
+ |root|.SCEditor-skeleton-root|Styles applied to the root element.|
  *
  */
 export default function EditorSkeleton() {

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

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

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

@@ -0,0 +1 @@
+export const PREFIX = 'SCEditor';

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

@@ -4,6 +4,7 @@ import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext
 import { Fade, Icon, IconButton, Popover, useMediaQuery, useTheme } from '@mui/material';
 import { styled } from '@mui/material/styles';
 import EmojiPicker from '../../../shared/EmojiPicker';
+import { PREFIX } from '../constants';
 function Emoji({ editor, className = '' }) {
     // STATE
     const theme = useTheme();
@@ -34,15 +35,13 @@ function Emoji({ editor, className = '' }) {
             } },
             React.createElement(EmojiPicker, { onEmojiClick: handleEmojiClick }))));
 }
-const PREFIX = 'SCEditorEmojiPlugin';
 const classes = {
-    root: `${PREFIX}-root`
+    root: `${PREFIX}-emoji-plugin-root`
 };
 const Root = styled(Emoji, {
     name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({}));
+    slot: 'EmojiPluginRoot'
+})(() => ({}));
 export default function EmojiPlugin() {
     const [editor] = useLexicalComposerContext();
     return React.createElement(Root, { editor: editor, className: classes.root });

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

@@ -9,15 +9,14 @@ import { isValidUrl } from '@selfcommunity/utils';
 import { styled } from '@mui/material/styles';
 import { IconButton, InputAdornment, Paper, Popper, TextField } from '@mui/material';
 import Icon from '@mui/material/Icon';
-const PREFIX = 'SCEditorFloatingLinkPlugin';
+import { PREFIX } from '../constants';
 const classes = {
-    root: `${PREFIX}-root`
+    root: `${PREFIX}-floating-link-plugin-root`
 };
 const Root = styled(Popper, {
     name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({}));
+    slot: 'FloatingLinkPluginRoot'
+})(() => ({}));
 function FloatingLinkPlugin({ editor, isLink, setIsLink }) {
     const [anchorEl, setAnchorEl] = useState(null);
     const [linkUrl, setLinkUrl] = useState('');
@@ -99,13 +98,13 @@ function FloatingLinkPlugin({ editor, isLink, setIsLink }) {
             React.createElement(TextField, { size: "small", value: linkUrl, variant: "outlined", onChange: (event) => {
                     setLinkUrl(event.target.value);
                 }, InputProps: {
-                    endAdornment: React.createElement(InputAdornment, { position: "end" },
+                    endAdornment: (React.createElement(InputAdornment, { position: "end" },
                         React.createElement(IconButton, { size: "small", tabIndex: 0, onClick: () => {
                                 setIsLink(false);
                             } },
                             React.createElement(Icon, null, "close")),
                         React.createElement(IconButton, { size: "small", tabIndex: 1, onClick: handleLinkSubmission },
-                            React.createElement(Icon, null, "check")))
+                            React.createElement(Icon, null, "check"))))
                 } }))));
 }
 function useFloatingLinkEditorToolbar(editor) {

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

@@ -8,6 +8,7 @@ import { createHashtagNode, HashtagNode } from '../nodes/HashtagNode';
 import { CategoryService } from '@selfcommunity/api-services';
 import classNames from 'classnames';
 import { styled } from '@mui/material/styles';
+import { PREFIX } from '../constants';
 const PUNCTUATION = '\\.,\\+\\*\\?\\$\\@\\|#{}\\(\\)\\^\\-\\[\\]\\\\/!%\'"~=<>_:;';
 const NAME = '\\b[A-Z][^\\s' + PUNCTUATION + ']';
 const DocumentHashtagsRegex = {
@@ -344,15 +345,13 @@ function isSelectionOnEntityBoundary(editor, offset) {
         return false;
     });
 }
-const PREFIX = 'SCEditorHashtagPlugin';
 const classes = {
-    root: `${PREFIX}-root`
+    root: `${PREFIX}-hashtag-plugin-root`
 };
 const Root = styled(HashtagsTypeahead, {
     name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({}));
+    slot: 'HashtagPluginRoot'
+})(() => ({}));
 function useHashtags(editor, containerSelector = null) {
     const [resolution, setResolution] = useState(null);
     useEffect(() => {

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

@@ -1,6 +1,6 @@
 import { __rest } from "tslib";
 import React, { forwardRef, useEffect, useState } from 'react';
-import { COMMAND_PRIORITY_EDITOR, createCommand, } from 'lexical';
+import { COMMAND_PRIORITY_EDITOR, createCommand } from 'lexical';
 import { $insertNodeToNearestRoot } from '@lexical/utils';
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
 import { CircularProgress, Icon, IconButton } from '@mui/material';
@@ -12,6 +12,7 @@ import MediaChunkUploader from '../../../shared/MediaChunkUploader';
 import { asUploadButton } from '@rpldy/upload-button';
 import { useSnackbar } from 'notistack';
 import { $createImageNode, ImageNode } from '../nodes/ImageNode';
+import { PREFIX } from '../constants';
 export const INSERT_IMAGE_COMMAND = createCommand();
 const UploadButton = asUploadButton(forwardRef((_a, ref) => {
     var { progress = null } = _a, rest = __rest(_a, ["progress"]);
@@ -65,15 +66,13 @@ function Image({ editor, className = '' }) {
                 progress: Object.keys(uploading).length !== 0 ? Object.values(uploading)[0].completed : null
             } })));
 }
-const PREFIX = 'SCEditorImagePlugin';
 const classes = {
-    root: `${PREFIX}-root`
+    root: `${PREFIX}-image-plugin-root`
 };
 const Root = styled(Image, {
     name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({}));
+    slot: 'ImagePluginRoot'
+})(() => ({}));
 export default function ImagePlugin() {
     const [editor] = useLexicalComposerContext();
     useEffect(() => {

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

@@ -9,6 +9,7 @@ import classNames from 'classnames';
 import { Avatar, Portal } from '@mui/material';
 import { styled } from '@mui/material/styles';
 import ClickAwayListener from '@mui/material/ClickAwayListener';
+import { PREFIX } from '../constants';
 const PUNCTUATION = '\\.,\\+\\*\\?\\$\\@\\|#{}\\(\\)\\^\\-\\[\\]\\\\/!%\'"~=<>_:;';
 const NAME = '\\b[A-Z][^\\s' + PUNCTUATION + ']';
 const DocumentMentionsRegex = {
@@ -469,15 +470,13 @@ function isSelectionOnEntityBoundary(editor, offset) {
         return false;
     });
 }
-const PREFIX = 'SCEditorMentionPlugin';
 const classes = {
-    root: `${PREFIX}-root`
+    root: `${PREFIX}-mention-plugin-root`
 };
 const Root = styled(MentionsTypeahead, {
     name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({}));
+    slot: 'MentionPluginRoot'
+})(() => ({}));
 function useMentions(editor, anchorClassName = null) {
     const [resolution, setResolution] = useState(null);
     const anchorElementRef = useMenuAnchorRef(resolution, setResolution, anchorClassName);

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

@@ -24,6 +24,7 @@ import { useThemeProps } from '@mui/system';
 import ImagePlugin from './ImagePlugin';
 import EmojiPlugin from './EmojiPlugin';
 import { INSERT_HORIZONTAL_RULE_COMMAND } from '@lexical/react/LexicalHorizontalRuleNode';
+import { PREFIX } from '../constants';
 const blockTypeToBlockIcon = {
     h1: 'format_heading_1',
     h2: 'format_heading_2',
@@ -123,16 +124,14 @@ function BlockFormatIconButton({ className = '', editor, blockType, disabled = f
         React.createElement(Menu, { anchorEl: anchorEl, open: Boolean(anchorEl), onClose: handleClose }, Object.keys(blockTypeToBlockIcon).map((block) => (React.createElement(MenuItem, { key: block, onClick: handleSelect(block) },
             React.createElement(Icon, null, blockTypeToBlockIcon[block])))))));
 }
-const PREFIX = 'SCEditorToolbarPlugin';
 const classes = {
-    root: `${PREFIX}-root`,
+    root: `${PREFIX}-toolbar-plugin-root`,
     blockFormat: `${PREFIX}-block-format`
 };
 const Root = styled(Box, {
     name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({}));
+    slot: 'ToolbarPluginRoot'
+})(() => ({}));
 export default function ToolbarPlugin(inProps) {
     // PROPS
     const props = useThemeProps({

package/lib/esm/components/Feed/Feed.js

@@ -1,6 +1,6 @@
 // @ts-nocheck
-import React, { forwardRef, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState, } from 'react';
-import { Link, SCCache, SCPreferences, SCPreferencesContext, SCUserContext, useIsComponentMountedRef, usePreviousValue, useSCFetchFeed, } from '@selfcommunity/react-core';
+import React, { forwardRef, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
+import { Link, SCCache, SCPreferences, SCPreferencesContext, SCUserContext, useIsComponentMountedRef, usePreviousValue, useSCFetchFeed } from '@selfcommunity/react-core';
 import { styled, useTheme } from '@mui/material/styles';
 import { Box, CardContent, Grid, Hidden, useMediaQuery } from '@mui/material';
 import { FormattedMessage } from 'react-intl';
@@ -13,15 +13,15 @@ import PubSub from 'pubsub-js';
 import { useThemeProps } from '@mui/system';
 import Widget from '../Widget';
 import InfiniteScroll from '../../shared/InfiniteScroll';
-import VirtualizedScroller, { VirtualScrollChild, } from '../../shared/VirtualizedScroller';
+import VirtualizedScroller, { VirtualScrollChild } from '../../shared/VirtualizedScroller';
 import { DEFAULT_WIDGETS_NUMBER, WIDGET_PREFIX_KEY } from '../../constants/Feed';
-import { DEFAULT_PAGINATION_LIMIT, DEFAULT_PAGINATION_OFFSET, DEFAULT_PAGINATION_QUERY_PARAM_NAME, } from '../../constants/Pagination';
+import { DEFAULT_PAGINATION_LIMIT, DEFAULT_PAGINATION_OFFSET, DEFAULT_PAGINATION_QUERY_PARAM_NAME } from '../../constants/Pagination';
 import { widgetSort } from '../../utils/feed';
 import Footer from '../Footer';
 import FeedSkeleton from './Skeleton';
 import { useDeepCompareEffectNoCheck } from 'use-deep-compare-effect';
 import StickyBoxComp from '../../shared/StickyBox';
-const PREFIX = 'SCFeed';
+import { PREFIX } from './constants';
 const classes = {
     root: `${PREFIX}-root`,
     left: `${PREFIX}-left`,
@@ -35,8 +35,7 @@ const classes = {
 };
 const Root = styled(Grid, {
     name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
+    slot: 'Root'
 })(() => ({}));
 const PREFERENCES = [SCPreferences.ADVERTISING_CUSTOM_ADV_ENABLED, SCPreferences.ADVERTISING_CUSTOM_ADV_ONLY_FOR_ANONYMOUS_USERS_ENABLED];
 /**

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

@@ -23,15 +23,15 @@ export declare type FeedSkeletonProps = React.PropsWithChildren<FeedSkeletonMap>
 
  #### Component Name
 
- The name `SCFeedSkeleton` can be used when providing style overrides in the theme.
+ The name `SCFeed-skeleton-root` can be used when providing style overrides in the theme.
 
  #### CSS
 
  |Rule Name|Global class|Description|
  |---|---|---|
- |root|.SCFeedSkeleton-root|Styles applied to the root element.|
- |left|.SCFeedSkeleton-left|Styles applied to the left section.|
- |right|.SCFeedSkeleton-right|Styles applied to the right section.|
+ |root|.SCFeed-skeleton-root|Styles applied to the root element.|
+ |left|.SCFeed-left|Styles applied to the left section.|
+ |right|.SCFeed-right|Styles applied to the right section.|
  *
  */
 export default function FeedSkeleton(props: FeedSkeletonProps): JSX.Element;

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

@@ -3,17 +3,16 @@ import { styled } from '@mui/material/styles';
 import { Grid, Hidden } from '@mui/material';
 import { GenericSkeleton } from '../Skeleton';
 import classNames from 'classnames';
-const PREFIX = 'SCFeedSkeleton';
+import { PREFIX } from './constants';
 const classes = {
-    root: `${PREFIX}-root`,
+    root: `${PREFIX}-skeleton-root`,
     left: `${PREFIX}-left`,
     right: `${PREFIX}-right`
 };
 const Root = styled(Grid, {
     name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({}));
+    slot: 'SkeletonRoot'
+})(() => ({}));
 /**
  * > API documentation for the Community-JS Feed Skeleton component. Learn about the available props and the CSS API.
 
@@ -25,15 +24,15 @@ const Root = styled(Grid, {
 
  #### Component Name
 
- The name `SCFeedSkeleton` can be used when providing style overrides in the theme.
+ The name `SCFeed-skeleton-root` can be used when providing style overrides in the theme.
 
  #### CSS
 
  |Rule Name|Global class|Description|
  |---|---|---|
- |root|.SCFeedSkeleton-root|Styles applied to the root element.|
- |left|.SCFeedSkeleton-left|Styles applied to the left section.|
- |right|.SCFeedSkeleton-right|Styles applied to the right section.|
+ |root|.SCFeed-skeleton-root|Styles applied to the root element.|
+ |left|.SCFeed-left|Styles applied to the left section.|
+ |right|.SCFeed-right|Styles applied to the right section.|
  *
  */
 export default function FeedSkeleton(props) {

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

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

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

@@ -0,0 +1 @@
+export const PREFIX = 'SCFeed';

package/lib/esm/components/FeedObject/Actions/Actions.d.ts

@@ -65,4 +65,4 @@ export interface ActionsProps {
      */
     ShareActionProps?: ShareProps;
 }
-export default function Actions(inProps: ActionsProps): JSX.Element;
+export default function Actions(props: ActionsProps): JSX.Element;

package/lib/esm/components/FeedObject/Actions/Actions.js

@@ -7,29 +7,17 @@ import Share from './Share';
 import { useSCFetchFeedObject } from '@selfcommunity/react-core';
 import { SCFeedObjectTemplateType } from '../../../types/feedObject';
 import classNames from 'classnames';
-import { useThemeProps } from '@mui/system';
-const PREFIX = 'SCFeedObjectActions';
+import { PREFIX } from '../constants';
 const classes = {
-    root: `${PREFIX}-root`,
-    action: `${PREFIX}-action`
+    root: `${PREFIX}-actions-root`,
+    action: `${PREFIX}-actions-action`
 };
 const Root = styled(Grid, {
     name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(() => ({
-    margin: '0px 0px',
-    color: '#3A3A3A',
-    [`& .${classes.action}`]: {
-        textAlign: 'center'
-    }
-}));
-export default function Actions(inProps) {
+    slot: 'ActionsRoot'
+})(() => ({}));
+export default function Actions(props) {
     // PROPS
-    const props = useThemeProps({
-        props: inProps,
-        name: PREFIX
-    });
     const { className, feedObject, feedObjectId = feedObject === null || feedObject === void 0 ? void 0 : feedObject.id, feedObjectType = feedObject === null || feedObject === void 0 ? void 0 : feedObject.type, feedObjectTemplate = SCFeedObjectTemplateType.PREVIEW, hideVoteAction = false, hideShareAction = false, hideCommentAction = false, handleExpandActivities, VoteActionProps = {}, CommentActionProps = {}, ShareActionProps = {} } = props;
     // STATE
     const { obj } = useSCFetchFeedObject({ id: feedObjectId, feedObject, feedObjectType });

package/lib/esm/components/FeedObject/Actions/Comment/Comment.d.ts

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

package/lib/esm/components/FeedObject/Actions/Comment/Comment.js

@@ -10,7 +10,7 @@ import { SCFeedObjectTemplateType } from '../../../../types/feedObject';
 import { getContributionRouteName, getRouteData } from '../../../../utils/contribution';
 import classNames from 'classnames';
 import Skeleton from '@mui/material/Skeleton';
-import { useThemeProps } from '@mui/system';
+import { PREFIX } from '../../constants';
 const messages = defineMessages({
     comments: {
         id: 'ui.feedObject.comment.comments',
@@ -21,24 +21,18 @@ const messages = defineMessages({
         defaultMessage: 'ui.feedObject.comment.comment'
     }
 });
-const PREFIX = 'SCCommentAction';
 const classes = {
-    root: `${PREFIX}-root`,
-    divider: `${PREFIX}-divider`,
-    inline: `${PREFIX}-inline`,
-    button: `${PREFIX}-button`,
-    viewAudienceButton: `${PREFIX}-view-audience-button`
+    root: `${PREFIX}-action-comment-root`,
+    divider: `${PREFIX}-action-comment-divider`,
+    inline: `${PREFIX}-action-comment-inline`,
+    button: `${PREFIX}-action-comment-button`,
+    viewAudienceButton: `${PREFIX}-action-comment-view-audience-button`
 };
 const Root = styled(Box, {
     name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({}));
-export default function Comment(inProps) {
-    const props = useThemeProps({
-        props: inProps,
-        name: PREFIX
-    });
+    slot: 'ActionCommentRoot'
+})(() => ({}));
+export default function Comment(props) {
     // PROPS
     const { className, feedObjectId, feedObject, feedObjectType = SCContributionType.POST, feedObjectTemplate = SCFeedObjectTemplateType, withAction = true, withAudience = true, inlineAction = false, onViewCommentsAction, onCommentAction } = props, rest = __rest(props, ["className", "feedObjectId", "feedObject", "feedObjectType", "feedObjectTemplate", "withAction", "withAudience", "inlineAction", "onViewCommentsAction", "onCommentAction"]);
     // STATE

package/lib/esm/components/FeedObject/Actions/Follow/Follow.d.ts

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

package/lib/esm/components/FeedObject/Actions/Follow/Follow.js

@@ -12,26 +12,20 @@ import { SCContributionType } from '@selfcommunity/types';
 import { Endpoints, http } from '@selfcommunity/api-services';
 import { Logger } from '@selfcommunity/utils';
 import { useSCContext, useSCFetchFeedObject, useSCUser } from '@selfcommunity/react-core';
-import { useThemeProps } from '@mui/system';
 import { catchUnauthorizedActionByBlockedUser } from '../../../../utils/errors';
-const PREFIX = 'SCFollowAction';
+import { PREFIX } from '../../constants';
 const classes = {
-    root: `${PREFIX}-root`,
-    button: `${PREFIX}-button`,
-    iconized: `${PREFIX}-iconized`,
-    followed: `${PREFIX}-followed`
+    root: `${PREFIX}-action-follow-root`,
+    button: `${PREFIX}-action-follow-button`,
+    iconized: `${PREFIX}-action-follow-iconized`,
+    followed: `${PREFIX}-action-follow-followed`
 };
 const Root = styled(Box, {
     name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({}));
-export default function Follow(inProps) {
+    slot: 'ActionFollowRoot'
+})(() => ({}));
+export default function Follow(props) {
     // PROPS
-    const props = useThemeProps({
-        props: inProps,
-        name: PREFIX
-    });
     const { className = null, feedObjectId = null, feedObject = null, feedObjectType = SCContributionType.POST, handleFollow, iconized = true } = props, rest = __rest(props, ["className", "feedObjectId", "feedObject", "feedObjectType", "handleFollow", "iconized"]);
     // STATE
     const { obj, setObj } = useSCFetchFeedObject({ id: feedObjectId, feedObject, feedObjectType });

package/lib/esm/components/FeedObject/Actions/Share/Share.d.ts

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

package/lib/esm/components/FeedObject/Actions/Share/Share.js

@@ -5,7 +5,7 @@ import Icon from '@mui/material/Icon';
 import LoadingButton from '@mui/lab/LoadingButton';
 import SharesDialog from './SharesDialog';
 import { styled } from '@mui/material/styles';
-import { Box, Button, Divider, ListItemText, Menu, SwipeableDrawer, Tooltip, useMediaQuery, useTheme, } from '@mui/material';
+import { Box, Button, Divider, ListItemText, Menu, SwipeableDrawer, Tooltip, useMediaQuery, useTheme } from '@mui/material';
 import MenuItem from '@mui/material/MenuItem';
 import ListItemIcon from '@mui/material/ListItemIcon';
 import { MEDIA_TYPE_SHARE } from '../../../../constants/Media';
@@ -16,11 +16,11 @@ import Skeleton from '@mui/material/Skeleton';
 import { SCContributionType } from '@selfcommunity/types';
 import { Endpoints, http } from '@selfcommunity/api-services';
 import { copyTextToClipboard, Logger } from '@selfcommunity/utils';
-import { SCPreferences, SCPreferencesContext, UserUtils, useSCContext, useSCFetchFeedObject, useSCRouting, useSCUser, } from '@selfcommunity/react-core';
-import { useThemeProps } from '@mui/system';
+import { SCPreferences, SCPreferencesContext, UserUtils, useSCContext, useSCFetchFeedObject, useSCRouting, useSCUser } from '@selfcommunity/react-core';
 import { getContributionRouteName, getRouteData } from '../../../../utils/contribution';
 import { FACEBOOK_SHARE, LINKEDIN_SHARE, TWITTER_SHARE } from '../../../../constants/SocialShare';
 import Composer from '../../../Composer';
+import { PREFIX } from '../../constants';
 const messages = defineMessages({
     shares: {
         id: 'ui.feedObject.share.shares',
@@ -31,25 +31,19 @@ const messages = defineMessages({
         defaultMessage: 'ui.feedObject.share.share'
     }
 });
-const PREFIX = 'SCShareAction';
 const classes = {
-    root: `${PREFIX}-root`,
-    divider: `${PREFIX}-divider`,
-    inline: `${PREFIX}-inline`,
-    button: `${PREFIX}-button`,
-    viewAudienceButton: `${PREFIX}-view-audience-button`
+    root: `${PREFIX}-action-share-root`,
+    divider: `${PREFIX}-action-share-divider`,
+    inline: `${PREFIX}-action-share-inline`,
+    button: `${PREFIX}-action-share-button`,
+    viewAudienceButton: `${PREFIX}-action-share-view-audience-button`
 };
 const Root = styled(Box, {
     name: PREFIX,
-    slot: 'Root',
-    overridesResolver: (props, styles) => styles.root
-})(({ theme }) => ({}));
-export default function Share(inProps) {
+    slot: 'ActionShareRoot'
+})(() => ({}));
+export default function Share(props) {
     // PROPS
-    const props = useThemeProps({
-        props: inProps,
-        name: PREFIX
-    });
     const { className = null, feedObjectId = null, feedObject = null, feedObjectType = SCContributionType.POST, withAction = true, withAudience = true, inlineAction = false } = props, rest = __rest(props, ["className", "feedObjectId", "feedObject", "feedObjectType", "withAction", "withAudience", "inlineAction"]);
     // STATE
     const theme = useTheme();

package/lib/esm/components/FeedObject/Actions/Vote/Vote.d.ts

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