A pack of extensions for grommet 2
created:4/8/2021
updated:4/8/2021
source lines:181
comments %:2

Notification

grommet-controls
3.0.1

A Box to display notification messages.

import { Notification } from 'grommet-controls';

Main

Name
Description
Default
Controls
INotificationProps (13 properties)
a11yTitle

Custom title to be used by screen readers

string
-
status

Status color

okinfowarningerrorunknowndisabled
info
size

The font size of the notification message

smallmediumlarge
medium
state

State label

string
-
strong

Heading bold state

boolean
-
message

Message to be displayed

string
Notification...
icon

Notification icon

ReactNode
true
closer

Closer icon

ReactNode
undefined
onClose

Function that will be called when the user closes the notification

(event: MouseEvent<HTMLButtonElement, MouseEvent>) => void
-
percentComplete

Percent complete Meter for task notifications

number
-
030 / 100
timestamp

Timestamp for the notification (Date)

DateFormat
-
locale

The locale to use for timestamp, if provided

string
en-us
reverse

If true, reverse the order of the Notification elements

boolean
-
BoxProps (27 properties)

Commits

Date
Author
Commit Message
8/31/2020

atanasster

update stories titles and navigation
8/30/2020

atanasster

update eslint and add component-controls
8/27/2019

atanasster

initial commit 2.x alpha
3 commits

package
imports
peer
grommet
^2.15.0
TextMeterHeadingButtonBoxPropsBox
*
Close
*
StatusCritical
*
StatusDisabled
*
StatusGood
*
StatusInfo
*
StatusUnknown
*
StatusWarning
*
react
^17.0.1
React
*

file
imports
"../../utils/moment"
longDate
"./NotificationProps"
INotificationProps

Stories

A 11 Y Title

Status

State

Strong

Icon

Closer

Percent Complete

Timestamp

Locale

Size

Reverse