svelte-alerter-component

Easily add custom alerts to your svelte app

Usage

Add it to your svelte project:

$ npm i svelte-alerter-component --save

Then, pop it into the component that suites you:

<script>
    import AlerterComponent from 'svelte-alerter-component/component.svelte'; // In some cases you may need the pre compiled svelte: svelte-alerter-component/component
</script>

<Alerter/>

Then, from any page or component you need to, create a new alert:

import Alerter from 'svelte-alerter-component';

new Alerter({
    title: "Like this alert?",  // or a svelte component instance
    style: "background: green; border-radius: 1px;",  // Optional.  You can also style alerts with this css selector: .svelte-alerter-component.alert
    time: 3000,  // Alert will disapear in 3 seconds.  If no value is specified, the alert will not disapear automaticly
    undo: () => {console.log("Undone!")},  // If a value is specified, an undo button will apear on the alert.  You can style this button with .svelte-alerter-component.undo
}, () => {
    console.log("Alert has been removed!");
})

// or

let myAlert = new Alerter({
    title: "My Alert"
})
myAlert.show();  // Show the alert
myAlert.hide();  // Hide the alert
myAlert.remove();  // Remove the alert

Help

Never be afraid to ask: emooring@protonmail.com or Vehmloewff#0724

Bugs

Found an problem? Submit an issue or ping me on Discord: Vehmloewff#0724.