1 files changed, 21 insertions, 9 deletions
diff --git a/src/lib/Settings/SettingToggle.svelte b/src/lib/Settings/SettingToggle.svelte
index 0d177b50..0d3b893a 100644
--- a/src/lib/Settings/SettingToggle.svelte
+++ b/src/lib/Settings/SettingToggle.svelte
@@ -1,16 +1,28 @@
 <script lang="ts">
   import settings, { type Settings } from '$stores/settings';
 
-  export let setting: keyof Settings;
-  export let on = '';
-  export let off = '';
-  export let sectionBreak = false;
-  export let disabled = false;
+  interface Props {
+    setting: keyof Settings;
+    on?: string;
+    off?: string;
+    sectionBreak?: boolean;
+    disabled?: boolean;
+    children?: import('svelte').Snippet;
+  }
+
+  let {
+    setting,
+    on = '',
+    off = '',
+    sectionBreak = false,
+    disabled = false,
+    children
+  }: Props = $props();
 </script>
 
 <a
   href={'#'}
-  on:click={() =>
+  onclick={() =>
     disabled
       ? {}
       : $settings[setting]
@@ -20,16 +32,16 @@
   {#if disabled}
     <strike>
       {$settings[setting] ? on : off}
-      <slot />
+      {@render children?.()}
     </strike>
   {:else}
     {$settings[setting] ? on : off}
-    <slot />
+    {@render children?.()}
   {/if}
 </a>
 
 <br />
 
 {#if sectionBreak}
-  <p />
+  <p></p>
 {/if}