Allow dynamic re-registration of form field components
This commit is contained in:
parent
c309db623e
commit
4ce25fdf0b
|
@ -23,7 +23,7 @@
|
|||
// Register field with form
|
||||
const formApi = formContext?.formApi
|
||||
const labelPos = fieldGroupContext?.labelPosition || "above"
|
||||
const formField = formApi?.registerField(
|
||||
$: formField = formApi?.registerField(
|
||||
field,
|
||||
type,
|
||||
defaultValue,
|
||||
|
@ -37,29 +37,16 @@
|
|||
$: $component.editing && labelNode?.focus()
|
||||
|
||||
// Update form properties in parent component on every store change
|
||||
const unsubscribe = formField?.subscribe(value => {
|
||||
$: unsubscribe = formField?.subscribe(value => {
|
||||
fieldState = value?.fieldState
|
||||
fieldApi = value?.fieldApi
|
||||
fieldSchema = value?.fieldSchema
|
||||
})
|
||||
onDestroy(() => unsubscribe?.())
|
||||
|
||||
// Keep field state up to date with props which might change due to
|
||||
// conditional UI
|
||||
$: updateValidation(validation)
|
||||
$: updateDisabled(disabled)
|
||||
|
||||
// Determine label class from position
|
||||
$: labelClass = labelPos === "above" ? "" : `spectrum-FieldLabel--${labelPos}`
|
||||
|
||||
const updateValidation = validation => {
|
||||
fieldApi?.updateValidation(validation)
|
||||
}
|
||||
|
||||
const updateDisabled = disabled => {
|
||||
fieldApi?.setDisabled(disabled)
|
||||
}
|
||||
|
||||
const updateLabel = e => {
|
||||
builderStore.actions.updateProp("label", e.target.textContent)
|
||||
}
|
||||
|
|
|
@ -96,15 +96,14 @@
|
|||
return
|
||||
}
|
||||
|
||||
// If we've already registered this field then wipe any errors and
|
||||
// return the existing field
|
||||
// If we've already registered this field then keep some existing state
|
||||
let initialValue = initialValues[field] ?? defaultValue
|
||||
let fieldId = `id-${generateID()}`
|
||||
const existingField = getField(field)
|
||||
if (existingField) {
|
||||
existingField.update(state => {
|
||||
state.fieldState.error = null
|
||||
return state
|
||||
})
|
||||
return existingField
|
||||
const { fieldState } = get(existingField)
|
||||
initialValue = fieldState.value ?? initialValue
|
||||
fieldId = fieldState.fieldId
|
||||
}
|
||||
|
||||
// Auto columns are always disabled
|
||||
|
@ -125,8 +124,8 @@
|
|||
type,
|
||||
step: step || 1,
|
||||
fieldState: {
|
||||
fieldId: `id-${generateID()}`,
|
||||
value: initialValues[field] ?? defaultValue,
|
||||
fieldId,
|
||||
value: initialValue,
|
||||
error: null,
|
||||
disabled: disabled || fieldDisabled || isAutoColumn,
|
||||
defaultValue,
|
||||
|
|
Loading…
Reference in New Issue