feat: add support for multiple callback urls

frontend/src/lib/components/form-input.svelte

@@ -2,15 +2,17 @@
 	import { Label } from '$lib/components/ui/label';
 	import type { FormInput } from '$lib/utils/form-util';
 	import type { Snippet } from 'svelte';
+	import type { HTMLAttributes } from 'svelte/elements';
 	import { Input } from './ui/input';
 
 	let {
 		input = $bindable(),
 		label,
 		description,
-		children
-	}: {
-		input: FormInput<string | boolean | number>;
+		children,
+		...restProps
+	}: HTMLAttributes<HTMLDivElement> & {
+		input?: FormInput<string | boolean | number>;
 		label: string;
 		description?: string;
 		children?: Snippet;
@@ -19,19 +21,19 @@
 	const id = label.toLowerCase().replace(/ /g, '-');
 </script>
 
-<div>
+<div {...restProps}>
 	<Label class="mb-0" for={id}>{label}</Label>
 	{#if description}
-		<p class="text-muted-foreground text-xs mt-1">{description}</p>
+		<p class="text-muted-foreground mt-1 text-xs">{description}</p>
 	{/if}
 	<div class="mt-2">
 		{#if children}
 			{@render children()}
-		{:else}
+		{:else if input}
 			<Input {id} bind:value={input.value} />
 		{/if}
-		{#if input.error}
-			<p class="text-sm text-red-500">{input.error}</p>
+		{#if input?.error}
+			<p class="mt-1 text-sm text-red-500">{input.error}</p>
 		{/if}
 	</div>
 </div>