Svelte: SweetAlert2 setup

demo.svelte

<script>
  import Swal from "sweetalert2";
  // npm i sweetalert2@9.7.2
  // https://sweetalert2.github.io/
</script>

<!-- a simple alert -->
<button
  on:click={() => {
    Swal.fire('hello sweet alert');
  }}>
  alert
</button>

<!-- an alert with async flow -->
<button
  on:click={() => {
    Swal.fire({
      title: 'Are you sure?',
      text: 'You will not be able to recover this imaginary file!',
      icon: 'warning',
      showCancelButton: true,
      confirmButtonText: 'Yes, delete it!',
      cancelButtonText: 'No, keep it'
    }).then(result => {
      if (result.value) {
        Swal.fire('Deleted!', 'Your imaginary file has been deleted.', 'success');
      } else if (result.dismiss === Swal.DismissReason.cancel) {
        Swal.fire('Cancelled', 'Your imaginary file is safe :)', 'error');
      }
    });
  }}>
  confirm
</button>

found it very useful, thanks a bunch :)

just decided today to try swal on svelte and this was posted 10h ago, thanks!

Don't forget to load the css too

import Swal from "sweetalert2";

//For the css, you can put it in main.js
import "sweetalert2/dist/sweetalert2.min.css";

Hi Do you know how to make sweetalert text reactive so I can pas a variable to the text and update it?