@momo-kits/native-kits 0.163.1-beta.2-debug → 0.163.1-beta.20-debug

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

@@ -28,6 +28,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Brush
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.input.pointer.pointerInput
 import androidx.compose.ui.platform.LocalDensity
@@ -43,6 +44,7 @@ import vn.momo.kits.const.Radius
 import vn.momo.kits.const.Spacing
 import vn.momo.kits.application.LocalContext
 import vn.momo.kits.application.IsShowBaseLineDebug
+import vn.momo.kits.const.AppNavigationBar
 import vn.momo.kits.const.Typography
 import vn.momo.kits.navigation.tracking.ScreenTracker
 import vn.momo.kits.modifier.conditional
@@ -56,10 +58,11 @@ internal fun BottomSheet(
     header: BottomHeader,
     isSurface: Boolean = false,
     barrierDismissible: Boolean = true,
+    draggable: Boolean = true,
+    useBottomInset: Boolean = true,
+    footerComponent: (@Composable () -> Unit)? = null,
     onDismiss: (() -> Unit)?
 ) {
-    val navigator = LocalNavigator.current
-
     val screenHeightDp = getScreenHeight()
     val screenHeightPx = with(LocalDensity.current) { screenHeightDp.toPx() }
     val sheetOffset = remember { Animatable(screenHeightPx) }
@@ -117,7 +120,7 @@ internal fun BottomSheet(
                     easing = CubicBezierEasing(0.3f, 0.0f, 0.8f, 0.15f)
                 )
             )
-            navigator.pop()
+            OverplayComponentRegistry.hardClearAfterDismiss()
         }
     }
 
@@ -162,30 +165,35 @@ internal fun BottomSheet(
                 .noFeedbackClickable {  },
             contentAlignment = Alignment.BottomCenter
         ) {
-            Column {
+            val bottomInset = if (useBottomInset) {
+                (AppNavigationBar.current - keyboardSizeState().value).coerceAtLeast(0.dp)
+            } else 0.dp
+            Column(Modifier.padding(bottom = bottomInset)) {
                 Box(
                     modifier = Modifier
                         .height(72.dp)
                         .fillMaxWidth()
-                        .pointerInput(Unit) {
-                            detectDragGestures(
-                                onDrag = { change, dragAmount ->
-                                    change.consume()
-                                    coroutineScope.launch {
-                                        val newOffset = (sheetOffset.value + dragAmount.y).coerceAtLeast(0f)
-                                        sheetOffset.snapTo(newOffset)
-                                    }
-                                },
-                                onDragEnd = {
-                                    coroutineScope.launch {
-                                        if (sheetOffset.value > sheetCloseOffset) {
-                                            closeEvent()
-                                        } else {
-                                            sheetOffset.animateTo(0f)
+                        .conditional(draggable) {
+                            pointerInput(Unit) {
+                                detectDragGestures(
+                                    onDrag = { change, dragAmount ->
+                                        change.consume()
+                                        coroutineScope.launch {
+                                            val newOffset = (sheetOffset.value + dragAmount.y).coerceAtLeast(0f)
+                                            sheetOffset.snapTo(newOffset)
+                                        }
+                                    },
+                                    onDragEnd = {
+                                        coroutineScope.launch {
+                                            if (sheetOffset.value > sheetCloseOffset) {
+                                                closeEvent()
+                                            } else {
+                                                sheetOffset.animateTo(0f)
+                                            }
                                         }
                                     }
-                                }
-                            )
+                                )
+                            }
                         }
                 ) {
                     Column(
@@ -236,12 +244,50 @@ internal fun BottomSheet(
                     }
                 }
                 Divider()
-                content()
+                if (footerComponent != null) {
+                    Box(Modifier.weight(1f, fill = false)) {
+                        content()
+                    }
+                    BottomSheetFooter(footerComponent)
+                } else {
+                    content()
+                }
             }
         }
     }
 }
 
+@Composable
+private fun BottomSheetFooter(footerComponent: @Composable () -> Unit) {
+    val shadowBrush = remember {
+        Brush.verticalGradient(
+            colors = listOf(Color.Transparent, Color.Black.copy(alpha = 0.05f))
+        )
+    }
+
+    Box {
+        Box(
+            Modifier
+                .fillMaxWidth()
+                .background(AppTheme.current.colors.background.surface)
+                .conditional(IsShowBaseLineDebug) {
+                    border(1.dp, Colors.blue_03)
+                }
+                .padding(vertical = Spacing.S)
+        ) {
+            footerComponent()
+        }
+
+        Box(
+            modifier = Modifier
+                .fillMaxWidth()
+                .height(6.dp)
+                .offset(x = 0.dp, y = (-6).dp)
+                .background(shadowBrush)
+        )
+    }
+}
+
 sealed class BottomHeader {
     data class Title(
         val data: String = "Bottom Sheet Title",

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

@@ -81,7 +81,7 @@ internal fun ModalScreen(
                 targetValue = 0.8f,
                 animationSpec = tween(durationMillis = 200)
             )
-            navigator.pop()
+            OverplayComponentRegistry.hardClearAfterDismiss()
         }
     }
 

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

@@ -16,6 +16,10 @@ class Navigation(
     val currentOptions: State<NavigationOptions> get() = _options
     val options: NavigationOptions get() = _options.value
 
+    private val _isBottomTabRoot = mutableStateOf(false)
+    internal val isBottomTabRoot: Boolean get() = _isBottomTabRoot.value
+    internal fun markAsBottomTabRoot() { _isBottomTabRoot.value = true }
+
     fun setOptions(
         onBackHandler: (() -> Unit)? = null,
         hiddenBack: Boolean? = null,
@@ -81,7 +85,9 @@ data class NavigationOptions(
     val footerComponent: @Composable (() -> Unit)? = null,
     val floatingButtonProps: FloatingButtonProps? = null,
     val keyboardOptions: KeyboardOptions = KeyboardOptions()
-)
+) {
+    internal fun hasFooter() : Boolean = footerComponent != null
+}
 
 data class KeyboardOptions(
     val keyboardShouldPersistTaps: Boolean = false,

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

@@ -1,17 +1,35 @@
 package vn.momo.kits.navigation
 
-import androidx.compose.animation.*
 import androidx.compose.animation.core.tween
-import androidx.compose.runtime.*
+import androidx.compose.animation.fadeIn
+import androidx.compose.animation.slideInHorizontally
+import androidx.compose.animation.slideInVertically
+import androidx.compose.animation.slideOutHorizontally
+import androidx.compose.animation.slideOutVertically
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
+import androidx.compose.runtime.DisposableEffect
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
 import androidx.compose.runtime.saveable.rememberSaveable
+import androidx.compose.runtime.staticCompositionLocalOf
 import androidx.compose.ui.unit.Dp
 import androidx.navigation.compose.NavHost
 import androidx.navigation.compose.composable
 import androidx.navigation.compose.rememberNavController
 import androidx.navigation.toRoute
-import vn.momo.kits.application.*
-import vn.momo.kits.const.*
+import vn.momo.kits.application.LocalContext
+import vn.momo.kits.application.LocalLocalize
+import vn.momo.kits.application.Localize
+import vn.momo.kits.application.MiniAppContext
+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.defaultTheme
 import vn.momo.kits.platform.ProvideNavigationEventDispatcherOwner
+import vn.momo.kits.platform.ProvideOsFontScale
 import vn.momo.kits.utils.getAppStatusBarHeight
 import vn.momo.kits.utils.getNavigationBarHeight
 import vn.momo.maxapi.IMaxApi
@@ -22,12 +40,12 @@ fun NavigationContainer(
     initialScreen: @Composable () -> Unit,
     options: NavigationOptions? = null,
     initialTheme: Theme = defaultTheme,
-    miniappContext: MiniAppContext? = null,
-    maxApi: IMaxApi?,
+    miniAppContext: MiniAppContext? = null,
+    maxApi: IMaxApi? = null,
     setNavigator: ((Navigator) -> Unit)? = null,
     statusBarHeight: Dp? = null,
     localize: Localize? = null,
-){
+) {
     val navController = rememberNavController()
     val registry = remember { DynamicScreenRegistry() }
     val navigator = remember { Navigator(navController = navController, maxApi = maxApi, registry = registry) }
@@ -35,99 +53,101 @@ fun NavigationContainer(
     val navigationBarHeight = getNavigationBarHeight()
 
     val parentContext = LocalContext.current
-    val mergedContext = MiniAppContext.merge(parentContext, miniappContext)
+    val mergedContext = MiniAppContext.merge(parentContext, miniAppContext)
 
-    var observerFontScaleConfig by remember { mutableStateOf(mergedContext?.fontScaleConfig) }
-    LaunchedEffect(maxApi) {
+    val theme = remember { mutableStateOf(initialTheme) }
+    val fallbackLocalize = remember { Localize() }
+
+    val resolvedLocalize = localize ?: fallbackLocalize
+
+    LaunchedEffect(maxApi, resolvedLocalize) {
         val api = maxApi ?: return@LaunchedEffect
         runCatching {
-            api.observer(FONT_SCALE_OBSERVER_KEY).collect { data ->
-                observerFontScaleConfig = parseFontScaleConfig(data)
-            }
+            api.getLanguage(callback = { data ->
+                if (parseLanguage(data) == Localize.EN) {
+                    resolvedLocalize.changeLanguage(Localize.EN)
+                }
+            })
         }
     }
 
-    val theme = remember { mutableStateOf(initialTheme) }
-
-    val fallbackLocalize = remember { Localize() }
-    val resolvedLocalize = localize ?: fallbackLocalize
-
     val screenId = rememberSaveable { registry.nextId() }
     registry.bind(screenId, initialScreenName, initialScreen, options)
     val startDestination = remember(screenId) { DynamicScreenRoute(screenId) }
 
-    ProvideNavigationEventDispatcherOwner {
-        CompositionLocalProvider(
-            LocalNavigator provides navigator,
-            LocalDynamicScreenRegistry provides registry,
-            LocalMaxApi provides maxApi,
-            AppTheme provides theme.value,
-            AppStatusBar provides statusBarHeight,
-            AppNavigationBar provides navigationBarHeight,
-            LocalContext provides mergedContext,
-            LocalLocalize provides resolvedLocalize,
-            LocalFontScaleConfig provides (observerFontScaleConfig ?: LocalFontScaleConfig.current),
+    ProvideOsFontScale {
+        ProvideNavigationEventDispatcherOwner {
+            CompositionLocalProvider(
+                LocalNavigator provides navigator,
+                LocalDynamicScreenRegistry provides registry,
+                LocalMaxApi provides maxApi,
+                AppTheme provides theme.value,
+                AppStatusBar provides statusBarHeight,
+                AppNavigationBar provides navigationBarHeight,
+                LocalContext provides mergedContext,
+                LocalLocalize provides resolvedLocalize,
             ) {
-            LaunchedEffect(Unit) {
-                setNavigator?.invoke(navigator)
-            }
-
-            NavHost(navController, startDestination = startDestination) {
-                composable<DynamicScreenRoute>(
-                    enterTransition = {
-                        slideInHorizontally(
-                            animationSpec = tween(300),
-                            initialOffsetX = { it }
-                        )
-                    },
-                    exitTransition = null,
-                    popEnterTransition = { fadeIn(animationSpec = tween(0)) },
-                    popExitTransition = {
-                        slideOutHorizontally(
-                            animationSpec = tween(300),
-                            targetOffsetX = { it }
-                        )
-                    }
-                ) { backStackEntry ->
-                    val route = backStackEntry.toRoute<DynamicScreenRoute>()
-                    val screen = registry.getScreen(route.id)
-
-                    if (screen != null) {
-                        StackScreen(
-                            id = route.id,
-                            name = screen.name,
-                            content = screen.content,
-                            navigationOptions = screen.options
-                        )
-                    }
+                LaunchedEffect(Unit) {
+                    setNavigator?.invoke(navigator)
                 }
 
-                composable<DynamicDialogRoute>(
-                    enterTransition = {
-                        slideInVertically(
-                            animationSpec = tween(300),
-                            initialOffsetY = { it }
-                        )
-                    },
-                    exitTransition = null,
-                    popEnterTransition = { fadeIn(animationSpec = tween(0)) },
-                    popExitTransition = {
-                        slideOutVertically(
-                            animationSpec = tween(300),
-                            targetOffsetY = { it }
-                        )
+                NavHost(navController, startDestination = startDestination) {
+                    composable<DynamicScreenRoute>(
+                        enterTransition = {
+                            slideInHorizontally(
+                                animationSpec = tween(300),
+                                initialOffsetX = { it }
+                            )
+                        },
+                        exitTransition = null,
+                        popEnterTransition = { fadeIn(animationSpec = tween(0)) },
+                        popExitTransition = {
+                            slideOutHorizontally(
+                                animationSpec = tween(300),
+                                targetOffsetX = { it }
+                            )
+                        }
+                    ) { backStackEntry ->
+                        val route = backStackEntry.toRoute<DynamicScreenRoute>()
+                        val screen = registry.getScreen(route.id)
+
+                        if (screen != null) {
+                            StackScreen(
+                                id = route.id,
+                                name = screen.name,
+                                content = screen.content,
+                                navigationOptions = screen.options
+                            )
+                        }
                     }
-                ) { backStackEntry ->
-                    val route = backStackEntry.toRoute<DynamicDialogRoute>()
-                    val screen = registry.getScreen(route.id)
-
-                    if (screen != null) {
-                        StackScreen(
-                            id = route.id,
-                            name = screen.name,
-                            content = screen.content,
-                            navigationOptions = screen.options
-                        )
+
+                    composable<DynamicDialogRoute>(
+                        enterTransition = {
+                            slideInVertically(
+                                animationSpec = tween(300),
+                                initialOffsetY = { it }
+                            )
+                        },
+                        exitTransition = null,
+                        popEnterTransition = { fadeIn(animationSpec = tween(0)) },
+                        popExitTransition = {
+                            slideOutVertically(
+                                animationSpec = tween(300),
+                                targetOffsetY = { it }
+                            )
+                        }
+                    ) { backStackEntry ->
+                        val route = backStackEntry.toRoute<DynamicDialogRoute>()
+                        val screen = registry.getScreen(route.id)
+
+                        if (screen != null) {
+                            StackScreen(
+                                id = route.id,
+                                name = screen.name,
+                                content = screen.content,
+                                navigationOptions = screen.options
+                            )
+                        }
                     }
                 }
             }
@@ -142,34 +162,11 @@ fun NavigationContainer(
     }
 }
 
-val LocalMaxApi = staticCompositionLocalOf<IMaxApi?> {
-    error("No MaxApi provided")
-}
+val LocalMaxApi = staticCompositionLocalOf<IMaxApi?> { null }
 
-private const val FONT_SCALE_OBSERVER_KEY = "font_scale_config"
-
-private fun parseFontScaleConfig(raw: Map<String, Any?>?): FontScaleConfig? {
-    if (raw.isNullOrEmpty()) return null
-    @Suppress("UNCHECKED_CAST")
-    val data = (raw["response"] as? Map<String, Any?>)
-        ?: (raw["data"] as? Map<String, Any?>)
-        ?: raw
-    if (!data.containsKey("useOSFontScale") && !data.containsKey("userScaleRate")) return null
-    val useOS = when (val v = data["useOSFontScale"]) {
-        is Boolean -> v
-        is String -> v.equals("true", ignoreCase = true)
-        is Number -> v.toInt() != 0
-        else -> true
-    }
-    val rate = when (val v = data["userScaleRate"]) {
-        is Number -> v.toFloat()
-        is String -> v.toFloatOrNull()
-        else -> null
-    }
-    val osScale = when (val v = data["osFontScale"]) {
-        is Number -> v.toFloat()
-        is String -> v.toFloatOrNull()
-        else -> null
-    }
-    return FontScaleConfig(useOSFontScale = useOS, userScaleRate = rate, osFontScale = osScale)
+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

@@ -139,10 +139,13 @@ class Navigator(
         isSurface: Boolean = false,
         barrierDismissible: Boolean = true,
         onDismiss: (() -> Unit)? = null,
-        bottomSheetHeader: BottomHeader? = null
+        bottomSheetHeader: BottomHeader? = null,
+        draggable: Boolean = true,
+        useBottomInset: Boolean = true,
+        footerComponent: (@Composable () -> Unit)? = null
     ){
         val id = currentScreen()?.id ?: -1
-        OverplayComponentRegistry.registerOverplay(id, content, OverplayComponentType.BOTTOM_SHEET, isSurface, barrierDismissible, onDismiss, bottomSheetHeader)
+        OverplayComponentRegistry.registerOverplay(id, content, OverplayComponentType.BOTTOM_SHEET, isSurface, barrierDismissible, onDismiss, bottomSheetHeader, draggable, useBottomInset, footerComponent)
     }
 
     fun showSnackBar(snackBar: SnackBar, onDismiss: (() -> Unit)? = null) {
@@ -257,6 +260,9 @@ sealed class OverplayComponentParams {
         val onDismiss: (() -> Unit)? = null,
         val barrierDismissible: Boolean = true,
         val bottomSheetHeader: BottomHeader? = null,
+        val draggable: Boolean = true,
+        val useBottomInset: Boolean = true,
+        val footerComponent: (@Composable () -> Unit)? = null,
     ) : OverplayComponentParams()
 
     class SnackBar : OverplayComponentParams()
@@ -288,10 +294,13 @@ object OverplayComponentRegistry {
         barrierDismissible: Boolean = true,
         onDismiss: (() -> Unit)?,
         bottomSheetHeader: BottomHeader? = null,
+        draggable: Boolean = true,
+        useBottomInset: Boolean = true,
+        footerComponent: (@Composable () -> Unit)? = null,
     ){
         val params = when(type){
             OverplayComponentType.MODAL -> OverplayComponentParams.Modal(onDismiss, barrierDismissible)
-            OverplayComponentType.BOTTOM_SHEET -> OverplayComponentParams.BottomSheet(isSurface, onDismiss, barrierDismissible, bottomSheetHeader)
+            OverplayComponentType.BOTTOM_SHEET -> OverplayComponentParams.BottomSheet(isSurface, onDismiss, barrierDismissible, bottomSheetHeader, draggable, useBottomInset, footerComponent)
             OverplayComponentType.SNACK_BAR -> OverplayComponentParams.SnackBar()
         }
 
@@ -333,6 +342,9 @@ object OverplayComponentRegistry {
                     header = params.bottomSheetHeader ?: Title(),
                     isSurface = params.isSurface,
                     barrierDismissible = params.barrierDismissible,
+                    draggable = params.draggable,
+                    useBottomInset = params.useBottomInset,
+                    footerComponent = params.footerComponent,
                     onDismiss = params.onDismiss
                 )
             }

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

@@ -56,6 +56,7 @@ import vn.momo.kits.const.Colors
 import vn.momo.kits.const.Spacing
 import vn.momo.kits.modifier.conditional
 import vn.momo.kits.modifier.hideKeyboardOnTap
+import vn.momo.kits.navigation.bottomtab.BOTTOM_TAB_BAR_HEIGHT
 import vn.momo.kits.navigation.component.FABPosition
 import vn.momo.kits.navigation.component.FloatingButton
 import vn.momo.kits.navigation.component.HEADER_HEIGHT
@@ -77,6 +78,13 @@ import kotlin.time.ExperimentalTime
 internal val LocalFooterHeightPx = staticCompositionLocalOf { mutableIntStateOf(0) }
 internal val LocalHeaderRightWidthPx = staticCompositionLocalOf { mutableIntStateOf(0) }
 
+@Composable
+private fun bottomTabBarInset(): Dp {
+    if (LocalNavigation.current.bottomTabIndex == -1) return 0.dp
+    val keyboard = keyboardSizeState().value
+    return (BOTTOM_TAB_BAR_HEIGHT.dp + Spacing.S - keyboard).coerceAtLeast(0.dp)
+}
+
 @OptIn(ExperimentalMaterialApi::class, ExperimentalTime::class)
 @Composable
 internal fun StackScreen(
@@ -96,6 +104,8 @@ internal fun StackScreen(
     val navigation = remember { Navigation(id = id, bottomTabIndex = bottomTabIndex, initOptions = navigationOptions, registry = screenRegistry) }
 
     val options by navigation.currentOptions
+    val isBottomTabChild = bottomTabIndex != -1
+    val isBottomTabRoot = navigation.isBottomTabRoot
 
     // Auto tracking state
     val trackingState = remember {
@@ -193,30 +203,35 @@ internal fun StackScreen(
             }
 
             Column(Modifier.zIndex(2f).fillMaxSize()) {
-                MainContent(content = content)
+                MainContent(content = content, isBottomTabRoot = isBottomTabRoot, isBottomTabChild = isBottomTabChild)
                 FooterContent()
             }
 
             Box(Modifier.zIndex(6f)) {
-                FloatingContent()
+                FloatingContent(isBottomTabChild = isBottomTabChild)
             }
 
-            OverplayView(bottomTabIndex = bottomTabIndex, id = id)
+            OverplayView(isBottomTabChild = isBottomTabChild, id = id)
         }
     }
 }
 
 @Suppress("FrequentlyChangingValue")
 @Composable
-internal fun FloatingContent() {
+internal fun FloatingContent(isBottomTabChild: Boolean) {
     val options = LocalOptions.current
     val density = LocalDensity.current
     val footerHeightPx = LocalFooterHeightPx.current
     val scrollState = LocalScrollState.current
+    val navigationBar = AppNavigationBar.current
 
     val fabProps = options.floatingButtonProps ?: return
     val bottomPadding = fabProps.bottom
-        ?: (Spacing.M + if (options.footerComponent != null) with(density) { footerHeightPx.intValue.toDp() } else 0.dp)
+        ?: (Spacing.M + when {
+            options.hasFooter() -> with(density) { footerHeightPx.intValue.toDp() }
+            isBottomTabChild -> bottomTabBarInset() + (navigationBar - keyboardSizeState().value).coerceAtLeast(0.dp)
+            else -> navigationBar
+        })
 
     FloatingButton(
         scrollPosition = fabProps.scrollState?.value ?: scrollState.value,
@@ -232,11 +247,12 @@ internal fun FloatingContent() {
 }
 
 @Composable
-internal fun ColumnScope.MainContent(content: @Composable () -> Unit) {
+internal fun ColumnScope.MainContent(content: @Composable () -> Unit, isBottomTabRoot: Boolean, isBottomTabChild: Boolean) {
     val options = LocalOptions.current
     val inputSearchType = getInputSearchType(options)
     val density = LocalDensity.current
     val scrollState = LocalScrollState.current
+    val navigationBar = AppNavigationBar.current
 
     Spacer(
         Modifier.height(
@@ -260,6 +276,14 @@ internal fun ColumnScope.MainContent(content: @Composable () -> Unit) {
             .conditional(options.scrollData.scrollable && options.scrollData.scrollState is ScrollState) {
                 verticalScroll(scrollState)
             }
+            .padding(
+                bottom = when {
+                    options.hasFooter() || isBottomTabRoot -> 0.dp
+                    isBottomTabChild -> bottomTabBarInset() + (navigationBar - keyboardSizeState().value).coerceAtLeast(0.dp)
+                    !options.scrollData.scrollable && options.scrollData.scrollState == null -> 0.dp
+                    else -> navigationBar
+                }
+            )
     ) {
         ScreenContent(content = content)
     }
@@ -289,7 +313,7 @@ internal fun ScreenContent(content: @Composable () -> Unit) {
 @Composable
 internal fun FooterContent() {
     val options = LocalOptions.current
-    if (options.footerComponent != null) {
+    if (options.hasFooter()) {
         val keyboardSize = keyboardSizeState()
         val bottomPadding = (AppNavigationBar.current - keyboardSize.value).coerceAtLeast(0.dp)
         Footer(footerComponent = options.footerComponent, bottomPadding = bottomPadding)
@@ -303,12 +327,12 @@ internal fun keyboardSizeState(): State<Dp> {
 }
 
 @Composable
-internal fun OverplayView(bottomTabIndex: Int, id: Int) {
+internal fun OverplayView(isBottomTabChild: Boolean, id: Int) {
     val overplayType = OverplayComponentRegistry.getOverplayType()
 
     if (overplayType != null) {
         Box(Modifier.zIndex(if (overplayType == OverplayComponentType.SNACK_BAR) 3f else 7f).fillMaxSize()) {
-            if (bottomTabIndex != -1) return@Box
+            if (isBottomTabChild) return@Box
             if (OverplayComponentRegistry.currentRootId() != id) return@Box
             OverplayComponentRegistry.OverlayComponent()
         }

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

@@ -18,12 +18,12 @@ import androidx.navigation.compose.rememberNavController
 import vn.momo.kits.const.AppNavigationBar
 import vn.momo.kits.const.AppTheme
 import vn.momo.kits.const.Spacing
+import vn.momo.kits.navigation.KeyboardOptions
 import vn.momo.kits.navigation.LocalNavigation
 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.getScreenHeight
 
 private var bottomTabOptionItems : MutableList<NavigationOptions?> = mutableListOf()
 internal fun setBottomTabOption(index: Int, options: NavigationOptions){
@@ -52,15 +52,16 @@ fun BottomTab(
 
 
     LaunchedEffect(Unit){
+        navigation.markAsBottomTabRoot()
         navigation.setOptions(
-            headerType = HeaderType.None
+            headerType = HeaderType.None,
+            keyboardOptions = KeyboardOptions(useAvoidKeyboard = false)
         )
     }
 
-    Box(modifier = Modifier.fillMaxWidth().height(getScreenHeight()), contentAlignment = Alignment.BottomCenter) {
+    Box(modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.BottomCenter) {
         Box(modifier = Modifier
             .fillMaxSize()
-            .padding(bottom = BOTTOM_TAB_BAR_HEIGHT.dp + AppNavigationBar.current)
         ) {
             NavHost(
                 navController = navController,
@@ -127,7 +128,7 @@ fun BottomTab(
                 onTabSelected = {
                     val currentRoute = navController.currentBackStackEntry?.destination?.route
                     val targetRoute = "option$it"
-                    if (currentRoute != targetRoute){
+                    if (currentRoute != targetRoute) {
                         navController.navigate(targetRoute)
                     }
                 }