Package Exports

js-snackbar

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 (js-snackbar) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

js-snackbar

Custom SnackBar notifications inspired by Material Design and node-snackbar

Installation

npm install js-snackbar

Usage

// require css for your app's bundle process
require('../node_modules/js-snackbar/dist/snackbar.css');

import {show} from 'js-snackbar';

show({pos: 'bottom-right'});

Requirements

In order to display the notify icons and icon close button, we rely on Material Design icons and fonts as well as Material Design Lite stylesheets.

If your project is not already referencing these, you can add the following to the <head> section of your index.html file.

    <link rel="stylesheet"
          href="https://fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&amp;lang=en">
    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <link rel="stylesheet" href="https://code.getmdl.io/1.1.3/material.indigo-pink.min.css">

Please note these are only required to use notifyIcon = 'some_md_icon' and actionType = 'CLOSE'

Run Locally

Global Dependencies:

npm install -g npm3
 
npm3 install -g webpack webpack-dev-server

Fire up the local server @ http://localhost:8080

npm3 run dev

Build ouput in the dist folder

npm3 run dist

Inspiration

This repo was lovingly forked and hacked from the awesome node-snackbar

A few of the changes:

Ability to use an action icon button
Ability to display a notify icon
Ability to display a notify image
Local React hacking environment
ES6 modules
Module bundling with Webpack and Babel