FeedObject
Interfaces
FeedObjectProps
Extends
CardProps
.VirtualScrollerItemProps
Indexable
[p
: string
]: any
Properties
Property | Type | Description | Overrides | Inherited from |
---|---|---|---|---|
ActionsProps? | ActionsProps | Props to spread to Actions component Default {} | - | - |
ActivitiesProps? | ActivitiesProps | Props to spread to Activities component Default {} | - | - |
CommentComponentProps? | CommentObjectProps | Props to spread to CommentObject component Default {variant: 'outlined} | - | - |
CommentObjectReplyComponent? | (inProps : CommentObjectReplyProps ) => Element | CommentObjectReplyComponent component Usefull to override the single CommentObjectReply render component Default CommentObject | - | - |
CommentObjectReplyComponentProps? | CommentObjectReplyProps | Props to spread to single reply comment object Default {variant: 'outlined'} | - | - |
CommentObjectSkeletonProps? | any | Props to spread to CommentObject component Default {elevation: 0, variant: 'outlined'} | - | - |
ContributionActionsMenuProps? | ContributionActionsMenuProps | Props to spread to ContributionActionsMenu component Default {} | - | - |
ContributorsFeedObjectProps? | ContributorsFeedObjectProps | Props to spread to ContributorsFeedObject component Default {elevation: 0} | - | - |
FeedObjectMediaPreviewProps? | FeedObjectMediaPreviewProps | Props to spread to MediasPreview component Default {} | - | - |
FeedObjectSkeletonProps? | FeedObjectSkeletonProps | Props to spread to ContributionActionsMenu component Default {elevation: 0} | - | - |
FollowButtonProps? | FollowProps | Props to spread to Follow button component Default {} | - | - |
PollObjectProps? | PollObjectProps | Props to spread to PollObject component Default {} | - | - |
activitiesExpanded? | boolean | Show activities as default Default false | - | - |
activitiesExpandedType? | SCFeedObjectActivitiesType | Activities type shown initially. If not set, they are shown in order: RELEVANCE_ACTIVITIES, RECENT_COMMENTS If the obj has no comments/activites, or activitiesExpanded == false nothing will be shown | - | - |
cacheStrategy? | CacheStrategies | Caching strategies Default CacheStrategies.CACHE_FIRST | - | - |
className? | string | Overrides or extends the styles applied to the component. Default null | CardProps.className | CardProps.className |
feedObject? | SCFeedObjectType | Feed Object Default null | - | - |
feedObjectActivities? | any [] | Feed Object latest activities Default null | - | - |
feedObjectId? | number | Id of feed object Default null | - | - |
feedObjectType? | DISCUSSION | POST | STATUS | Feed Object type Default 'post' | - | - |
hideFollowAction? | boolean | Hide follow action object Default false | - | - |
hideParticipantsPreview? | boolean | Hide Participants preview Default false | - | - |
id? | string | Id of the feedObject Default feed_object_<feedObjectType>_<feedObjectId | feedObject.id> | CardProps.id | CardProps.id |
markRead? | boolean | Mark the FeedObject as read when enter in viewport Default false | - | - |
onHeightChange? | () => void | Must be called whenever a list item's height changes (for example, when a user clicks an "Expand"/"Collapse" button of a list item): it re-measures the item's height and updates VirtualScroller layout. Every change in an item's height must come as a result of changing some kind of a state, be it the item's state in VirtualScroller via .onItemStateChange(), or some other state managed by the application. Call this method to re-measure the current element. | VirtualScrollerItemProps.onHeightChange | VirtualScrollerItemProps.onHeightChange |
onReply? | (SCCommentType : any ) => void | Callback on reply | - | - |
onStateChange? | (state : any ) => void | Save current state and when the component re-mount restore previous state using props. It is used to keep a copy of VirtualScroller state so that it could be quickly restored in case the VirtualScroller component gets unmounted and then re-mounted back again — for example, when the user navigates away by clicking on a list item and then navigates "Back" to the list. | VirtualScrollerItemProps.onStateChange | VirtualScrollerItemProps.onStateChange |
pollVisible? | boolean | Show poll as default if exist Default false | - | - |
summaryExpanded? | boolean | Show all summary initially (otherwise it will be truncated) Default false | - | - |
template? | SCFeedObjectTemplateType | Feed Object template type Default 'preview' | - | - |
Functions
FeedObject()
FeedObject(
inProps
):JSX.Element
API documentation for the Community-JS Feed Object component. Learn about the available props and the CSS API.
This component renders a feed object item (post, discussion or status). Take a look at our demo component here
Import
import {FeedObject} from '@selfcommunity/react-ui';
Component Name
The name SCFeedObject
can be used when providing style overrides in the theme.
CSS
Rule Name | Global class | Description |
---|---|---|
root | .SCFeedObject-root | Styles applied to the root element. |
deleted | .SCFeedObject-deleted | Styles applied to the feed obj when is deleted (visible only for admin and moderator). |
header | .SCFeedObject-header | Styles applied to the header of the card. |
category | .SCFeedObject-category | Styles applied to the category element. |
group | .SCFeedObject-group | Styles applied to the group element. |
avatar | .SCFeedObject-avatar | Styles applied to the avatar element. |
username | .SCFeedObject-username | Styles applied to the username element. |
activityAt | .SCFeedObject-activity-at | Styles applied to the activity at section. |
tag | .SCFeedObject-tag | Styles applied to the tag element. |
location | .SCFeedObject-location | Styles applied to the location element. |
content | .SCFeedObject-content | Styles applied to the content section. Content section include: title-section, text-section, snippetContent, subContent, medias-section, polls-section, info-section. |
error | .SCFeedObject-error | Styles applied to the error element. |
title-section | .SCFeedObject-title-section | Styles applied to the title section. |
title | .SCFeedObject-title | Styles applied to the title element. |
text-section | .SCFeedObject-text-section | Styles applied to the text section. |
text | .SCFeedObject-text | Styles applied to the text element. |
snippet | .SCFeedObject-snippet | Styles applied to snippet element. |
snippet-content | .SCFeedObject-snippet-content | Styles applied to snippet content element. |
medias-section | .SCFeedObject-medias-section | Styles applied to the medias section. |
polls-section | .SCFeedObject-polls-section | Styles applied to the polls section. |
info-section | .SCFeedObject-info-section | Styles applied to the info section. |
actions-section | .SCFeedObject-actions-section | Styles applied to the actions container. |
reply-content | .SCFeedObject-reply-content | Styles applied to the reply box. |
activitiesSection | .SCFeedObject-activities-section | Styles applied to the activities section element. |
activitiesContent | .SCFeedObject-activities-content | Styles applied to the activities content element. |
followButton | .SCFeedObject-follow-button | Styles applied to the follow button element. |
Parameters
Parameter | Type | Description |
---|---|---|
inProps | FeedObjectProps |
Returns
JSX.Element
Source
packages/react-ui/src/components/FeedObject/FeedObject.tsx:326
FeedObjectSkeleton()
FeedObjectSkeleton(
props
):JSX.Element
API documentation for the Community-JS Feed Object Skeleton component. Learn about the available props and the CSS API.
Import
import {FeedObjectSkeleton} from '@selfcommunity/react-ui';
Component Name
The name SCFeedObject-skeleton-root
can be used when providing style overrides in the theme.
CSS
Rule Name | Global class | Description |
---|---|---|
root | .SCFeedObject-skeleton-root | Styles applied to the root element. |
media | .SCFeedObject-media | Styles applied to the media element. |
Parameters
Parameter | Type |
---|---|
props | object |
props.template ? | SCFeedObjectTemplateType |
Returns
JSX.Element