Notification indicator

Examples
Typescript ❤️

A wrapped React component used to display whether user has any new notifications.

Install
yarn add @atlaskit/notification-indicator
npm
@atlaskit/notification-indicator
Source
Bitbucket
Bundle
unpkg.com
Changelog
Latest

10.0.0

Major Changes

  • #117363 10a0f7f6c2027 - This package's peerDependencies have been adjusted for react and/or react-dom to reflect the status of only supporting React 18 going forward. No explicit breaking change to React support has been made in this release, but this is to signify going forward, breaking changes for React 16 or React 17 may come via non-major semver releases.

    Please refer this community post for more details: https://community.developer.atlassian.com/t/rfc-78-dropping-support-for-react-16-and-rendering-in-a-react-18-concurrent-root-in-jira-and-confluence/87026

Patch Changes

  • Updated dependencies

Note: This component is designed for internal Atlassian development.

External contributors will be able to use this component but will not be able to submit issues.

NotificationIndicator is a React component that wraps an existing @atlaskit/badge component with additional functionalities:

  • Populate its own state by fetching data through the provided notification-log-client.
  • Sets up automatic refresh when refreshRate is specified.
  • Disables automatic refresh when tab is inactive, unless forced.

Usage

import { NotificationIndicator } from '@atlaskit/notification-indicator';

Basic

5

Props

notificationLogProvider Promise<import> required

Promise@atlaskit/notification-log-client.NotificationLogProvider

appearance union = "important"

One of
"added",
"default",
"important",
"primary",
"primaryInverted",
"removed"

max number = 9

refreshRate number = 0

refreshOnHidden boolean = false

refreshOnVisibilityChange boolean = true

onCountUpdating function

param =>
skip boolean
countOverride number

onCountUpdated function

param => undefined

createAnalyticsEvent any