A pack of extensions for grommet 2
created:7/7/2021
updated:7/7/2021
loc
181
comments
2%
failed
24
coverage
92%

Notification

avatar of atanasster
grommet-controls
3.0.2

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

avatar of atanasster
update stories titles and navigation
8/30/2020

atanasster

avatar of atanasster
update eslint and add component-controls
8/27/2019

atanasster

avatar of 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