💄 :: [#332] DesignSystem / Chip

GSM-MSG · May 24, 2024 · 6c36c32 · 6c36c32
1 parent 30284a3
commit 6c36c32
Show file tree

Hide file tree

Showing 2 changed files with 53 additions and 9 deletions.
diff --git a/Projects/Core/DesignSystem/Sources/Chip/SMSChip.swift b/Projects/Core/DesignSystem/Sources/Chip/SMSChip.swift
@@ -4,16 +4,19 @@ import ViewUtil
 public struct SMSChip<Content: View>: View {
     var iconLabel: Content
     var text: String
+    var style: ChipStyle
     var action: () -> Void
 
     public init(
         _ text: String,
+        style: ChipStyle = .default,
         action: @escaping () -> Void = {},
         iconLabel: @escaping () -> Content = {
             SMSIcon(.plus, renderingMode: .template, width: 12, height: 12)
         }
     ) {
         self.text = text
+        self.style = style
         self.iconLabel = iconLabel()
         self.action = action
     }
@@ -24,9 +27,8 @@ public struct SMSChip<Content: View>: View {
 
             Text(text)
         }
-        .smsFont(.body1, color: .neutral(.n30))
         .buttonWrapper(action)
-        .buttonStyle(SMSChipButtonStyle())
+        .buttonStyle(SMSChipButtonStyle(style: style))
     }
 }
 

diff --git a/Projects/Core/DesignSystem/Sources/Chip/SMSChipButtonStyle.swift b/Projects/Core/DesignSystem/Sources/Chip/SMSChipButtonStyle.swift
@@ -1,12 +1,54 @@
 import SwiftUI
 
+public enum ChipStyle {
+    case outline
+    case `default`
+}
+
 struct SMSChipButtonStyle: ButtonStyle {
-    func makeBody(configuration: Configuration) -> some View {
-        configuration.label
-            .padding(8)
-            .background {
-                configuration.isPressed ? Color.sms(.neutral(.n10)) : .sms(.system(.white))
-            }
-            .cornerRadius(8)
+    var style: ChipStyle
+
+    public func makeBody(configuration: Configuration) -> some View {
+        switch style {
+        case .outline:
+            OutlineChip(configuration: configuration)
+
+        case .`default`:
+            DefaultChip(configuration: configuration)
+        }
+    }
+}
+
+extension SMSChipButtonStyle {
+    struct DefaultChip: View {
+        let configuration: ButtonStyle.Configuration
+
+        var body: some View {
+            configuration.label
+                .smsFont(.body1, color: .neutral(.n30))
+                .padding(8)
+                .background {
+                    configuration.isPressed ? Color.sms(.neutral(.n10)) : .sms(.system(.white))
+                }
+                .cornerRadius(8)
+        }
+    }
+}
+
+extension SMSChipButtonStyle {
+    struct OutlineChip: View {
+        let configuration: ButtonStyle.Configuration
+        var body: some View {
+            configuration.label
+                .padding(8)
+                .smsFont(.body1, color: .system(.black))
+                .background {
+                    configuration.isPressed ? Color.sms(.neutral(.n10)) : .sms(.system(.white))
+                }
+                .overlay {
+                    RoundedRectangle(cornerRadius: 8).stroke(Color.sms(.system(.black)), lineWidth: 1)
+                }
+                .cornerRadius(8)
+        }
     }
 }