Use component tokens for button (#1368)

* Use component tokens for button

* Update more colors

* Change color

* Update colors

* Update Warp

* Fix tests

---------

Co-authored-by: Milad Ajilianabbasi <[email protected]>

FinniversKit.xcworkspace/xcshareddata/swiftpm/Package.resolved

@@ -33,8 +33,8 @@
       "kind" : "remoteSourceControl",
       "location" : "https://github.com/warp-ds/warp-ios.git",
       "state" : {
-        "revision" : "47cdf208cbaa44b76713da510046a7d935eb978e",
-        "version" : "0.0.17"
+        "revision" : "ae6d80f9fd3477ebf487cc060306697b557cc532",
+        "version" : "0.0.22"
       }
     }
   ],

FinniversKit/Sources/Base Components/ButtonStyle.swift

@@ -9,7 +9,7 @@ public struct InlineFlatStyle: ButtonStyle {
     private let font: Font
     private let textColor: Color
 
-    public init(size: Button.Size = .normal, textColor: Color = .backgroundPrimary) {
+    public init(size: Button.Size = .normal, textColor: Color = .textLink) {
         self.font = size == .normal ? .finnFont(.bodyStrong) : .finnFont(.detailStrong)
         self.textColor = textColor
     }
@@ -31,7 +31,7 @@ public struct FlatStyle: ButtonStyle {
 
     public init(
         size: Button.Size = .normal,
-        textColor: Color = .backgroundPrimary,
+        textColor: Color = .textLink,
         fullWidth: Bool = true,
         padding: EdgeInsets = .init(top: Warp.Spacing.spacing100, leading: Warp.Spacing.spacing200, bottom: Warp.Spacing.spacing100, trailing: Warp.Spacing.spacing200)
     ) {
@@ -66,7 +66,7 @@ public struct DefaultStyle: ButtonStyle {
 
     public init(
         size: Button.Size = .normal,
-        textColor: Color = .backgroundPrimary,
+        textColor: Color = .textLink,
         fullWidth: Bool = true,
         padding: EdgeInsets = .init(top: Warp.Spacing.spacing100, leading: Warp.Spacing.spacing200, bottom: Warp.Spacing.spacing100, trailing: Warp.Spacing.spacing200)
     ) {
@@ -97,7 +97,7 @@ public struct DefaultStyle: ButtonStyle {
         .cornerRadius(Warp.Spacing.spacing100)
         .roundedBorder(
             radius: Warp.Spacing.spacing100,
-            color: configuration.isPressed ? .borderActive : .backgroundDisabled
+            color: configuration.isPressed ? .borderActive : .borderDisabled
         )
     }
 }
@@ -111,7 +111,7 @@ public struct CallToAction: ButtonStyle {
 
     public init(
         size: Button.Size = .normal,
-        background: Color = .backgroundPrimary,
+        background: Color = Warp.Color.buttonPrimaryBackground,
         fullWidth: Bool = true,
         isEnabled: Binding<Bool>? = nil,
         padding: EdgeInsets? = nil

FinniversKit/Sources/Components/Button/Button/Button+Style.swift

@@ -223,12 +223,12 @@ public extension Button.Style {
             stateStyles: [
                 .normal: Button.StateStyle(
                     textColor: .textInverted,
-                    backgroundColor: .backgroundPrimary,
+                    backgroundColor: Warp.UIColor.buttonPrimaryBackground,
                     borderColor: nil
                 ),
                 .highlighted: Button.StateStyle(
                     textColor: nil,
-                    backgroundColor: .backgroundPrimaryActive,
+                    backgroundColor: Warp.UIColor.buttonPrimaryBackgroundActive,
                     borderColor: nil
                 ),
                 .disabled: Button.StateStyle(

FinniversKit/Sources/Components/Panel/Panel+Style.swift

@@ -17,7 +17,7 @@ extension Panel {
             switch self {
             case .plain: return .background
             case .info: return .backgroundInfoSubtle
-            case .tips: return Warp.UIColor.badgeSponsoredBackground
+            case .tips: return .backgroundInfoSubtle
             case .newFunctionality: return .backgroundPositiveSubtle
             case .success: return .backgroundPositiveSubtle
             case .warning: return .backgroundWarningSubtle

FinniversKit/Sources/Components/SelectionView/Cells/SelectionOptionCell.swift

@@ -68,7 +68,7 @@ final class SelectionOptionCell: UITableViewCell {
 
     private func setup() {
         isAccessibilityElement = true
-        backgroundColor = .background
+        backgroundColor = .clear
         setDefaultSelectedBackgound()
         hideCheckmark(true)
 
@@ -94,10 +94,10 @@ final class SelectionOptionCell: UITableViewCell {
     }
 
     private func hideCheckmark(_ hide: Bool) {
-        iconImageView.tintColor = hide ? .iconPrimary : .backgroundPrimary
+        iconImageView.tintColor = hide ? .icon : .iconPrimary
 
         titleLabel.font = hide ? .body : .bodyStrong
-        titleLabel.textColor = iconImageView.tintColor
+        titleLabel.textColor = hide ? .text : .textLink
 
         checkmarkImageView.isHidden = hide
     }

FinniversKit/Sources/Components/SelectionView/SelectionView.swift

@@ -25,7 +25,7 @@ public final class SelectionView: UIView {
         tableView.translatesAutoresizingMaskIntoConstraints = false
         tableView.delegate = self
         tableView.dataSource = self
-        tableView.backgroundColor = .background
+        tableView.backgroundColor = .clear
         tableView.rowHeight = SelectionView.rowHeight
         tableView.estimatedRowHeight = SelectionView.rowHeight
         tableView.separatorInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)

FinniversKit/Sources/Recycling/ListViews/Settings/View/SettingsView.swift

@@ -32,7 +32,7 @@ public class SettingsView: UIView {
 
     lazy var tableView: UITableView = {
         let tableView = UITableView(frame: .zero, style: .grouped)
-        tableView.backgroundColor = .background
+        tableView.backgroundColor = .surfaceSunken
         tableView.separatorStyle = .none
         tableView.dataSource = self
         tableView.delegate = self

Package.swift

@@ -11,7 +11,7 @@ let package = Package(
         ),
     ],
     dependencies: [
-        .package(url: "https://github.com/warp-ds/warp-ios.git", "0.0.17"..."999.0.0")
+        .package(url: "https://github.com/warp-ds/warp-ios.git", "0.0.22"..."999.0.0")
     ],
     targets: [
         .target(