<script>
import { onMount } from 'svelte'
import { Modals, openModal, closeModal } from 'svelte-modals@next'
import ConfirmModal from './ConfirmModal.svelte'
async function handleDelete() {
const confirmed = await openModal(ConfirmModal, {
message: 'This will delete very important data. Are you sure?',
page: "page1"
});
}
</script>
<button on:click={handleDelete}>Delete Important Data</button>
<Modals>
<div
slot="backdrop"
class="backdrop"
on:click={closeModal}
/>
</Modals>
<style>
.backdrop {
position: fixed;
top: 0;
bottom: 0;
right: 0;
left: 0;
background: rgba(0,0,0,0.50)
}
</style>