feat!: Added property "unregisterBehavior" to FormularioField to control value unset behavior on field component removal

Defaults to "none" which means value will not be unset and path will not be remove

src/FormularioField.vue

@@ -32,6 +32,8 @@ import {
     Empty,
 } from '@/types'
 
+import { UNREGISTER_BEHAVIOR } from '@/enum'
+
 const VALIDATION_BEHAVIOR = {
     DEMAND: 'demand',
     LIVE: 'live',
@@ -72,6 +74,7 @@ export default class FormularioField extends Vue {
     @Prop({ default: () => <T, U>(value: U|T): U|T => value }) modelSetConverter!: ModelSetConverter
 
     @Prop({ default: 'div' }) tag!: string
+    @Prop({ default: UNREGISTER_BEHAVIOR.NONE }) unregisterBehavior!: string
 
     public proxy: unknown = this.hasModel ? this.value : ''
 
@@ -156,7 +159,7 @@ export default class FormularioField extends Vue {
      */
     public beforeDestroy (): void {
         if (typeof this.__FormularioForm_unregister === 'function') {
-            this.__FormularioForm_unregister(this.fullPath)
+            this.__FormularioForm_unregister(this.fullPath, this.unregisterBehavior)
         }
     }
 

src/FormularioForm.vue

@@ -27,6 +27,8 @@ import {
 import { FormularioField } from '@/types'
 import { Violation } from '@/validation/validator'
 
+import { UNREGISTER_BEHAVIOR } from '@/enum'
+
 const update = (state: Record<string, unknown>, path: string, value: unknown): Record<string, unknown> => {
     if (value === undefined) {
         return unset(state, path) as Record<string, unknown>
@@ -88,13 +90,16 @@ export default class FormularioForm extends Vue {
     }
 
     @Provide('__FormularioForm_unregister')
-    private unregister (path: string): void {
+    private unregister (path: string, behavior: string): void {
         if (this.registry.has(path)) {
             this.registry.delete(path)
+
+            if (behavior === UNREGISTER_BEHAVIOR.UNSET) {
                 this.proxy = unset(this.proxy, path) as Record<string, unknown>
                 this.emitInput()
             }
         }
+    }
 
     @Provide('__FormularioForm_getState')
     private getState (): Record<string, unknown> {

src/enum.ts

@@ -0,0 +1,4 @@
+export const UNREGISTER_BEHAVIOR = {
+    NONE: 'none',
+    UNSET: 'unset',
+}

test/unit/FormularioField.test.js

@@ -286,4 +286,37 @@ describe('FormularioField', () => {
             [{ date: new Date('2001-05-12') }],
         ])
     })
+
+    test('unregister behavior', async () => {
+        const wrapper = mount({
+            props: {
+                formExists: {
+                    type: Boolean,
+                    default: true,
+                }
+            },
+            data: () => ({ state: { fieldA: '', fieldB: '' } }),
+            watch: {
+                state () {
+                    this.$emit('updated', this.state)
+                },
+            },
+            template: `
+                <div>
+                    <FormularioForm v-if="formExists" v-model="state">
+                        <FormularioField name="fieldA" />
+                        <FormularioField name="fieldB" unregister-behavior="unset" />
+                    </FormularioForm>
+                </div>
+            `,
+        })
+
+        await wrapper.vm.$nextTick()
+
+        wrapper.setProps({ formExists: false })
+
+        await wrapper.vm.$nextTick()
+
+        expect(wrapper.emitted('updated')).toEqual([[{ fieldA: '' }]])
+    })
 })