@momo-kits/native-kits 0.162.1-beta.1-debug → 0.162.1-beta.12-debug

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

@@ -0,0 +1,269 @@
+package vn.momo.kits.application
+
+import androidx.compose.runtime.Immutable
+import androidx.compose.runtime.Stable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.setValue
+import androidx.compose.runtime.staticCompositionLocalOf
+
+/** Translation dictionary keyed by language; both `vi` and `en` are required. */
+@Immutable
+data class LocalizationObject(
+    val vi: Map<String, String> = emptyMap(),
+    val en: Map<String, String> = emptyMap(),
+)
+
+/**
+ * Translation gateway, ported from momo-kits React Native (`Application/Localize.ts`).
+ * Holds the merged dictionary (kit defaults + host overrides) and the active language,
+ * switched at runtime via [changeLanguage]. Language is snapshot-backed, so a switch
+ * recomposes consumers of [translate]/[translateData].
+ */
+@Stable
+class Localize(translations: LocalizationObject = LocalizationObject()) {
+
+    private var assets by mutableStateOf(merge(defaultLanguage, translations))
+
+    private var language by mutableStateOf(VI)
+
+    val currentLanguage: String get() = language
+
+    fun changeLanguage(language: String?) {
+        this.language = if (language == EN) EN else VI
+    }
+
+    fun translate(key: String): String {
+        val dictionary = if (language == EN) assets.en else assets.vi
+        return dictionary[key]?.takeIf { it.isNotEmpty() } ?: key
+    }
+
+    fun translateData(data: Map<String, String>): String =
+        data[language] ?: data.entries.joinToString(prefix = "{", postfix = "}") {
+            "\"${it.key}\":\"${it.value}\""
+        }
+
+    fun translateData(vi: String, en: String): String = if (language == EN) en else vi
+
+    fun addTranslations(translations: LocalizationObject) {
+        assets = merge(translations, assets)
+    }
+
+    companion object {
+        const val VI = "vi"
+        const val EN = "en"
+
+        private fun merge(base: LocalizationObject, override: LocalizationObject) = LocalizationObject(vi = base.vi + override.vi, en = base.en + override.en)
+
+        private val defaultLanguage = LocalizationObject(
+            vi = mapOf(
+                "errorCode" to "Mã lỗi: ",
+                "seeMore" to "Xem thêm",
+                "cancel" to "Huỷ",
+                "done" to "Xong",
+                "confirm" to "Xác nhận",
+                "month" to "tháng",
+                "day" to "ngày",
+                "choose" to "Chọn",
+                "sent" to "Đã gửi",
+                "received" to "Đã tiếp nhận",
+                "processing" to "Đang xử lý",
+                "processed" to "Đã xử lý",
+                "addImg" to "Thêm hình",
+                "chooseBtn" to "Chọn button",
+                "imgEg" to "Hình ảnh tham khảo",
+                "filter" to "Sắp xếp",
+                "shipping" to "Đang giao hàng",
+                "men" to "Nam",
+                "women" to "Nữ",
+                "more" to "Khác",
+                "expDate" to "Ngày hết hạn",
+                "exp" to "HSD",
+                "inActive" to "Chưa kích hoạt",
+                "voucherRemindHour" to "Hết hạn sau {hours} giờ",
+                "voucherRemindMinute" to "Hết hạn sau {minutes} phút",
+                "voucherRemindSecond" to "Hết hạn sau {seconds} giây",
+                "voucherRemindDay" to "Hết hạn sau {days} ngày",
+                "chooseRoundtrip" to "Chọn vé khứ hồi",
+                "depart" to "Ngày đi",
+                "return" to "Ngày về",
+                "departing" to "Đi",
+                "returning" to "Về",
+                "jan" to "Tháng 1",
+                "feb" to "Tháng 2",
+                "mar" to "Tháng 3",
+                "apr" to "Tháng 4",
+                "may" to "Tháng 5",
+                "jun" to "Tháng 6",
+                "jul" to "Tháng 7",
+                "aug" to "Tháng 8",
+                "sep" to "Tháng 9",
+                "oct" to "Tháng 10",
+                "nov" to "Tháng 11",
+                "dec" to "Tháng 12",
+                "mon" to "T2",
+                "tue" to "T3",
+                "wed" to "T4",
+                "thu" to "T5",
+                "fri" to "T6",
+                "sat" to "T7",
+                "sun" to "CN",
+                "showLunar" to "Hiển thị lịch âm",
+                "newYear" to "Tết Dương lịch",
+                "valentine" to "Ngày Lễ Tình nhân",
+                "womenDay" to "Ngày Quốc tế Phụ nữ",
+                "liberationDay" to "Ngày giải phóng Miền Nam thống nhất đất nước",
+                "laborDay" to "Ngày Quốc tế Lao động",
+                "childrenDay" to "Ngày Quốc tế Thiếu nhi",
+                "nationalDay" to "Quốc khánh nước CHXHCN Việt Nam",
+                "womenDayVN" to "Ngày Phụ nữ Việt Nam",
+                "teacherDay" to "Ngày Nhà giáo Việt Nam",
+                "christmasEve" to "Ngày Lễ Giáng Sinh",
+                "christmas" to "Ngày Lễ Giáng Sinh",
+                "lunarNewYear" to "Tết Nguyên Đán",
+                "hungKingDay" to "Giỗ Tổ Hùng Vương",
+                "balance" to "Số dư trong ví",
+                "chooseDate" to "Chọn ngày tháng năm",
+                "year" to "năm",
+                "hour" to "giờ",
+                "minute" to "phút",
+                "from" to "Từ",
+                "to" to "Đến",
+                "connected" to "Đã kết nối",
+                "disconnected" to "Mất kết nối",
+                "hide" to "Ẩn",
+                "viewAllTitle" to "Xem tất cả",
+                "headerTitle" to "Lịch sử thanh toán",
+                "SHORTEN" to "THU GỌN",
+                "viewMoreBank" to "XEM THÊM (\${otherItemCount} ngân hàng)",
+                "transaction_success" to "Thành công",
+                "transaction_fail" to "Thất bại",
+                "transaction_processing" to "Đang xử lý",
+                "viewMore" to "Xem thêm",
+                "shorten" to "Thu gọn",
+                "Payment" to "Thanh toán \${serviceName}",
+                "currencyUnit" to "đ",
+                "Month" to "Tháng",
+                "save" to "Lưu",
+                "favoriteIn" to "Thêm dịch vụ yêu thích",
+                "favoriteOut" to "Xóa dịch vụ yêu thích",
+                "deviceIn" to "Thêm vào thiết bị",
+                "setting" to "Cài đặt",
+                "transaction" to "Lịch sử giao dịch",
+                "share" to "Chia sẽ dịch vụ",
+                "information" to "Thông tin chung",
+                "tutorial" to "Hướng dẫn sử dụng",
+                "question" to "Câu hỏi thường gặp",
+                "support" to "Trung tâm hỗ trợ",
+                "skip" to "Bỏ qua",
+                "enterPhoneNumber" to "Vui lòng nhập số điện thoại",
+                "invalidPhoneNumber" to "Số điện thoại không đúng",
+            ),
+            en = mapOf(
+                "seeMore" to "See more",
+                "cancel" to "Cancel",
+                "done" to "Done",
+                "confirm" to "Confirm",
+                "month" to "month",
+                "day" to "day",
+                "choose" to "Choose",
+                "sent" to "Sent",
+                "received" to "Received",
+                "processing" to "Processing",
+                "processed" to "Done",
+                "addImg" to "Add image",
+                "chooseBtn" to "Choose button",
+                "imgEg" to "Example images",
+                "filter" to "Filter",
+                "shipping" to "Shipping",
+                "men" to "Men",
+                "women" to "Women",
+                "more" to "More",
+                "expDate" to "Expiration date",
+                "exp" to "EXP",
+                "inActive" to "Not Activated",
+                "voucherRemindHour" to "Revoke after {hours} hours",
+                "voucherRemindMinute" to "Revoke after {minutes} minutes",
+                "voucherRemindSecond" to "Revoke after {seconds} seconds",
+                "voucherRemindDay" to "Revoke after {days} days",
+                "chooseRoundtrip" to "Choose roundtrip ticket",
+                "depart" to "Departing",
+                "return" to "Returning",
+                "departing" to "De",
+                "returning" to "Re",
+                "jan" to "January",
+                "feb" to "February",
+                "mar" to "March",
+                "apr" to "April",
+                "may" to "May",
+                "jun" to "June",
+                "jul" to "July",
+                "aug" to "August",
+                "sep" to "September",
+                "oct" to "October",
+                "nov" to "November",
+                "dec" to "December",
+                "mon" to "Mon",
+                "tue" to "Tue",
+                "wed" to "Wed",
+                "thu" to "Thu",
+                "fri" to "Fri",
+                "sat" to "Sat",
+                "sun" to "Sun",
+                "showLunar" to "Show Lunar Calendar",
+                "newYear" to "New Year's Day",
+                "valentine" to "Valentine's Day",
+                "womenDay" to "International Women's Day",
+                "liberationDay" to "Liberation Day",
+                "laborDay" to "Internation Labor's Day",
+                "childrenDay" to "International Labor's Day",
+                "nationalDay" to "National Day",
+                "womenDayVN" to "Vietnamese Women's Day",
+                "teacherDay" to "Teacher's Day",
+                "christmasEve" to "Christmas Eve",
+                "christmas" to "Christmas Day",
+                "lunarNewYear" to "Lunar New Year",
+                "hungKingDay" to "Hung Kings' Festival",
+                "balance" to "Wallet Balance",
+                "chooseDate" to "Choose date",
+                "year" to "year",
+                "hour" to "hour",
+                "minute" to "minute",
+                "from" to "From",
+                "to" to "To",
+                "connected" to "Connected",
+                "disconnected" to "Disconnected",
+                "hide" to "Hide",
+                "viewAllTitle" to "View all",
+                "headerTitle" to "Transaction history",
+                "SHORTEN" to "SHORTEN",
+                "viewMoreBank" to "VIEW MORE (\${otherItemCount} banks)",
+                "transaction_success" to "Success",
+                "transaction_fail" to "Fail",
+                "transaction_processing" to "Processing",
+                "viewMore" to "View more",
+                "shorten" to "Shorten",
+                "Payment" to "\${serviceName} payment",
+                "currencyUnit" to "VND",
+                "Month" to "Month",
+                "save" to "Save",
+                "favoriteIn" to "Add to favorite services",
+                "favoriteOut" to "Remove to favorite services",
+                "deviceIn" to "Add to device",
+                "setting" to "Settings",
+                "transaction" to "Transaction History",
+                "share" to "Share",
+                "information" to "Information",
+                "tutorial" to "Instruction",
+                "question" to "FAQ",
+                "support" to "Support center",
+                "errorCode" to "Error code: ",
+                "skip" to "Skip",
+                "enterPhoneNumber" to "Please enter your phone number",
+                "invalidPhoneNumber" to "Invalid phone number",
+            ),
+        )
+    }
+}
+
+val LocalLocalize = staticCompositionLocalOf { Localize() }

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

@@ -6,7 +6,7 @@ import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.Dp
 import vn.momo.kits.const.*
-import vn.momo.kits.utils.Deprecated as DeprecatedKit
+import vn.momo.kits.modifier.DeprecatedModifier
 import vn.momo.kits.platform.getStatusBarHeight
 
 @Deprecated("Use IMaxApi instead", ReplaceWith("IMaxApi"))
@@ -69,7 +69,7 @@ fun ApplicationContainer(
     composeApi: ComposeApi? = null,
     statusBarHeight: Dp? = AppStatusBar.current,
     applicationContext: MiniAppContext? = null,
-    config: KitConfig? = null,
+    config: DesignSystemConfig? = null,
     language: String? = null,
     isWhiteList: Boolean = false,
     content: @Composable () -> Unit,
@@ -97,13 +97,11 @@ fun ApplicationContainer(
         AppTheme provides appTheme,
         PlatformApi provides composeApi,
         AppStatusBar provides appStatusBarHeight,
-        ApplicationContext provides applicationContext,
-        AppConfig provides config,
-        AppLanguage provides language,
+        LocalContext provides applicationContext,
     ) {
-        Box(Modifier.wrapContentSize().then(DeprecatedKit.deprecatedModifier())) {
+        Box(Modifier.wrapContentSize().then(DeprecatedModifier())) {
             content()
         }
     }
 
-}
+}

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

@@ -29,7 +29,7 @@ import vn.momo.kits.const.AppTheme
 import vn.momo.kits.const.Colors
 import vn.momo.kits.const.Spacing
 import vn.momo.kits.modifier.conditional
-import vn.momo.kits.utils.Deprecated as DeprecatedKit
+import vn.momo.kits.modifier.DeprecatedModifier
 import vn.momo.kits.modifier.shadow
 import vn.momo.kits.navigation.component.SnackBar
 import vn.momo.kits.platform.supportsImePadding
@@ -111,7 +111,7 @@ fun Screen(
                 .background(backgroundColor ?: AppTheme.current.colors.background.default)
                 .conditional(useAvoidKeyboard && supportsImePadding()) {
                     imePadding()
-                }.then(DeprecatedKit.deprecatedModifier())
+                }.then(DeprecatedModifier())
         ) {
             val footerHeightPx = remember { mutableStateOf(0) }
 

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

@@ -11,6 +11,7 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.dp
 import vn.momo.kits.application.IsShowBaseLineDebug
 import vn.momo.kits.const.*
@@ -18,7 +19,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, modifier: Modifier = Modifier) {
     val primaryColors = listOf(
         Color(0xFFF0F0F0),
         Color(0xFFEB2F96),
@@ -58,23 +59,24 @@ 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,
+            maxLines = 1,
+            overflow = TextOverflow.Ellipsis
+        )
     }
 }

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

@@ -1,6 +1,6 @@
 package vn.momo.kits.components
 
-import vn.momo.kits.utils.Deprecated.InternalApi
+import vn.momo.kits.modifier.InternalApi
 
 import androidx.compose.animation.core.animateDpAsState
 import androidx.compose.animation.core.animateFloatAsState

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

@@ -1,7 +1,9 @@
 package vn.momo.kits.components
 
 import androidx.compose.foundation.border
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.BoxWithConstraints
+import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -17,10 +19,12 @@ import androidx.compose.ui.semantics.contentDescription
 import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.unit.dp
-import coil3.compose.AsyncImage
+import coil3.compose.AsyncImage as CoilAsyncImage
 import vn.momo.kits.application.IsShowBaseLineDebug
 import vn.momo.kits.const.AppTheme
 import vn.momo.kits.const.Colors
+import vn.momo.kits.gifimage.GifImage
+import vn.momo.kits.gifimage.GifImageState
 import vn.momo.kits.modifier.conditional
 
 data class Options(
@@ -73,6 +77,19 @@ private fun getHostFromUrl(url: String): String? {
     }
 }
 
+private fun isGifUrl(url: String): Boolean {
+    val path = url.substringBefore('#').substringBefore('?')
+    return path.endsWith(".gif", ignoreCase = true)
+}
+
+private fun GifImageState.toImageState(): ImageState {
+    return when (this) {
+        GifImageState.Success -> ImageState.Success
+        GifImageState.Error -> ImageState.Error
+        GifImageState.Loading -> ImageState.Loading
+    }
+}
+
 // Optimized query parameter appending
 private fun appendSizeQueryParam(url: String, value: String): String {
     val fragmentIndex = url.indexOf('#')
@@ -95,12 +112,12 @@ fun Image(
     modifier: Modifier = Modifier,
     options: Options? = null,
     loading: Boolean = true,
+    onStateChanged: (ImageState) -> Unit = {},
 ) {
     val imageOptions = remember(options) {
         options ?: Options()
     }
 
-    var imageState by remember { mutableStateOf(ImageState.Loading) }
     val density = LocalDensity.current
 
     BoxWithConstraints(
@@ -121,34 +138,46 @@ fun Image(
                         processedUrl
                     }
                 }
-                else -> source
+                else -> source.toString()
             }
         }
 
-        AsyncImage(
-            modifier = Modifier.matchParentSize(),
-            model = urlToLoad,
-            contentDescription = null,
-            contentScale = imageOptions.contentScale,
-            alignment = imageOptions.alignment,
-            colorFilter = imageOptions.colorFilter,
-            alpha = imageOptions.alpha,
-            onLoading = { imageState = ImageState.Loading },
-            onSuccess = { imageState = ImageState.Success },
-            onError = { imageState = ImageState.Error },
-        )
+        var imageState by remember(urlToLoad) { mutableStateOf(ImageState.Loading) }
+        fun updateImageState(state: ImageState) {
+            imageState = state
+            onStateChanged(state)
+        }
+
+        if (isGifUrl(urlToLoad)) {
+            GifImage(
+                modifier = Modifier.matchParentSize(),
+                url = urlToLoad,
+                contentDescription = null,
+                contentScale = imageOptions.contentScale,
+                alignment = imageOptions.alignment,
+                colorFilter = imageOptions.colorFilter,
+                alpha = imageOptions.alpha,
+                onStateChanged = { updateImageState(it.toImageState()) },
+            )
+        } else {
+            CoilAsyncImage(
+                modifier = Modifier.matchParentSize(),
+                model = urlToLoad,
+                contentDescription = null,
+                contentScale = imageOptions.contentScale,
+                alignment = imageOptions.alignment,
+                colorFilter = imageOptions.colorFilter,
+                alpha = imageOptions.alpha,
+                onLoading = { updateImageState(ImageState.Loading) },
+                onSuccess = { updateImageState(ImageState.Success) },
+                onError = { updateImageState(ImageState.Error) },
+            )
+        }
 
         when (imageState) {
-            ImageState.Loading -> if (loading) Skeleton()
-            ImageState.Error -> {
-                val theme = AppTheme.current
-                Icon(
-                    source = "media_fail",
-                    color = theme.colors.text.disable,
-                    modifier = Modifier.align(Alignment.Center)
-                )
-            }
             ImageState.Success -> {}
+            ImageState.Error -> ImageError()
+            ImageState.Loading -> if (loading) Skeleton()
         }
     }
 }
@@ -156,7 +185,7 @@ fun Image(
 // Extracted URL processing logic for better performance
 private fun processImageUrl(url: String, maxWidth: androidx.compose.ui.unit.Dp, density: androidx.compose.ui.unit.Density): String {
     val host = getHostFromUrl(url)
-    return if (host != null && supportedDomains.contains(host)) {
+    return if (!isGifUrl(url) && host != null && supportedDomains.contains(host)) {
         val widthPx = with(density) { maxWidth.roundToPx() }
         val pixelRatio = density.density
         val pixelFitForWidth = widthPx * pixelRatio
@@ -167,6 +196,20 @@ private fun processImageUrl(url: String, maxWidth: androidx.compose.ui.unit.Dp,
     }
 }
 
+@Composable
+private fun ImageError() {
+    val theme = AppTheme.current
+    Box(
+        modifier = Modifier.fillMaxSize(),
+        contentAlignment = Alignment.Center
+    ) {
+        Icon(
+            source = "media_fail",
+            color = theme.colors.text.disable,
+        )
+    }
+}
+
 @Composable
 fun Image(
     source: Painter,
@@ -185,4 +228,4 @@ fun Image(
         colorFilter = colorFilter,
         alpha = alpha,
     )
-}
+}

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

@@ -1,6 +1,6 @@
 package vn.momo.kits.components
 
-import vn.momo.kits.utils.Deprecated.InternalApi
+import vn.momo.kits.modifier.InternalApi
 
 import androidx.compose.foundation.background
 import androidx.compose.foundation.border

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

@@ -1,6 +1,6 @@
 package vn.momo.kits.components
 
-import vn.momo.kits.utils.Deprecated.InternalApi
+import vn.momo.kits.modifier.InternalApi
 
 import androidx.compose.animation.core.LinearEasing
 import androidx.compose.animation.core.RepeatMode

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

@@ -21,9 +21,11 @@ import androidx.compose.ui.unit.sp
 import androidx.compose.ui.zIndex
 import vn.momo.kits.application.IsShowBaseLineDebug
 import vn.momo.kits.const.*
+import vn.momo.kits.modifier.InternalApi
 import vn.momo.kits.modifier.conditional
 
-internal const val MAX_LENGTH = 300
+@InternalApi
+const val MAX_LENGTH = 300
 internal val DEFAULT_HEIGHT = 104.dp
 
 @Composable

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

@@ -15,8 +15,8 @@ import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.text.TextLayoutResult
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
-import vn.momo.kits.application.AppLanguage
 import vn.momo.kits.application.IsShowBaseLineDebug
+import vn.momo.kits.application.LocalLocalize
 import vn.momo.kits.const.*
 import vn.momo.kits.modifier.conditional
 import vn.momo.kits.modifier.setAutomationId
@@ -83,9 +83,6 @@ fun PopupNotify(
         }
     }
 
-    val language = AppLanguage.current ?: "vi"
-    val errorCode: Map<String, String> = mapOf("vi" to "Mã lỗi: ", "en" to "Error code: ")
-
     LaunchedEffect(layoutResult.value) {
         layoutResult.value?.let { v ->
             // cap visible height at ~8.5 lines
@@ -161,7 +158,7 @@ fun PopupNotify(
                 content(Modifier.padding(top = Spacing.S))
                 if (props.error.isNotEmpty()) {
                     Text(
-                        text = errorCode[language] + props.error,
+                        text = LocalLocalize.current.translate("errorCode") + props.error,
                         style = Typography.descriptionXsRegular,
                         color = AppTheme.current.colors.text.hint,
                         maxLines = 1,

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

@@ -1,6 +1,6 @@
 package vn.momo.kits.components
 
-import vn.momo.kits.utils.Deprecated.InternalApi
+import vn.momo.kits.modifier.InternalApi
 
 import androidx.compose.animation.core.*
 import androidx.compose.foundation.background

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

@@ -36,6 +36,7 @@ fun Text(
     softWrap: Boolean = true,
     accessibilityId: String? = null,
     inlineContent: Map<String, InlineTextContent> = mapOf(),
+    userScaleRate: Float? = null,
     ) {
     Text(
         text = AnnotatedString(text),
@@ -52,7 +53,8 @@ fun Text(
         letterSpacing = letterSpacing,
         softWrap = softWrap,
         accessibilityId = accessibilityId,
-        inlineContent = inlineContent
+        inlineContent = inlineContent,
+        userScaleRate = userScaleRate
     )
 }
 
@@ -74,13 +76,14 @@ fun Text(
     softWrap: Boolean = true,
     accessibilityId: String? = null,
     inlineContent: Map<String, InlineTextContent> = mapOf(),
+    userScaleRate: Float? = null,
 ) {
     // Cache theme access to avoid repeated lookups
     val theme = AppTheme.current
 
     // Call @Composable functions directly in composable context
-    val scaledFontSize = scaleSize(style.fontSize)
-    val scaledLineHeight = scaleSize(style.lineHeight)
+    val scaledFontSize = scaleSize(style.fontSize, userScaleRate)
+    val scaledLineHeight = scaleSize(style.lineHeight, userScaleRate)
     val fontFamilyResult = getFontFamily(fontFamily ?: theme.font, style.fontWeight)
 
     // Now memoize the results