Notification Center

KbqNotificationCenterService

Properties

Name	Description
changes: Observable	Emits an event whenever the changes.
hasMore: BehaviorSubject	Whether there are more notifications to load. While `true`, scrolling to the bottom emits `onNextPage`; set it to `false` to stop further infinite-scroll requests.
isEmpty: boolean	true if there are no notifications.
items: KbqNotificationItem[]	Notification items
loadMoreErrorMode: BehaviorSubject	Whether the bottom "load more" error row (with a retry button) is shown. Distinct from `errorMode`, which replaces the whole list with the full-screen error state.
loadingMore: BehaviorSubject	Whether the bottom "load more" spinner is shown while the next page is being loaded. Note: this is the infinite-scroll indicator and is distinct from `loadingMode`, which renders the full-screen loader instead of the list.
onDelete: EventEmitter	Triggers an event when an item, a group, or all notifications are removed.
onNextPage: EventEmitter	Triggers an event when the list is scrolled to the bottom and the next page should be loaded.
onReload: EventEmitter	Triggers an event when the user presses the reload button.
unreadItemsCounter: Observable	Number of unread notifications

Name

Description

changes: Observable

Emits an event whenever the changes.

hasMore: BehaviorSubject

Whether there are more notifications to load. While `true`, scrolling to the bottom emits `onNextPage`; set it to `false` to stop further infinite-scroll requests.

isEmpty: boolean

true if there are no notifications.

items: KbqNotificationItem[]

Notification items

loadMoreErrorMode: BehaviorSubject

Whether the bottom "load more" error row (with a retry button) is shown. Distinct from `errorMode`, which replaces the whole list with the full-screen error state.

loadingMore: BehaviorSubject

Whether the bottom "load more" spinner is shown while the next page is being loaded. Note: this is the infinite-scroll indicator and is distinct from `loadingMode`, which renders the full-screen loader instead of the list.

onDelete: EventEmitter

Triggers an event when an item, a group, or all notifications are removed.

onNextPage: EventEmitter

Triggers an event when the list is scrolled to the bottom and the next page should be loaded.

onReload: EventEmitter

Triggers an event when the user presses the reload button.

unreadItemsCounter: Observable

Number of unread notifications

Methods

hideToast

Hides the toast that corresponds to the given notification item.

push

Push new notification item in center

remove

Remove notification item

removeAll

Remove all notification items

removeGroup

Remove group of notification items

setErrorMode

Set error mode

setHasMore

Set whether there are more notifications to load via infinite scroll.

setLoadMoreErrorMode

Set the bottom "load more" error state visibility.

setLoadingMode

Set loading mode

setLoadingMore

Set the bottom "load more" spinner visibility.

setSilentMode

Set silent mode

KbqNotificationCenterTrigger

Selector: [kbqNotificationCenterTrigger]

Exported as: kbqNotificationCenterTrigger

Properties

Name	Description
@Input() backdropClass: string	Class that will be used in the background
@Input() container: HTMLElement	Container for additional positioning, used with stickToWindow
@Input() disabled: boolean	Whether the trigger is disabled.
@Input() offset: number	Offset of popUp
@Input('kbqNotificationCenterPanelClass') panelClass: string	Class that will be used in the panel
@Input('kbqNotificationCenterPlacement') placement: "top" \| "topLeft" \| "topRight" \| "right" \| "rightTop" \| "rightBottom" \| "left" \| "leftTop" \| "leftBottom" \| "bottom" \| "bottomLeft" \| "bottomRight"	Placement of popUp
@Input() popoverHeight: string	Set height of popover. Default is calc(100vh - 48px). 48px - height of navbar
@Input() popoverMode: boolean	Use popover or not
@Input() scrolledToBottomOffset: number	Distance in pixels from the bottom of the list at which the next page is requested via `onNextPage`.
@Input() stickToWindow: "top" \| "right" \| "left" \| "bottom"	Additionally positions the element relative to the window side (Top, Right, Bottom and Left). If container is specified, the positioning will be relative to it.
@Output('kbqPlacementChange') placementChange: EventEmitter	Emits a change event whenever the placement state changes.
@Output('kbqVisibleChange') visibleChange: EventEmitter	Emits a change event whenever the visible state changes.
isOpen: boolean	Whether the pop-up overlay is currently open.
unreadItemsCounter: Observable	Number of unread notifications

Name

Description

@Input()

backdropClass: string

Class that will be used in the background

@Input()

container: HTMLElement

Container for additional positioning, used with stickToWindow

@Input()

disabled: boolean

Whether the trigger is disabled.

@Input()

offset: number

Offset of popUp

@Input('kbqNotificationCenterPanelClass')

panelClass: string

Class that will be used in the panel

@Input('kbqNotificationCenterPlacement')

Placement of popUp

@Input()

popoverHeight: string

Set height of popover. Default is calc(100vh - 48px). 48px - height of navbar

@Input()

popoverMode: boolean

Use popover or not

@Input()

scrolledToBottomOffset: number

Distance in pixels from the bottom of the list at which the next page is requested via `onNextPage`.

@Input()

stickToWindow: "top" | "right" | "left" | "bottom"

Additionally positions the element relative to the window side (Top, Right, Bottom and Left). If container is specified, the positioning will be relative to it.

@Output('kbqPlacementChange')

placementChange: EventEmitter

Emits a change event whenever the placement state changes.

@Output('kbqVisibleChange')

visibleChange: EventEmitter

Emits a change event whenever the visible state changes.

isOpen: boolean

Whether the pop-up overlay is currently open.

unreadItemsCounter: Observable

Number of unread notifications

KbqNotificationItem

Properties

Name	Description
actions: TemplateRef
caption: string \| TemplateRef
content: string \| TemplateRef
date: string
icon: boolean \| TemplateRef
iconClass: string
id: string
read: boolean
style: string
title: string \| TemplateRef
toastId: number	Numeric id of the shown toast, set by `push()` and consumed by `hideToast()`.

Name

Description

actions: TemplateRef

caption: string | TemplateRef

content: string | TemplateRef

date: string

icon: boolean | TemplateRef

iconClass: string

id: string

read: boolean

style: string

title: string | TemplateRef

toastId: number

Numeric id of the shown toast, set by `push()` and consumed by `hideToast()`.

KbqNotificationDeleteEvent

Payload emitted by `KbqNotificationCenterService.onDelete`.

type KbqNotificationDeleteEvent = {
    /** What was removed: a single item, a whole date group, or all notifications. */
    type: 'item' | 'group' | 'all';
    /** The notification items that were removed. */
    items: KbqNotificationItem[];
};

maxUnreadItemsLength

const maxUnreadItemsLength: number;

KBQ_NOTIFICATION_CENTER_DEFAULT_CONFIGURATION

default configuration of notification-center

const KBQ_NOTIFICATION_CENTER_DEFAULT_CONFIGURATION: { notifications: string; remove: string; doNotDisturb: string; showPopUpNotifications: string; noNotifications: string; failedToLoadNotifications: string; repeat: string; loadingMore: string; };

KBQ_NOTIFICATION_CENTER_CONFIGURATION

Injection Token for providing configuration of notification-center

const KBQ_NOTIFICATION_CENTER_CONFIGURATION: InjectionToken<unknown>;