Package Exports

material-ui-notifications

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (material-ui-notifications) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

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 here

License

The Project is Licensed under the MIT License