@momo-kits/native-kits 0.152.4-beta.3 → 0.152.5

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

@@ -1,105 +0,0 @@
-package vn.momo.kits.platform
-
-import android.annotation.SuppressLint
-import android.content.res.Resources
-import android.graphics.BlurMaskFilter
-import android.graphics.PorterDuff
-import android.graphics.PorterDuffColorFilter
-import android.os.Build
-import androidx.compose.foundation.layout.Box
-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.NativePaint
-import androidx.compose.ui.graphics.toArgb
-import androidx.compose.ui.platform.LocalConfiguration
-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.rememberLottieComposition
-import com.airbnb.lottie.compose.rememberLottieDynamicProperties
-import com.airbnb.lottie.compose.rememberLottieDynamicProperty
-import vn.momo.kits.const.AppNavigationBar
-import vn.momo.kits.const.AppStatusBar
-import vn.momo.kits.utils.readJson
-import androidx.activity.compose.BackHandler as AndroidBackHandler
-
-actual fun getPlatformName(): String = "Android"
-
-@Composable
-actual fun getScreenDimensions(): ScreenDimension {
-    val config = LocalConfiguration.current
-    return ScreenDimension(
-        config.screenWidthDp, config.screenHeightDp
-    )
-}
-
-actual fun NativePaint.setMaskFilter(blurRadius: Float) {
-    this.maskFilter = BlurMaskFilter(blurRadius, BlurMaskFilter.Blur.NORMAL)
-}
-
-@SuppressLint("InternalInsetResource")
-@Composable
-actual fun getStatusBarHeight(): Dp {
-    val resourceId = Resources.getSystem().getIdentifier(
-        "status_bar_height",
-        "dimen",
-        "android"
-    )
-    return if(resourceId > 0) Resources.getSystem().getDimensionPixelSize(resourceId).dp else 0.dp
-}
-
-@Composable
-actual fun BackHandler(enabled: Boolean, onBack: () -> Unit) {
-    AndroidBackHandler(enabled = enabled, onBack = onBack)
-}
-
-@Composable
-actual fun getScreenHeight(): Dp {
-    return getScreenDimensions().height.dp + if (getAndroidBuildVersion() >= 35) 0.dp else AppStatusBar.current + AppNavigationBar.current
-}
-
-actual fun getAndroidBuildVersion(): Int = Build.VERSION.SDK_INT
-
-@Composable
-actual fun LottieAnimation(
-    path: String,
-    tintColor: Color?,
-    bgColor: Color?,
-    modifier: Modifier
-) {
-    val json = readJson(path)
-
-    if (json.isEmpty()) {
-        Box(modifier)
-        return
-    }
-
-    val composition by rememberLottieComposition(
-        LottieCompositionSpec.JsonString(json)
-    )
-
-    val colorFilter = PorterDuffColorFilter(
-        tintColor?.toArgb() ?: Color.White.toArgb(),
-        PorterDuff.Mode.SRC_ATOP
-    )
-
-    val dynamicProperties = rememberLottieDynamicProperties(
-        rememberLottieDynamicProperty(
-            property = LottieProperty.COLOR_FILTER,
-            value = colorFilter,
-            keyPath = arrayOf("**")
-        )
-    )
-
-    LottieAnimation(
-        composition = composition,
-        iterations = LottieConstants.IterateForever,
-        dynamicProperties = if (tintColor != null) dynamicProperties else null,
-        modifier = modifier
-    )
-}

package/compose/src/commonMain/composeResources/files/lottie_circle_loader.json

@@ -1 +0,0 @@
-{"v":"5.10.2","fr":30,"ip":0,"op":20,"w":100,"h":100,"nm":"Spinner3.1_Refine","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":12,"ty":4,"nm":"loading 2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":0,"s":[0],"e":[360]},{"t":20}],"ix":10},"p":{"a":0,"k":[50,50,0],"ix":2,"l":2},"a":{"a":0,"k":[44.124,44.124,0],"ix":1,"l":2},"s":{"a":0,"k":[100,100,100],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[90,90],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"st","c":{"a":0,"k":[0.996078431373,0.956862745098,0.980392156863,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":9,"ix":5},"lc":2,"lj":1,"ml":4,"bm":0,"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"tr","p":{"a":0,"k":[44.124,44.124],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Ellipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"tm","s":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.167],"y":[0.167]},"t":0,"s":[0],"e":[20]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.333],"y":[0]},"t":10,"s":[20],"e":[0]},{"t":20}],"ix":1},"e":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.167],"y":[0.167]},"t":0,"s":[35],"e":[50]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.333],"y":[0]},"t":10,"s":[50],"e":[35]},{"t":20}],"ix":2},"o":{"a":0,"k":0,"ix":3},"m":1,"ix":2,"nm":"Trim Paths 1","mn":"ADBE Vector Filter - Trim","hd":false}],"ip":0,"op":20,"st":0,"ct":1,"bm":0},{"ddd":0,"ind":13,"ty":4,"nm":"loading 3","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":2,"s":[0],"e":[360]},{"t":20}],"ix":10},"p":{"a":0,"k":[50,50,0],"ix":2,"l":2},"a":{"a":0,"k":[44.124,44.124,0],"ix":1,"l":2},"s":{"a":0,"k":[100,100,100],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[90,90],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"st","c":{"a":0,"k":[0.98431372549,0.835294117647,0.917647058824,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":9,"ix":5},"lc":2,"lj":1,"ml":4,"bm":0,"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"tr","p":{"a":0,"k":[44.124,44.124],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Ellipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"tm","s":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.167],"y":[0.167]},"t":2,"s":[0],"e":[20]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.333],"y":[0]},"t":12,"s":[20],"e":[0]},{"t":20}],"ix":1},"e":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.167],"y":[0.167]},"t":2,"s":[35],"e":[50]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.333],"y":[0]},"t":12,"s":[50],"e":[35]},{"t":20}],"ix":2},"o":{"a":0,"k":0,"ix":3},"m":1,"ix":2,"nm":"Trim Paths 1","mn":"ADBE Vector Filter - Trim","hd":false}],"ip":0,"op":20,"st":0,"ct":1,"bm":0},{"ddd":0,"ind":14,"ty":4,"nm":"base pink 2","sr":1,"ks":{"o":{"a":0,"k":40,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[50,50,0],"ix":2,"l":2},"a":{"a":0,"k":[44.124,44.124,0],"ix":1,"l":2},"s":{"a":0,"k":[100,100,100],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[90,90],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"st","c":{"a":0,"k":[0.996078431373,0.972549019608,0.988235294118,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":9,"ix":5},"lc":1,"lj":1,"ml":4,"bm":0,"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"tr","p":{"a":0,"k":[44.124,44.124],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Ellipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":20,"st":0,"ct":1,"bm":0}],"markers":[]}

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

@@ -1,57 +0,0 @@
-package vn.momo.kits.application
-
-import androidx.compose.foundation.background
-import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.offset
-import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.width
-import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.unit.dp
-import androidx.compose.ui.zIndex
-import vn.momo.kits.components.InputSearch
-import vn.momo.kits.components.InputSearchProps
-import vn.momo.kits.const.Radius
-import vn.momo.kits.const.Spacing
-
-@Composable
-fun AnimationSearchInput(
-    animations: HeaderAnimations,
-    inputSearchProps: InputSearchProps
-) {
-    Box(
-        modifier = Modifier
-            .fillMaxWidth()
-            .offset(
-                x = animations.translateX.dp,
-                y = animations.translateY.dp
-            )
-    ) {
-        Box(
-            modifier = Modifier
-                .height(HEADER_HEIGHT.dp)
-                .padding(vertical = Spacing.S)
-                .zIndex(1f)
-        ) {
-            Box(
-                modifier = Modifier
-                    .width(animations.width.dp)
-                    .background(
-                        color = animations.backgroundSearch,
-                        shape = RoundedCornerShape(Radius.XL)
-                    )
-            ) {
-                InputSearch(
-                    inputSearchProps = inputSearchProps.copy(
-                        showButtonText = false,
-                        backgroundColor = Color.Transparent
-                    )
-                )
-            }
-        }
-    }
-}

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

@@ -1,201 +0,0 @@
-package vn.momo.kits.application
-
-import androidx.compose.animation.AnimatedVisibility
-import androidx.compose.animation.core.CubicBezierEasing
-import androidx.compose.animation.core.animateDpAsState
-import androidx.compose.animation.core.tween
-import androidx.compose.animation.expandHorizontally
-import androidx.compose.animation.fadeIn
-import androidx.compose.animation.fadeOut
-import androidx.compose.animation.shrinkHorizontally
-import androidx.compose.foundation.ScrollState
-import androidx.compose.foundation.background
-import androidx.compose.foundation.interaction.MutableInteractionSource
-import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.offset
-import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.sizeIn
-import androidx.compose.foundation.layout.width
-import androidx.compose.material3.AlertDialogDefaults.shape
-import androidx.compose.material3.FloatingActionButton
-import androidx.compose.material3.FloatingActionButtonDefaults
-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.rememberCoroutineScope
-import androidx.compose.runtime.saveable.rememberSaveable
-import androidx.compose.runtime.setValue
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.unit.Dp
-import androidx.compose.ui.unit.dp
-import androidx.compose.ui.zIndex
-import kotlinx.coroutines.delay
-import kotlinx.coroutines.flow.MutableStateFlow
-import kotlinx.coroutines.flow.collectLatest
-import kotlinx.coroutines.launch
-import vn.momo.kits.components.Icon
-import vn.momo.kits.components.Text
-import vn.momo.kits.const.Typography
-
-enum class FABSize {
-    SMALL,
-    DEFAULT,
-}
-
-enum class FABPosition {
-    END,
-    CENTER,
-}
-
-data class FabProps(
-    val icon: String,
-    val iconColor: Color? = null,
-    val label: String? = null,
-    val onClick: () -> Unit,
-    val size: FABSize = FABSize.DEFAULT,
-    val bottom: Dp? = null,
-    val scrollState: ScrollState? = null,
-    val position: FABPosition? = FABPosition.END,
-)
-
-@Deprecated("Use vn.momo.kits.navigation.FloatingButton instead", ReplaceWith("vn.momo.kits.navigation.FloatingButton"))
-@Composable
-fun FloatingButton(
-    scrollPosition: Int,
-    bottom: Dp,
-    onClick: () -> Unit,
-    containerColor: Color,
-    contentColor: Color = containerColor,
-    icon: String,
-    iconColor: Color? = null,
-    text: String? = null,
-    elevation: androidx.compose.material3.FloatingActionButtonElevation = FloatingActionButtonDefaults.elevation(
-        4.dp,
-        4.dp,
-        4.dp,
-        4.dp
-    ),
-    size: FABSize = FABSize.DEFAULT,
-    position: FABPosition = FABPosition.END,
-    keyboardSize: Dp = 0.dp,
-) {
-    val scrollPositionStateFlow = remember { MutableStateFlow(scrollPosition) }
-    var lastScrollPosition by rememberSaveable { mutableStateOf(0) }
-    val coroutineScope = rememberCoroutineScope()
-    var isExpanded by rememberSaveable { mutableStateOf(false) }
-
-    val startPadding = if (isExpanded) 12.dp else 0.dp
-    val endPadding = if (isExpanded) 12.dp else 0.dp
-    val widthIn = if ((size === FABSize.SMALL)) 36.dp else 48.dp
-
-
-    val width = animateDpAsState(
-        targetValue = if (isExpanded && text != null) 80.dp else widthIn,
-        animationSpec = tween(
-            durationMillis = 200,
-            easing = CubicBezierEasing(0.2f, 0.2f, 0.2f, 0.2f),
-        )
-    )
-
-    LaunchedEffect(text) {
-        if (text != null) {
-            coroutineScope.launch {
-                scrollPositionStateFlow
-                    .collectLatest { debouncedScrollPosition ->
-                        isExpanded = debouncedScrollPosition > lastScrollPosition
-                        delay(300)
-                        lastScrollPosition = debouncedScrollPosition
-
-                    }
-            }
-        }
-    }
-
-    LaunchedEffect(scrollPosition) {
-        scrollPositionStateFlow.value = scrollPosition
-    }
-
-    Box(
-        Modifier
-            .fillMaxSize()
-            .padding(end = 12.dp, bottom = bottom)
-            .offset(y = -keyboardSize)
-            .background(Color.Transparent)
-            .zIndex(10f),
-        contentAlignment = if (position == FABPosition.END) Alignment.BottomEnd else Alignment.BottomCenter,
-    ) {
-        FloatingActionButton(
-            onClick = onClick,
-            shape = shape,
-            containerColor = containerColor,
-            contentColor = contentColor,
-            elevation = elevation,
-            interactionSource = remember { MutableInteractionSource() },
-            modifier = Modifier
-                .sizeIn(minWidth = width.value)
-                .height(widthIn)
-        ) {
-            Row(
-                modifier = Modifier.padding(start = startPadding, end = endPadding),
-                verticalAlignment = Alignment.CenterVertically,
-                horizontalArrangement = if (isExpanded) Arrangement.Start else Arrangement.Center
-            ) {
-                Icon(
-                    icon,
-                    size = if (size === FABSize.SMALL) 12.dp else 24.dp,
-                    color = iconColor ?: Color.White
-                )
-                AnimatedVisibility(
-                    visible = isExpanded,
-                    enter = ExtendedFabExpandAnimation,
-                    exit = ExtendedFabCollapseAnimation,
-                ) {
-                    Row {
-                        Spacer(Modifier.width(12.dp))
-                        Text(
-                            text ?: "",
-                            color = Color.White,
-                            style = Typography.actionDefaultBold
-                        )
-                    }
-                }
-            }
-        }
-    }
-}
-
-private val ExtendedFabCollapseAnimation = fadeOut(
-    animationSpec = tween(
-        durationMillis = 800,
-        easing = CubicBezierEasing(0.0f, 0.0f, 1.0f, 1.0f),
-    )
-) + shrinkHorizontally(
-    animationSpec = tween(
-        durationMillis = 500,
-        easing = CubicBezierEasing(0.2f, 0.0f, 0.0f, 1.0f),
-    ),
-    shrinkTowards = Alignment.Start,
-)
-
-private val ExtendedFabExpandAnimation = fadeIn(
-    animationSpec = tween(
-        durationMillis = 200,
-        delayMillis = 100,
-        easing = CubicBezierEasing(0.0f, 0.0f, 1.0f, 1.0f),
-    ),
-) + expandHorizontally(
-    animationSpec = tween(
-        durationMillis = 500,
-        easing = CubicBezierEasing(0.2f, 0.0f, 0.0f, 1.0f),
-    ),
-    expandFrom = Alignment.Start,
-)

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

@@ -1,222 +0,0 @@
-package vn.momo.kits.application
-
-import androidx.compose.animation.core.animateFloatAsState
-import androidx.compose.foundation.background
-import androidx.compose.foundation.border
-import androidx.compose.foundation.clickable
-import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.BoxWithConstraints
-import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.size
-import androidx.compose.foundation.layout.width
-import androidx.compose.foundation.shape.RoundedCornerShape
-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.runtime.snapshotFlow
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.graphics.graphicsLayer
-import androidx.compose.ui.text.style.TextAlign
-import androidx.compose.ui.unit.Dp
-import androidx.compose.ui.unit.dp
-import androidx.compose.ui.zIndex
-import kotlinx.coroutines.flow.distinctUntilChanged
-import kotlinx.coroutines.flow.map
-import vn.momo.kits.components.Icon
-import vn.momo.kits.components.InputSearch
-import vn.momo.kits.components.InputSearchProps
-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.modifier.setAutomationId
-import vn.momo.kits.utils.getAppStatusBarHeight
-
-data class HeaderColor(val tintIconColor: Color, val backgroundButton: Color, val borderColor: Color)
-fun getHeaderColor(animatedHeader: AnimatedHeader?, opacity: Float, tintColor: Color?, defaultColor: Color): HeaderColor{
-    return if(animatedHeader !== null)
-        if (opacity == 1f || !animatedHeader.isSurface)
-            HeaderColor(
-                tintIconColor = Colors.black_17,
-                backgroundButton = Colors.black_01.copy(alpha = 0.6f),
-                borderColor = Colors.black_20.copy(alpha = 0.2f)
-            )
-        else
-            HeaderColor(
-                tintIconColor = Colors.black_01,
-                backgroundButton = Colors.black_20.copy(alpha = 0.6f),
-                borderColor = Color.Transparent
-            )
-    else
-        if (tintColor == Colors.black_01)
-            HeaderColor(
-                tintIconColor = tintColor,
-                backgroundButton = Colors.black_20.copy(alpha = 0.6f),
-                borderColor = Colors.black_01.copy(alpha = 0.2f)
-            )
-        else
-            HeaderColor(
-                tintIconColor = tintColor ?: defaultColor,
-                backgroundButton = Colors.black_01.copy(alpha = 0.6f),
-                borderColor = Colors.black_20.copy(alpha = 0.2f)
-            )
-}
-
-@Deprecated("Use vn.momo.kits.navigation.component.Header instead", ReplaceWith("vn.momo.kits.navigation.component.Header"))
-@Composable
-fun Header(
-    headerType: HeaderType = HeaderType.DEFAULT,
-    titlePosition: TitlePosition,
-    title: String,
-    headerRight: @Composable (() -> Unit)? = null,
-    goBack: (() -> Unit)? = null,
-    opacity: Float = 1f,
-    animatedHeader: AnimatedHeader? = null,
-    scrollState: Int = 0,
-    inputSearchProps: InputSearchProps? = null,
-    headerRightWidth: Dp = 0.dp,
-    useAnimationSearch: Boolean = false,
-    tintColor: Color? = null
-) {
-    val statusBarHeight = getAppStatusBarHeight()
-    val color = getHeaderColor(animatedHeader, opacity, tintColor, AppTheme.current.colors.text.default)
-    val tintIconColor = color.tintIconColor
-    val backgroundButton = color.backgroundButton
-    val borderColor = color.borderColor
-
-    var colorFraction by remember { mutableStateOf(0f) }
-
-    LaunchedEffect(scrollState) {
-        snapshotFlow { scrollState }
-            .map { (it / 50f).coerceIn(0f, 1f) }
-            .distinctUntilChanged()
-            .collect { fraction -> colorFraction = fraction }
-    }
-    val animations = useHeaderSearchAnimation(
-        opacityAni = opacity,
-        scrollState = scrollState,
-        headerRightWidth = headerRightWidth,
-        isBack = goBack != null
-    )
-
-    val backgroundSearch = animateColor(
-        Colors.black_01,
-        AppTheme.current.colors.background.default,
-        colorFraction
-    )
-
-    val searchAnimationEnable =
-        inputSearchProps != null && useAnimationSearch && headerType == HeaderType.EXTENDED
-    val animatedAlpha by animateFloatAsState(targetValue = opacity, label = "BackgroundAlpha")
-
-    if (headerType != HeaderType.NONE) {
-        BoxWithConstraints(
-            Modifier.height(statusBarHeight + HEADER_HEIGHT.dp)
-                .fillMaxWidth()
-                .conditional(animatedHeader !== null) { background(Color.White.copy(alpha = animatedAlpha)) }
-                .zIndex(10f),
-            contentAlignment = Alignment.BottomCenter
-        ) {
-            Row(
-                modifier = Modifier.height(HEADER_HEIGHT.dp)
-                    .fillMaxWidth()
-                    .padding(horizontal = Spacing.M),
-                verticalAlignment = Alignment.CenterVertically,
-                horizontalArrangement = Arrangement.SpaceBetween
-            ) {
-                Box {
-                    if (goBack != null) {
-                        Box(
-                            modifier = Modifier
-                                .size(28.dp)
-                                .then(
-                                    Modifier.border(
-                                        0.2.dp,
-                                        borderColor,
-                                        RoundedCornerShape(100)
-                                    )
-                                )
-                                .background(
-                                    backgroundButton,
-                                    RoundedCornerShape(100)
-                                )
-                                .clickable(
-                                    onClick = goBack
-                                )
-                                .padding(Spacing.XS)
-                                .setAutomationId("btn_navigation_back"),
-                            contentAlignment = Alignment.Center
-                        ) {
-                            Icon(
-                                source = "arrow-back",
-                                color = tintIconColor,
-                                size = 20.dp,
-                            )
-                        }
-                    }
-                }
-
-                if (useAnimationSearch || inputSearchProps == null) {
-                    if(headerRight == null){
-                        HeaderRight(opacity = opacity, animatedHeader = animatedHeader, tintColor = tintColor)
-                    } else {
-                        headerRight.invoke()
-                    }
-                }
-            }
-
-            // Title
-            Row(
-                modifier = Modifier.height(HEADER_HEIGHT.dp)
-                    .fillMaxWidth()
-                    .padding(horizontal = Spacing.M),
-                verticalAlignment = Alignment.CenterVertically,
-            ) {
-                if (goBack != null && titlePosition == TitlePosition.LEFT) {
-                    Spacer(Modifier.width(40.dp))
-                }
-                if (inputSearchProps != null && !useAnimationSearch) {
-                    InputSearch(inputSearchProps = inputSearchProps.copy(backgroundColor = backgroundSearch))
-                } else {
-                    Box(
-                        Modifier.weight(1f).graphicsLayer {
-                            alpha = if (useAnimationSearch) {
-                                1f - (opacity)
-                            } else {
-                                1f
-                            }
-                        },
-                        contentAlignment = if (titlePosition == TitlePosition.LEFT) Alignment.TopStart else Alignment.Center
-                    ) {
-                        HeaderTitle(
-                            title = title,
-                            color = tintIconColor,
-                            modifier = Modifier
-                                .setAutomationId("title_navigation_header")
-                                .fillMaxWidth(fraction = if(titlePosition == TitlePosition.LEFT) 0.7f else 0.5f)
-                            ,
-                            textAlign = if(titlePosition == TitlePosition.LEFT) TextAlign.Start else TextAlign.Center
-                        )
-                    }
-                }
-            }
-
-            if (searchAnimationEnable) {
-                AnimationSearchInput(
-                    animations = animations,
-                    inputSearchProps = inputSearchProps!!
-                )
-            }
-        }
-    }
-}