Implement onSubmit and submitScope modifiers for TextField handling

Author: stackotter

Sources/AppKitBackend/AppKitBackend.swift

@@ -537,14 +537,16 @@ public final class AppKitBackend: AppBackend {
         _ textField: Widget,
         placeholder: String,
         environment: EnvironmentValues,
-        onChange: @escaping (String) -> Void
+        onChange: @escaping (String) -> Void,
+        onSubmit: @escaping () -> Void
     ) {
         let textField = textField as! NSObservableTextField
         textField.placeholderString = placeholder
         textField.appearance = environment.colorScheme.nsAppearance
         textField.onEdit = { textField in
             onChange(textField.stringValue)
         }
+        textField.onSubmit = onSubmit
     }
 
     public func getContent(ofTextField textField: Widget) -> String {
@@ -1055,7 +1057,7 @@ final class NSCustomMenuItem: NSMenuItem {
 //   than the existing associated keys based approach. And probably more efficient too.
 // Source: https://stackoverflow.com/a/36983811
 final class Action: NSObject {
-    private let action: () -> Void
+    var action: () -> Void
 
     init(_ action: @escaping () -> Void) {
         self.action = action
@@ -1197,6 +1199,17 @@ class NSObservableTextField: NSTextField {
     }
 
     var onEdit: ((NSTextField) -> Void)?
+    var _onSubmitAction = Action({})
+    var onSubmit: () -> Void {
+        get {
+            _onSubmitAction.action
+        }
+        set {
+            _onSubmitAction.action = newValue
+            action = #selector(_onSubmitAction.run)
+            target = _onSubmitAction
+        }
+    }
 }
 
 // Source: https://gist.github.com/sindresorhus/3580ce9426fff8fafb1677341fca4815

Sources/Gtk3Backend/Gtk3Backend.swift

@@ -589,13 +589,17 @@ public final class Gtk3Backend: AppBackend {
         _ textField: Widget,
         placeholder: String,
         environment: EnvironmentValues,
-        onChange: @escaping (String) -> Void
+        onChange: @escaping (String) -> Void,
+        onSubmit: @escaping () -> Void
     ) {
         let textField = textField as! Entry
         textField.placeholderText = placeholder
         textField.changed = { widget in
             onChange(widget.text)
         }
+        textField.activate = { _ in
+            onSubmit()
+        }
 
         textField.css.clear()
         textField.css.set(properties: Self.cssProperties(for: environment, isControl: true))

Sources/GtkBackend/GtkBackend.swift

@@ -593,13 +593,17 @@ public final class GtkBackend: AppBackend {
         _ textField: Widget,
         placeholder: String,
         environment: EnvironmentValues,
-        onChange: @escaping (String) -> Void
+        onChange: @escaping (String) -> Void,
+        onSubmit: @escaping () -> Void
     ) {
         let textField = textField as! Entry
         textField.placeholderText = placeholder
         textField.changed = { widget in
             onChange(widget.text)
         }
+        textField.activate = { _ in
+            onSubmit()
+        }
 
         textField.css.clear()
         textField.css.set(properties: Self.cssProperties(for: environment, isControl: true))

Sources/SwiftCrossUI/Backend/AppBackend.swift

@@ -335,15 +335,17 @@ public protocol AppBackend {
     func createTextField() -> Widget
     /// Sets the placeholder label and change handler of an editable text field. The new
     /// change handler replaces any existing change handlers, and is called whenever the
-    /// displayed value changes.
+    /// displayed value changes. `onSubmit` gets called when the user hits Enter/Return,
+    /// or whatever the backend decides counts as submission of the field.
     ///
     /// The backend shouldn't wait until the user finishes typing to call the change handler;
     /// it should allow live access to the value.
     func updateTextField(
         _ textField: Widget,
         placeholder: String,
         environment: EnvironmentValues,
-        onChange: @escaping (String) -> Void
+        onChange: @escaping (String) -> Void,
+        onSubmit: @escaping () -> Void
     )
     /// Sets the value of an editable text field.
     func setContent(ofTextField textField: Widget, to content: String)
@@ -650,7 +652,8 @@ extension AppBackend {
         _ textField: Widget,
         placeholder: String,
         environment: EnvironmentValues,
-        onChange: @escaping (String) -> Void
+        onChange: @escaping (String) -> Void,
+        onSubmit: @escaping () -> Void
     ) {
         todo()
     }

Sources/SwiftCrossUI/Environment/EnvironmentValues.swift

@@ -31,6 +31,10 @@ public struct EnvironmentValues {
         foregroundColor ?? colorScheme.defaultForegroundColor
     }
 
+    /// Called when a text field gets submitted (usually due to the user
+    /// pressing Enter/Return).
+    public var onSubmit: (() -> Void)?
+
     /// Called by view graph nodes when they resize due to an internal state
     /// change and end up changing size. Each view graph node sets its own
     /// handler when passing the environment on to its children, setting up

Sources/SwiftCrossUI/Modifiers/OnSubmitModifier.swift

@@ -0,0 +1,17 @@
+extension View {
+    /// Adds an action to perform when the user submits a text field within this
+    /// view (generally via pressing the Enter/Return key).
+    public func onSubmit(perform action: @escaping () -> Void) -> some View {
+        EnvironmentModifier(self) { environment in
+            environment.with(\.onSubmit, action)
+        }
+    }
+
+    /// Prevents text field submissions from propagating to this view's
+    /// ancestors.
+    public func submitScope() -> some View {
+        EnvironmentModifier(self) { environment in
+            environment.with(\.onSubmit, nil)
+        }
+    }
+}

Sources/SwiftCrossUI/Views/TextField.swift

@@ -26,10 +26,12 @@ public struct TextField: ElementaryView, View {
             backend.updateTextField(
                 widget,
                 placeholder: placeholder,
-                environment: environment
-            ) { newValue in
-                self.value?.wrappedValue = newValue
-            }
+                environment: environment,
+                onChange: { newValue in
+                    self.value?.wrappedValue = newValue
+                },
+                onSubmit: environment.onSubmit ?? {}
+            )
             if let value = value?.wrappedValue, value != backend.getContent(ofTextField: widget) {
                 backend.setContent(ofTextField: widget, to: value)
             }