1 files changed, 26 insertions, 12 deletions
diff --git a/src/lib/Lazy.svelte b/src/lib/Lazy.svelte
index da5b09a9..8167711d 100644
--- a/src/lib/Lazy.svelte
+++ b/src/lib/Lazy.svelte
@@ -1,17 +1,31 @@
 <script lang="ts">
   import { onMount, onDestroy } from 'svelte';
 
-  export let top = 0;
-  export let bottom = 0;
-  export let left = 0;
-  export let right = 0;
-  export let steps = 100;
-  export let threshold = 0.01;
-  export let once = false;
-
-  let element: Element;
-  let percent: number = 0;
-  let visible = false;
+  interface Props {
+    top?: number;
+    bottom?: number;
+    left?: number;
+    right?: number;
+    steps?: number;
+    threshold?: number;
+    once?: boolean;
+    children?: import('svelte').Snippet<[any]>;
+  }
+
+  let {
+    top = 0,
+    bottom = 0,
+    left = 0,
+    right = 0,
+    steps = 100,
+    threshold = 0.01,
+    once = false,
+    children
+  }: Props = $props();
+
+  let element: Element = $state();
+  let percent: number = $state(0);
+  let visible = $state(false);
   let observer: IntersectionObserver;
 
   const intersectPercent = (
@@ -45,5 +59,5 @@
 </script>
 
 <div bind:this={element}>
-  <slot {visible} {percent} />
+  {@render children?.({ visible, percent, })}
 </div>