@momo-kits/native-kits 0.157.1-skill.3 → 0.157.1-skill.6-debug

package/.claude/momo-native-kits-skill/workspace/iteration-3/eval-navcontainer/with_skill/outputs/NavigationContainerExample.kt

@@ -1,547 +0,0 @@
-package vn.momo.kits.examples
-
-import androidx.compose.foundation.background
-import androidx.compose.foundation.clickable
-import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.size
-import androidx.compose.foundation.lazy.LazyColumn
-import androidx.compose.foundation.rememberScrollState
-import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.foundation.verticalScroll
-import androidx.compose.material3.Text
-import androidx.compose.runtime.Composable
-import androidx.compose.runtime.LaunchedEffect
-import androidx.compose.runtime.getValue
-import androidx.compose.runtime.mutableStateOf
-import androidx.compose.runtime.remember
-import androidx.compose.runtime.setValue
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.draw.clip
-import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.unit.dp
-import vn.momo.kits.navigation.LocalNavigation
-import vn.momo.kits.navigation.LocalNavigator
-import vn.momo.kits.navigation.NavigationContainer
-import vn.momo.kits.navigation.NavigationOptions
-import vn.momo.kits.navigation.ScrollData
-import vn.momo.kits.navigation.component.HeaderBackProps
-import vn.momo.kits.navigation.component.HeaderRight
-import vn.momo.kits.navigation.component.HeaderTitle
-import vn.momo.kits.navigation.component.HeaderType
-import vn.momo.kits.navigation.component.InputSearchProps
-import vn.momo.kits.navigation.component.PopupAction
-import vn.momo.kits.navigation.component.PopupNotifyProps
-
-/**
- * NavigationContainer Example for MoMo App
- *
- * This file demonstrates the correct pattern for implementing NavigationContainer
- * in a MoMo Native Kits application.
- *
- * KEY POINTS:
- * - ONE NavigationContainer per Fragment/Activity
- * - Use setOptions in LaunchedEffect(Unit) for dynamic configuration
- * - Use LocalNavigation.current for setOptions (header, scroll, footer)
- * - Use LocalNavigator.current for push/pop/present/showModal/showBottomSheet
- */
-@Composable
-fun NavigationContainerExample() {
-    // Single NavigationContainer - root of the app/fragment
-    NavigationContainer(
-        initialScreen = {
-            HomeScreen()
-        },
-        options = NavigationOptions(
-            headerTitle = HeaderTitle.Default("MoMo App"),
-            headerType = HeaderType.Default,
-            headerRight = {
-                HeaderRight.Toolkit(useShortcut = true)
-            },
-            hiddenBack = false
-        )
-    ) {
-        // All screens are pushed within this container
-        // The container manages the navigation stack
-    }
-}
-
-/**
- * Home Screen - Initial screen in NavigationContainer
- *
- * Demonstrates:
- * - Using LaunchedEffect(Unit) for setOptions
- * - Connecting scroll state for header animation
- * - Navigation to other screens
- */
-@Composable
-fun HomeScreen() {
-    val navigator = LocalNavigator.current
-    val navigation = LocalNavigation.current
-
-    // Use LaunchedEffect(Unit) for setOptions - NOT in composable root
-    LaunchedEffect(Unit) {
-        navigation.setOptions(
-            headerTitle = HeaderTitle.Default("Trang chủ"),
-            headerType = HeaderType.Default
-        )
-    }
-
-    // Connect scroll state for header animation
-    val scrollState = rememberScrollState()
-    LaunchedEffect(Unit) {
-        navigation.setOptions(
-            scrollData = ScrollData(
-                scrollState = scrollState
-            )
-        )
-    }
-
-    LazyColumn(
-        modifier = Modifier
-            .fillMaxSize()
-            .padding(horizontal = 16.dp),
-        state = scrollState,
-        verticalArrangement = Arrangement.spacedBy(12.dp)
-    ) {
-        item {
-            Modifier.padding(top = 16.dp)
-            Text(
-                text = "Navigation Examples",
-                style = androidx.compose.material3.MaterialTheme.typography.headlineMedium,
-                modifier = Modifier.padding(vertical = 8.dp)
-            )
-        }
-
-        // Navigation examples
-        item {
-            NavigationItem(
-                title = "Basic Screen",
-                description = "Navigate to a simple screen with push/pop",
-                onClick = { navigator.push({ BasicScreen() }) }
-            )
-        }
-
-        item {
-            NavigationItem(
-                title = "Extended Header",
-                description = "Header with search input",
-                onClick = { navigator.push({ SearchScreen() }) }
-            )
-        }
-
-        item {
-            NavigationItem(
-                title = "Animated Header",
-                description = "Collapsing header with image",
-                onClick = { navigator.push({ AnimatedHeaderScreen() }) }
-            )
-        }
-
-        item {
-            NavigationItem(
-                title = "Footer Component",
-                description = "Screen with footer button",
-                onClick = { navigator.push({ FooterScreen() }) }
-            )
-        }
-
-        item {
-            NavigationItem(
-                title = "Prevent Back",
-                description = "Confirmation dialog on back press",
-                onClick = { navigator.push({ PreventBackScreen() }) }
-            )
-        }
-
-        item {
-            NavigationItem(
-                title = "Modal Screen",
-                description = "Present screen as modal",
-                onClick = { navigator.present({ ModalScreen() }) }
-            )
-        }
-
-        item {
-            NavigationItem(
-                title = "Bottom Sheet",
-                description = "Show content in bottom sheet",
-                onClick = { navigator.showBottomSheet({ BottomSheetContent() }) }
-            )
-        }
-
-        item {
-            NavigationItem(
-                title = "Dynamic Title",
-                description = "Change header title dynamically",
-                onClick = { navigator.push({ DynamicTitleScreen() }) }
-            )
-        }
-
-        item {
-            Modifier.padding(bottom = 16.dp)
-        }
-    }
-}
-
-/**
- * Basic Screen - Simple navigation example
- */
-@Composable
-fun BasicScreen() {
-    val navigator = LocalNavigator.current
-    val navigation = LocalNavigation.current
-
-    LaunchedEffect(Unit) {
-        navigation.setOptions(
-            headerTitle = HeaderTitle.Default("Basic Screen"),
-            headerType = HeaderType.Default
-        )
-    }
-
-    Column(
-        modifier = Modifier
-            .fillMaxSize()
-            .padding(16.dp),
-        horizontalAlignment = Alignment.CenterHorizontally,
-        verticalArrangement = Arrangement.Center
-    ) {
-        Text(
-            text = "This is a basic screen",
-            style = androidx.compose.material3.MaterialTheme.typography.bodyLarge
-        )
-
-        Text(
-            text = "Tap the back button or use navigator.pop()",
-            style = androidx.compose.material3.MaterialTheme.typography.bodyMedium,
-            modifier = Modifier.padding(top = 8.dp)
-        )
-    }
-}
-
-/**
- * Search Screen - Extended header with search input
- */
-@Composable
-fun SearchScreen() {
-    val navigation = LocalNavigation.current
-    val searchText = remember { mutableStateOf("") }
-    var searchResults by remember { mutableStateOf(listOf<String>()) }
-
-    LaunchedEffect(Unit) {
-        navigation.setOptions(
-            headerTitle = HeaderTitle.Default("Search"),
-            headerType = HeaderType.Extended(
-                useAnimated = true,
-                inputSearchProps = InputSearchProps(
-                    text = searchText,
-                    placeholder = "Search...",
-                    onChangeText = { query ->
-                        searchText.value = query
-                        // Simulate search
-                        searchResults = listOf("Result 1", "Result 2", "Result 3")
-                            .filter { it.contains(query, ignoreCase = true) }
-                    }
-                )
-            )
-        )
-    }
-
-    LazyColumn(
-        modifier = Modifier
-            .fillMaxSize()
-            .padding(16.dp)
-    ) {
-        if (searchText.value.isNotEmpty()) {
-            items(searchResults.size) { index ->
-                Text(
-                    text = searchResults[index],
-                    modifier = Modifier
-                        .fillMaxWidth()
-                        .padding(vertical = 8.dp)
-                )
-            }
-        } else {
-            item {
-                Text(
-                    text = "Enter search query above",
-                    style = androidx.compose.material3.MaterialTheme.typography.bodyMedium
-                )
-            }
-        }
-    }
-}
-
-/**
- * Animated Header Screen - Collapsing header with image
- */
-@Composable
-fun AnimatedHeaderScreen() {
-    val navigation = LocalNavigation.current
-
-    LaunchedEffect(Unit) {
-        navigation.setOptions(
-            headerTitle = HeaderTitle.Default("Animated Header"),
-            headerType = HeaderType.Animated(
-                isSurface = true,
-                aspectRatio = vn.momo.kits.navigation.component.AnimatedHeaderRatio.RATIO_16_9,
-                composable = {
-                    Box(
-                        modifier = Modifier
-                            .fillMaxSize()
-                            .background(Color(0xFF6200EE)),
-                        contentAlignment = Alignment.Center
-                    ) {
-                        Text(
-                            text = "Header Image Area",
-                            color = Color.White
-                        )
-                    }
-                }
-            )
-        )
-    }
-
-    Column(
-        modifier = Modifier
-            .fillMaxSize()
-            .padding(16.dp)
-    ) {
-        Text(
-            text = "Content below animated header",
-            style = androidx.compose.material3.MaterialTheme.typography.bodyLarge
-        )
-    }
-}
-
-/**
- * Footer Screen - Screen with footer component
- */
-@Composable
-fun FooterScreen() {
-    val navigation = LocalNavigation.current
-
-    LaunchedEffect(Unit) {
-        navigation.setOptions(
-            headerTitle = HeaderTitle.Default("Footer Screen"),
-            headerType = HeaderType.Default,
-            footerComponent = {
-                Box(
-                    modifier = Modifier
-                        .fillMaxWidth()
-                        .background(Color.White)
-                        .padding(16.dp)
-                ) {
-                    Text(
-                        text = "Footer Button",
-                        modifier = Modifier
-                            .fillMaxWidth()
-                            .background(Color(0xFF6200EE), RoundedCornerShape(8.dp))
-                            .padding(12.dp)
-                            .clickable { /* Handle click */ },
-                        color = Color.White,
-                        textAlign = androidx.compose.ui.text.style.TextAlign.Center
-                    )
-                }
-            }
-        )
-    }
-
-    Column(
-        modifier = Modifier
-            .fillMaxSize()
-            .padding(16.dp)
-    ) {
-        Text(
-            text = "Main content area",
-            style = androidx.compose.material3.MaterialTheme.typography.bodyLarge
-        )
-    }
-}
-
-/**
- * Prevent Back Screen - Confirmation dialog on back press
- */
-@Composable
-fun PreventBackScreen() {
-    val navigator = LocalNavigator.current
-    val navigation = LocalNavigation.current
-
-    LaunchedEffect(Unit) {
-        navigation.setOptions(
-            headerTitle = HeaderTitle.Default("Prevent Back"),
-            headerType = HeaderType.Default,
-            headerBackProps = HeaderBackProps(
-                preventBack = PopupNotifyProps(
-                    onIconClose = { navigator.pop() },
-                    primary = PopupAction(
-                        title = "Go back",
-                        onPress = { navigator.pop() }
-                    ),
-                    secondary = PopupAction(
-                        title = "Stay",
-                        onPress = { /* Do nothing - stay on screen */ }
-                    )
-                )
-            )
-        )
-    }
-
-    Column(
-        modifier = Modifier
-            .fillMaxSize()
-            .padding(16.dp),
-        verticalArrangement = Arrangement.Center,
-        horizontalAlignment = Alignment.CenterHorizontally
-    ) {
-        Text(
-            text = "Try pressing the back button",
-            style = androidx.compose.material3.MaterialTheme.typography.bodyLarge
-        )
-        Text(
-            text = "A confirmation dialog will appear",
-            style = androidx.compose.material3.MaterialTheme.typography.bodyMedium,
-            modifier = Modifier.padding(top = 8.dp)
-        )
-    }
-}
-
-/**
- * Modal Screen - Presented as modal
- */
-@Composable
-fun ModalScreen() {
-    val navigator = LocalNavigator.current
-    val navigation = LocalNavigation.current
-
-    LaunchedEffect(Unit) {
-        navigation.setOptions(
-            headerTitle = HeaderTitle.Default("Modal Screen"),
-            headerType = HeaderType.Default
-        )
-    }
-
-    Column(
-        modifier = Modifier
-            .fillMaxSize()
-            .padding(16.dp),
-        verticalArrangement = Arrangement.Center,
-        horizontalAlignment = Alignment.CenterHorizontally
-    ) {
-        Text(
-            text = "This is a modal screen",
-            style = androidx.compose.material3.MaterialTheme.typography.bodyLarge
-        )
-        Text(
-            text = "Tap outside or back to dismiss",
-            style = androidx.compose.material3.MaterialTheme.typography.bodyMedium,
-            modifier = Modifier.padding(top = 8.dp)
-        )
-    }
-}
-
-/**
- * Bottom Sheet Content - Shown in bottom sheet
- */
-@Composable
-fun BottomSheetContent() {
-    Column(
-        modifier = Modifier
-            .fillMaxWidth()
-            .padding(24.dp)
-    ) {
-        Text(
-            text = "Bottom Sheet",
-            style = androidx.compose.material3.MaterialTheme.typography.headlineSmall
-        )
-        Text(
-            text = "This content is shown in a bottom sheet",
-            style = androidx.compose.material3.MaterialTheme.typography.bodyMedium,
-            modifier = Modifier.padding(top = 8.dp)
-        )
-    }
-}
-
-/**
- * Dynamic Title Screen - Change header title dynamically
- */
-@Composable
-fun DynamicTitleScreen() {
-    val navigation = LocalNavigation.current
-    var title by remember { mutableStateOf("Dynamic Title") }
-
-    LaunchedEffect(Unit) {
-        navigation.setOptions(
-            headerTitle = HeaderTitle.Default(title)
-        )
-    }
-
-    // Update title when it changes
-    LaunchedEffect(title) {
-        navigation.setOptions(
-            headerTitle = HeaderTitle.Default(title)
-        )
-    }
-
-    Column(
-        modifier = Modifier
-            .fillMaxSize()
-            .padding(16.dp)
-    ) {
-        Text(
-            text = "Current title: $title",
-            style = androidx.compose.material3.MaterialTheme.typography.bodyLarge
-        )
-
-        // Example buttons to change title
-        listOf("Home", "Settings", "Profile", "Account").forEach { newTitle ->
-            Text(
-                text = newTitle,
-                modifier = Modifier
-                    .fillMaxWidth()
-                    .padding(vertical = 8.dp)
-                    .clip(RoundedCornerShape(8.dp))
-                    .background(Color(0xFFEEEEEE))
-                    .padding(12.dp)
-                    .clickable { title = newTitle },
-                style = androidx.compose.material3.MaterialTheme.typography.bodyMedium
-            )
-        }
-    }
-}
-
-/**
- * Reusable Navigation Item for the example list
- */
-@Composable
-fun NavigationItem(
-    title: String,
-    description: String,
-    onClick: () -> Unit
-) {
-    Column(
-        modifier = Modifier
-            .fillMaxWidth()
-            .clip(RoundedCornerShape(12.dp))
-            .background(Color(0xFFF5F5F5))
-            .clickable { onClick() }
-            .padding(16.dp)
-    ) {
-        Text(
-            text = title,
-            style = androidx.compose.material3.MaterialTheme.typography.titleMedium
-        )
-        Text(
-            text = description,
-            style = androidx.compose.material3.MaterialTheme.typography.bodySmall,
-            color = Color.Gray,
-            modifier = Modifier.padding(top = 4.dp)
-        )
-    }
-}

package/.claude/momo-native-kits-skill/workspace/iteration-3/eval-navcontainer/with_skill/timing.json

@@ -1,5 +0,0 @@
-{
-  "total_tokens": 24618,
-  "duration_ms": 138670,
-  "total_duration_seconds": 138.7
-}