summaryrefslogtreecommitdiff
path: root/packages/integrations/svelte/Wrapper.svelte
diff options
context:
space:
mode:
Diffstat (limited to 'packages/integrations/svelte/Wrapper.svelte')
-rw-r--r--packages/integrations/svelte/Wrapper.svelte21
1 files changed, 21 insertions, 0 deletions
diff --git a/packages/integrations/svelte/Wrapper.svelte b/packages/integrations/svelte/Wrapper.svelte
new file mode 100644
index 000000000..c1ee77d91
--- /dev/null
+++ b/packages/integrations/svelte/Wrapper.svelte
@@ -0,0 +1,21 @@
+<script>
+/**
+ * Why do we need a wrapper component?
+ *
+ * Astro passes `children` as a string of HTML, so we need
+ * a way to render that content.
+ *
+ * Rather than passing a magical prop which needs special
+ * handling, using this wrapper allows Svelte users to just
+ * use `<slot />` like they would for any other component.
+ */
+const { __astro_component: Component, __astro_children, ...props } = $$props;
+</script>
+
+<svelte:component this={Component} {...props}>
+ {#if __astro_children != null}
+ <astro-fragment>
+ {@html __astro_children}
+ </astro-fragment>
+ {/if}
+</svelte:component>