@momo-kits/native-kits 0.118.1-beta.3 → 0.120.0-beta.20

package/compose/src/commonMain/kotlin/vn/momo/kits/application/NavigationContainer.kt

@@ -96,7 +96,8 @@ val AppLanguage = staticCompositionLocalOf<String?> {
 data class KitConfig(
     val trustBanner: TrustBannerData? = null,
     val headerBar: String? = null,
-    val headerGradient: String? = null
+    val headerGradient: String? = null,
+    val isWhiteList: Boolean = false
 )
 
 @Composable

package/compose/src/commonMain/kotlin/vn/momo/kits/components/InputOTP.kt

@@ -36,7 +36,6 @@ import androidx.compose.ui.text.input.KeyboardType
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.zIndex
 import vn.momo.kits.const.AppTheme
-import vn.momo.kits.const.Colors
 import vn.momo.kits.const.Radius
 import vn.momo.kits.const.Spacing
 import vn.momo.kits.const.Typography

package/compose/src/commonMain/kotlin/vn/momo/kits/components/Text.kt

@@ -1,5 +1,7 @@
 package vn.momo.kits.components
 
+import androidx.compose.foundation.border
+import androidx.compose.foundation.layout.Box
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
@@ -8,8 +10,10 @@ import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.text.style.TextDecoration
 import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import vn.momo.kits.const.AppTheme
+import vn.momo.kits.const.Colors
 import vn.momo.kits.const.Typography
 import vn.momo.kits.const.getFontFamily
 import vn.momo.kits.const.scaleSize
@@ -45,4 +49,5 @@ fun Text(
         onTextLayout = onTextLayout,
         overflow = overflow
     )
+
 }

package/compose/src/commonMain/kotlin/vn/momo/kits/const/Typography.kt

@@ -12,32 +12,39 @@ import org.jetbrains.compose.resources.Font
 import org.jetbrains.compose.resources.FontResource
 import org.jetbrains.compose.resources.InternalResourceApi
 import org.jetbrains.compose.resources.ResourceItem
+import vn.momo.kits.application.AppConfig
+import vn.momo.kits.application.KitConfig
 import vn.momo.kits.platform.getScreenDimensions
+import kotlin.math.max
 import kotlin.math.min
 
 const val DEFAULT_SCREEN_SIZE = 375f
-const val MAX_FONT_SCALE = 1.2f
+const val MAX_FONT_SCALE = 1.5f
 const val MAX_DEVICE_SCALE = 5
 
 @Composable
-fun scaleSize(size: Float): Float {
+fun scaleSize(size: Float, config: KitConfig? = AppConfig.current): Float {
+    val isWhiteList = config?.isWhiteList ?: false
     val deviceWidth = getScreenDimensions().width
     val deviceScale = deviceWidth / DEFAULT_SCREEN_SIZE
 
     val density = LocalDensity.current
     val fontScale = density.fontScale
 
-    var fontSize = size / fontScale //To ignore OS scale
+    val defaultFontSize = size / fontScale //To ignore OS scale
+    var fontSizeScaleDevice = defaultFontSize
+    var fontSizeScaleOS = defaultFontSize
 
     if (deviceScale > 1) {
-        fontSize = min(deviceScale * fontSize, fontSize + MAX_DEVICE_SCALE)
+        fontSizeScaleDevice =
+            min(deviceScale * fontSizeScaleDevice, fontSizeScaleDevice + MAX_DEVICE_SCALE)
     }
 
     if (fontScale > 1) {
-        fontSize = min(fontScale * fontSize, fontSize * MAX_FONT_SCALE)
+        fontSizeScaleOS = min(fontScale * fontSizeScaleOS, fontSizeScaleOS * MAX_FONT_SCALE)
     }
 
-    return fontSize
+    return if (isWhiteList) max(fontSizeScaleDevice, fontSizeScaleOS) else fontSizeScaleDevice
 }
 
 @OptIn(InternalResourceApi::class)

package/ios/Application/Components.swift

@@ -214,8 +214,8 @@ public struct Header: View {
                                 }
                             } else {
                                 Text(title)
-                                    .font(Font.system(size: 17).weight(.bold))
-                                    .lineSpacing(22)
+                                    .font(Font.system(size: scaleSize(17)).weight(.bold))
+                                    .lineSpacing(scaleSize(22))
                                     .foregroundColor(tintColor)
                                     .frame(maxWidth: titlePosition == .center ? UIScreen.main.bounds.width - 252 : nil)
                                     .frame(maxWidth: titlePosition == .center ? .infinity : UIScreen.main.bounds.width - 172, alignment: titlePosition == .center ? .center : .leading)

package/ios/Button/Button.swift

@@ -62,11 +62,11 @@ public struct Button: View {
     func renderTitle(title: String, type: ButtonType, size: ButtonSize) -> Text {
         switch size {
         case .large:
-            return Text(title).font(.system(size: 16, weight: Font.Weight.bold))
+            return Text(title).font(.system(size: scaleSize(16), weight: Font.Weight.bold))
         case .medium:
-            return Text(title).font(.system(size: 14, weight: Font.Weight.bold))
+            return Text(title).font(.system(size: scaleSize(14), weight: Font.Weight.bold))
         case .small:
-            return Text(title).font(.system(size: 12, weight: Font.Weight.bold))
+            return Text(title).font(.system(size: scaleSize(12), weight: Font.Weight.bold))
         }
     }
 }

package/ios/Checkbox/Checkbox.swift

@@ -53,8 +53,7 @@ public struct Checkbox: View{
 
             // Title
             if !title.isEmpty {
-                Text(title)
-                    .font(.description1)
+                MomoText(title, typography: .bodyDefaultRegular)
             }
         }
     }

package/ios/Input/Input.swift

@@ -5,6 +5,7 @@ import SwiftUI
 fileprivate struct FloatingComponent: View {
     var floatingValue: String
     var floatingIcon: AnyView?
+    var disabled: Bool = false
     
     public init (_ floatingValue: String = "", floatingIcon: AnyView? = nil){
         self.floatingValue = floatingValue
@@ -13,12 +14,9 @@ fileprivate struct FloatingComponent: View {
     
     public var body: some View {
         return HStack {
-            Text(floatingValue)
-                .font(.paragraph)
-                .foregroundColor(Colors.black09)
-                .font(.system(size: 12))
-                .padding(.leading, 8)
-                .padding(.trailing, 8)
+            MomoText(floatingValue, typography: .labelSMedium, color: self.disabled ? Colors.black12 : Colors.black08)
+                .padding(.leading, Spacing.XS)
+                .padding(.trailing, Spacing.XS)
             floatingIcon
         }
         .background(Colors.black01)
@@ -113,84 +111,83 @@ public struct Input: View {
     }
     
     public var body: some View {
-            VStack(alignment: .leading, spacing: 4) {
-                ZStack(alignment: .topLeading) {
-                    HStack(alignment: .center) {
-                        if let leadingIcon = leadingIcon {
-                            Icon(source: leadingIcon, size: 16, color: leadingIconColor)
-                        }
-                        
-                        if !isSecure {
-                            TextField("", text: $value, onEditingChanged: { isChange in
-                                self.focused = isChange
-                            })
-                            .disabled(disabled)
-                            .font(fontWeight == .bold ? .headline : .body)
-                        } else {
-                            DotTextField(value: $value)
-                                .disabled(disabled)
-                        }
-                        
-                        if loading {
-                            ActivityIndicator(isAnimating: .constant(true), style: .medium)
-                                .frame(width: 20, height: 20)
-                        } else if !value.isEmpty {
-                            SwiftButton(action: onCancel){
-                                Image(systemName: "x.circle.fill")
-                                    .foregroundColor(Colors.text)
-                                    .frame(width: 16, height: 16)
-                                    .padding(.leading, -4)
-                                    .padding(.trailing, 8)
-                            }
-                        }
-
-                        rightIcon
+        VStack(alignment: .leading, spacing: 4) {
+            ZStack(alignment: .topLeading) {
+                HStack(alignment: .center) {
+                    if let leadingIcon = leadingIcon {
+                        Icon(source: leadingIcon, size: 16, color: leadingIconColor)
                     }
-                    .padding(.horizontal, 12)
-                    .frame(height: size == .small ? 40 : 48)
-                    .background(disabled ? Colors.black01 : Color.white)
-                    .overlay(RoundedRectangle(cornerRadius: 8).stroke(focused ? Colors.pink03 : Colors.border, lineWidth: 1))
                     
-                    if value.isEmpty {
-                        Text(placeholder + (required ? " *" : ""))
-                            .foregroundColor(Colors.black09)
-                            .padding(.horizontal, leadingIcon == nil ? 12 : 32)
-                            .padding(.top, 12)
-                            .allowsHitTesting(false)
+                    if !isSecure {
+                        TextField("", text: $value ,onEditingChanged: { isChange in
+                            self.focused = isChange
+                        })
+                        .disabled(disabled)
+                        .frame(maxHeight: .infinity)
+                        .multilineTextAlignment(.leading)
+                        .font(.system(size: scaleSize(14)))
+                    } else {
+                        DotTextField(value: $value)
+                            .disabled(disabled)
                     }
                     
-                    if !floatingValue.isEmpty {
-                        FloatingComponent(floatingValue, floatingIcon: floatingIconURL.map { url in
-                            AnyView(
-                                Icon(source: url, size: 16, color: floatingIconColor)
-                                )
-                        })
-                            
+                    if loading {
+                        ActivityIndicator(isAnimating: .constant(true), style: .medium)
+                            .frame(width: 20, height: 20)
+                    } else if !value.isEmpty {
+                        SwiftButton(action: onCancel){
+                            Image(systemName: "x.circle.fill")
+                                .foregroundColor(Colors.text)
+                                .frame(width: 16, height: 16)
+                                .padding(.leading, -4)
+                                .padding(.trailing, 8)
+                        }
                     }
+                    
+                    rightIcon
                 }
+                .padding(.horizontal, 12)
+                .frame(height: size == .small ? scaleSize(40) : scaleSize(48))
+                .background(disabled ? Colors.black01 : Color.white)
+                .overlay(RoundedRectangle(cornerRadius: 8).stroke(focused ? Colors.pink03 : Colors.border, lineWidth: 1))
                 
-                if !errorMessage.isEmpty {
-                    Text(errorMessage)
-                        .foregroundColor(.red)
-                        .font(.caption)
-                } else if let hint = hintText {
-                    Text(hint)
+                if value.isEmpty {
+                    Text(placeholder + (required ? " *" : ""))
+                        .font(.system(size: scaleSize(14)))
                         .foregroundColor(Colors.black09)
-                        .font(.caption)
+                        .padding(.horizontal, leadingIcon == nil ? 12 : 32)
+                        .padding(.top, 12)
+                        .allowsHitTesting(false)
                 }
+                
+                if !floatingValue.isEmpty {
+                    FloatingComponent(floatingValue, floatingIcon: floatingIconURL.map { url in
+                        AnyView(
+                            Icon(source: url, size: 16, color: floatingIconColor)
+                        )
+                    })
+                    
+                }
+            }
+            
+            if !errorMessage.isEmpty {
+                MomoText(errorMessage, typography: .descriptionDefaultRegular, color: Colors.red03)
+            } else if hintText != nil {
+                MomoText(errorMessage, typography: .descriptionDefaultRegular, color: Colors.black12)
             }
         }
+    }
 }
 
 
 struct ActivityIndicator: UIViewRepresentable {
     @Binding var isAnimating: Bool
     let style: UIActivityIndicatorView.Style
-
+    
     func makeUIView(context: UIViewRepresentableContext<ActivityIndicator>) -> UIActivityIndicatorView {
         return UIActivityIndicatorView(style: style)
     }
-
+    
     func updateUIView(_ uiView: UIActivityIndicatorView, context: UIViewRepresentableContext<ActivityIndicator>) {
         isAnimating ? uiView.startAnimating() : uiView.stopAnimating()
     }

package/ios/Typography/Text.swift

@@ -0,0 +1,140 @@
+import SwiftUI
+
+public func scaleSize(_ size: CGFloat) -> CGFloat {
+    let defaultScreenSize: CGFloat = 375
+    let maxFontScale: CGFloat = 1.5
+    let maxDeviceScale: CGFloat = 5
+    
+    let deviceWidth = UIScreen.main.bounds.width
+    let deviceScale = deviceWidth / defaultScreenSize
+    
+    let defaultFont = UIFont.systemFont(ofSize: UIFont.labelFontSize)
+    let scaledFont = UIFontMetrics.default.scaledFont(for: defaultFont)
+    let fontScale = scaledFont.pointSize / defaultFont.pointSize
+    
+    var fontSizeDeviceScale = size
+    var fontSizeOSScale = size
+    
+    
+    if deviceScale > 1 {
+        fontSizeDeviceScale = min(fontSizeDeviceScale * deviceScale, fontSizeDeviceScale + maxDeviceScale)
+    }
+    
+    if fontScale > 1 {
+        fontSizeOSScale = min(fontSizeOSScale * fontScale, fontSizeOSScale * maxFontScale)
+    }
+    
+    return max(fontSizeDeviceScale, fontSizeOSScale)
+}
+
+public enum TypographyStyle {
+    case headlineDefaultBold
+    case headerMBold
+    case headerDefaultBold
+    case headerSSemibold
+    case headerXsSemibold
+    case bodyDefaultRegular
+    case bodyDefaultRegularStrikethrough
+    case descriptionDefaultRegular
+    case descriptionDefaultRegularStrikethrough
+    case descriptionXsRegular
+    case descriptionXsRegularStrikethrough
+    case labelDefaultMedium
+    case labelSMedium
+    case labelXsMedium
+    case actionDefaultBold
+    case actionSBold
+    case actionXsBold
+    case actionXxsBold
+}
+
+public extension TypographyStyle {
+    var fontSize: CGFloat {
+        switch self {
+        case .headlineDefaultBold: return 24
+        case .headerMBold: return 18
+        case .headerDefaultBold: return 16
+        case .headerSSemibold: return 14
+        case .headerXsSemibold: return 12
+        case .bodyDefaultRegular, .bodyDefaultRegularStrikethrough: return 14
+        case .descriptionDefaultRegular, .descriptionDefaultRegularStrikethrough: return 12
+        case .descriptionXsRegular, .descriptionXsRegularStrikethrough: return 10
+        case .labelDefaultMedium: return 14
+        case .labelSMedium: return 12
+        case .labelXsMedium: return 10
+        case .actionDefaultBold: return 16
+        case .actionSBold: return 14
+        case .actionXsBold: return 12
+        case .actionXxsBold: return 10
+        }
+    }
+    var lineHeight: CGFloat {
+        switch self {
+        case .headlineDefaultBold: return 34
+        case .headerMBold: return 26
+        case .headerDefaultBold: return 22
+        case .headerSSemibold: return 20
+        case .headerXsSemibold: return 18
+        case .bodyDefaultRegular, .bodyDefaultRegularStrikethrough: return 20
+        case .descriptionDefaultRegular, .descriptionDefaultRegularStrikethrough: return 18
+        case .descriptionXsRegular, .descriptionXsRegularStrikethrough: return 14
+        case .labelDefaultMedium: return 20
+        case .labelSMedium: return 18
+        case .labelXsMedium: return 14
+        case .actionDefaultBold: return 22
+        case .actionSBold: return 20
+        case .actionXsBold: return 18
+        case .actionXxsBold: return 14
+        }
+    }
+    var fontWeight: Font.Weight {
+        switch self {
+        case .headlineDefaultBold, .headerMBold, .headerDefaultBold,
+                .actionDefaultBold, .actionSBold, .actionXsBold, .actionXxsBold:
+            return .bold
+        case .headerSSemibold, .headerXsSemibold:
+            return .semibold
+        case .bodyDefaultRegular, .bodyDefaultRegularStrikethrough,
+                .descriptionDefaultRegular, .descriptionDefaultRegularStrikethrough,
+                .descriptionXsRegular, .descriptionXsRegularStrikethrough:
+            return .regular
+        case .labelDefaultMedium, .labelSMedium, .labelXsMedium:
+            return .medium
+        }
+    }
+    var isStrikethrough: Bool {
+        switch self {
+        case .bodyDefaultRegularStrikethrough,
+                .descriptionDefaultRegularStrikethrough,
+                .descriptionXsRegularStrikethrough:
+            return true
+        default:
+            return false
+        }
+    }
+}
+
+public struct MomoText: View {
+    private let content: String
+    private let typography: TypographyStyle
+    private let color: Color
+    
+    public init(
+        _ content: String,
+        typography: TypographyStyle = .bodyDefaultRegular,
+        color: Color = Colors.text
+    ) {
+        self.content = content
+        self.typography = typography
+        self.color = color
+    }
+    
+    public var body: some View {
+        let text = SwiftUI.Text(content)
+            .font(.system(size: scaleSize(typography.fontSize), weight: typography.fontWeight))
+            .foregroundColor(color)
+            .lineSpacing(scaleSize(typography.lineHeight) - scaleSize(typography.fontSize))
+        
+        return text
+    }
+}

package/local.properties

@@ -4,5 +4,5 @@
 # Location of the SDK. This is only used by Gradle.
 # For customization when using a Version Control System, please read the
 # header note.
-#Wed Aug 21 14:20:12 ICT 2024
-sdk.dir=/Users/huynhdung/Library/Android/sdk
+#Tue Apr 08 11:13:31 ICT 2025
+sdk.dir=/Users/sonnguyen/Library/Android/sdk

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@momo-kits/native-kits",
-  "version": "0.118.1-beta.3",
+  "version": "0.120.0-beta.20",
   "private": false,
   "dependencies": {},
   "devDependencies": {},