@momo-kits/native-kits 0.167.1-sizescale.2-debug → 0.300.1-debug

package/compose/src/commonMain/kotlin/vn/momo/kits/layout/Item.kt

@@ -6,33 +6,46 @@ import androidx.compose.foundation.layout.width
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.compositionLocalOf
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
+import vn.momo.kits.platform.getScreenDimensions
+import kotlin.math.floor
 
 internal data class GridContext(
     val numberOfColumns: Int = 12,
-    val gutter: Dp = 12.dp,
-    val sizePerSpan: Dp = 0.dp,
+    val gutterPx: Int = 0,
+    val columnPx: Float = 0f,
+    val density: Float = 1f,
 ) {
-    fun sizeForSpan(span: Int): Dp = sizePerSpan * span + gutter * (span - 1)
+    fun sizeForSpan(span: Int): Dp = (floor(columnPx * span + gutterPx * (span - 1)) / density).dp
 }
 
 internal val LocalGridContext = compositionLocalOf<GridContext?> { null }
 
 @Composable
-internal fun Item(
-    widthSpan: Int = 12,
+internal fun gridColumns(): Int = if (getScreenDimensions().width > 600) 24 else 12
+
+@Composable
+internal fun gridContext(maxWidthPx: Int, columns: Int, gap: Dp): GridContext {
+    val density = LocalDensity.current
+    val gutterPx = with(density) { gap.roundToPx() }
+    return GridContext(columns, gutterPx, (maxWidthPx - gutterPx * (columns - 1)).toFloat() / columns, density.density)
+}
+
+@Composable
+fun Item(
+    widthSpan: Int? = null,
     heightSpan: Int = 0,
     modifier: Modifier = Modifier,
+    contentModifier: Modifier = Modifier,
     content: @Composable () -> Unit,
 ) {
     val grid = LocalGridContext.current
     var m = modifier
     if (grid != null) {
-        m = m.width(grid.sizeForSpan(widthSpan))
+        m = m.width(grid.sizeForSpan(widthSpan ?: grid.numberOfColumns))
         if (heightSpan > 0) m = m.height(grid.sizeForSpan(heightSpan))
     }
-    // A Column (not a Box) so multiple children flow VERTICALLY instead of stacking
-    // on top of each other — matches the React Item's flex-column content.
-    Column(modifier = m) { content() }
+    Column(modifier = m.then(contentModifier)) { content() }
 }

package/compose/src/commonMain/kotlin/vn/momo/kits/layout/Section.kt

@@ -3,6 +3,7 @@ package vn.momo.kits.layout
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.BoxWithConstraints
+import androidx.compose.foundation.layout.ExperimentalLayoutApi
 import androidx.compose.foundation.layout.FlowRow
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
@@ -11,27 +12,28 @@ import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
 import vn.momo.kits.components.Image
+import vn.momo.kits.const.Spacing
 
 @Composable
-internal fun Section(
+@OptIn(ExperimentalLayoutApi::class)
+fun Section(
     useMargin: Boolean = true,
     backgroundImage: String? = null,
     modifier: Modifier = Modifier,
     content: @Composable () -> Unit,
 ) {
-    val columns = 12
-    val gutter = 12.dp
-    val margin = if (useMargin) 12.dp else 0.dp
-    Box(modifier = modifier.fillMaxWidth().padding(horizontal = margin)) {
+    val columns = gridColumns()
+    val gap = Spacing.M
+    val margin = if (useMargin) Spacing.M else 0.dp
+    Box(modifier = Modifier.fillMaxWidth().padding(horizontal = margin).then(modifier)) {
         if (backgroundImage != null) {
             Image(source = backgroundImage, modifier = Modifier.matchParentSize())
         }
         BoxWithConstraints(modifier = Modifier.fillMaxWidth()) {
-            val sizePerSpan = (maxWidth - gutter * (columns - 1)) / columns - 1.dp / columns
-            CompositionLocalProvider(LocalGridContext provides GridContext(columns, gutter, sizePerSpan)) {
+            CompositionLocalProvider(LocalGridContext provides gridContext(constraints.maxWidth, columns, gap)) {
                 FlowRow(
-                    horizontalArrangement = Arrangement.spacedBy(gutter),
-                    verticalArrangement = Arrangement.spacedBy(gutter),
+                    horizontalArrangement = Arrangement.spacedBy(gap),
+                    verticalArrangement = Arrangement.spacedBy(gap),
                 ) { content() }
             }
         }

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

@@ -30,13 +30,15 @@ import vn.momo.kits.const.AppNavigationBar
 import vn.momo.kits.const.AppStatusBar
 import vn.momo.kits.const.AppTheme
 import vn.momo.kits.const.Theme
-import vn.momo.kits.const.ProvideKitScale
 import vn.momo.kits.const.defaultTheme
-import vn.momo.kits.const.pendingSizeScale
 import vn.momo.kits.platform.ProvideNavigationEventDispatcherOwner
+import vn.momo.kits.platform.ProvideOsFontScale
 import vn.momo.kits.utils.getAppStatusBarHeight
 import vn.momo.kits.utils.getNavigationBarHeight
+// AI-GENERATED START: consume typed NativeMaxApi results
 import vn.momo.maxapi.IMaxApi
+import vn.momo.maxapi.runtime.ApiResult
+// AI-GENERATED END: consume typed NativeMaxApi results
 import kotlin.time.Duration.Companion.milliseconds
 
 @Composable
@@ -54,11 +56,13 @@ fun NavigationContainer(
 ) {
     val navController = rememberNavController()
     val registry = remember { DynamicScreenRegistry() }
-    val navigator = remember { Navigator(navController = navController, maxApi = maxApi, registry = registry) }
-    // Insets are measured in real units; convert to the dp of the size-scaled container.
-    val sizeScale = pendingSizeScale()
-    val statusBarHeight = (statusBarHeight ?: getAppStatusBarHeight()) / sizeScale
-    val navigationBarHeight = getNavigationBarHeight() / sizeScale
+    // AI-GENERATED START: retain the current host client after recomposition
+    val navigator = remember(navController, maxApi, registry) {
+        Navigator(navController = navController, maxApi = maxApi, registry = registry)
+    }
+    // AI-GENERATED END: retain the current host client after recomposition
+    val statusBarHeight = statusBarHeight ?: getAppStatusBarHeight()
+    val navigationBarHeight = getNavigationBarHeight()
 
     val parentContext = LocalContext.current
     val mergedContext = MiniAppContext.merge(parentContext, miniAppContext)
@@ -80,22 +84,31 @@ fun NavigationContainer(
 
     val resolvedLocalize = localize ?: fallbackLocalize
 
-    LaunchedEffect(maxApi, resolvedLocalize) {
-        val api = maxApi ?: return@LaunchedEffect
-        runCatching {
-            api.getLanguage(callback = { data ->
-                if (parseLanguage(data) == Localize.EN) {
-                    resolvedLocalize.changeLanguage(Localize.EN)
+    // AI-GENERATED START: cancel language delivery when its composition owner changes
+    DisposableEffect(maxApi, resolvedLocalize) {
+        val api = maxApi
+        val target = resolvedLocalize
+        var active = true
+        val handle = runCatching {
+            api.getLanguage { result ->
+                if (active && result is ApiResult.Success &&
+                    result.value.trim().lowercase().startsWith(Localize.EN)) {
+                    target.changeLanguage(Localize.EN)
                 }
-            })
+            }
+        }.getOrNull()
+        onDispose {
+            active = false
+            handle?.cancel()
         }
     }
+    // AI-GENERATED END: cancel language delivery when its composition owner changes
 
     val screenId = rememberSaveable { registry.nextId() }
     registry.bind(screenId, initialScreenName, initialScreen, options)
     val startDestination = remember(screenId) { DynamicScreenRoute(screenId) }
 
-    ProvideKitScale {
+    ProvideOsFontScale {
         ProvideNavigationEventDispatcherOwner(navigator) {
             CompositionLocalProvider(
                 LocalNavigator provides navigator,
@@ -196,9 +209,3 @@ fun NavigationContainer(
 
 val LocalMaxApi = staticCompositionLocalOf<IMaxApi?> { null }
 
-private fun parseLanguage(raw: Map<String, Any?>?): String? {
-    val code = (raw?.get("response") as? String)?.trim()?.lowercase()
-    if (code.isNullOrEmpty()) return null
-    return if (code.startsWith(Localize.EN)) Localize.EN else Localize.VI
-}
-

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

@@ -22,6 +22,9 @@ import vn.momo.kits.components.PopupNotify
 import vn.momo.kits.navigation.BottomHeader.*
 import vn.momo.kits.navigation.component.SnackBar
 import vn.momo.maxapi.IMaxApi
+// AI-GENERATED START: dismiss through the typed navigator target
+import vn.momo.maxapi.contract.navigation.model.DismissTarget
+// AI-GENERATED END: dismiss through the typed navigator target
 import kotlin.time.Duration.Companion.milliseconds
 
 class Navigator(
@@ -119,7 +122,9 @@ class Navigator(
             delay(STACK_TRANSITION_DURATION.milliseconds)
             dismissing?.let { registry.unregisterScreen(it.id) }
         } else {
-            maxApi?.dismiss {  }
+            // AI-GENERATED START: preserve root-screen dismissal
+            maxApi?.dismiss(DismissTarget.Current()) {}
+            // AI-GENERATED END: preserve root-screen dismissal
         }
     }
 

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

@@ -6,6 +6,9 @@ import androidx.compose.runtime.snapshotFlow
 import vn.momo.kits.platform.getScreenDimensions
 import vn.momo.kits.platform.rememberBackGestureProgress
 import vn.momo.maxapi.IMaxApi
+// AI-GENERATED START: use the typed light vibration pattern
+import vn.momo.maxapi.contract.device.vibration.model.VibrateStyle
+// AI-GENERATED END: use the typed light vibration pattern
 
 // Unscaled, so the tick lands at the same physical distance on every device.
 private const val SWIPE_BACK_HAPTIC_THRESHOLD_DP = 50f
@@ -25,7 +28,9 @@ internal fun SwipeBackHaptic(maxApi: IMaxApi?) {
         snapshotFlow { progress.value }.collect { fraction ->
             val travelled = fraction ?: 0f
             if (travelled >= threshold && !isSendHaptic) {
-                runCatching { maxApi.triggerEventVibration("light", callback = null) }
+                // AI-GENERATED START: keep one light tick per threshold crossing
+                runCatching { maxApi.vibrate(VibrateStyle.LIGHT) }
+                // AI-GENERATED END: keep one light tick per threshold crossing
                 isSendHaptic = true
             } else if (travelled < threshold && isSendHaptic) {
                 isSendHaptic = false

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

@@ -10,6 +10,7 @@ import androidx.compose.foundation.layout.*
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.DisposableEffect
 import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
@@ -26,6 +27,7 @@ import vn.momo.kits.navigation.LocalNavigator
 import vn.momo.kits.navigation.NavigationOptions
 import vn.momo.kits.navigation.StackScreen
 import vn.momo.kits.navigation.component.HeaderType
+import vn.momo.kits.platform.BackHandler
 import vn.momo.kits.platform.reportFloatingArrowBack
 
 private var bottomTabOptionItems : MutableList<NavigationOptions?> = mutableListOf()
@@ -43,11 +45,17 @@ internal fun getBottomTabOption(index: Int): NavigationOptions? {
 @Composable
 fun BottomTab(
     items: List<BottomTabItem>,
-    floatingButton: BottomTabFloatingButton? = null
+    floatingButton: BottomTabFloatingButton? = null,
+    initialRouteName: String? = null,
+    onTabPress: ((index: Int, switchTab: () -> Unit) -> Unit)? = null,
+    backToInitialTab: Boolean = true,
 ) {
     val navigation = LocalNavigation.current
     val navigator = LocalNavigator.current
     val navController = rememberNavController()
+    val startRoute = remember {
+        "option${items.indexOfFirst { it.name == initialRouteName }.coerceAtLeast(0)}"
+    }
 
     bottomTabOptionItems = items.mapIndexed { index, item ->
         item.options ?: NavigationOptions()
@@ -62,15 +70,14 @@ fun BottomTab(
         )
     }
 
-    // Tab 0 keeps the seeked transition; other tabs go to the host's floating arrow. Matches RN.
     val currentRoute = navController.currentBackStackEntryAsState().value?.destination?.route
-    val isFirstTab = currentRoute == null || currentRoute == "option0"
+    val onStartTab = currentRoute == null || currentRoute == startRoute
+    val isFirstTab = onStartTab || !backToInitialTab
+    val backToStartTab = { navController.popBackStack(startRoute, inclusive = false) }
 
     DisposableEffect(isFirstTab) {
         reportFloatingArrowBack(!isFirstTab)
-        navigator.tabBackHandler = if (isFirstTab) null else ({
-            navController.popBackStack(navController.graph.startDestinationRoute!!, false)
-        })
+        navigator.tabBackHandler = if (isFirstTab) null else ({ backToStartTab() })
         // both live outside this composition
         onDispose {
             reportFloatingArrowBack(false)
@@ -84,7 +91,7 @@ fun BottomTab(
         ) {
             NavHost(
                 navController = navController,
-                startDestination = "option0"
+                startDestination = startRoute
             ) {
                 items.forEachIndexed { index, item ->
                     composable(
@@ -125,11 +132,8 @@ fun BottomTab(
                             navigationOptions = option,
                             bottomTabIndex = index,
                             onBackHandler = {
-                                if (index != 0) {
-                                    navController.popBackStack(
-                                        navController.graph.startDestinationRoute!!,
-                                        inclusive = false
-                                    )
+                                if (backToInitialTab && "option$index" != startRoute) {
+                                    backToStartTab()
                                 } else {
                                     navigator.pop()
                                 }
@@ -139,17 +143,22 @@ fun BottomTab(
                 }
             }
         }
+        BackHandler(enabled = !onStartTab) {
+            if (backToInitialTab) backToStartTab() else navigator.pop()
+        }
         Column {
             BottomTabBar(
                 items = items,
                 floatingButton = floatingButton,
                 navController = navController,
-                onTabSelected = {
-                    val currentRoute = navController.currentBackStackEntry?.destination?.route
-                    val targetRoute = "option$it"
-                    if (currentRoute != targetRoute) {
-                        navController.navigate(targetRoute)
+                onTabSelected = { index ->
+                    val switchTab = {
+                        val targetRoute = "option$index"
+                        if (navController.currentBackStackEntry?.destination?.route != targetRoute) {
+                            navController.navigate(targetRoute)
+                        }
                     }
+                    onTabPress?.invoke(index, switchTab) ?: switchTab()
                 }
             )
             Spacer(modifier = Modifier.fillMaxWidth().height(AppNavigationBar.current + Spacing.S).background(AppTheme.current.colors.background.surface))

package/compose/src/commonMain/kotlin/vn/momo/kits/navigation/component/Header.kt

@@ -67,11 +67,10 @@ internal fun Header(onBackHandler: (() -> Unit)? = null) {
         else -> HEADER_HEIGHT
     }
     val opacity by animateFloatAsState(
-        targetValue = if (options.headerType is HeaderType.Transparent) {
-            0f
-        } else {
-            (scrollState.value / opacityHeight.toFloat())
-                .coerceIn(0f, 1f)
+        targetValue = when {
+            options.headerType is HeaderType.Transparent -> 0f
+            opacityHeight <= 0 -> if (scrollState.value > 0) 1f else 0f
+            else -> (scrollState.value / opacityHeight.toFloat()).coerceIn(0f, 1f)
         }
     )
 

package/compose/src/commonMain/kotlin/vn/momo/kits/navigation/component/HeaderRight.kt

@@ -16,6 +16,17 @@ import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
+// AI-GENERATED START: dispose toolkit requests with their UI owner
+import androidx.compose.runtime.DisposableEffect
+import kotlinx.serialization.json.booleanOrNull
+import kotlinx.serialization.json.jsonPrimitive
+import vn.momo.maxapi.contract.navigation.model.DismissTarget
+import vn.momo.maxapi.contract.toolkit.model.ToolAction
+import vn.momo.maxapi.contract.toolkit.model.ToolkitOptions
+import vn.momo.maxapi.contract.toolkit.model.ToolkitToolGroup
+import vn.momo.maxapi.contract.toolkit.model.ToolkitTool
+import vn.momo.maxapi.runtime.ApiResult
+// AI-GENERATED END: dispose toolkit requests with their UI owner
 import androidx.compose.runtime.derivedStateOf
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -71,37 +82,43 @@ internal fun Toolkit(
     var isFavorite by remember { mutableStateOf(false) }
     val isLoading by remember { mutableStateOf(false) }
 
-    LaunchedEffect(context?.appCode) {
-        api?.isFavoriteApp(mapOf("code" to context?.appCode)) { callback ->
-            val response = callback?.get("response") as? Boolean
-            isFavorite = response == true
+    // AI-GENERATED START: retain custom tool data and typed callback outcomes
+    val requests = remember(api, context?.appCode) { ToolkitRequests() }
+    DisposableEffect(requests) { onDispose { requests.close() } }
+
+    LaunchedEffect(requests) {
+        val client = api ?: return@LaunchedEffect
+        requests.launch<Boolean>({ callback -> client.checkFavorite(context?.appCode, callback) }) { result ->
+            if (result is ApiResult.Success) isFavorite = result.value
         }
     }
 
     fun onPressShortcut() {
-        api?.onToolAction(mapOf("item" to mapOf("key" to "onFavorite"), "context" to MiniAppContext.toMap(context))) { callback ->
-            val response = callback?.get("response") as? Map<*, *>?
-            val success = response?.get("success") as? Boolean
-            if (success == true){
-                isFavorite = !isFavorite
+        val client = api ?: return
+        requests.launch({ callback ->
+            client.performToolAction(ToolAction.FAVORITE, context?.appCode, callback)
+        }) { result ->
+            if (result is ApiResult.Success) {
+                result.value.jsonPrimitive.booleanOrNull?.let { isFavorite = it }
             }
         }
     }
 
     fun onPressMore() {
-        api?.showTools(
-            mapOf(
-                "useSystemTools" to headerRight.useSystemTools,
-                "tools" to headerRight.tools.map { it.toMap() },
-                "context" to MiniAppContext.toMap(context)
-            )
-        ) { callback ->
-            val response = callback?.get("response") as? String
-            if (response != null) {
-                headerRight.toolCallback?.invoke(response)
-            }
+        val client = api ?: return
+        val options = ToolkitOptions(
+            customToolGroups = headerRight.tools.map { group ->
+                ToolkitToolGroup(group.title, group.items.map { tool ->
+                    ToolkitTool(tool.key, tool.icon, tool.showBadge, tool.name, tool.showRightIcon)
+                })
+            },
+            useSystemTools = headerRight.useSystemTools,
+        )
+        requests.launch({ callback -> client.showToolkit(options, callback) }) { result ->
+            if (result is ApiResult.Success) headerRight.toolCallback?.invoke(result.value.actionKey)
         }
     }
+    // AI-GENERATED END: retain custom tool data and typed callback outcomes
 
     val navButtonConfig = getNavigationButtonConfig(
         headerRight,
@@ -156,15 +173,13 @@ internal fun Toolkit(
                     size = 20.dp,
                     color = headerColor.tintIconColor,
                     modifier = Modifier.padding(4.dp).activeOpacityClickable {
-                        api?.showHelpCenter(
-                            mapOf(
-                                "appId" to context.appId,
-                                "code" to context.appCode,
-                                "name" to context.appName,
-                                "icon" to context.appIcon,
-                                "description" to context.description
-                            )
-                        ) {}
+                        // AI-GENERATED START: open support through the typed action
+                        api?.let { client ->
+                            requests.launch({ callback ->
+                                client.performToolAction(ToolAction.SUPPORT, context.appCode, callback)
+                            }) {}
+                        }
+                        // AI-GENERATED END: open support through the typed action
                     }
                 )
                 Box(
@@ -179,7 +194,9 @@ internal fun Toolkit(
                 size = 20.dp,
                 color = headerColor.tintIconColor,
                 modifier = Modifier.padding(4.dp).activeOpacityClickable {
-                    api?.dismissAll {  }
+                    // AI-GENERATED START: preserve dismiss-all without selecting Home
+                    api?.dismiss(DismissTarget.All) {}
+                    // AI-GENERATED END: preserve dismiss-all without selecting Home
                 }
             )
         }

package/compose/src/commonMain/kotlin/vn/momo/kits/navigation/component/HeaderTitle.kt

@@ -9,10 +9,12 @@ import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.sp
 import androidx.compose.ui.zIndex
 import vn.momo.kits.components.Text
+import vn.momo.kits.const.KitDesignSystem
 import vn.momo.kits.const.Typography
 import vn.momo.kits.modifier.setAutomationId
 
-internal const val HEADER_FONT_FAMILY = "MoMoTrustDisplay"
+internal val headerFontFamily: String?
+    get() = if (KitDesignSystem.isWhiteList) "MoMoTrustDisplay" else null
 
 @Composable
 internal fun HeaderTitle(
@@ -29,7 +31,7 @@ internal fun HeaderTitle(
             fontSize = 15.sp,
             lineHeight = 22.sp,
         ),
-        fontFamily = HEADER_FONT_FAMILY,
+        fontFamily = headerFontFamily,
         color = color,
         maxLines = 1,
         overflow = TextOverflow.Ellipsis

package/compose/src/commonMain/kotlin/vn/momo/kits/navigation/component/HeaderUser.kt

@@ -79,7 +79,7 @@ internal fun HeaderUser(
                         text = data.title,
                         color = data.tintColor,
                         style = Typography.actionXsBold,
-                        fontFamily = HEADER_FONT_FAMILY,
+                        fontFamily = headerFontFamily,
                         maxLines = 1,
                         overflow = TextOverflow.Ellipsis
                     )

package/compose/src/commonMain/kotlin/vn/momo/kits/navigation/component/ToolkitRequests.kt

@@ -0,0 +1,33 @@
+// File: ToolkitRequests.kt
+// Created At: 2026-10-12 +07:00 | Created By: AI | AI Agent: Codex | Model: GPT-6
+// AI-GENERATED START: cancel only toolkit requests owned by this composition
+package vn.momo.kits.navigation.component
+
+import vn.momo.maxapi.runtime.ApiCallback
+import vn.momo.maxapi.runtime.ApiRequestHandle
+
+internal class ToolkitRequests {
+    private var active = true
+    private val handles = mutableSetOf<ApiRequestHandle>()
+
+    fun <T> launch(request: (ApiCallback<T>) -> ApiRequestHandle, onResult: ApiCallback<T>) {
+        if (!active) return
+        var completed = false
+        var handle: ApiRequestHandle? = null
+        val created = request { result ->
+            completed = true
+            handle?.let(handles::remove)
+            if (active) onResult(result)
+        }
+        handle = created
+        if (!active) created.cancel() else if (!completed) handles.add(created)
+    }
+
+    fun close() {
+        active = false
+        val pending = handles.toList()
+        handles.clear()
+        pending.forEach { it.cancel() }
+    }
+}
+// AI-GENERATED END: cancel only toolkit requests owned by this composition