Skip to content

Releases: BinarCode/vue-notifyjs

v0.4.3

30 Apr 13:49
Compare
Choose a tag to compare

Patches

  • Simplify plugin initialization SSR support: 2fb163b
  • #24 support class based notification handling Add Vue as peer dependency: 6b4cbde

You can now use notifications everywhere including vuex stores:

import {Notification} from 'vue-notifyjs'

// trigger notification
Notification.notify({type: 'success', message: 'hello from the other side'})

Important Note:
You still need to initialize the plugin globally beforehand:

import Vue from 'vue'
import Notifications from 'vue-notifyjs'
Vue.use(Notifications)

and declare <notifications></notifications> somewhere in your app because otherwise the {Notification} import from above won't work

v0.4.2

20 Feb 14:54
4dc60c9
Compare
Choose a tag to compare

Patches

  • Added on readme close all notifications (issues #16): b6d7b37
  • Add method clear in index.js: 5c16f60

Clear method usage

this.$notifications.clear()

v0.4.1

16 Jan 16:09
Compare
Choose a tag to compare

Minor Changes

  • #11 Pass notification instance as second param to onClick method: a4b63c4
    You can pass a click handler when clicking on a notification and recieve both the click event and the notification instance
this.$notify({
  ...
   onClick: (event, notificationInstance) => {
      alert('You clicked a notification');
   }
  ...
})
  • Make notification without timeout: 49e5345
this.$notify({
  ...
   timeout: 0 // providing a 0 value will not auto close the notification
  ...
})

Patches

Many thanks to Amandio Magalhães since the features from above are PRs sent by him. 👏

v0.3.0

28 Nov 17:17
Compare
Choose a tag to compare

Patches

  • Update readme with primary option #10
  • Add a more specific css class to the notification layer vue-notifyjs

New options

This version introduces new options which you can pass through the $notify method / config during plugin initialization or setOptions method.

       showClose: {
            type: Boolean,
            default: true
        },
        closeOnClick: {
            type: Boolean,
            default: true
        },
        onClick: Function,
  • showClose will hide the close icon/button if set to false
  • closeOnClick will not close the notification when clicking it if set to false
  • onClick function which can be passed to the notify method. The method accepts an event parameter.
    Example:
this.$notify({title: 'Hi', message: 'Some message', onClick: (evt) => {
                     alert('You clicked a notification')
                }})

v0.2.0

17 Sep 20:08
Compare
Choose a tag to compare

Minor Changes

  • Show the vue-version for this plugin...: ed8d546
  • #6 Wrap themes in .vue-notifyjs class to avoid some css conflicts: 2f743d0
  • #7 Add title option to notifications: 0af1e46
  • Add posibility to set notification options upon plugin initialization: c9e3227

Improvements/Features

  • Possibility to set notification options upon plugin initialization
import Notify from 'vue-notifyjs'
Vue.use(Notify, {type: 'primary', timeout: 2000})
  • Set notification options dynamically via setOptions
this.$notifications.setOptions({
                            type: 'primary', 
                            timeout: 2000,
                            horizontalAlign: 'right',
                            verticalAlign: 'top'
                          })
  • Add notification title prop #7
this.$notify({title: 'This line will be bold', message: 'This line will not be bold'})

Fiddle example https://jsfiddle.net/z11fe07p/2519/

  • Shorthand for notifying with a message only
    this.$notify('My message') will now default to this.$notify({message: 'My message})

v0.1.8

23 Aug 07:45
Compare
Choose a tag to compare

Patches

  • Handle notification removal after timeout better: 178ef19
  • Add notification timestamp as key: 178ef19 Fixes #5

v0.1.7

10 Jul 17:58
Compare
Choose a tag to compare

Patches

  • #1 Handle bulk notification addition: 4f49dd5

v0.1.5

01 Jul 20:48
Compare
Choose a tag to compare

Patches

  • Add pointer cursor when hovering notifications: 5a8bf46
  • Add option to render a custom component: 5a8bf46
  • Close notification when clicking on it: 5a8bf46

Added jsFiddle example on how to render custom html content inside notifications
https://jsfiddle.net/z11fe07p/2297/