I have used a few popup/modal packages available for Svelte but none of them felt easy to use.
They are really useful but not user-friendly. I thought I will make something that should ask users for no additional info.
So a modal usually has a trigger and content. These are the only two parts a user has to define. I think asking users to add the content inside a named slot is a lot to ask and can be confusing at times.
In sv-popup however, we do not use named slots. We just use components instead.
There will be 3 parts.
- a wrapper
<Modal>
- content(to be shown inside the modal)
<Content>
- a trigger
<Trigger>
.
Here is a simple popup
<Modal>
<Content>
Hello
</Content>
<Trigger>
Open a simple unstyled modal
</Trigger>
</Modal>
You can check this in action here
You can see that there are even simple text can be a trigger. You can use any HTML inside content or trigger.
I guess this is easier to use than other(maybe even better) packages. Let me know if you have any suggestions on improving this.