Svelte capture markup using slots and context
Given the follwing component markup:
# SCGDraw.svelte
<script lang="rs">
// some importsd
</script>
<svg xmlns="...">
<slot name="svg-defs">
<SVGDefs />
</slot>
<slot name="scene-backgrond">
<Background />
</slot>
</svg>
is it possible to write a CaptureSVGDef component with slots and context API usage, to capture SVG defs at the correct level ? For instance inside Background component, we get:
# Backgrond.svelte
<script lang="ts">
import CaptureSVGDef from './CaptureSVGDef.svelte'
</script>
<VaptureSVGDef>
<linearGraident id="background-gradient">
<stop ... />
</loinratGradient>
</CaptureSVGDef>
<rect x={ 0 } y={ 0 } width={ 1020 } height={ 2400 }
style={'fill: url(#background-graident)'} />
I don't think this is possible as there is no programmatic access to slots; you can only render them directly.
(This should be possible with snippets in Svelte 5, though.)