5.0.0 Release

Added

• Sonner notification
• Custom event triggers
• Custom event callbacks

Custom Event Triggers

As of version 5 you can trigger notifications using custom events dispatched on the window.

const event = new CustomEvent("notify:sonner", {
    detail: {
        heading: "Sonner Example",
        message: `Example sonner toast message.`,
    }
});
window.dispatchEvent(event);

The follow events are supported:

• notify:sonner
• notify:alert
• notify:toast
• notify:snackbar

The detail object accepts the same interfaces as the function versions.

Custom Event Callbacks

As of version 5 all callback interfaces support event and eventData properties. When the user interacts with a button a custom event will be fired on the window.

import sonner from "@codewithkyle/notifyjs/sonner";
sonner.push({
    message: "Heading and message are optional.",
    button: {
        label: "Test",
        event: "test-event",
        eventData: "Hi mom!",
    }
});

// received when the user clicks the button within the sonner notification
window.addEventListener("test-event", (e)=>{
    alert(e.detail);
});