diff --git a/packages/client/src/components/app/forms/Field.svelte b/packages/client/src/components/app/forms/Field.svelte index 3ebfc5084f..b267f6caff 100644 --- a/packages/client/src/components/app/forms/Field.svelte +++ b/packages/client/src/components/app/forms/Field.svelte @@ -44,7 +44,6 @@ fieldApi = value?.fieldApi fieldSchema = value?.fieldSchema }) - onDestroy(() => unsubscribe?.()) // Determine label class from position $: labelClass = labelPos === "above" ? "" : `spectrum-FieldLabel--${labelPos}` @@ -52,6 +51,11 @@ const updateLabel = e => { builderStore.actions.updateProp("label", e.target.textContent) } + + onDestroy(() => { + fieldApi?.deregister() + unsubscribe?.() + }) diff --git a/packages/client/src/components/app/forms/InnerForm.svelte b/packages/client/src/components/app/forms/InnerForm.svelte index 99dcbf4d5e..752bc9a2eb 100644 --- a/packages/client/src/components/app/forms/InnerForm.svelte +++ b/packages/client/src/components/app/forms/InnerForm.svelte @@ -329,6 +329,17 @@ } } + // We don't want to actually remove the field state when deregistering, just + // remove any errors and validation + const deregister = () => { + const fieldInfo = getField(field) + fieldInfo.update(state => { + state.fieldState.validator = null + state.fieldState.error = null + return state + }) + } + // Updates the disabled state of a certain field const setDisabled = fieldDisabled => { const fieldInfo = getField(field) @@ -348,6 +359,7 @@ reset, updateValidation, setDisabled, + deregister, validate: () => { // Validate the field by force setting the same value again const { fieldState } = get(getField(field))