aboutsummaryrefslogtreecommitdiff
path: root/src/lib/Settings/SettingCheckboxToggle.svelte
diff options
context:
space:
mode:
authorFuwn <[email protected]>2023-10-24 19:11:21 -0700
committerFuwn <[email protected]>2023-10-24 19:11:21 -0700
commit7051fd67e98be0166d4f093f111dfa5dfa28bc0a (patch)
tree61395da21f35395a88950428990f21ca9c12d261 /src/lib/Settings/SettingCheckboxToggle.svelte
parentfeat: badge wall (diff)
parentchore(git): ignore data folder (diff)
downloaddue.moe-7051fd67e98be0166d4f093f111dfa5dfa28bc0a.tar.xz
due.moe-7051fd67e98be0166d4f093f111dfa5dfa28bc0a.zip
merge: main into badges
Diffstat (limited to 'src/lib/Settings/SettingCheckboxToggle.svelte')
-rw-r--r--src/lib/Settings/SettingCheckboxToggle.svelte54
1 files changed, 54 insertions, 0 deletions
diff --git a/src/lib/Settings/SettingCheckboxToggle.svelte b/src/lib/Settings/SettingCheckboxToggle.svelte
new file mode 100644
index 00000000..ab603278
--- /dev/null
+++ b/src/lib/Settings/SettingCheckboxToggle.svelte
@@ -0,0 +1,54 @@
+<script lang="ts">
+ import settings, { type Settings } from '../../stores/settings';
+
+ type BooleanSettingsKeys<T> = {
+ [K in keyof T]: T[K] extends boolean ? K : never;
+ };
+ type SettingsBooleanKeys = BooleanSettingsKeys<Settings>;
+
+ export let sectionBreak = false;
+ export let disabled = false;
+ export let text: string;
+ export let setting: SettingsBooleanKeys[keyof SettingsBooleanKeys];
+
+ // const toggler = (key: keyof Settings) => [
+ // () =>
+ // settings.update((s) => {
+ // (s[key] as boolean) = true;
+
+ // $settings = s;
+
+ // return s;
+ // }),
+ // () =>
+ // settings.update((s) => {
+ // (s[key] as boolean) = false;
+
+ // $settings = s;
+
+ // return s;
+ // })
+ // ];
+
+ const check = (e: Event & { currentTarget: EventTarget & HTMLInputElement }): void => {
+ settings.setKey(setting, (e.target as HTMLInputElement).checked);
+ };
+</script>
+
+<input type="checkbox" on:change={check} bind:checked={$settings[setting]} />
+
+{#if disabled}
+ <strike>
+ {text}
+ </strike>
+ <slot />
+{:else}
+ {text}
+ <slot />
+{/if}
+
+<br />
+
+{#if sectionBreak}
+ <p />
+{/if}