so as you can see I have created a component. And I am reporting to my script that I am listening for a window event listener(message). I actually want to make that every time this EventListnere is called, that I add a new Notification under gold notify box. How would I archive that in svelte. ?
<script>
import Notification from './Components/Notification.svelte';
let type,text,time,title,icon,position,top,progress
let slideIn = true;
let showNoti;
$: if(!slideIn) {
slideIn === false;
}
window.addEventListener('message', (event) => {
showNoti = true;
if(showNoti) {
let data = event.data;
type = data.type
text = data.text
time = data.time
title = data.title
icon = data.icons;
top = data.top;
progress = data.progress;
position = data.position;
if(type == "success") {
type = "success"
}else if(type == "error") {
type = "error"
}else if(type == "money") {
type = "money"
}
setTimeout(() => {
slideIn = false;
}, time);
}
});
</script>
<main>
{#if showNoti}
<div class="notif-container {position}" style="top: {top}">
<div class="gold-notify-box">
<Notification text={text} type={type} time={time} title={title} icon={icon} position={position} top={top} progress={progress} slideIn={slideIn} />
</div>
</div>
{/if}
</main>
<style>
</style>