<script lang="ts">
	import { writable } from 'svelte/store';
	import { SlideToggle } from '@skeletonlabs/skeleton';

	export let form;
	export let errors;
	export let validate;
	export let field;
	export let constraints;

	const state = writable(false);
</script>

<div class="mb-4">
	<label for={field.name} class="block mb-2 font-semibold text-white">
		{field.name.charAt(0).toUpperCase() + field.name.slice(1)}
	</label>
	<SlideToggle name={field.name} bind:checked={$form[field.name]} {...constraints[field.name]} />
</div>
