Add name attribute to Button and TextField. (#164)

Sources/Slipstream/W3C/Elements/Forms/Button.swift

@@ -16,41 +16,40 @@ public enum ButtonType: String {
 public struct Button<Label>: View where Label: View {
   /// Creates a button that displays a custom label and executes a custom action
   /// when clicked.
-  public init(action: String, type: ButtonType? = nil, @ViewBuilder label: @escaping () -> Label) {
+  public init(action: String, type: ButtonType? = nil, name: String? = nil, @ViewBuilder label: @escaping () -> Label) {
     self.label = label
     self.action = action
     self.type = type
+    self.name = name
   }
 
   /// Creates a button that displays a custom label.
-  public init(type: ButtonType? = nil, @ViewBuilder label: @escaping () -> Label) {
+  public init(type: ButtonType? = nil, name: String? = nil, @ViewBuilder label: @escaping () -> Label) {
     self.label = label
     self.action = nil
     self.type = type
+    self.name = name
   }
 
   /// Creates a button that generates its label from a string.
-  public init(_ text: String, type: ButtonType? = nil) where Label == DOMString {
-    self.label = {
+  public init(_ text: String, type: ButtonType? = nil, name: String? = nil) where Label == DOMString {
+    self.init(type: type, name: name) {
       DOMString(text)
     }
-    self.action = nil
-    self.type = type
   }
 
   /// Creates a button that generates its label from a string and executes a custom
   /// action when clicked.
-  public init(_ text: String, action: String, type: ButtonType? = nil) where Label == DOMString {
-    self.label = {
+  public init(_ text: String, action: String, type: ButtonType? = nil, name: String? = nil) where Label == DOMString {
+    self.init(action: action, type: type, name: name) {
       DOMString(text)
     }
-    self.action = action
-    self.type = type
   }
 
   @ViewBuilder private let label: () -> Label
   private let action: String?
   private let type: ButtonType?
+  private let name: String?
 
   @_documentation(visibility: private)
   public func render(_ container: Element, environment: EnvironmentValues) throws {
@@ -61,6 +60,9 @@ public struct Button<Label>: View where Label: View {
     if let type {
       try element.attr("type", type.rawValue)
     }
+    if let name {
+      try element.attr("name", name)
+    }
     try self.label().render(element, environment: environment)
   }
 }

Sources/Slipstream/W3C/Elements/Forms/TextField.swift

@@ -94,12 +94,14 @@ public struct TextField: View {
   /// - Parameters:
   ///   - text: The placeholder text to display in the text field when it is empty.
   ///   - type: The text field's content type.
+  ///   - name: The name of the form control, as used in form submission.
   ///   - autoFocus: If true, indicates that the view should be focused as soon as
   ///   the page is loaded, allowing the user to start typing without having to
   ///   manually focus the main view.
-  public init(_ text: String, type: TextFieldInputType = .text, autoFocus: Bool = false) {
+  public init(_ text: String, type: TextFieldInputType = .text, name: String? = nil, autoFocus: Bool = false) {
     self.text = text
     self.type = type
+    self.name = name
     self.autoFocus = autoFocus
   }
 
@@ -108,6 +110,9 @@ public struct TextField: View {
     let element = try container.appendElement("input")
     try element.attr("type", type.rawValue)
     try element.attr("placeholder", text)
+    if let name {
+      try element.attr("name", name)
+    }
     if autoFocus {
       try element.attr("autofocus", "")
     }
@@ -116,4 +121,5 @@ public struct TextField: View {
   private let text: String
   private let autoFocus: Bool
   private let type: TextFieldInputType
+  private let name: String?
 }

Tests/SlipstreamTests/W3C/Forms/ButtonTests.swift

@@ -11,6 +11,10 @@ struct ButtonTests {
     try #expect(renderHTML(Button("Tap me")) == #"<button>Tap me</button>"#)
   }
 
+  @Test func withName() throws {
+    try #expect(renderHTML(Button("Tap me", name: "button")) == #"<button name="button">Tap me</button>"#)
+  }
+
   @Test func withType() throws {
     try #expect(renderHTML(Button("Tap me", type: .submit)) == #"<button type="submit">Tap me</button>"#)
     try #expect(renderHTML(Button("Tap me", type: .reset)) == #"<button type="reset">Tap me</button>"#)

Tests/SlipstreamTests/W3C/Forms/TextFieldTests.swift

@@ -11,6 +11,10 @@ struct TextFieldTests {
     try #expect(renderHTML(TextField("Placeholder", autoFocus: true)) == #"<input type="text" placeholder="Placeholder" autofocus />"#)
   }
 
+  @Test func withName() throws {
+    try #expect(renderHTML(TextField("Placeholder", name: "email")) == #"<input type="text" placeholder="Placeholder" name="email" />"#)
+  }
+
   @Test func withType() throws {
     try #expect(renderHTML(TextField("Placeholder", type: .text)) == #"<input type="text" placeholder="Placeholder" />"#)
     try #expect(renderHTML(TextField("Placeholder", type: .search)) == #"<input type="search" placeholder="Placeholder" />"#)