diff --git a/docs/guide/inputs.md b/docs/guide/inputs.md index 7be4b72..927221b 100644 --- a/docs/guide/inputs.md +++ b/docs/guide/inputs.md @@ -31,6 +31,7 @@ `FormSelect` extends `FormInput` props and adds the following options: - `options` Key-value object for select options. - `multiple` Boolean for multiple select. +- `empty` Boolean to allow empty value ### Example ```VUE @@ -62,6 +63,7 @@ `FormRadio` extends `FormInput` props and adds the following options: - `options` Key-value object for select options. - `default` Default value. +- `empty` Boolean to allow empty value ### Example ```VUE diff --git a/package.json b/package.json index cbf709e..c85cbf1 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "@wgr-sa/nuxt-form", "description": "Form builder for Nuxt", - "version": "0.8.2", + "version": "0.8.3", "repository": "https://github.com/WGR-SA/nuxt-form.git", "author": "jeanvier", "license": "MIT", diff --git a/playground/app.vue b/playground/app.vue index dcc6b89..acc2e81 100644 --- a/playground/app.vue +++ b/playground/app.vue @@ -19,6 +19,8 @@ + + Submit diff --git a/src/runtime/components/FormInputContainer.vue b/src/runtime/components/FormInputContainer.vue index 4138b41..038734d 100644 --- a/src/runtime/components/FormInputContainer.vue +++ b/src/runtime/components/FormInputContainer.vue @@ -12,6 +12,7 @@ const props = defineProps<{ value?: string, default?: string, type?: string, + empty?: boolean, [key: string]: any }>() const { getFieldErrors } = useFormValidator() diff --git a/src/runtime/types/input.d.ts b/src/runtime/types/input.d.ts index 5aac937..1982b83 100644 --- a/src/runtime/types/input.d.ts +++ b/src/runtime/types/input.d.ts @@ -12,6 +12,7 @@ declare namespace FormInput { multiple?: boolean, default?: string, type?: string, + empty?: boolean, placeholder?: string, [key: string]: any } diff --git a/src/runtime/utils/data/handler.ts b/src/runtime/utils/data/handler.ts index 21318fb..a6a1d01 100644 --- a/src/runtime/utils/data/handler.ts +++ b/src/runtime/utils/data/handler.ts @@ -13,11 +13,11 @@ export class FormDataHandler { this.state[name] = value } - setDefaultValue (field: any) { + setDefaultValue(field: FormInput.Container) { if (field.type === 'checkbox') { this.state[field.name] = 'false' } - if (field.options) { + if (field.options && !field.empty) { this.state[field.name] = field.value ?? field.default ?? Object.keys(field.options)[0] } if (field.checked) {