@momo-kits/native-kits 0.162.30-debug → 0.162.31-debug

package/ios/Button/Button.swift

@@ -133,19 +133,19 @@ public struct Button: View {
     var action: () -> Void
     var type: ButtonType
     var size: ButtonSize
-    var iconLeft: AnyView?
-    var iconRight: AnyView?
+    var iconLeft: String
+    var iconRight: String
     var isFull: Bool
     var loading: Bool
     var useTintColor: Bool
 
     public init(
-        title: String = "",
+        title: String = "Button",
         action: @escaping () -> Void,
         type: ButtonType = .primary,
         size: ButtonSize = .large,
-        iconLeft: AnyView? = nil,
-        iconRight: AnyView? = nil,
+        iconLeft: String = "",
+        iconRight: String = "",
         isFull: Bool = true,
         loading: Bool = false,
         useTintColor: Bool = true
@@ -161,38 +161,9 @@ public struct Button: View {
         self.useTintColor = useTintColor
     }
 
-    /// Mirrors Kotlin's `Button(iconLeft: String, iconRight: String, ...)`, which resolves
-    /// icons by design-system source name through the shared `Icon` component rather than
-    /// a caller-supplied view. `iconLeft` is required here (unlike Kotlin's `= ""` default)
-    /// solely to keep this initializer unambiguous alongside the `AnyView`-based one above —
-    /// pass `""` explicitly for an icon-right-only button.
-    public init(
-        title: String = "Button",
-        action: @escaping () -> Void,
-        type: ButtonType = .primary,
-        size: ButtonSize = .large,
-        iconLeft: String,
-        iconRight: String = "",
-        isFull: Bool = true,
-        loading: Bool = false,
-        useTintColor: Bool = true
-    ) {
-        self.init(
-            title: title,
-            action: action,
-            type: type,
-            size: size,
-            iconLeft: iconLeft.isEmpty ? nil : AnyView(Icon(source: iconLeft)),
-            iconRight: iconRight.isEmpty ? nil : AnyView(Icon(source: iconRight)),
-            isFull: isFull,
-            loading: loading,
-            useTintColor: useTintColor
-        )
-    }
-
-    private func shouldLoadingOnLeft(_ left: AnyView?, _ right: AnyView?) -> Bool {
-        let hasLeft = left != nil
-        let hasRight = right != nil
+    private func shouldLoadingOnLeft(_ left: String, _ right: String) -> Bool {
+        let hasLeft = !left.isEmpty
+        let hasRight = !right.isEmpty
 
         switch (hasLeft, hasRight) {
         case (false, false): return true
@@ -217,27 +188,13 @@ public struct Button: View {
             }
         }) {
             HStack(spacing: size.iconSpacing) {
-                if loading && loadingOnLeft {
-                    LottieView(name: "lottie_circle_loader", loopMode: .loop)
-                        .frame(width: size.iconSize, height: size.iconSize)
-                        .colorMultiply(fg)
-
-                } else if let iconLeft = iconLeft {
-                    tintedIcon(iconLeft, color: fg)
-                }
+                renderIcon(icon: iconLeft, forceLoading: loading && loadingOnLeft, textColor: fg)
 
                 MomoText(title, typography: size.typographyStyle, color: fg)
                     .lineLimit(1)
                     .truncationMode(.tail)
 
-                if loading && !loadingOnLeft {
-                    LottieView(name: "lottie_circle_loader", loopMode: .loop)
-                        .frame(width: size.iconSize, height: size.iconSize)
-                        .colorMultiply(fg)
-
-                } else if let iconRight = iconRight {
-                    tintedIcon(iconRight, color: fg)
-                }
+                renderIcon(icon: iconRight, forceLoading: loading && !loadingOnLeft, textColor: fg)
             }
             .frame(maxWidth: isFull ? .infinity : nil)
             .padding(.horizontal, size.padding)
@@ -249,20 +206,24 @@ public struct Button: View {
             border: border,
             borderWidth: borderWidth,
             radius: size.radius,
-            height: size.height
+            height: size.height,
+            isFull: isFull
         ))
         .disabled(!isEnabled)
     }
 
+    /// Mirrors Kotlin `RenderIcon`: the loader replaces the icon slot entirely, and
+    /// `useTintColor == false` leaves the icon at its own colors.
     @ViewBuilder
-    private func tintedIcon(_ icon: AnyView, color: Color) -> some View {
-        if useTintColor {
-            icon
-                .frame(width: size.iconSize, height: size.iconSize)
-                .colorMultiply(color)
-        } else {
-            icon
+    private func renderIcon(icon: String, forceLoading: Bool, textColor: Color) -> some View {
+        let color: Color? = useTintColor ? textColor : nil
+
+        if forceLoading {
+            LottieView(name: "lottie_circle_loader", loopMode: .loop)
                 .frame(width: size.iconSize, height: size.iconSize)
+                .colorMultiply(color ?? Colors.black01)
+        } else if !icon.isEmpty {
+            Icon(source: icon, size: size.iconSize, color: color)
         }
     }
 }
@@ -277,11 +238,13 @@ private struct ButtonPressFeedbackStyle: ButtonStyle {
     let borderWidth: CGFloat
     let radius: CGFloat
     let height: CGFloat
+    let isFull: Bool
 
     func makeBody(configuration: Configuration) -> some View {
         let pressed = configuration.isPressed && isEnabled
 
         configuration.label
+            .modifier(HugContentOnLegacyOS(isFull: isFull))
             .opacity(pressed ? 0.5 : 1)
             .background(
                 RoundedRectangle(cornerRadius: radius)
@@ -297,3 +260,20 @@ private struct ButtonPressFeedbackStyle: ButtonStyle {
             .animation(.easeInOut(duration: 0.1), value: pressed)
     }
 }
+
+/// `ButtonStyleConfiguration.Label` is greedy on iOS 16 and earlier — it accepts
+/// the full proposed width, so the background drawn in `makeBody` stretches past
+/// the content even when `isFull == false`. iOS 17 fixed the label to hug its
+/// content, so only legacy OSes need the `fixedSize` clamp (kept off on 17+ to
+/// preserve tail truncation of long titles).
+private struct HugContentOnLegacyOS: ViewModifier {
+    let isFull: Bool
+
+    func body(content: Content) -> some View {
+        if #available(iOS 17.0, *) {
+            content
+        } else {
+            content.fixedSize(horizontal: !isFull, vertical: false)
+        }
+    }
+}

package/ios/Chip/Chip.swift

@@ -3,6 +3,7 @@ import Foundation
 
 public struct Chip: View {
     @Environment(\.appTheme) private var theme
+    @Environment(\.momoFontScale) private var fontScale
     public enum ChipSize { case small, large }
 
     public struct Dimensions {
@@ -54,11 +55,11 @@ public struct Chip: View {
         let dims = (size == .small) ? Self.Small : Self.Large
         // Mirrors Compose's `scaleSize(...)` on every chip dimension so it responds
         // to Dynamic Type scaling the same way the rest of the kit does.
-        let height = scaleSize(dims.height)
-        let horizontal = scaleSize(dims.horizontal)
-        let iconSize = scaleSize(dims.iconSize)
-        let iconSpacing = scaleSize(dims.iconSpacing)
-        let radius = scaleSize(Radius.L)
+        let height = fontScale(dims.height)
+        let horizontal = fontScale(dims.horizontal)
+        let iconSize = fontScale(dims.iconSize)
+        let iconSpacing = fontScale(dims.iconSpacing)
+        let radius = fontScale(Radius.L)
 
         let bg: Color = {
             if selected { return theme.colors.background.selected }

package/ios/Icon/Icon.swift

@@ -26,17 +26,24 @@ let iconSources: [String: IconSource] = loadIconSources()
 // Icons that must never be tinted (mirror Compose `noThemeIcons`)
 let noThemeIcons: [String] = ["ic_round_momo_tiny"]
 
+// Compose defaults `color` to the theme text color while `color = null` means "no tint".
+// Swift can't tell an omitted argument from an explicit `nil`, so the default is this
+// unrepresentable sentinel: omitted -> theme text color, `nil` -> untinted.
+public let iconThemeColor = Color(.sRGB, red: -1, green: -1, blue: -1, opacity: -1)
+
 // Icon ViewModel
 public struct Icon: View {
+    @Environment(\.appTheme) private var theme
+
     var source: String
     var size: CGFloat
     var color: Color?
     var accessibilityLabel: String?
-    
+
     public init(
             source: String,
             size: CGFloat = 24,
-            color: Color? = nil,
+            color: Color? = iconThemeColor,
             accessibilityLabel: String? = nil
         ) {
             self.source = source
@@ -46,9 +53,11 @@ public struct Icon: View {
         }
 
     public var body: some View {
-        if let uri = iconSources[source]?.uri {
+        // Mirror Compose: an https source is used as-is, anything else is a key into icon.json
+        if let uri = source.contains("https") ? source : iconSources[source]?.uri {
+            let requestedColor = color == iconThemeColor ? theme.colors.text.default : color
             // Mirror Compose: certain icons (e.g. branded glyphs) are never tinted
-            let resolvedColor = noThemeIcons.contains(source) ? nil : color
+            let resolvedColor = noThemeIcons.contains(source) ? nil : requestedColor
             ImageView(uri, color: resolvedColor)
                 .frame(width: size, height: size)
                 // Mirrors Compose's auto-generated `contentDescription = "img|$iconUrl"`

package/ios/Input/ErrorView.swift

@@ -9,6 +9,7 @@ import SwiftUI
 
 public struct ErrorView: View {
     @Environment(\.appTheme) private var theme
+    @Environment(\.momoFontScale) private var fontScale
 
     public var errorMessage: String
     public var errorSpacing: Bool
@@ -27,7 +28,7 @@ public struct ErrorView: View {
     public var body: some View {
         if !errorMessage.isEmpty || !hintText.isEmpty {
             HStack(alignment: .top, spacing: 4) {
-                Icon(source: "ic_error", size: scaleSize(16), color: displayColor())
+                Icon(source: "ic_error", size: fontScale(16), color: displayColor())
                 MomoText(
                     displayText(),
                     typography: .descriptionDefaultRegular,

package/ios/Input/Input.swift

@@ -4,6 +4,7 @@ import Combine
 
 public struct Input: View {
     @Environment(\.appTheme) private var theme
+    @Environment(\.momoFontScale) private var fontScale
     @Binding public var text: String
     
     public var placeholder: String
@@ -163,7 +164,7 @@ public struct Input: View {
                             SecureInputField(
                                 text: $text,
                                 keyboardType: keyboardType,
-                                fontSize: scaleSize(14),
+                                fontSize: fontScale(14),
                                 fontWeight: fontWeight == .bold ? .bold : .regular,
                                 textColor: UIColor(getTextColor()),
                                 cursorColor: UIColor(theme.colors.primary),
@@ -189,6 +190,12 @@ public struct Input: View {
                             .onAppear {
                                 if autofocus { isFieldFocused = true }
                             }
+                            // SwiftUI reads a TextField's UIKit input traits only when it
+                            // builds the backing UITextField, so a later `keyboardType`
+                            // change is silently dropped. The secure path can call
+                            // `reloadInputViews()` in `updateUIView`; here the only lever
+                            // is to force a rebuild.
+                            .id(keyboardType.rawValue)
                         }
                     }
                     
@@ -230,7 +237,7 @@ public struct Input: View {
                     }
                 }
                 .padding(.horizontal, Spacing.M)
-                .frame(height: scaleSize(size == .small ? 48 : 56, 1.1))
+                .frame(height: fontScale(size == .small ? 48 : 56))
                 .background(
                     RoundedRectangle(cornerRadius: Radius.S)
                         .fill(theme.colors.background.surface)

package/ios/Input/InputPhoneNumber.swift

@@ -8,6 +8,7 @@
 import SwiftUI
 public struct InputPhoneNumber: View {
     @Environment(\.appTheme) private var theme
+    @Environment(\.momoFontScale) private var fontScale
     @Binding public var text: String
     
     public var placeholder: String
@@ -143,7 +144,7 @@ public struct InputPhoneNumber: View {
                 }
             }
             .padding(.horizontal, Spacing.M)
-            .frame(height: scaleSize(size == .small ? 48 : 56, 1.1))
+            .frame(height: fontScale(size == .small ? 48 : 56))
             .background(
                 RoundedRectangle(cornerRadius: Radius.S)
                     .fill(theme.colors.background.surface)

package/ios/Input/InputSearch.swift

@@ -104,6 +104,7 @@ public struct InputSearchProps {
 
 public struct InputSearch: View {
     @Environment(\.appTheme) private var theme
+    @Environment(\.momoFontScale) private var fontScale
     @Binding var text: String
     var buttonText: String = ""
     var showButtonText: Bool = false
@@ -214,7 +215,7 @@ public struct InputSearch: View {
                             } else {
                                 Text(placeholder)
                                     .foregroundColor(disabled ? theme.colors.text.disable : theme.colors.text.hint)
-                                    .font(.system(size: scaleSize(14), weight: fontWeight))
+                                    .font(.system(size: fontScale(14), weight: fontWeight))
                                     .ignoreBoldTextSetting()
                             }
                         }
@@ -231,7 +232,7 @@ public struct InputSearch: View {
                         }, onCommit: {})
                         .disabled(disabled)
                         .foregroundColor(disabled ? theme.colors.text.disable : theme.colors.text.default)
-                        .font(.system(size: scaleSize(14), weight: fontWeight))
+                        .font(.system(size: fontScale(14), weight: fontWeight))
                         .ignoreBoldTextSetting()
                         .keyboardType(keyboardType)
                         .applyCursorColor(theme.colors.primary)

package/ios/Input/InputTextArea.swift

@@ -37,7 +37,12 @@ struct UITextViewWrapper: UIViewRepresentable {
         }
         uiView.textColor = UIColor(textColor)
         uiView.tintColor = UIColor(cursorColor)
-        uiView.font = UIFont.systemFont(ofSize: scaleSize(16), weight: fontWeight == .bold ? .bold : .regular)
+        // Read through `context.environment` rather than the global `scaleSize`: that is what makes
+        // SwiftUI re-run updateUIView when the font scale changes.
+        uiView.font = UIFont.systemFont(
+            ofSize: context.environment.momoFontScale(16),
+            weight: fontWeight == .bold ? .bold : .regular
+        )
         uiView.isEditable = !disabled
     }
     

package/ios/InputMoney/InputMoney.swift

@@ -50,6 +50,7 @@ public func formatNumberToMoney(_ digits: String, currency: String = "đ") -> St
 
 public struct InputMoney: View {
     @Environment(\.appTheme) private var theme
+    @Environment(\.momoFontScale) private var fontScale
     @Binding public var text: String
 
     public var floatingValue: String
@@ -214,7 +215,7 @@ public struct InputMoney: View {
                     }
                 }
                 .padding(.horizontal, Spacing.M)
-                .frame(height: scaleSize(size == .small ? 48 : 56, 1.1))
+                .frame(height: fontScale(size == .small ? 48 : 56))
                 .background(
                     RoundedRectangle(cornerRadius: Radius.S)
                         .fill(theme.colors.background.surface)
@@ -278,7 +279,7 @@ private struct MoneyTextField: UIViewRepresentable {
         let field = UITextField()
         field.delegate = context.coordinator
         field.keyboardType = keyboardType
-        field.font = UIFont.systemFont(ofSize: scaleSize(20), weight: fontWeight)
+        field.font = UIFont.systemFont(ofSize: context.environment.momoFontScale(20), weight: fontWeight)
         field.textColor = textColor
         field.isEnabled = !isDisabled
         field.tintColor = cursorColor
@@ -295,6 +296,8 @@ private struct MoneyTextField: UIViewRepresentable {
 
     func updateUIView(_ field: UITextField, context: Context) {
         context.coordinator.parent = self
+        // Re-applied here, not just in makeUIView, so a font-scale change reaches an existing field.
+        field.font = UIFont.systemFont(ofSize: context.environment.momoFontScale(20), weight: fontWeight)
         field.isEnabled = !isDisabled
         field.textColor = textColor
         field.tintColor = cursorColor

package/ios/InputOTP/InputOTP.swift

@@ -7,12 +7,13 @@ import SwiftUI
 private struct OTPCaret: View {
     @Environment(\.appTheme) private var theme
     @State private var visible: Bool = true
+    @Environment(\.momoFontScale) private var fontScale
 
     var body: some View {
         HStack(spacing: 0) {
             Rectangle()
                 .fill(theme.colors.primary)
-                .frame(width: 1, height: scaleSize(12))
+                .frame(width: 1, height: fontScale(12))
                 .opacity(visible ? 1 : 0)
                 .animation(
                     .linear(duration: 0.5).repeatForever(autoreverses: true),

package/ios/Layout/GridContext.swift

@@ -0,0 +1,30 @@
+import SwiftUI
+
+/// Grid metrics published by a layout container (`SectionView`) so span-based children
+/// can size themselves. Mirrors `vn.momo.kits.layout.GridContext`.
+public struct GridContext: Equatable {
+    public let numberOfColumns: Int
+    public let gutter: CGFloat
+    public let sizePerSpan: CGFloat
+
+    public init(numberOfColumns: Int = 12, gutter: CGFloat = Spacing.M, sizePerSpan: CGFloat = 0) {
+        self.numberOfColumns = numberOfColumns
+        self.gutter = gutter
+        self.sizePerSpan = sizePerSpan
+    }
+
+    public func sizeForSpan(_ span: Int) -> CGFloat {
+        sizePerSpan * CGFloat(span) + gutter * CGFloat(span - 1)
+    }
+}
+
+private struct GridContextKey: EnvironmentKey {
+    static let defaultValue: GridContext? = nil
+}
+
+public extension EnvironmentValues {
+    var gridContext: GridContext? {
+        get { self[GridContextKey.self] }
+        set { self[GridContextKey.self] = newValue }
+    }
+}

package/ios/Layout/Item.swift

@@ -0,0 +1,42 @@
+import SwiftUI
+
+/// Span-sized cell inside a `SectionView`. Reads the grid published by its container;
+/// without one it just wraps its content. Mirrors `vn.momo.kits.layout.Item`.
+public struct ItemView<Content: View>: View {
+    // MARK: Lifecycle
+
+    public init(
+        widthSpan: Int = 12,
+        heightSpan: Int = 0,
+        @ViewBuilder content: @escaping () -> Content
+    ) {
+        self.widthSpan = widthSpan
+        self.heightSpan = heightSpan
+        self.content = content
+    }
+
+    // MARK: Public
+
+    public var body: some View {
+        // A VStack (not a ZStack) so multiple children flow VERTICALLY instead of stacking
+        // on top of each other — matches the React Item's flex-column content.
+        VStack(alignment: .leading, spacing: 0) { content() }
+            .frame(width: width, height: height, alignment: .topLeading)
+    }
+
+    // MARK: Private
+
+    private let widthSpan: Int
+    private let heightSpan: Int
+    private let content: () -> Content
+
+    @Environment(\.gridContext) private var grid
+
+    private var width: CGFloat? {
+        grid.map { $0.sizeForSpan(widthSpan) }
+    }
+
+    private var height: CGFloat? {
+        heightSpan > 0 ? grid.map { $0.sizeForSpan(heightSpan) } : nil
+    }
+}

package/ios/Layout/Section.swift

@@ -0,0 +1,134 @@
+import SwiftUI
+
+/// 12-column section container: horizontal margin, optional background image, and a
+/// wrapping row of children that read their span size from `\.gridContext`.
+/// Mirrors `vn.momo.kits.layout.Section`.
+public struct SectionView<Content: View>: View {
+    // MARK: Lifecycle
+
+    public init(
+        useMargin: Bool = true,
+        backgroundImage: String? = nil,
+        @ViewBuilder content: @escaping () -> Content
+    ) {
+        self.useMargin = useMargin
+        self.backgroundImage = backgroundImage
+        self.content = content
+    }
+
+    // MARK: Public
+
+    public var body: some View {
+        flow
+            .environment(\.gridContext, grid)
+            .frame(maxWidth: .infinity, alignment: .topLeading)
+            .background(widthReader)
+            .background(background)
+            .padding(.horizontal, useMargin ? Spacing.M : 0)
+    }
+
+    // MARK: Private
+
+    private static var columns: Int { 12 }
+    private static var gutter: CGFloat { Spacing.M }
+
+    private let useMargin: Bool
+    private let backgroundImage: String?
+    private let content: () -> Content
+
+    /// Width available *inside* the horizontal margin — the Compose `BoxWithConstraints` equivalent.
+    @State private var availableWidth: CGFloat = 0
+
+    private var grid: GridContext {
+        let columns = CGFloat(Self.columns)
+        // The trailing `- 1 / columns` mirrors Compose: it absorbs rounding so 12 spans
+        // plus their gutters never overflow the row by a sub-point.
+        let sizePerSpan = (availableWidth - Self.gutter * (columns - 1)) / columns - 1 / columns
+        return GridContext(numberOfColumns: Self.columns, gutter: Self.gutter, sizePerSpan: max(0, sizePerSpan))
+    }
+
+    @ViewBuilder private var flow: some View {
+        if #available(iOS 16.0, *) {
+            FlowRowLayout(gutter: Self.gutter) { content() }
+        } else {
+            // No `Layout` protocol before iOS 16: children stack instead of wrapping.
+            // Full-width (span 12) items — the common case — look identical.
+            VStack(alignment: .leading, spacing: Self.gutter) { content() }
+        }
+    }
+
+    @ViewBuilder private var background: some View {
+        if let backgroundImage {
+            ImageView(backgroundImage, contentMode: .fill).clipped()
+        }
+    }
+
+    private var widthReader: some View {
+        GeometryReader { proxy in
+            Color.clear.preference(key: SectionWidthKey.self, value: proxy.size.width)
+        }
+        .onPreferenceChange(SectionWidthKey.self) { availableWidth = $0 }
+    }
+}
+
+private struct SectionWidthKey: PreferenceKey {
+    static var defaultValue: CGFloat = 0
+
+    static func reduce(value: inout CGFloat, nextValue: () -> CGFloat) {
+        value = max(value, nextValue())
+    }
+}
+
+/// Wrapping row with equal horizontal/vertical spacing — the Compose `FlowRow` equivalent.
+@available(iOS 16.0, *)
+private struct FlowRowLayout: Layout {
+    struct Row {
+        var items: [(index: Int, size: CGSize)] = []
+        var width: CGFloat = 0
+        var height: CGFloat = 0
+    }
+
+    let gutter: CGFloat
+
+    func sizeThatFits(proposal: ProposedViewSize, subviews: Subviews, cache: inout Void) -> CGSize {
+        let maxWidth = proposal.width ?? .infinity
+        let rows = rows(for: subviews, maxWidth: maxWidth)
+        let height = rows.reduce(0) { $0 + $1.height } + gutter * CGFloat(max(0, rows.count - 1))
+        return CGSize(width: proposal.width ?? rows.map(\.width).max() ?? 0, height: height)
+    }
+
+    func placeSubviews(in bounds: CGRect, proposal: ProposedViewSize, subviews: Subviews, cache: inout Void) {
+        var y = bounds.minY
+        for row in rows(for: subviews, maxWidth: bounds.width) {
+            var x = bounds.minX
+            for item in row.items {
+                subviews[item.index].place(
+                    at: CGPoint(x: x, y: y),
+                    anchor: .topLeading,
+                    proposal: ProposedViewSize(item.size)
+                )
+                x += item.size.width + gutter
+            }
+            y += row.height + gutter
+        }
+    }
+
+    private func rows(for subviews: Subviews, maxWidth: CGFloat) -> [Row] {
+        var rows: [Row] = []
+        var current = Row()
+        for index in subviews.indices {
+            let size = subviews[index].sizeThatFits(ProposedViewSize(width: maxWidth, height: nil))
+            let widthIfAppended = current.items.isEmpty ? size.width : current.width + gutter + size.width
+            // Sub-point tolerance: spans are computed to land exactly on `maxWidth`.
+            if !current.items.isEmpty, widthIfAppended > maxWidth + 0.5 {
+                rows.append(current)
+                current = Row()
+            }
+            current.width = current.items.isEmpty ? size.width : current.width + gutter + size.width
+            current.height = max(current.height, size.height)
+            current.items.append((index, size))
+        }
+        if !current.items.isEmpty { rows.append(current) }
+        return rows
+    }
+}

package/ios/Popup/PopupNotify.swift

@@ -39,6 +39,7 @@ public struct PopupNotifyProps {
 
 public struct PopupNotify: View {
     @Environment(\.localize) private var localize
+    @Environment(\.momoFontScale) private var fontScale
 
     public let props: PopupNotifyProps
 
@@ -49,7 +50,7 @@ public struct PopupNotify: View {
     }
 
     private var maxDescriptionHeight: CGFloat {
-        scaleSize(TypographyStyle.bodyDefaultRegular.lineHeight) * 8.5
+        fontScale(TypographyStyle.bodyDefaultRegular.lineHeight) * 8.5
     }
 
     private var shouldUseColumnButtons: Bool {

package/ios/ProgressInfo/ProgressInfo.swift

@@ -254,15 +254,16 @@ private struct ProgressInfoVertical: View {
 // MARK: - Step icon
 
 private struct ProgressInfoStepIcon: View {
+    @Environment(\.momoFontScale) private var fontScale
     let index: Int
     let size: ProgressInfoSize
     let useNumber: Bool
     let customIcon: String?
 
     var body: some View {
-        let containerSize = scaleSize(size == .small ? 16 : 24)
-        let dotSize = scaleSize(size == .small ? 6 : 8)
-        let iconSize = scaleSize(size == .small ? 12 : 16)
+        let containerSize = fontScale(size == .small ? 16 : 24)
+        let dotSize = fontScale(size == .small ? 6 : 8)
+        let iconSize = fontScale(size == .small ? 12 : 16)
 
         ZStack {
             Circle()

package/ios/Rating/Rating.swift

@@ -15,6 +15,7 @@ public enum RatingSize {
 }
 
 public struct Rating: View {
+    @Environment(\.momoFontScale) private var fontScale
     private let numOfStars: Int
     private let rating: Float
     private let onRatingChange: ((Int) -> Void)?
@@ -44,7 +45,7 @@ public struct Rating: View {
     private func star(at index: Int) -> some View {
         let icon = Icon(
             source: starIcon(at: index),
-            size: scaleSize(size.iconSize),
+            size: fontScale(size.iconSize),
             color: starColor(at: index)
         )