Notification

Interfaces

NotificationProps

Extends

• CardProps.VirtualScrollerItemProps

Indexable

[p: string]: any

Properties

Property	Type	Description	Overrides	Inherited from
className?	string	Overrides or extends the styles applied to the component. Default null	CardProps.className	CardProps.className
collapsedOtherAggregated?	boolean	Collapse or not other aggregated Default true	-	-
handleCustomNotification?	(data: any) => Element	Handle custom notification	-	-
id?	string	Id of the UserNotification Default notification_<notificationObject.sid>	CardProps.id	CardProps.id
key	number	The obj key	CardProps.key	CardProps.key
notificationObject	SCNotificationAggregatedType	Notification obj Default null	-	-
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
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
showMaxAggregated?	number	The max n of results uncollapsed shown Default 2	-	-

Functions

NotificationSkeleton()

NotificationSkeleton(props): JSX.Element

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

Import

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

Component Name

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

CSS

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

Parameters

Parameter	Type
props	any

Returns

JSX.Element

Source

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

---

UserNotification()

UserNotification(inProps): JSX.Element

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

Import

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

Component Name

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

CSS

Rule Name	Global class	Description
root	.SCNotification-root	Styles applied to the root element.
content	.SCNotification-notification-wrap	Styles applied to the element wrap.
header	.SCNotification-notification-wrap	Styles applied to the notification header.
title	.SCNotification-title	Styles applied to the title element in the notification header.
image	.SCNotification-image	Styles applied to the image element in the notification header.
username	.SCNotification-username	Styles applied to the user element in the notification header.
content	.SCNotification-notification-content	Styles applied to the notification content.
unCollapsed	.SCNotification-notification-wrap	Styles applied to the uncollapsed elements.
collapsed	.SCNotification-notification-wrap	Styles applied to the collapsed elements.
stopButton	.SCNotification-stop-notification-button	Styles applied to the stop notification button.
showOtherAggregated	.SCNotification-show-other-aggregated	Styles applied to the show other aggregated element.

Parameters

Parameter	Type	Description
inProps	NotificationProps

Returns

JSX.Element

Source

packages/react-ui/src/components/Notification/Notification.tsx:154