Merge pull request #37 from componentskit/button/light-style

New button style: `light`

Author: mikhailChelbaev

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

@@ -29,6 +29,7 @@ struct ButtonPreview: View {
         Picker("Style", selection: self.$model.style) {
           Text("Filled").tag(ButtonVM.Style.filled)
           Text("Plain").tag(ButtonVM.Style.plain)
+          Text("Light").tag(ButtonVM.Style.light)
           Text("Bordered with small border").tag(ButtonVM.Style.bordered(.small))
           Text("Bordered with medium border").tag(ButtonVM.Style.bordered(.medium))
           Text("Bordered with large border").tag(ButtonVM.Style.bordered(.large))

Sources/ComponentsKit/Components/Button/Models/ButtonStyle.swift

@@ -7,6 +7,8 @@ extension ButtonVM {
     case filled
     /// A button with a transparent background.
     case plain
+    /// A button with a partially transparent background.
+    case light
     /// A button with a transparent background and a border.
     case bordered(BorderWidth)
   }

Sources/ComponentsKit/Components/Button/Models/ButtonVM.swift

@@ -50,44 +50,38 @@ public struct ButtonVM: ComponentVM {
 // MARK: Shared Helpers
 
 extension ButtonVM {
-  private var mainColor: UniversalColor {
-    let color = self.color?.main ?? .content2
-    return color.enabled(self.isEnabled)
-  }
-  private var contrastColor: UniversalColor {
-    let color = self.color?.contrast ?? .foreground
-    return color.enabled(self.isEnabled)
-  }
   var backgroundColor: UniversalColor? {
     switch self.style {
     case .filled:
-      return self.mainColor
+      let color = self.color?.main ?? .content2
+      return color.enabled(self.isEnabled)
+    case .light:
+      let color = self.color?.background ?? .content1
+      return color.enabled(self.isEnabled)
     case .plain, .bordered:
       return nil
     }
   }
   var foregroundColor: UniversalColor {
-    switch self.style {
+    let color = switch self.style {
     case .filled:
-      return self.contrastColor
-    case .plain:
-      return self.mainColor
-    case .bordered:
-      let color = self.color?.main ?? .foreground
-      return color.enabled(self.isEnabled)
+      self.color?.contrast ?? .foreground
+    case .plain, .light, .bordered:
+      self.color?.main ?? .foreground
     }
+    return color.enabled(self.isEnabled)
   }
   var borderWidth: CGFloat {
     switch self.style {
-    case .filled, .plain:
+    case .filled, .plain, .light:
       return 0.0
     case .bordered(let borderWidth):
       return borderWidth.value
     }
   }
   var borderColor: UniversalColor? {
     switch self.style {
-    case .filled, .plain:
+    case .filled, .plain, .light:
       return nil
     case .bordered:
       if let color {