Fork of: https://github.com/romkor/svelte-portal
Changes:
- Based on SvelteKit
- Typescript support
- Little code refactoring
- romkor#129
npm i @oklookat/svelte-portal
<Portal />
component has only one property: target
.
Target can be a HTMLElement or a CSS selector that points to an already existing element.
When no target is given it defaults to: document.body
.
<script>
import Portal from "@oklookat/svelte-portal";
import { portal } from "@oklookat/svelte-portal";
</script>
<main>
<Portal target="body">
div in body (component)
</Portal>
<div use:portal={".overlay"}>
div in .overlay (use)
</div>
</main>
<div class="overlay" />