Update POSFontStyle to use dynamicTypeSize instead of maximumContentSizeCategory

POSFontStyle should react to global dynamicTypeSize changes to make it more versatile

Author: staskus

WooCommerce/Classes/POS/Presentation/CardReaderConnection/CardReaderConnectionStatusView.swift

@@ -58,7 +58,8 @@ struct CardReaderConnectionStatusView: View {
                 }
             }
         }
-        .font(Constants.font, maximumContentSizeCategory: .accessibilityLarge)
+        .font(Constants.font)
+        .dynamicTypeSize(...DynamicTypeSize.accessibility2)
         .opacity(isEnabled ? 1 : 0.5)
     }
 }

WooCommerce/Classes/POS/Presentation/Item Selector/ChildItemList.swift

@@ -50,7 +50,8 @@ private extension ChildItemList {
                 dismiss()
             } label: {
                 Image(systemName: "chevron.backward")
-                    .font(.posBodyLargeBold, maximumContentSizeCategory: .accessibilityLarge)
+                    .font(.posBodyLargeBold)
+                    .dynamicTypeSize(...DynamicTypeSize.accessibility2)
                     .foregroundColor(.posOnSurface)
             }
             POSHeaderTitleView(title: title)

WooCommerce/Classes/POS/Presentation/ItemListView.swift

@@ -122,10 +122,9 @@ private extension ItemListView {
         .padding(.bottom, Constants.bannerCardPadding)
     }
 
-    private var bannerHintAndLearnMoreText: Text {
-        Text(headerBannerHint + " ") +
-        Text(Localization.headerBannerLearnMoreHint)
-            .font(POSFontStyle.posBodySmallBold.font())
+    private var bannerHintAndLearnMoreText: some View {
+        Text("\(headerBannerHint) \(Localization.headerBannerLearnMoreHint)")
+            .font(.posBodySmallBold)
             .foregroundColor(Color(.posPrimary))
     }
 

WooCommerce/Classes/POS/Presentation/POSFloatingControlView.swift

@@ -50,7 +50,8 @@ struct POSFloatingControlView: View {
                 VStack {
                     Spacer()
                     Image(systemName: "ellipsis")
-                        .font(.posBodyLargeBold, maximumContentSizeCategory: .accessibilityLarge)
+                        .font(.posBodyLargeBold)
+                        .dynamicTypeSize(...DynamicTypeSize.accessibility2)
                         .foregroundStyle(fontColor)
                     Spacer()
                 }

WooCommerce/Classes/POS/Presentation/PointOfSaleCollectCashView.swift

@@ -104,7 +104,8 @@ private extension PointOfSaleCollectCashView {
     var navigationHeader: some View {
         HStack(alignment: .top) {
             Image(systemName: "chevron.backward")
-                .font(.posBodyLargeBold, maximumContentSizeCategory: .accessibilityLarge)
+                .font(.posBodyLargeBold)
+                .dynamicTypeSize(...DynamicTypeSize.accessibility2)
             DynamicVStack(horizontalAlignment: .leading, spacing: Constants.navigationButtonSpacing) {
                 Text(Localization.backNavigationTitle)
                     .font(.posHeading)

WooCommerce/Classes/POS/Utils/POSFontStyle.swift

@@ -17,7 +17,7 @@ enum POSFontStyle {
     case posButtonSymbolMedium
     case posButtonSymbolLarge
 
-    func font(maximumContentSizeCategory: UIContentSizeCategory? = nil) -> Font {
+    fileprivate func font(maximumContentSizeCategory: UIContentSizeCategory? = nil) -> Font {
         switch self {
         case .posHeading:
             Font.system(size: scaledValue(FontSize.heading, maximumContentSizeCategory: maximumContentSizeCategory ?? .accessibilityLarge), weight: .bold)
@@ -81,11 +81,12 @@ private struct POSScaledFont: ViewModifier {
     // Declaring dynamicTypeSize ensures it's automatically observed
     @Environment(\.dynamicTypeSize) var dynamicTypeSize
     var style: POSFontStyle
-    var maximumContentSizeCategory: UIContentSizeCategory? = nil
 
     func body(content: Content) -> some View {
-        content
-            .font(style.font(maximumContentSizeCategory: maximumContentSizeCategory))
+        let category = UIContentSizeCategory(dynamicTypeSize)
+
+        return content
+            .font(style.font(maximumContentSizeCategory: category))
             .if(shouldUnderline()) { view in
                 view.underline()
             }
@@ -104,8 +105,29 @@ private struct POSScaledFont: ViewModifier {
 }
 
 extension View {
-    func font(_ style: POSFontStyle, maximumContentSizeCategory: UIContentSizeCategory? = nil) -> some View {
-        return self.modifier(POSScaledFont(style: style, maximumContentSizeCategory: maximumContentSizeCategory))
+    func font(_ style: POSFontStyle) -> some View {
+        return self.modifier(POSScaledFont(style: style))
+    }
+}
+
+// Helper to convert DynamicTypeSize to UIContentSizeCategory
+extension UIContentSizeCategory {
+    init(_ dynamicTypeSize: DynamicTypeSize) {
+        switch dynamicTypeSize {
+        case .xSmall: self = .extraSmall
+        case .small: self = .small
+        case .medium: self = .medium
+        case .large: self = .large
+        case .xLarge: self = .extraLarge
+        case .xxLarge: self = .extraExtraLarge
+        case .xxxLarge: self = .extraExtraExtraLarge
+        case .accessibility1: self = .accessibilityMedium
+        case .accessibility2: self = .accessibilityLarge
+        case .accessibility3: self = .accessibilityExtraLarge
+        case .accessibility4: self = .accessibilityExtraExtraLarge
+        case .accessibility5: self = .accessibilityExtraExtraExtraLarge
+        @unknown default: self = .large
+        }
     }
 }