From b1f233784916f4b089c9af3a708a5379a90205ac Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 27 Oct 2023 11:42:01 +0100
Subject: [PATCH] Hide field layout settings for normal field components, and
 only show them when editing from within a form block

---
 .../EditFieldPopover.svelte                   |  1 +
 .../Component/ComponentSettingsSection.svelte | 25 +++++++++++++++----
 packages/client/manifest.json                 | 14 +++++++++++
 3 files changed, 35 insertions(+), 5 deletions(-)

diff --git a/packages/builder/src/components/design/settings/controls/FieldConfiguration/EditFieldPopover.svelte b/packages/builder/src/components/design/settings/controls/FieldConfiguration/EditFieldPopover.svelte
index 29c1d21841..e6fb82bedd 100644
--- a/packages/builder/src/components/design/settings/controls/FieldConfiguration/EditFieldPopover.svelte
+++ b/packages/builder/src/components/design/settings/controls/FieldConfiguration/EditFieldPopover.svelte
@@ -134,6 +134,7 @@
         <span>{field.field}</span>
       </div>
       <ComponentSettingsSection
+        includeHidden
         componentInstance={pseudoComponentInstance}
         componentDefinition={parsedComponentDef}
         isScreen={false}
diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/ComponentSettingsSection.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/ComponentSettingsSection.svelte
index f833464d8c..f78aeaa192 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/ComponentSettingsSection.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/ComponentSettingsSection.svelte
@@ -16,10 +16,16 @@
   export let isScreen = false
   export let onUpdateSetting
   export let showSectionTitle = true
+  export let includeHidden = false
 
-  $: sections = getSections(componentInstance, componentDefinition, isScreen)
+  $: sections = getSections(
+    componentInstance,
+    componentDefinition,
+    isScreen,
+    includeHidden
+  )
 
-  const getSections = (instance, definition, isScreen) => {
+  const getSections = (instance, definition, isScreen, includeHidden) => {
     const settings = definition?.settings ?? []
     const generalSettings = settings.filter(setting => !setting.section)
     const customSections = settings.filter(setting => setting.section)
@@ -38,7 +44,12 @@
         return
       }
       section.settings.forEach(setting => {
-        setting.visible = canRenderControl(instance, setting, isScreen)
+        setting.visible = canRenderControl(
+          instance,
+          setting,
+          isScreen,
+          includeHidden
+        )
       })
       section.visible =
         section.name === "General" ||
@@ -108,16 +119,20 @@
     })
   }
 
-  const canRenderControl = (instance, setting, isScreen) => {
+  const canRenderControl = (instance, setting, isScreen, includeHidden) => {
     // Prevent rendering on click setting for screens
     if (setting?.type === "event" && isScreen) {
       return false
     }
+    // Check we have a component to render for this setting
     const control = getComponentForSetting(setting)
     if (!control) {
       return false
     }
-
+    // Check if setting is hidden
+    if (setting.hidden && !includeHidden) {
+      return false
+    }
     return shouldDisplay(instance, setting)
   }
 </script>
diff --git a/packages/client/manifest.json b/packages/client/manifest.json
index 48f3f19203..c74ec7dea8 100644
--- a/packages/client/manifest.json
+++ b/packages/client/manifest.json
@@ -2603,6 +2603,7 @@
         "label": "Layout",
         "key": "span",
         "defaultValue": 6,
+        "hidden": true,
         "showInBar": true,
         "barStyle": "buttons",
         "options": [
@@ -2688,6 +2689,7 @@
         "label": "Layout",
         "key": "span",
         "defaultValue": 6,
+        "hidden": true,
         "showInBar": true,
         "barStyle": "buttons",
         "options": [
@@ -2768,6 +2770,7 @@
         "label": "Layout",
         "key": "span",
         "defaultValue": 6,
+        "hidden": true,
         "showInBar": true,
         "barStyle": "buttons",
         "options": [
@@ -2853,6 +2856,7 @@
         "label": "Layout",
         "key": "span",
         "defaultValue": 6,
+        "hidden": true,
         "showInBar": true,
         "barStyle": "buttons",
         "options": [
@@ -3049,6 +3053,7 @@
         "label": "Layout",
         "key": "span",
         "defaultValue": 6,
+        "hidden": true,
         "showInBar": true,
         "barStyle": "buttons",
         "options": [
@@ -3239,6 +3244,7 @@
         "label": "Layout",
         "key": "span",
         "defaultValue": 6,
+        "hidden": true,
         "showInBar": true,
         "barStyle": "buttons",
         "options": [
@@ -3347,6 +3353,7 @@
         "label": "Layout",
         "key": "span",
         "defaultValue": 6,
+        "hidden": true,
         "showInBar": true,
         "barStyle": "buttons",
         "options": [
@@ -3454,6 +3461,7 @@
         "label": "Layout",
         "key": "span",
         "defaultValue": 6,
+        "hidden": true,
         "showInBar": true,
         "barStyle": "buttons",
         "options": [
@@ -3563,6 +3571,7 @@
         "label": "Layout",
         "key": "span",
         "defaultValue": 6,
+        "hidden": true,
         "showInBar": true,
         "barStyle": "buttons",
         "options": [
@@ -3692,6 +3701,7 @@
         "label": "Layout",
         "key": "span",
         "defaultValue": 6,
+        "hidden": true,
         "showInBar": true,
         "barStyle": "buttons",
         "options": [
@@ -3896,6 +3906,7 @@
         "label": "Layout",
         "key": "span",
         "defaultValue": 6,
+        "hidden": true,
         "showInBar": true,
         "barStyle": "buttons",
         "options": [
@@ -3992,6 +4003,7 @@
         "label": "Layout",
         "key": "span",
         "defaultValue": 6,
+        "hidden": true,
         "showInBar": true,
         "barStyle": "buttons",
         "options": [
@@ -4072,6 +4084,7 @@
         "label": "Layout",
         "key": "span",
         "defaultValue": 6,
+        "hidden": true,
         "showInBar": true,
         "barStyle": "buttons",
         "options": [
@@ -6094,6 +6107,7 @@
         "label": "Layout",
         "key": "span",
         "defaultValue": 6,
+        "hidden": true,
         "showInBar": true,
         "barStyle": "buttons",
         "options": [