fix: Displaying label when provided in a Custom Sign Up fields (#32)

Author: sebaland

CHANGELOG.md

@@ -1,5 +1,9 @@
 # Changelog
 
+## 1.0.4 (2023-08-22)
+### Bug Fixes
+- Adding missing label when displaying a `.custom()` Sign Up field.
+
 ## 1.0.3 (2023-08-17)
 
 ### Bug Fixes
@@ -25,4 +29,4 @@
 
 Amplify Authenticator provides a complete drop-in implementation of an authentication flow for your application using [Amplify Authentication](https://docs.amplify.aws/lib/auth/getting-started/q/platform/ios/).
 
-More information on setting up and using the component is in the [documentation](https://ui.docs.amplify.aws/swift/connected-components/authenticator).
+More information on setting up and using the component is in the [documentation](https://ui.docs.amplify.aws/swift/connected-components/authenticator).

Sources/Authenticator/Constants/ComponentInformation.swift

@@ -8,6 +8,6 @@
 import Foundation
 
 public class ComponentInformation {
-    public static let version = "1.0.3"
+    public static let version = "1.0.4"
     public static let name = "amplify-ui-swift-authenticator"
 }

Sources/Authenticator/Views/Internal/SignUpInputField.swift

@@ -71,7 +71,16 @@ struct SignUpInputField: View {
     }
 
     @ViewBuilder func customView(for field: CustomSignUpField) -> some View {
-        VStack(alignment: .leading) {
+        VStack(alignment: .leading, spacing: theme.components.field.spacing.vertical) {
+            if let label = field.label {
+                HStack {
+                    SwiftUI.Text(label)
+                        .foregroundColor(foregroundColor)
+                        .font(theme.fonts.body)
+                        .accessibilityHidden(true)
+                    Spacer()
+                }
+            }
             AnyView(
                 field.content($field.value)
             )
@@ -86,11 +95,20 @@ struct SignUpInputField: View {
                     field.errorContent(errorMessage)
                         .font(theme.fonts.subheadline)
                 )
-                    .foregroundColor(borderColor)
-                    .transition(options.contentTransition)
+                .foregroundColor(borderColor)
+                .transition(options.contentTransition)
             }
         }
     }
+    
+    private var foregroundColor: Color {
+        switch validator.state {
+        case .normal:
+            return theme.colors.foreground.secondary
+        case .error:
+            return theme.colors.foreground.error
+        }
+    }
 
     private var borderColor: Color {
         switch validator.state {