User

Interfaces

UserProps

API documentation for the Community-JS Widget component. Learn about the available props and the CSS API.

Import

import {Widget} from '@selfcommunity/react-ui';

Component Name

The name SCWidget can be used when providing style overrides in the theme.

CSS

Rule Name	Global class	Description
root	.SCWidget-root	Styles applied to the root element.

Extends

• WidgetProps

Indexable

[p: string]: any

Properties

Property	Type	Description	Inherited from
actions?	ReactNode	Prop to add actions Default null	-
badgeContent?	any	Badge content to show as user avatar badge if show reaction is true.	-
buttonProps?	ButtonBaseProps	Props to spread to the button Default {}	-
className?	string	Overrides or extends the styles applied to the component. Default null	WidgetProps.className
followConnectUserButtonProps?	FollowUserButtonProps | FriendshipButtonProps	Props to spread to follow/friendship button Default {}	-
handleIgnoreAction?	(u: any) => void	Handles actions ignore Default null	-
isGroupAdmin?	boolean	If true, shows a custom label next to the user username Default false	-
secondary?	ReactNode	-	-
showFollowers?	boolean	Prop to show user followers as secondary text Default false	-
user?	SCUserType	User Object Default null	-
userId?	number	User Id Default null	-

Functions

User()

User(inProps): JSX.Element

API documentation for the Community-JS User component. Learn about the available props and the CSS API.

This component renders a user item. Take a look at our demo component here

Import

import {User} from '@selfcommunity/react-ui';

Component Name

The name SCUser can be used when providing style overrides in the theme.

CSS

Rule Name	Global class	Description
root	.SCUser-root	Styles applied to the root element.
avatar	.SCUser-avatar	Styles applied to the avatar element.
staffBadgeLabel	.SCUser-staff-badge-label	Styles applied to the staff badge label element.

Parameters

Parameter	Type	Description
inProps	UserProps

Returns

JSX.Element

Source

packages/react-ui/src/components/User/User.tsx:130

---

UserSkeleton()

UserSkeleton(props): JSX.Element

API documentation for the Community-JS User Skeleton component. Learn about the available props and the CSS API.

Import

import {UserSkeleton} from '@selfcommunity/react-ui';

Component Name

The name SCUser-skeleton-root can be used when providing style overrides in the theme.

CSS

Rule Name	Global class	Description
root	.SCUser-skeleton-root	Styles applied to the root element.

Parameters

Parameter	Type
props	WidgetProps

Returns

JSX.Element

Source

packages/react-ui/src/components/User/Skeleton.tsx:39