@momo-kits/native-kits 0.156.6-sp.2-debug → 0.156.6-sp.3-debug

package/compose/build.gradle.kts

@@ -40,7 +40,7 @@ kotlin {
     }
 
     cocoapods {
-        version = "0.156.6-sp.2-debug"
+        version = "0.156.6-sp.3-debug"
         summary = "IOS Shared module"
         homepage = "https://momo.vn"
         ios.deploymentTarget = "15.0"

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

@@ -23,7 +23,7 @@ import vn.momo.kits.modifier.conditional
 
 
 @Composable
-fun Badge(label: String = "Label", backgroundColor: Color? = null, modifier: Modifier? = null) {
+fun Badge(label: String = "Label", backgroundColor: Color? = null) {
     val primaryColors = listOf(
         Color(0xFFF0F0F0),
         Color(0xFFEB2F96),
@@ -63,23 +63,21 @@ fun Badge(label: String = "Label", backgroundColor: Color? = null, modifier: Mod
     }
     val scaleSize = scaleSize(16f)
 
-    if (modifier != null) {
-        Box(
-            modifier = modifier
-                .height(scaleSize.dp)
-                .widthIn(min = scaleSize.dp)
-                .background(color = badgeColor, shape = RoundedCornerShape(Radius.M))
-                .border(width = 1.dp, shape = RoundedCornerShape(Radius.M), color = Colors.black_01)
-                .conditional(IsShowBaseLineDebug) {
-                    border(1.dp, Colors.blue_03)
-                }
-                .padding(horizontal = Spacing.XS), contentAlignment = Alignment.Center
-        ) {
-            Text(
-                text = formatTitle(label),
-                color = Colors.black_01,
-                style = Typography.actionXxsBold
-            )
-        }
+    Box(
+        modifier = Modifier
+            .height(scaleSize.dp)
+            .widthIn(min = scaleSize.dp)
+            .background(color = badgeColor, shape = RoundedCornerShape(Radius.M))
+            .border(width = 1.dp, shape = RoundedCornerShape(Radius.M), color = Colors.black_01)
+            .conditional(IsShowBaseLineDebug) {
+                border(1.dp, Colors.blue_03)
+            }
+            .padding(horizontal = Spacing.XS), contentAlignment = Alignment.Center
+    ) {
+        Text(
+            text = formatTitle(label),
+            color = Colors.black_01,
+            style = Typography.actionXxsBold
+        )
     }
 }

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

@@ -49,20 +49,9 @@ import vn.momo.kits.utils.formatNumberToMoney
 
 class CustomConverter : VisualTransformation {
     override fun filter(text: AnnotatedString): TransformedText {
-        if (text.text.isEmpty()) {
-            return TransformedText(
-                AnnotatedString("0"),
-                object : OffsetMapping {
-                    override fun originalToTransformed(offset: Int): Int = 0
-                    override fun transformedToOriginal(offset: Int): Int = 0
-                }
-            )
-        }
-        
-        if (text.text == "0") {
+        if (text.text.isEmpty() || text.text == "0") {
             return TransformedText(AnnotatedString("0"), OffsetMapping.Identity)
         }
-        
         val formattedText = formatNumberToMoney(text.text.toLong())
 
         return TransformedText(

package/compose/src/commonMain/kotlin/vn/momo/kits/navigation/bottomtab/BottomTabBar.kt

@@ -40,15 +40,13 @@ import vn.momo.kits.const.Colors
 import vn.momo.kits.const.Radius
 import vn.momo.kits.const.Spacing
 import vn.momo.kits.application.IsShowBaseLineDebug
-import vn.momo.kits.components.BadgeDot
-import vn.momo.kits.components.DotSize
 import vn.momo.kits.const.Typography
 import vn.momo.kits.modifier.conditional
 import vn.momo.kits.modifier.noFeedbackClickable
 import vn.momo.kits.platform.getScreenDimensions
 
 val floatingButtonWidth = 75.dp
-const val BOTTOM_TAB_BAR_HEIGHT = 64
+const val BOTTOM_TAB_BAR_HEIGHT = 56
 
 @Composable
 fun BottomTabBar(
@@ -144,18 +142,6 @@ fun RowScope.renderTabBarItem(
 
 @Composable
 fun TabBarItem(item: BottomTabItem, selected: Boolean, onClick: () -> Unit) {
-    fun isNumber(label: String): Boolean {
-        val numberRegex = "^\\d+$".toRegex()
-        return numberRegex.matches(label)
-    }
-    fun formatLabel(label: String): String? {
-        if (isNumber(label) && label.toInt() == 0) {
-            return null
-        }
-        return label
-    }
-    val badgeLabel = item.badgeLabel?.let { formatLabel(it) }
-
     Box(modifier = Modifier
         .fillMaxSize()
         .padding(horizontal = Spacing.XXS)
@@ -170,34 +156,31 @@ fun TabBarItem(item: BottomTabItem, selected: Boolean, onClick: () -> Unit) {
         Column(
             modifier = Modifier
                 .fillMaxSize()
-                .padding(horizontal = Spacing.S, vertical = Spacing.S)
+                .padding(horizontal = Spacing.XXS)
                 .noFeedbackClickable {
                     onClick()
                 },
             horizontalAlignment = Alignment.CenterHorizontally,
-            verticalArrangement = Arrangement.Center
+            verticalArrangement = Arrangement.Bottom
         ) {
             Icon(
                 source = item.icon,
-                size = 28.dp,
-                modifier = Modifier.padding(Spacing.XS),
+                modifier = Modifier.weight(1f),
                 color = if (selected) AppTheme.current.colors.primary else AppTheme.current.colors.text.hint)
             Text(
                 text = item.label,
                 color = if (selected) AppTheme.current.colors.primary else AppTheme.current.colors.text.hint,
-                style = if (selected) Typography.labelXsMedium else Typography.descriptionXsRegular,
+                style = Typography.labelXsMedium,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis
             )
         }
-        if (badgeLabel != null) {
-            if (badgeLabel.isEmpty())
-                BadgeDot(
-                    size = DotSize.Small,
-                    modifier = Modifier.offset(x = 50.dp, y = (-48).dp)
-                )
-            else
-                Badge(badgeLabel, modifier = Modifier.offset(x = 44.dp, y = (-42).dp))
+        if(item.badgeLabel != null){
+            Box(modifier = Modifier
+                .offset(x = 44.dp, y = (-32).dp)
+            ){
+                Badge(item.badgeLabel)
+            }
         }
     }
 }
@@ -207,7 +190,7 @@ fun FloatingButton(data: BottomTabFloatingButton) {
     Column(
         modifier = Modifier
             .width(floatingButtonWidth)
-            .padding(horizontal = Spacing.XXS, vertical = Spacing.S)
+            .padding(horizontal = Spacing.XXS)
             .conditional(IsShowBaseLineDebug) {
                 border(1.dp, Colors.blue_03)
             }

package/ios/Application/FloatingButton.swift

@@ -154,7 +154,7 @@ public struct FloatingButton: View {
                     Spacer().frame(width: 8)
                     Text(label)
                         .foregroundColor(.white)
-                        .font(.system(size: 16, weight: .bold))
+                        .font(.system(size: scaleSize(16), weight: .bold))
                         .lineLimit(1)
                         .background(
                             GeometryReader { geo in

package/ios/Badge/BadgeRibbon.swift

@@ -137,7 +137,7 @@ public struct BadgeRibbon: View {
     private var roundContent: some View {
         HStack(spacing: 0) {
             Text(label)
-                .font(.system(size: 12, weight: .medium))
+                .font(.system(size: scaleSize(12), weight: .medium))
                 .foregroundColor(Colors.black01)
                 .lineLimit(1)
                 .rotationEffect(rotation)
@@ -158,7 +158,7 @@ public struct BadgeRibbon: View {
     private var skewContent: some View {
         HStack(spacing: 0) {
             Text(label)
-                .font(.system(size: 12, weight: .medium))
+                .font(.system(size: scaleSize(12), weight: .medium))
                 .foregroundColor(Colors.black01)
                 .lineLimit(1)
                 .rotationEffect(rotation)

package/ios/Popup/PopupDisplay.swift

@@ -128,9 +128,7 @@ public struct PopupDisplay: View {
                             .clipped()
                     }
                     VStack(alignment: .leading, spacing: 0) {
-                        Text(title)
-                            .foregroundColor(.black)
-                            .font(.header_default_semibold)
+                        MomoText(title, typography: .headerDefaultBold)
                             .padding(.top, 24)
                             .padding(.bottom, 8)
                             .lineLimit(2)
@@ -139,9 +137,7 @@ public struct PopupDisplay: View {
                         Group {
                             if isScrollable {
                                 ScrollView(showsIndicators: false) {
-                                    Text(description)
-                                        .font(.body_default_regular)
-                                        .foregroundColor(Colors.black17)
+                                    MomoText(description, typography: .bodyDefaultRegular)
                                         .multilineTextAlignment(.leading)
                                         .background(GeometryReader { geo in
                                             Color.clear.onAppear { textHeight = geo.size.height }
@@ -149,13 +145,12 @@ public struct PopupDisplay: View {
                                         .measureLineHeights(font: .body_default_regular,
                                                             oneLine: $oneLineH,
                                                             twoLines: $twoLineH)
+                                        .accessibility(identifier: "description_popup_permission")
                                 }
                                 // Cap the visible height to ~8.5 lines
                                 .frame(height: min(maxHeight8_5, textHeight))
                             } else {
-                                Text(description)
-                                    .font(.body_default_regular)
-                                    .foregroundColor(Colors.black17)
+                                MomoText(description, typography: .bodyDefaultRegular)
                                     .multilineTextAlignment(.leading)
                                     .background(GeometryReader { geo in
                                         Color.clear.onAppear {
@@ -167,14 +162,13 @@ public struct PopupDisplay: View {
                                     .measureLineHeights(font: .body_default_regular,
                                                         oneLine: $oneLineH,
                                                         twoLines: $twoLineH)
+                                    .accessibility(identifier: "description_popup_permission")
                             }
                         }
                         .padding(.bottom, 8)
                         
                         if(!errorCode.isEmpty) {
-                            Text((errorCodeLabels[language] ?? "Mã lỗi: ") + errorCode)
-                                .foregroundColor(Colors.black12)
-                                .font(.description_xs_regular)
+                            MomoText((errorCodeLabels[language] ?? "Mã lỗi: ") + errorCode, typography: .descriptionXsRegular, color: Colors.black12)
                                 .lineLimit(1)
                                 .padding(.bottom, 8)
                         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@momo-kits/native-kits",
-  "version": "0.156.6-sp.2-debug",
+  "version": "0.156.6-sp.3-debug",
   "private": false,
   "dependencies": {},
   "devDependencies": {},

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

@@ -1,198 +0,0 @@
-package vn.momo.kits.components
-
-import androidx.compose.foundation.Canvas
-import androidx.compose.foundation.background
-import androidx.compose.foundation.border
-import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.WindowInsets
-import androidx.compose.foundation.layout.asPaddingValues
-import androidx.compose.foundation.layout.fillMaxHeight
-import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.navigationBars
-import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.width
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.geometry.Offset
-import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.graphics.PathEffect
-import androidx.compose.ui.graphics.StrokeCap
-import androidx.compose.ui.unit.dp
-import io.ktor.util.Platform
-import vn.momo.kits.application.IsShowBaseLineDebug
-import vn.momo.kits.const.Colors
-import vn.momo.kits.modifier.conditional
-import vn.momo.kits.platform.getPlatformName
-import vn.momo.kits.platform.getStatusBarHeight
-
-/**
- * A debug overlay that draws danger/warning baseline guides on top of the screen.
- *
- * Highlights safe-area boundaries, header regions, and bottom navigation zones
- * using colored solid or dotted lines and semi-transparent red zones.
- *
- * @param enabled When `false` the composable renders nothing. Pass `false` when
- *                your QC automation flag is active to suppress the overlay.
- */
-@Composable
-fun BaselineView(enabled: Boolean = true) {
-    if (!enabled) return
-
-    val bottomInsetHeight = WindowInsets.navigationBars.asPaddingValues().calculateBottomPadding()
-    val topInset = if (getPlatformName() == "Android") getStatusBarHeight() - 14.dp else getStatusBarHeight()
-    val bottomInset = if (getPlatformName() == "iOS") minOf(bottomInsetHeight, 21.dp) else bottomInsetHeight
-
-    Box(modifier = Modifier.fillMaxSize()) {
-        // Danger zones
-        Box(
-            modifier = Modifier
-                .fillMaxWidth()
-                .height(topInset)
-                .background(Color.Red.copy(alpha = 0.15f))
-        )
-        Box(
-            modifier = Modifier
-                .width(12.dp)
-                .fillMaxHeight()
-                .padding(top = topInset, bottom = bottomInset)
-                .background(Color.Red.copy(alpha = 0.15f))
-        )
-        Box(
-            modifier = Modifier
-                .width(12.dp)
-                .fillMaxHeight()
-                .padding(top = topInset, bottom = bottomInset)
-                .background(Color.Red.copy(alpha = 0.15f))
-                .align(Alignment.TopEnd)
-        )
-        Box(
-            modifier = Modifier
-                .fillMaxWidth()
-                .height(bottomInset)
-                .background(Color.Red.copy(alpha = 0.15f))
-                .align(Alignment.BottomCenter)
-        )
-
-        // Danger lines
-        BaselineDottedLine(
-            Modifier
-                .padding(top = topInset)
-                .fillMaxWidth(),
-            isDotted = false,
-            color = Color(0xFFE400FF)
-        )
-        BaselineDottedLine(
-            Modifier
-                .padding(top = topInset + 52.dp)
-                .fillMaxWidth(),
-            color = Color(0xFFE400FF)
-        )
-        BaselineDottedLine(
-            Modifier
-                .padding(top = topInset + 104.dp)
-                .fillMaxWidth(),
-            color = Color(0xFFE400FF)
-        )
-        BaselineDottedLine(
-            Modifier
-                .padding(bottom = bottomInset + 64.dp)
-                .fillMaxWidth()
-                .align(Alignment.BottomCenter),
-            color = Color(0xFFE400FF)
-        )
-        BaselineDottedLine(
-            Modifier
-                .padding(bottom = bottomInset)
-                .fillMaxWidth()
-                .align(Alignment.BottomCenter),
-            isDotted = false,
-            color = Color(0xFFE400FF)
-        )
-        BaselineDottedLine(
-            Modifier
-                .padding(start = 12.dp)
-                .fillMaxHeight(),
-            orientation = BaselineOrientation.Vertical,
-            isDotted = false,
-            color = Color(0xFFE400FF)
-        )
-        BaselineDottedLine(
-            Modifier
-                .padding(end = 12.dp)
-                .fillMaxHeight()
-                .align(Alignment.BottomEnd),
-            orientation = BaselineOrientation.Vertical,
-            isDotted = false,
-            color = Color(0xFFE400FF)
-        )
-
-        // Warning lines
-        BaselineDottedLine(
-            Modifier
-                .padding(top = topInset + 26.dp)
-                .fillMaxWidth(),
-            color = Color(0xFFFF7A00)
-        )
-        BaselineDottedLine(
-            Modifier
-                .padding(bottom = bottomInset + 56.dp)
-                .fillMaxWidth()
-                .align(Alignment.BottomCenter),
-            color = Color(0xFFFFCC00)
-        )
-        BaselineDottedLine(
-            Modifier
-                .padding(bottom = bottomInset + 8.dp)
-                .fillMaxWidth()
-                .align(Alignment.BottomCenter),
-            color = Color(0xFFFFCC00)
-        )
-
-        // Header background warning lines
-        BaselineDottedLine(
-            Modifier
-                .padding(start = 40.dp, top = topInset)
-                .height(52.dp),
-            color = Color(0xFF00C520),
-            orientation = BaselineOrientation.Vertical
-        )
-        BaselineDottedLine(
-            Modifier
-                .padding(start = 48.dp, top = topInset)
-                .height(52.dp),
-            color = Color(0xFF00C520),
-            orientation = BaselineOrientation.Vertical
-        )
-    }
-}
-
-enum class BaselineOrientation { Horizontal, Vertical }
-
-@Composable
-fun BaselineDottedLine(
-    modifier: Modifier = Modifier,
-    color: Color = Color.Red,
-    orientation: BaselineOrientation = BaselineOrientation.Horizontal,
-    isDotted: Boolean = true
-) {
-    Canvas(modifier = modifier) {
-        val pathEffect = if (isDotted) PathEffect.dashPathEffect(floatArrayOf(8f, 8f)) else null
-        drawLine(
-            color = color,
-            start = if (orientation == BaselineOrientation.Horizontal) Offset(
-                0f,
-                size.height / 2
-            ) else Offset(size.width / 2, 0f),
-            end = if (orientation == BaselineOrientation.Horizontal) Offset(
-                size.width,
-                size.height / 2
-            ) else Offset(size.width / 2, size.height),
-            strokeWidth = 1.dp.toPx(),
-            pathEffect = pathEffect,
-            cap = StrokeCap.Round,
-        )
-    }
-}