Update field disabled state when disabled prop changes

packages/client/src/components/app/forms/Field.svelte

@@ -22,7 +22,7 @@
 
   // Register field with form
   const formApi = formContext?.formApi
-  const labelPosition = fieldGroupContext?.labelPosition || "above"
+  const labelPos = fieldGroupContext?.labelPosition || "above"
   const formField = formApi?.registerField(
     field,
     type,
@@ -38,17 +38,23 @@
     fieldApi = value?.fieldApi
     fieldSchema = value?.fieldSchema
   })
-  onDestroy(() => unsubscribe && unsubscribe())
+  onDestroy(() => unsubscribe?.())
 
-  // Keep validation rules up to date
+  // 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)
   }
 
-  // Extract label position from field group context
+  const updateDisabled = disabled => {
-  $: labelPositionClass =
+    fieldApi?.setDisabled(disabled)
-    labelPosition === "above" ? "" : `spectrum-FieldLabel--${labelPosition}`
+  }
 </script>
 
 <FieldGroupFallback>
@@ -56,7 +62,7 @@
     <label
       class:hidden={!label}
       for={fieldState?.fieldId}
-      class={`spectrum-FieldLabel spectrum-FieldLabel--sizeM spectrum-Form-itemLabel ${labelPositionClass}`}
+      class={`spectrum-FieldLabel spectrum-FieldLabel--sizeM spectrum-Form-itemLabel ${labelClass}`}
     >
       {label || ""}
     </label>

packages/client/src/components/app/forms/InnerForm.svelte

@@ -248,10 +248,25 @@
       }
     }
 
+    // Updates the disabled state of a certain field
+    const setDisabled = fieldDisabled => {
+      const fieldInfo = getField(field)
+
+      // Auto columns are always disabled
+      const isAutoColumn = !!schema?.[field]?.autocolumn
+
+      // Update disabled state
+      fieldInfo.update(state => {
+        state.fieldState.disabled = disabled || fieldDisabled || isAutoColumn
+        return state
+      })
+    }
+
     return {
       setValue,
       clearValue,
       updateValidation,
+      setDisabled,
       validate: () => {
         // Validate the field by force setting the same value again
         const { fieldState } = get(getField(field))