From 68bb8ff869cf07894d74454e9b7965d58667dc78 Mon Sep 17 00:00:00 2001
From: Jon Uhlmann <me@jonnitto.ch>
Date: Tue, 29 Aug 2023 19:15:18 +0000
Subject: [PATCH 1/2] TASK: Better class rendering and fix typo in label
 renderer

---
 Resources/Private/Fusion/Prototypes/FieldContainer.fusion | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/Resources/Private/Fusion/Prototypes/FieldContainer.fusion b/Resources/Private/Fusion/Prototypes/FieldContainer.fusion
index 03f0ec8..7b5daff 100644
--- a/Resources/Private/Fusion/Prototypes/FieldContainer.fusion
+++ b/Resources/Private/Fusion/Prototypes/FieldContainer.fusion
@@ -28,8 +28,8 @@ prototype(Neos.Fusion.Form:FieldContainer)  < prototype(Neos.Fusion.Form:Compone
     errorRenderer = 'Neos.Fusion.Form:ErrorRenderer'
 
     renderer = afx`
-        <div class={props.class + (field.hasErrors() ? ' ' + props.errorClass : '')} {...props.attributes} >
-            <Neos.Fusion:Renderer @if.hasErrors={props.label} type={props.labelRenderer} element.for={field.getName()} element.label={props.label} />
+        <div class={[props.class, field.hasErrors() ? props.errorClass : null]} {...props.attributes} >
+            <Neos.Fusion:Renderer @if.hasLabel={props.label} type={props.labelRenderer} element.for={field.getName()} element.label={props.label} />
             {props.content}
             <Neos.Fusion:Renderer @if.hasErrors={field.hasErrors()} type={props.errorRenderer} element.result={field.getResult()} />
         </div>

From a7f16559e028fd033a4578f38bf7b0461cc193df Mon Sep 17 00:00:00 2001
From: Jon Uhlmann <me@jonnitto.ch>
Date: Tue, 29 Aug 2023 19:15:36 +0000
Subject: [PATCH 2/2] BUGFIX: Add id to form elements

---
 Resources/Private/Fusion/Prototypes/Checkbox.fusion | 1 +
 Resources/Private/Fusion/Prototypes/Date.fusion     | 1 +
 Resources/Private/Fusion/Prototypes/Input.fusion    | 1 +
 Resources/Private/Fusion/Prototypes/Radio.fusion    | 1 +
 Resources/Private/Fusion/Prototypes/Select.fusion   | 1 +
 Resources/Private/Fusion/Prototypes/Textarea.fusion | 1 +
 Resources/Private/Fusion/Prototypes/Upload.fusion   | 4 +++-
 7 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/Resources/Private/Fusion/Prototypes/Checkbox.fusion b/Resources/Private/Fusion/Prototypes/Checkbox.fusion
index d4adaff..a8bf51d 100644
--- a/Resources/Private/Fusion/Prototypes/Checkbox.fusion
+++ b/Resources/Private/Fusion/Prototypes/Checkbox.fusion
@@ -20,6 +20,7 @@ prototype(Neos.Fusion.Form:Checkbox)  < prototype(Neos.Fusion.Form:Component.Fie
 
         renderer = afx`
             <input
+                id={field.getName()}
                 type="checkbox"
                 name={field.getName()}
                 value={field.getTargetValueStringified()}
diff --git a/Resources/Private/Fusion/Prototypes/Date.fusion b/Resources/Private/Fusion/Prototypes/Date.fusion
index 7814326..b71e0ce 100644
--- a/Resources/Private/Fusion/Prototypes/Date.fusion
+++ b/Resources/Private/Fusion/Prototypes/Date.fusion
@@ -4,6 +4,7 @@ prototype(Neos.Fusion.Form:Date)  < prototype(Neos.Fusion.Form:Component.Field)
 
     renderer = afx`
         <input
+            id={field.getName()}
             name={field.getName()}
             value={field.getCurrentValue() || field.getTargetValue()}
             value.@process.format={Type.instance(value, 'DateTime') ? Date.format(value, 'Y-m-d') : value}
diff --git a/Resources/Private/Fusion/Prototypes/Input.fusion b/Resources/Private/Fusion/Prototypes/Input.fusion
index 8618b40..bdaa1e2 100644
--- a/Resources/Private/Fusion/Prototypes/Input.fusion
+++ b/Resources/Private/Fusion/Prototypes/Input.fusion
@@ -4,6 +4,7 @@ prototype(Neos.Fusion.Form:Input)  < prototype(Neos.Fusion.Form:Component.Field)
 
     renderer = afx`
         <input
+            id={field.getName()}
             name={field.getName()}
             value={field.getCurrentValueStringified() || field.getTargetValueStringified()}
             {...props.attributes}
diff --git a/Resources/Private/Fusion/Prototypes/Radio.fusion b/Resources/Private/Fusion/Prototypes/Radio.fusion
index bbcb107..eab04f7 100644
--- a/Resources/Private/Fusion/Prototypes/Radio.fusion
+++ b/Resources/Private/Fusion/Prototypes/Radio.fusion
@@ -16,6 +16,7 @@ prototype(Neos.Fusion.Form:Radio)  < prototype(Neos.Fusion.Form:Component.Field)
 
         renderer = afx`
             <input
+                id={field.getName() + '-' + field.getTargetValueStringified()}
                 type="radio"
                 name={field.getName()}
                 value={field.getTargetValueStringified()}
diff --git a/Resources/Private/Fusion/Prototypes/Select.fusion b/Resources/Private/Fusion/Prototypes/Select.fusion
index 6ccfce5..d876f6c 100644
--- a/Resources/Private/Fusion/Prototypes/Select.fusion
+++ b/Resources/Private/Fusion/Prototypes/Select.fusion
@@ -2,6 +2,7 @@ prototype(Neos.Fusion.Form:Select)  < prototype(Neos.Fusion.Form:Component.Field
 
     renderer = afx`
         <select
+            id={field.getName()}
             name={field.getName()}
             multiple={field.isMultiple()}
             {...props.attributes}
diff --git a/Resources/Private/Fusion/Prototypes/Textarea.fusion b/Resources/Private/Fusion/Prototypes/Textarea.fusion
index 5b3cea7..aa6db7b 100644
--- a/Resources/Private/Fusion/Prototypes/Textarea.fusion
+++ b/Resources/Private/Fusion/Prototypes/Textarea.fusion
@@ -2,6 +2,7 @@ prototype(Neos.Fusion.Form:Textarea)  < prototype(Neos.Fusion.Form:Component.Fie
 
     renderer = afx`
         <textarea
+            id={field.getName()}
             name={field.getName()}
             {...props.attributes}
         >
diff --git a/Resources/Private/Fusion/Prototypes/Upload.fusion b/Resources/Private/Fusion/Prototypes/Upload.fusion
index 84e455e..971444a 100644
--- a/Resources/Private/Fusion/Prototypes/Upload.fusion
+++ b/Resources/Private/Fusion/Prototypes/Upload.fusion
@@ -5,10 +5,12 @@ prototype(Neos.Fusion.Form:Upload)  < prototype(Neos.Fusion.Form:Component.Field
     renderer = afx`
         <input
             @if.has={Type.instance(field.getCurrentValue(), 'Neos\Flow\ResourceManagement\PersistentResource')}
-            type="hidden" name={field.getName() + '[originallySubmittedResource][__identity]'}
+            type="hidden"
+            name={field.getName() + '[originallySubmittedResource][__identity]'}
             value={field.getCurrentValueStringified()}
         />
         <input
+        id={field.getName()}
             name={field.getName()}
             {...props.attributes}
         />