summaryrefslogtreecommitdiffstatshomepage
path: root/frontend/src/lib/dialogs/components/UpdateModeSelector.svelte
blob: 6548fb54b6f7e219affc96beeb06e6a4e4195dbd (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<script lang="ts">
	import { UpdateMode } from '$gql/graphql';
	import { UpdateModeLabel } from '$lib/Enums';

	let { mode = $bindable() }: { mode: UpdateMode } = $props();

	function select(e: string) {
		mode = e as UpdateMode;
	}
</script>

<div class="flex gap-1 pb-1 text-xs">
	{#each Object.entries(UpdateModeLabel) as [e, label]}
		<button
			type="button"
			class:active={mode === e}
			class:dangerous={mode !== UpdateMode.Add}
			class="btn btn-xs hover:bg-slate-700 [&.active.dangerous]:bg-rose-800 [&.active]:bg-indigo-700"
			onclick={() => select(e)}
		>
			{label}
		</button>
	{/each}
</div>