summaryrefslogtreecommitdiffstatshomepage
path: root/frontend/src/lib/components/LabelledBlock.svelte
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/src/lib/components/LabelledBlock.svelte')
-rw-r--r--frontend/src/lib/components/LabelledBlock.svelte17
1 files changed, 12 insertions, 5 deletions
diff --git a/frontend/src/lib/components/LabelledBlock.svelte b/frontend/src/lib/components/LabelledBlock.svelte
index feb563e..8f93667 100644
--- a/frontend/src/lib/components/LabelledBlock.svelte
+++ b/frontend/src/lib/components/LabelledBlock.svelte
@@ -1,7 +1,14 @@
<script lang="ts">
import { idFromLabel } from '$lib/Utils';
+ import type { Snippet } from 'svelte';
- export let label: string;
+ interface Props {
+ label: string;
+ side?: Snippet;
+ children?: Snippet<[{ id: string }]>;
+ }
+
+ let { label, side, children }: Props = $props();
const id = idFromLabel(label);
</script>
@@ -9,10 +16,10 @@
<div class="flex flex-col">
<div class="flex">
<label for={id}>{label}</label>
- {#if $$slots.controls}
- <div class="grow" />
- <slot name="controls" />
+ {#if side}
+ <div class="grow"></div>
+ {@render side?.()}
{/if}
</div>
- <slot {id} />
+ {@render children?.({ id })}
</div>