v2 Migration

v2 introduces Svelte 5 support and an API overhaul to better solve the community requests from v1.

To make the migration easier and incrementally adopt the new APIs, you can change all of your svelte-modals imports to svelte-modals/legacy. This is a wrapper around the new APIs to maintain the v1 API. If you encounter any problems please open an issue.

<script>
  import { openModal, closeModal } from 'svelte-modals/legacy'
  import MyModal from '$lib/components/MyModal.svelte'

  function handleClick() {
    openModal(MyModal, { title: "Alert", message: "This is an alert" })
  }
</script>

<button onclick={handleClick}>Open Modal</button>

Open Modal

What’s new?