refactor: update colors in the Palette

Author: mikhailChelbaev

Examples/DemosApp/DemosApp/ComponentsPreview/Helpers/PreviewPickers.swift

@@ -40,15 +40,14 @@ struct ComponentColorPicker: View {
   var body: some View {
     Picker("Color", selection: self.$selection) {
       Text("Primary").tag(ComponentColor.primary)
-      Text("Secondary").tag(ComponentColor.secondary)
       Text("Accent").tag(ComponentColor.accent)
       Text("Success").tag(ComponentColor.success)
       Text("Warning").tag(ComponentColor.warning)
       Text("Danger").tag(ComponentColor.danger)
       Text("Custom").tag(ComponentColor(
         main: .universal(.uiColor(.systemPurple)),
-        contrast: .universal(.uiColor(.systemYellow)))
-      )
+        contrast: .universal(.uiColor(.systemYellow))
+      ))
     }
   }
 }
@@ -62,15 +61,14 @@ struct ComponentOptionalColorPicker: View {
     Picker("Color", selection: self.$selection) {
       Text("Default").tag(Optional<ComponentColor>.none)
       Text("Primary").tag(ComponentColor.primary)
-      Text("Secondary").tag(ComponentColor.secondary)
       Text("Accent").tag(ComponentColor.accent)
       Text("Success").tag(ComponentColor.success)
       Text("Warning").tag(ComponentColor.warning)
       Text("Danger").tag(ComponentColor.danger)
       Text("Custom").tag(ComponentColor(
         main: .universal(.uiColor(.systemPurple)),
-        contrast: .universal(.uiColor(.systemYellow)))
-      )
+        contrast: .universal(.uiColor(.systemYellow))
+      ))
     }
   }
 }
@@ -173,7 +171,6 @@ struct UniversalColorPicker: View {
   var body: some View {
     Picker(self.title, selection: self.$selection) {
       Text("Primary").tag(UniversalColor.primary)
-      Text("Secondary").tag(UniversalColor.secondary)
       Text("Accent").tag(UniversalColor.accent)
       Text("Success").tag(UniversalColor.success)
       Text("Warning").tag(UniversalColor.warning)

Examples/DemosApp/DemosApp/ComponentsPreview/PreviewPages/ButtonPreview.swift

@@ -18,7 +18,7 @@ struct ButtonPreview: View {
       }
       Form {
         AnimationScalePicker(selection: self.$model.animationScale)
-        ComponentColorPicker(selection: self.$model.color)
+        ComponentOptionalColorPicker(selection: self.$model.color)
         CornerRadiusPicker(selection: self.$model.cornerRadius) {
           Text("Custom: 20px").tag(ComponentRadius.custom(20))
         }

Examples/DemosApp/DemosApp/ComponentsPreview/PreviewPages/DividerPreview.swift

@@ -15,21 +15,23 @@ struct DividerPreview: View {
         SUDivider(model: self.model)
       }
       Form {
+        Picker("Color", selection: self.$model.color) {
+          Text("Default").tag(Optional<ComponentColor>.none)
+          Text("Primary").tag(ComponentColor.primary)
+          Text("Accent").tag(ComponentColor.accent)
+          Text("Success").tag(ComponentColor.success)
+          Text("Warning").tag(ComponentColor.warning)
+          Text("Danger").tag(ComponentColor.danger)
+          Text("Custom").tag(ComponentColor(
+            main: .universal(.uiColor(.systemPurple)),
+            contrast: .universal(.uiColor(.systemYellow))
+          ))
+        }
         Picker("Orientation", selection: self.$model.orientation) {
           Text("Horizontal").tag(DividerVM.Orientation.horizontal)
           Text("Vertical").tag(DividerVM.Orientation.vertical)
         }
         SizePicker(selection: self.$model.size)
-        Picker("Color", selection: self.$model.color) {
-          Text("Default").tag(Palette.Base.divider)
-          Text("Primary").tag(UniversalColor.primary)
-          Text("Secondary").tag(UniversalColor.secondary)
-          Text("Accent").tag(UniversalColor.accent)
-          Text("Success").tag(UniversalColor.success)
-          Text("Warning").tag(UniversalColor.warning)
-          Text("Danger").tag(UniversalColor.danger)
-          Text("Custom").tag(UniversalColor.universal(.uiColor(.systemPurple)))
-        }
       }
     }
   }

Examples/DemosApp/DemosApp/Demos/Login/SwiftUILogin.swift

@@ -38,7 +38,7 @@ struct SwiftUILogin: View {
 
   var body: some View {
     ZStack {
-      Palette.Base.background.color(for: self.colorScheme)
+      UniversalColor.background.color(for: self.colorScheme)
 
       ScrollView {
         VStack(spacing: 20) {

Examples/DemosApp/DemosApp/Demos/Login/UIKitLogin.swift

@@ -157,7 +157,7 @@ final class UIKitLogin: UIViewController {
   }
 
   private func style() {
-    self.scrollView.backgroundColor = Palette.Base.background.uiColor
+    self.scrollView.backgroundColor = UniversalColor.background.uiColor
 
     self.stackView.setCustomSpacing(50, after: self.pageControl)
     self.stackView.setCustomSpacing(50, after: self.titleLabel)

Sources/ComponentsKit/Button/Models/ButtonVM.swift

@@ -11,9 +11,7 @@ public struct ButtonVM: ComponentVM {
   public var animationScale: AnimationScale = .medium
 
   /// The color of the button.
-  ///
-  /// Defaults to `.primary`.
-  public var color: ComponentColor = .primary
+  public var color: ComponentColor?
 
   /// The corner radius of the button.
   ///
@@ -53,18 +51,12 @@ public struct ButtonVM: ComponentVM {
 
 extension ButtonVM {
   private var mainColor: UniversalColor {
-    return self.isEnabled
-    ? self.color.main
-    : self.color.main.withOpacity(
-      ComponentsKitConfig.shared.layout.disabledOpacity
-    )
+    let color = self.color?.main ?? .content2
+    return color.enabled(self.isEnabled)
   }
   private var contrastColor: UniversalColor {
-    return self.isEnabled
-    ? self.color.contrast
-    : self.color.contrast.withOpacity(
-      ComponentsKitConfig.shared.layout.disabledOpacity
-    )
+    let color = self.color?.contrast ?? .foreground
+    return color.enabled(self.isEnabled)
   }
   var backgroundColor: UniversalColor? {
     switch self.style {
@@ -81,7 +73,8 @@ extension ButtonVM {
     case .plain:
       return self.mainColor
     case .bordered:
-      return self.mainColor
+      let color = self.color?.main ?? .foreground
+      return color.enabled(self.isEnabled)
     }
   }
   var borderWidth: CGFloat {
@@ -97,7 +90,11 @@ extension ButtonVM {
     case .filled, .plain:
       return nil
     case .bordered:
-      return self.mainColor
+      if let color {
+        return color.main.enabled(self.isEnabled)
+      } else {
+        return .divider
+      }
     }
   }
   var preferredFont: UniversalFont {

Sources/ComponentsKit/Checkbox/Models/CheckboxVM.swift

@@ -38,32 +38,16 @@ public struct CheckboxVM: ComponentVM {
 
 extension CheckboxVM {
   var backgroundColor: UniversalColor {
-    return self.color.main.withOpacity(
-      self.isEnabled
-      ? 1.0
-      : ComponentsKitConfig.shared.layout.disabledOpacity
-    )
+    return self.color.main.enabled(self.isEnabled)
   }
   var foregroundColor: UniversalColor {
-    return self.color.contrast.withOpacity(
-      self.isEnabled
-      ? 1.0
-      : ComponentsKitConfig.shared.layout.disabledOpacity
-    )
+    return self.color.contrast.enabled(self.isEnabled)
   }
   var titleColor: UniversalColor {
-    return Palette.Text.primary.withOpacity(
-      self.isEnabled
-      ? 1.0
-      : ComponentsKitConfig.shared.layout.disabledOpacity
-    )
+    return .foreground.enabled(self.isEnabled)
   }
   var borderColor: UniversalColor {
-    return .universal(.uiColor(.lightGray)).withOpacity(
-      self.isEnabled
-      ? 1.0
-      : ComponentsKitConfig.shared.layout.disabledOpacity
-    )
+    return .divider
   }
   var borderWidth: CGFloat {
     return 2.0

Sources/ComponentsKit/Checkbox/UKCheckbox.swift

@@ -262,6 +262,7 @@ open class UKCheckbox: UIView, UKComponent {
     self.checkboxContainer.layer.borderColor = self.isSelected
     ? UIColor.clear.cgColor
     : self.model.borderColor.uiColor.cgColor
+    Self.Style.checkmarkLayer(self.checkmarkLayer, model: self.model)
   }
 }
 
@@ -275,7 +276,7 @@ extension UKCheckbox {
       stackView.alignment = .center
     }
     static func titleLabel(_ label: UILabel, model: Model) {
-      label.textColor = Palette.Text.primary.uiColor
+      label.textColor = model.titleColor.uiColor
       label.numberOfLines = 0
       label.text = model.title
       label.textColor = model.titleColor.uiColor