Material-UI Notifications

Material-UI Notification offers components and functionality to use a web version of the Material Desing notifications as seen in the Documentation.
To implement the components we use Material-UI (< v1.0.0) and React Flip Move.
Installation
To use all components you have to add material-ui-notifications
to your dependencies.Yarn
> yarn add material-ui-notifications
npm
> npm install -S material-ui-notifications
Examples
Simple usage of a notification<Notification
headerLabel="Mail"
onClose={e => { this.setState({ showNotification: false }); }}
title="Timo Hanisch"
text="Yeah this seems like a pretty good idea!"
/>
Simple usage of a notification container
import { NotificationActions, NotifcationContainer } from 'material-ui-notifications';
...
<div>
<NotificationContainer />
<button onClick={
e => {
NotificationActions.addNotification(
{
headerLabel: "Mail",
secondaryHeaderLabel: "timohanisch@googlemail.com",
timestamp: "Now",
primaryColor: "#ff0000",
title: "Timo Hanisch",
text: "Yeah this seems like a pretty good idea!",
}
);
}}
/>
</div>
...
Demo
To run the demo clone the repository and then run following commands. We use Storybook to test > yarn
> yarn storybook
Documentation
The documentation for all components and functionalities can be found hereLicense
The Project is Licensed under the MIT License