Support foregroundColor for TextField (#453)

* Support adjusting TextField foregroundColor in TokamakDOM * Simplify implementation of foregroundColor
TokamakUI · May 28, 2022 · 355c880 · 355c880
1 parent c0c4534
commit 355c880
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 3 deletions.
diff --git a/Sources/TokamakCore/Views/Text/TextField.swift b/Sources/TokamakCore/Views/Text/TextField.swift
@@ -39,7 +39,7 @@ public struct TextField<Label>: _PrimitiveView where Label: View {
   let textBinding: Binding<String>
   let onEditingChanged: (Bool) -> ()
   let onCommit: () -> ()
-  @Environment(\.textFieldStyle) var style
+  @Environment(\.self) var environment
 }
 
 public extension TextField where Label == Text {
@@ -80,5 +80,11 @@ public struct _TextFieldProxy<Label: View> {
   public var textBinding: Binding<String> { subject.textBinding }
   public var onCommit: () -> () { subject.onCommit }
   public var onEditingChanged: (Bool) -> () { subject.onEditingChanged }
-  public var textFieldStyle: _AnyTextFieldStyle { subject.style }
+  public var textFieldStyle: _AnyTextFieldStyle { subject.environment.textFieldStyle }
+  public var foregroundColor: AnyColorBox.ResolvedValue? {
+    guard let foregroundColor = subject.environment.foregroundColor else {
+      return nil
+    }
+    return _ColorProxy(foregroundColor).resolve(in: subject.environment)
+  }
 }
diff --git a/Sources/TokamakDOM/Views/Text/TextField.swift b/Sources/TokamakDOM/Views/Text/TextField.swift
@@ -46,7 +46,10 @@ extension TextField: DOMPrimitive where Label == Text {
       "type": proxy.textFieldStyle is RoundedBorderTextFieldStyle ? "search" : "text",
       .value: proxy.textBinding.wrappedValue,
       "placeholder": _TextProxy(proxy.label).rawText,
-      "style": css(for: proxy.textFieldStyle),
+      "style": """
+      \(css(for: proxy.textFieldStyle)) \
+      \(proxy.foregroundColor.map { "color: \($0.cssValue);" } ?? "")
+      """,
       "class": className(for: proxy.textFieldStyle),
     ], listeners: [
       "focus": { _ in proxy.onEditingChanged(true) },