From 335439c165c2ab83599b05f73fe6abf6ac9e564d Mon Sep 17 00:00:00 2001
From: Jeff Verkoeyen <jverkoey@gmail.com>
Date: Sat, 10 Aug 2024 12:04:50 -0400
Subject: [PATCH] Add onclick support to Button. (#157)

---
 .../W3C/Elements/Forms/Button.swift           | 37 +++++++++++++++----
 .../W3C/Forms/ButtonTests.swift               |  9 +++++
 2 files changed, 38 insertions(+), 8 deletions(-)

diff --git a/Sources/Slipstream/W3C/Elements/Forms/Button.swift b/Sources/Slipstream/W3C/Elements/Forms/Button.swift
index 8ada1e0..c7a6e4b 100644
--- a/Sources/Slipstream/W3C/Elements/Forms/Button.swift
+++ b/Sources/Slipstream/W3C/Elements/Forms/Button.swift
@@ -4,25 +4,46 @@ import SwiftSoup
 ///
 /// - SeeAlso: W3C [button](https://html.spec.whatwg.org/multipage/form-elements.html#the-button-element) specification.
 @available(iOS 17.0, macOS 14.0, *)
-public struct Button<Content>: View where Content: View {
+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, @ViewBuilder label: @escaping () -> Label) {
+    self.label = label
+    self.action = action
+  }
+
   /// Creates a button that displays a custom label.
-  public init(@ViewBuilder content: @escaping () -> Content) {
-    self.content = content
+  public init(@ViewBuilder label: @escaping () -> Label) {
+    self.label = label
+    self.action = nil
   }
 
   /// Creates a button that generates its label from a string.
-  public init(_ text: String) where Content == DOMString {
-    self.content = {
+  public init(_ text: String) where Label == DOMString {
+    self.label = {
       DOMString(text)
     }
+    self.action = nil
   }
 
-  @_documentation(visibility: private)
-  @ViewBuilder public let content: () -> Content
+  /// Creates a button that generates its label from a string and executes a custom
+  /// action when clicked.
+  public init(_ text: String, action: String) where Label == DOMString {
+    self.label = {
+      DOMString(text)
+    }
+    self.action = action
+  }
+
+  @ViewBuilder private let label: () -> Label
+  private let action: String?
 
   @_documentation(visibility: private)
   public func render(_ container: Element, environment: EnvironmentValues) throws {
     let element = try container.appendElement("button")
-    try self.content().render(element, environment: environment)
+    if let action {
+      try element.attr("onclick", action)
+    }
+    try self.label().render(element, environment: environment)
   }
 }
diff --git a/Tests/SlipstreamTests/W3C/Forms/ButtonTests.swift b/Tests/SlipstreamTests/W3C/Forms/ButtonTests.swift
index 36d8d85..e9f022e 100644
--- a/Tests/SlipstreamTests/W3C/Forms/ButtonTests.swift
+++ b/Tests/SlipstreamTests/W3C/Forms/ButtonTests.swift
@@ -6,10 +6,19 @@ struct ButtonTests {
   @Test func emptyBlock() throws {
     try #expect(renderHTML(Button {}) == "<button></button>")
   }
+
   @Test func withText() throws {
     try #expect(renderHTML(Button("Tap me")) == #"<button>Tap me</button>"#)
   }
 
+  @Test func withAction() throws {
+    try #expect(renderHTML(Button(action: "alert('hello world')") {
+      DOMString("Tap me")
+    }) == #"<button onclick="alert('hello world')">Tap me</button>"#)
+
+    try #expect(renderHTML(Button("Tap me", action: "alert('hello world')")) == #"<button onclick="alert('hello world')">Tap me</button>"#)
+  }
+
   @Test func withCustomContent() throws {
     try #expect(renderHTML(Button {
       Text("Tap me")