diff --git a/src/lib/components/inputfields/SelectInput.svelte b/src/lib/components/inputfields/SelectInput.svelte
index 2ab0f65..92f95fd 100644
--- a/src/lib/components/inputfields/SelectInput.svelte
+++ b/src/lib/components/inputfields/SelectInput.svelte
@@ -21,9 +21,7 @@
aria-invalid={$errors[field.name] ? 'true' : undefined}
{...constraints[field.name]}
>
-
-
-
-
-
+ {#each field.options as option (option.value)}
+
+ {/each}
diff --git a/src/lib/components/inputfields/TextInput.svelte b/src/lib/components/inputfields/TextInput.svelte
index 8fed656..dc9038b 100644
--- a/src/lib/components/inputfields/TextInput.svelte
+++ b/src/lib/components/inputfields/TextInput.svelte
@@ -10,6 +10,8 @@
export let childInput;
const { form, errors, field, constraints } = childInput;
+
+ $: console.log({ field });
value !== '', validationMessages.favoriteFood.invalid),
+ favoriteFood: z.enum(['apple', 'banana', 'coconut', 'peach', 'mango']).refine(value => value !== '', validationMessages.favoriteFood.invalid),
slider: z.number().min(0, validationMessages.slider.min).max(100, validationMessages.slider.max),
toggle: z.boolean().refine(value => typeof value === 'boolean', validationMessages.toggle.isBoolean),
}).required({
diff --git a/src/routes/composer/form/+page.svelte b/src/routes/composer/form/+page.svelte
index 0a55b07..6141361 100644
--- a/src/routes/composer/form/+page.svelte
+++ b/src/routes/composer/form/+page.svelte
@@ -24,37 +24,39 @@
{
name: 'name',
type: 'text',
- placeholder: '',
title: 'What is your name?',
description: 'Please enter your name'
},
{
name: 'email',
type: 'email',
- placeholder: '',
title: 'What is your email?',
description: 'Please enter your email'
},
{
name: 'about',
type: 'textarea',
- placeholder: '',
title: 'Can you tell us about yourself?',
description: 'Tell us about yourself'
},
{
name: 'age',
type: 'number',
- placeholder: '',
title: 'How old are you?',
description: 'Please enter your age'
},
{
name: 'favoriteFood',
type: 'select',
- placeholder: '',
title: 'What is your favorite food?',
- description: 'Please select your favorite food'
+ description: 'Please select your favorite food',
+ options: [
+ { value: 'apple', label: 'Apple' },
+ { value: 'banana', label: 'Banana' },
+ { value: 'peach', label: 'Peach' },
+ { value: 'coconut', label: 'Coconut' },
+ { value: 'mango', label: 'Mango' }
+ ]
}
],
validators: UserSchema