Svelte 5: Access snippets from context module #10350
Description
Describe the problem
Can't send/find/reference/use a snippet defined in a component from a <script context="module"> block in that component
Example of what I'm trying to do
<script lang="ts" context="module">
import type { Snippet } from "svelte";
let modals = $state<Array<{snippet: Snippet | Snippet<any>, isFullScreen: boolean, arg?: any }>>([]);
export function openModal(snippet: Snippet | Snippet<any>, isFullScreen: boolean, arg?: any)
{
modals.push({snippet, isFullScreen, arg});
modals = modals;
}
export function closeModal()
{
modals.pop();
}
export function confirm(): Promise<boolean>
{
let resolvePromise: (result: boolean) => void;
let confirmPromise = new Promise<boolean>((resolve) =>
{
resolvePromise = resolve;
});
openModal(confirmModal, false, resolvePromise!);
return confirmPromise;
}
</script>
{#each modals as {snippet, isFullScreen, arg} }
{#if isFullScreen}
<div class="full-screen-modal">
{@render snippet(arg)}
</div>
{:else}
<div class="dialog-modal-wrapper">
<div class="dialog-modal">
{@render snippet(arg)}
</div>
</div>
{/if}
{/each}
{#snippet confirmModal(resolvePromise: (value: boolean | PromiseLike<boolean>) => void)}
<button on:click={() => resolvePromise(true)}>Accept</button>
<button on:click={() => resolvePromise(false)}>Cancel</button>
{/snippet}
Describe the proposed solution
Maybe make snippets visible from <script context="module"> block, the possibility of define {#snippet coso() context="module"}, javascript snippets or anything like that.
Importance
would make my life easier