diff --git a/src/components/Notification/Notification.tsx b/src/components/Notification/Notification.tsx index 814fe0f3..e9a7f317 100644 --- a/src/components/Notification/Notification.tsx +++ b/src/components/Notification/Notification.tsx @@ -63,16 +63,11 @@ export const Notification = React.memo(function Notification(props: Props) { ) : null; let renderedContent; - if (typeof content === 'function') { + if (content) { + const node = typeof content === 'function' ? content({wrapperRef}) : content; renderedContent = (
-
{content({wrapperRef})}
-
- ); - } else { - renderedContent = ( -
-
{content}
+
{node}
); } diff --git a/src/components/Notification/definitions.ts b/src/components/Notification/definitions.ts index 958f2126..d012a0b1 100644 --- a/src/components/Notification/definitions.ts +++ b/src/components/Notification/definitions.ts @@ -24,7 +24,7 @@ export type NotificationSwipeActionsProps = export type NotificationProps = { id: string; - content: + content?: | React.ReactNode | ((props: {wrapperRef?: React.RefObject}) => React.ReactNode); diff --git a/src/components/Notifications/__stories__/mockData.tsx b/src/components/Notifications/__stories__/mockData.tsx index 8e8854fb..537a6b82 100644 --- a/src/components/Notifications/__stories__/mockData.tsx +++ b/src/components/Notifications/__stories__/mockData.tsx @@ -152,6 +152,18 @@ export const mockNotifications: NotificationProps[] = [ formattedDate: '12 seconds ago', swipeActions: notificationsMockSwipeActions, }, + { + id: 'only-title', + source: { + title: 'Yandex', + icon: svgYandexStoryIcon, + href: LINK, + }, + theme: 'info', + title: 'You hired!', + formattedDate: '12 seconds ago', + swipeActions: notificationsMockSwipeActions, + }, { id: 'minimum', content: Bare minimum,