Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 1,000,000+ packages pre-installed, including k-toast with all npm packages installed. Try it out:

var kToast = require("k-toast")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

k-toast v0.5.7

Notification messages for Derby

#derby-ui-toast

Notification messages (toasts for Derby.

toast

##Requirements

##Demo

https://derby-demos.herokuapp.com/derby-ui-toast

##Installation

Using npm

npm install derby-ui-toast

##Usage

###Add CSS

First you have to import the base CSS:

@import '../../node_modules/derby-ui-toast/css/'

If you want to use the default background images on the notification boxes:

@import '../../node_modules/derby-ui-toast/css/bg-images.css'

Or if you want to use the Font Awesome icons:

@import '../../node_modules/derby-ui-toast/css/bg-fontawesome.css'

###Add JS

Also you have to enable the component in JavaScript:

app.component(require('derby-ui-toast'));

###Add HTML

And in HTML:

<view name="derby-ui-toast"></view>

###Adding messages

model.toast(type, message, options);

type : string, the default possibilities are:

  • 'info'
  • 'success'
  • 'warning'
  • 'error'

message: string

options: object

options

  • sticky
    default: false
  • timeout
    default: 5000
  • click
    default: none

####This will also work:

model.toast({ info: 'Info message' }, options);
model.toast({ success: 'Success message' });

###Examples:

model.toast('info', 'Everything is ok!');
model.toast('success', 'It worked!');
model.toast('warning', 'Beware!');
model.toast('error', 'An error happened!', { sticky: true });
model.toast('error', 'An error happened again!', { timeout: 1000 });
model.toast('error', 'And again!', { click: myFunction });
model.toast({ info: 'Info message' });

###Removing messages

Messages will disappear in 5 seconds by default. They can also be removed by clicking the message dialog box.

Metadata

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free