@momo-kits/native-kits 0.160.1-beta.16-debug → 0.160.1-beta.17-debug

package/compose/build.gradle.kts

@@ -40,7 +40,7 @@ kotlin {
     }
 
     cocoapods {
-        version = "0.160.1-beta.16-debug"
+        version = "0.160.1-beta.17-debug"
         summary = "IOS Shared module"
         homepage = "https://momo.vn"
         ios.deploymentTarget = "15.0"
@@ -73,6 +73,9 @@ kotlin {
             implementation(libs.jetbrains.serialization.json)
             implementation(libs.kotlinx.datetime)
             api(libs.native.max.api)
+            // AI-GENERATED START: compottie multiplatform lottie engine for LottieEngine.Compose
+            implementation(libs.compottie)
+            // AI-GENERATED END: compottie multiplatform lottie engine for LottieEngine.Compose
         }
         androidMain.dependencies {
             implementation(libs.ktor.client.okhttp)

package/compose/build.gradle.kts.backup

@@ -73,6 +73,9 @@ kotlin {
             implementation(libs.jetbrains.serialization.json)
             implementation(libs.kotlinx.datetime)
             api(libs.native.max.api)
+            // AI-GENERATED START: compottie multiplatform lottie engine for LottieEngine.Compose
+            implementation(libs.compottie)
+            // AI-GENERATED END: compottie multiplatform lottie engine for LottieEngine.Compose
         }
         androidMain.dependencies {
             implementation(libs.ktor.client.okhttp)

package/compose/compose.podspec

@@ -1,6 +1,6 @@
 Pod::Spec.new do |spec|
     spec.name                     = 'compose'
-    spec.version                  = '0.159.1-beta.12'
+    spec.version                  = '0.159.1-beta.16'
     spec.homepage                 = 'https://momo.vn'
     spec.source                   = { :http=> ''}
     spec.authors                  = ''

package/compose/src/androidMain/kotlin/vn/momo/kits/platform/Platform.android.kt

@@ -14,13 +14,14 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.NativePaint
 import androidx.compose.ui.graphics.toArgb
 import androidx.compose.ui.platform.LocalConfiguration
+import androidx.compose.ui.semantics.contentDescription
+import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 import com.airbnb.lottie.LottieProperty
 import com.airbnb.lottie.compose.LottieAnimation
 import com.airbnb.lottie.compose.LottieCompositionSpec
 import com.airbnb.lottie.compose.LottieConstants
-import com.airbnb.lottie.compose.animateLottieCompositionAsState
 import com.airbnb.lottie.compose.rememberLottieComposition
 import com.airbnb.lottie.compose.rememberLottieDynamicProperties
 import com.airbnb.lottie.compose.rememberLottieDynamicProperty
@@ -77,9 +78,16 @@ actual fun LottieAnimation(
     tintColor: Color?,
     bgColor: Color?,
     placedAsOverlay: Boolean,
-    isPlaying: Boolean,
+    useCompose: Boolean,
     modifier: Modifier
 ) {
+    // AI-GENERATED START: dispatch to Compottie renderer when useCompose
+    if (useCompose) {
+        ComposeLottieAnimation(path, tintColor, bgColor, placedAsOverlay, modifier)
+        return
+    }
+    // AI-GENERATED END: dispatch to Compottie renderer when useCompose
+
     val json = readJson(path)
 
     if (json.isEmpty()) {
@@ -91,13 +99,6 @@ actual fun LottieAnimation(
         LottieCompositionSpec.JsonString(json)
     )
 
-    val progress by animateLottieCompositionAsState(
-        composition = composition,
-        iterations = LottieConstants.IterateForever,
-        isPlaying = isPlaying,
-        restartOnPlay = false,
-    )
-
     val colorFilter = PorterDuffColorFilter(
         tintColor?.toArgb() ?: Color.White.toArgb(),
         PorterDuff.Mode.SRC_ATOP
@@ -113,7 +114,7 @@ actual fun LottieAnimation(
 
     LottieAnimation(
         composition = composition,
-        progress = { progress },
+        iterations = LottieConstants.IterateForever,
         dynamicProperties = if (tintColor != null) dynamicProperties else null,
         modifier = modifier
     )

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

@@ -97,7 +97,6 @@ fun Screen(
     inputSearchProps: InputSearchProps? = null,
     useAnimationSearch: Boolean = false,
     headerRightWidth: Dp = 0.dp,
-    usePlaceAsOverlay: Boolean = false,
     content: @Composable () -> Unit,
 ) {
     val statusBarHeight = getAppStatusBarHeight()
@@ -173,7 +172,7 @@ fun Screen(
                 Column(
                     modifier = Modifier.fillMaxSize()
                         .padding( top = when {
-                            animatedHeader != null && !usePlaceAsOverlay -> 0.dp
+                            animatedHeader != null -> 0.dp
                             headerType == HeaderType.NONE -> 0.dp
                             fullScreenContent -> 0.dp
                             else -> statusBarHeight + HEADER_HEIGHT.dp
@@ -197,10 +196,10 @@ fun Screen(
                         horizontalAlignment = horizontalAlignment
                     ) {
                         Box {
-                            if (!usePlaceAsOverlay && animatedHeader !== null) headerAnimated()
+                            if (animatedHeader !== null) headerAnimated()
                             Column {
                                 if (animatedHeader !== null) {
-                                    Spacer(modifier = Modifier.padding(top = if (usePlaceAsOverlay) layoutOffset else statusBarHeight + HEADER_HEIGHT.dp + layoutOffset))
+                                    Spacer(modifier = Modifier.padding(top = statusBarHeight + HEADER_HEIGHT.dp + layoutOffset))
                                 }
 
                                 if (useAnimationSearch && inputSearchProps != null && headerType == HeaderType.EXTENDED) {
@@ -218,16 +217,6 @@ fun Screen(
                 }
             }
 
-            if (animatedHeader !== null && usePlaceAsOverlay) {
-                Box(
-                    modifier = Modifier
-                        .fillMaxWidth()
-                        .zIndex(1.5f)
-                ) {
-                    headerAnimated()
-                }
-            }
-
             Box(Modifier.zIndex(4f).align(Alignment.BottomCenter)) {
                 footer?.let {
                     Footer(
@@ -351,7 +340,7 @@ fun ScreenSnackBarHost(footerHeightPx: Int) {
     val navigationBar = AppNavigationBar.current
 
     val footerHeight = if (footerHeightPx > 0) {
-        footerHeightPx
+            footerHeightPx
     } else {
         with(density) {
             navigationBar.toPx()
@@ -406,4 +395,9 @@ fun ScreenSnackBarHost(footerHeightPx: Int) {
             is SnackBar.Toast -> {}
         }
     }
-}
+}
+
+
+
+
+

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

@@ -174,10 +174,6 @@ internal fun StackScreen(
                 HeaderBackground()
             }
 
-            Box(Modifier.zIndex(1.5f)) {
-                AnimatedHeaderImage()
-            }
-
             Box(Modifier.zIndex(5f)) {
                 Header(onBackHandler)
             }
@@ -235,10 +231,9 @@ fun ColumnScope.MainContent(content: @Composable ()-> Unit){
     val scrollState = LocalScrollState.current
 
     Spacer(Modifier.height(
-        if (options.headerType is HeaderType.DefaultOrExtended || (options.headerType is HeaderType.Transparent && !options.headerType.isFullScreenContent) || options.headerType is HeaderType.Animated)
+        if (options.headerType is HeaderType.DefaultOrExtended || (options.headerType is HeaderType.Transparent && !options.headerType.isFullScreenContent))
             AppStatusBar.current + HEADER_HEIGHT.dp else 0.dp)
     )
-
     if (inputSearchType == InputSearchType.Animated){
         val scrollDp = with(density) { scrollState.value.toDp() }
 
@@ -267,37 +262,24 @@ fun ColumnScope.MainContent(content: @Composable ()-> Unit){
 
 @Composable
 fun ScreenContent(content: @Composable () -> Unit){
+    val scrollState = LocalScrollState.current
     val options = LocalOptions.current
 
     if (options.headerType is HeaderType.Animated){
         val animatedHeader = options.headerType
-        Column {
-            Spacer(Modifier.height(animatedHeader.layoutOffSet))
-            content()
+        Box {
+            Box(Modifier.fillMaxWidth().aspectRatio(animatedHeader.aspectRatio.value)){
+                animatedHeader.composable.invoke(scrollState.value)
+            }
+            Box(Modifier.offset(x = 0.dp, y = AppStatusBar.current + HEADER_HEIGHT.dp + animatedHeader.layoutOffSet)){
+                content()
+            }
         }
     } else {
         content()
     }
 }
 
-@Composable
-fun AnimatedHeaderImage() {
-    val options = LocalOptions.current
-    val scrollState = LocalScrollState.current
-    val animatedHeader = options.headerType as? HeaderType.Animated ?: return
-    val density = LocalDensity.current
-    val scrollDp = with(density) { scrollState.value.toDp() }
-
-    Box(
-        Modifier
-            .fillMaxWidth()
-            .offset(y = -scrollDp)
-            .aspectRatio(animatedHeader.aspectRatio.value)
-    ) {
-        animatedHeader.composable.invoke(scrollState.value)
-    }
-}
-
 @Composable
 fun FooterContent(){
     val options = LocalOptions.current

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

@@ -230,10 +230,6 @@ sealed class HeaderType {
 
     data object None : HeaderType()
 
-    data class Transparent(
-        val isFullScreenContent: Boolean = false
-    ) : HeaderType()
-
     data class Animated(
         val aspectRatio: AnimatedHeaderRatio = AnimatedHeaderRatio.RATIO_16_9,
         val isSurface: Boolean = true,
@@ -241,6 +237,9 @@ sealed class HeaderType {
         val composable: @Composable (scrollState: Int) -> Unit = {}
     ) : HeaderType()
 
+    data class Transparent(
+        val isFullScreenContent: Boolean = false
+    ) : HeaderType()
 }
 
 data class HeaderBackProps(

package/compose/src/commonMain/kotlin/vn/momo/kits/platform/ComposeLottieAnimation.kt

@@ -0,0 +1,57 @@
+/*
+File: compose/src/commonMain/kotlin/vn/momo/kits/platform/ComposeLottieAnimation.kt
+Created At: 2026-05-25 11:30:00 +07:00
+Created By: AI
+AI Agent: Claude Code
+Model: claude-opus-4-7
+*/
+package vn.momo.kits.platform
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.ColorFilter
+import io.github.alexzhirkevich.compottie.Compottie
+import io.github.alexzhirkevich.compottie.LottieCompositionSpec
+import io.github.alexzhirkevich.compottie.rememberLottieComposition
+import io.github.alexzhirkevich.compottie.rememberLottiePainter
+import vn.momo.kits.utils.readJson
+
+// AI-GENERATED START: internal compottie renderer used when LottieEngine.Compose is selected
+@Composable
+internal fun ComposeLottieAnimation(
+    path: String,
+    tintColor: Color?,
+    bgColor: Color?,
+    @Suppress("UNUSED_PARAMETER") placedAsOverlay: Boolean,
+    modifier: Modifier,
+) {
+    val json = readJson(path)
+
+    if (json.isEmpty()) {
+        Box(modifier.background(bgColor ?: Color.Transparent))
+        return
+    }
+
+    val composition by rememberLottieComposition {
+        LottieCompositionSpec.JsonString(json)
+    }
+
+    Box(modifier.background(bgColor ?: Color.Transparent)) {
+        Image(
+            painter = rememberLottiePainter(
+                composition = composition,
+                iterations = Compottie.IterateForever,
+            ),
+            contentDescription = null,
+            colorFilter = tintColor?.let { ColorFilter.tint(it) },
+            modifier = Modifier.fillMaxSize(),
+        )
+    }
+}
+// AI-GENERATED END: internal compottie renderer used when LottieEngine.Compose is selected

package/compose/src/commonMain/kotlin/vn/momo/kits/platform/Platform.kt

@@ -44,15 +44,23 @@ fun supportsImePadding(): Boolean = when (val v = getOSVersion()) {
     is OSVersion.IOS -> true
 }
 
+// AI-GENERATED START: useCompose flag to switch between native and Compose (compottie) renderer
+/**
+ * @param useCompose when `true`, renders via the pure-Compose Compottie engine instead of the
+ * platform-native engine (airbnb-lottie on Android, lottie-ios on iOS). Defaults to `false` for
+ * backward compatibility. Note: `tintColor` becomes a single global `ColorFilter.tint` and
+ * `placedAsOverlay` is a no-op when `useCompose = true`.
+ */
 @Composable
 expect fun LottieAnimation(
     path: String,
     tintColor: Color? = null,
     bgColor: Color? = null,
     placedAsOverlay: Boolean = false,
-    isPlaying: Boolean = true,
+    useCompose: Boolean = false,
     modifier: Modifier = Modifier
 )
+// AI-GENERATED END: useCompose flag to switch between native and Compose (compottie) renderer
 
 expect fun NativePaint.setColor(
     color: Color = Color.Black

package/compose/src/iosMain/kotlin/vn/momo/kits/platform/Platform.ios.kt

@@ -19,18 +19,20 @@ import androidx.compose.ui.backhandler.LocalCompatNavigationEventDispatcherOwner
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.NativePaint
 import androidx.compose.ui.graphics.toArgb
+import androidx.compose.ui.semantics.SemanticsPropertyKey
+import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.viewinterop.UIKitInteropProperties
 import androidx.compose.ui.viewinterop.UIKitView
-import androidx.navigationevent.NavigationEventDispatcher
-import androidx.navigationevent.NavigationEventDispatcherOwner
 import cocoapods.lottie_ios.CompatibleAnimation
 import cocoapods.lottie_ios.CompatibleAnimationKeypath
 import cocoapods.lottie_ios.CompatibleAnimationView
 import kotlinx.cinterop.ExperimentalForeignApi
 import kotlinx.cinterop.get
 import kotlinx.cinterop.memScoped
+import androidx.navigationevent.NavigationEventDispatcher
+import androidx.navigationevent.NavigationEventDispatcherOwner
 import org.jetbrains.skia.FilterBlurMode
 import org.jetbrains.skia.MaskFilter
 import platform.Foundation.NSBundle
@@ -96,9 +98,16 @@ actual fun LottieAnimation(
     tintColor: Color?,
     bgColor: Color?,
     placedAsOverlay: Boolean,
-    isPlaying: Boolean,
+    useCompose: Boolean,
     modifier: Modifier
 ) {
+    // AI-GENERATED START: dispatch to Compottie renderer when useCompose
+    if (useCompose) {
+        ComposeLottieAnimation(path, tintColor, bgColor, placedAsOverlay, modifier)
+        return
+    }
+    // AI-GENERATED END: dispatch to Compottie renderer when useCompose
+
     var animation by remember { mutableStateOf<CompatibleAnimation?>(null) }
 
     LaunchedEffect(Unit) {
@@ -114,10 +123,7 @@ actual fun LottieAnimation(
             Box(modifier) {
                 UIKitView(
                     modifier = Modifier.fillMaxSize(),
-                    properties = UIKitInteropProperties(
-                        interactionMode = null,
-                        placedAsOverlay = placedAsOverlay,
-                    ),
+                    properties = UIKitInteropProperties(placedAsOverlay = placedAsOverlay),
                     factory = {
                         CompatibleAnimationView(value).apply {
                             translatesAutoresizingMaskIntoConstraints = true
@@ -138,7 +144,7 @@ actual fun LottieAnimation(
                                 setColorValue(uiColor, CompatibleAnimationKeypath("**.Stroke.Color"))
                             }
 
-                            if (isPlaying) play() else pause()
+                            play()
                         }
                     },
 
@@ -154,8 +160,6 @@ actual fun LottieAnimation(
                             view.setColorValue(uiColor, CompatibleAnimationKeypath("**.Stroke 1.Color"))
                             view.setColorValue(uiColor, CompatibleAnimationKeypath("**.Stroke.Color"))
                         }
-
-                        if (isPlaying) view.play() else view.pause()
                     }
                 )
             }

package/gradle/libs.versions.toml

@@ -13,6 +13,7 @@ androidGradlePlugin = "8.13.2"
 r8 = "8.9.35"
 kotlinx-datetime = "0.7.1"
 airbnb-lottie = "5.2.0"
+compottie = "2.0.0-rc04"
 androidx-activity = "1.9.1"
 androidx-appcompat = "1.7.0"
 material = "1.10.0"
@@ -38,6 +39,7 @@ coil-multiplatform-compose = { module = "io.coil-kt.coil3:coil-compose", version
 coil-multiplatform-network-ktor = { module = "io.coil-kt.coil3:coil-network-ktor3", version.ref = "coil3-multiplatform" }
 r8 = { module = "com.android.tools:r8", version.ref = "r8" }
 airbnb-lottie = { group = "com.airbnb.android", name = "lottie-compose", version.ref = "airbnb-lottie" }
+compottie = { module = "io.github.alexzhirkevich:compottie", version.ref = "compottie" }
 native-max-api = { group = "vn.momo.maxapi", name = "NativeMaxApi", version.ref = "nativemaxapi" }
 kits = { module = "vn.momo.kits:kits", version.ref = "kits" }
 androidx-appcompat = { module = "androidx.appcompat:appcompat", version.ref = "androidx-appcompat" }

package/gradle.properties

@@ -18,7 +18,7 @@ kotlin.apple.xcodeCompatibility.nowarn=true
 name="ComposeKits"
 group=vn.momo.kits
 artifact.id=kits
-version=0.160.1-beta.14
+version=0.159.1-beta.16
 
 repo=GitLab
 url=https://gitlab.mservice.com.vn/api/v4/projects/5400/packages/maven

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@momo-kits/native-kits",
-  "version": "0.160.1-beta.16-debug",
+  "version": "0.160.1-beta.17-debug",
   "private": false,
   "dependencies": {},
   "devDependencies": {},