ceri-toaster

toasts, quick and easy

Demo

Install

npm install --save-dev ceri-toaster

Usage

Toaster = require("ceri-toaster")
# load the theme (see below)
window.customElements.define("ceri-toaster", Toaster(require("ceri-toaster/materialize")))
toaster = document.createElement("ceri-toaster")
document.body.appendChild(toaster)
toaster.toast({text:"Hello!", timeout: 5000, onClose: => return})

Mixin

the toaster can be used as a mixin within other ceri components:

  ...
  mixins: [
    require("ceri-toaster/mixin")(require("ceri-toaster/materialize"))
  ]
  ...
  methods:
    doSomething: ->
      close = @$toast({text:"Hello!", timeout: 5000})
      close() 

Themes

Materialize

• setup ceri-materialize and load the scss.

// and this additional requirement
@import "~ceri-toaster/materialize";

• load theme file

Toaster = require("ceri-toaster")
window.customElements.define("ceri-toaster", Toaster(require("ceri-toaster/materialize")))

For example see dev/materialize.

Development

Clone repository

npm install
npm run dev

Browse to http://localhost:8080/.

Notable changes

0.2.0

• use ceri-materialize@2

License

Copyright (c) 2017 Paul Pflugradt Licensed under the MIT license.