fix: 🐛 [IOSSDKBUG-811] Tag component adjustment (SAP#1169)

* fix: 🐛 [IOSSDKBUG-811] Tag component adjustment

Adjust the tag's fiori style with a filled background color in gray as
default. Add a new outlined style with a border and clear background
color.

* fix: 🐛 [IOSSDKBUG-811] Tag component adjustment

Adjust the example code

---------

Co-authored-by: dyongxu <[email protected]>

Author: hengyi-zhang

Apps/Examples/Examples/FioriSwiftUICore/ObjectHeader/ObjectHeaderTestApp.swift

@@ -22,10 +22,11 @@ struct ObjectHeaderTestApp: View {
         }, subtitle: {
             Text("Job 819701")
         }, tags: {
-            Tag("I am selected")
+            Tag("Tag custom style")
                 .tagStyle(MyCustomTagStyle())
-            Tag("Tag1")
-            Tag("Tag2")
+            Tag("Tag default style .filled")
+            Tag("Tag .outlined style")
+                .tagStyle(.outlined)
         }, bodyText: {
             Text("1000-Hamburg, MECHANIK")
         }, footnote: {

Sources/FioriSwiftUICore/_FioriStyles/TagStyle.fiori.swift

@@ -7,37 +7,26 @@ public struct TagBaseStyle: TagStyle {
     @ViewBuilder
     public func makeBody(_ configuration: TagConfiguration) -> some View {
         configuration.tag
-            .padding(EdgeInsets(top: 2, leading: 3, bottom: 2, trailing: 3))
+            .padding(EdgeInsets(top: 2, leading: 4, bottom: 2, trailing: 4))
     }
 }
 
 // Default fiori styles
 public struct TagFioriStyle: TagStyle {
     @Environment(\.tagLimit) var tagLimit
-    @Environment(\.colorScheme) var colorScheme
-    @Environment(\.isLoading) var isLoading
+    @Environment(\.tagStyle) var tagStyle
     @ViewBuilder
     public func makeBody(_ configuration: TagConfiguration) -> some View {
-        let isLight = self.colorScheme == .light
-        let background = isLight ? RoundedRectangle(cornerRadius: 8).stroke(Color.preferredColor(.quaternaryLabel), lineWidth: 0.5).typeErased : RoundedRectangle(cornerRadius: 8).fill(Color.preferredColor(.tertiaryLabel)).typeErased
-        
         Tag(configuration)
             .font(.fiori(forTextStyle: .footnote))
-            .foregroundStyle(self.getTextColor(configuration: configuration))
+            .foregroundStyle(Color.preferredColor(.accentLabel10))
             .lineLimit(self.tagLimit)
-            .background(background)
-            .ifApply(self.isLoading) {
-                $0.foregroundStyle(Color.preferredColor(.separator))
-            }
-    }
-    
-    func getTextColor(configuration: TagConfiguration) -> Color {
-        let isLight = self.colorScheme == .light
-        if self.isLoading {
-            return Color.preferredColor(.separator)
-        } else {
-            return isLight ? Color.preferredColor(.secondaryLabel) : Color.preferredColor(.primaryLabel, background: .darkConstant)
-        }
+            .ifApply(!(self.tagStyle is OutlinedTagStyle), content: {
+                $0.background(
+                    RoundedRectangle(cornerRadius: 8)
+                        .fill(Color.preferredColor(.accentBackground10))
+                )
+            })
     }
 }
 
@@ -87,6 +76,27 @@ public struct DarkTagStyle: TagStyle {
     }
 }
 
+public struct OutlinedTagStyle: TagStyle {
+    /// :nodoc:
+    public init() {}
+    public func makeBody(_ configuration: TagConfiguration) -> some View {
+        Tag(configuration)
+            .foregroundStyle(Color.preferredColor(.secondaryLabel))
+            .background(
+                RoundedRectangle(cornerRadius: 8)
+                    .stroke(Color.preferredColor(.tertiaryLabel), lineWidth: 0.5)
+            )
+    }
+}
+
+/// :nodoc:
+public extension TagStyle where Self == OutlinedTagStyle {
+    /// Outlined tag style
+    static var outlined: OutlinedTagStyle {
+        OutlinedTagStyle()
+    }
+}
+
 @available(*, deprecated, message: "Use `tagStyle(_ style: some TagStyle)` or `tagStyle(@ViewBuilder content: @escaping (TagConfiguration) -> some View)` to customize the style. We will remove this in the future.")
 /// :nodoc:
 public struct CustomTagStyle: TagStyle {