@svelte-put/modal
TypeScript icon, indicating that this package has built-in type declarations

1.0.7 • Public • Published

@svelte-put/modal

npm.badge bundlephobia.badge docs.badge repl.badge

Solution to async & type-safe modals in Svelte.

This solution employs svelte store for handling stack-able modals in an async manner. That is, you can open a modal programmatically and await for it to be "resolved".

svelte-put

This package is part of the @svelte-put family. For contributing guideline and more, refer to its readme.

Usage & Documentation

See the dedicated documentation page here.

Quick Start

// setup modal store
import { createModalStore } from '@svelte-put/modal';
export const modalStore = createModalStore();
<!-- setup ModalPortal -->
<script lang="ts">
  import ModalPortal from '@svelte-put/modal/ModalPortal.svelte';

  import { modalStore } from './modal.store';
</script>

<slot />

<ModalPortal store="{modalStore}" />
// load compatible modal & push/pop
import { modalStore } from './modal.store';
import MyModal from './MyModal.svelte';

const pushed = modal.push(MyModal, {
  /* props */
});
modal.pop(pushed);

Changelog

Package Sidebar

Install

npm i @svelte-put/modal

Weekly Downloads

142

Version

1.0.7

License

MIT

Unpacked Size

41.6 kB

Total Files

19

Last publish

Collaborators

  • vnphanquang