aboutsummaryrefslogtreecommitdiff
path: root/src/lib/Settings/SettingToggle.svelte
diff options
context:
space:
mode:
authorFuwn <[email protected]>2024-10-28 15:32:46 -0700
committerFuwn <[email protected]>2024-10-28 15:32:46 -0700
commit39b677404558ae3b7eb34e818d7ca308f62f9cb0 (patch)
tree7f19fca39ecd4237e3c0d1aef2d8e9fa3cec7845 /src/lib/Settings/SettingToggle.svelte
parentfeat(graphql): paged badges query (diff)
downloaddue.moe-svelte-5.tar.xz
due.moe-svelte-5.zip
feat: update to svelte 5svelte-5
Diffstat (limited to 'src/lib/Settings/SettingToggle.svelte')
-rw-r--r--src/lib/Settings/SettingToggle.svelte30
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}