@momo-kits/native-kits 0.168.1-beta.11-debug → 0.168.1-beta.13

package/compose/src/commonMain/kotlin/vn/momo/kits/components/LazyColumnWithBouncing.kt

@@ -1,343 +0,0 @@
-package vn.momo.kits.components
-
-import androidx.compose.animation.core.*
-import androidx.compose.foundation.Canvas
-import androidx.compose.foundation.OverscrollEffect
-import androidx.compose.foundation.background
-import androidx.compose.foundation.gestures.FlingBehavior
-import androidx.compose.foundation.gestures.ScrollableDefaults
-import androidx.compose.foundation.layout.*
-import androidx.compose.foundation.lazy.*
-import androidx.compose.material.ExperimentalMaterialApi
-import androidx.compose.material.pullrefresh.PullRefreshIndicator
-import androidx.compose.material.pullrefresh.pullRefresh
-import androidx.compose.material.pullrefresh.rememberPullRefreshState
-import androidx.compose.runtime.*
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.composed
-import androidx.compose.ui.geometry.CornerRadius
-import androidx.compose.ui.geometry.Offset
-import androidx.compose.ui.geometry.Size
-import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.graphics.drawscope.rotate
-import androidx.compose.ui.hapticfeedback.HapticFeedbackType
-import androidx.compose.ui.layout.Measurable
-import androidx.compose.ui.layout.MeasureResult
-import androidx.compose.ui.layout.MeasureScope
-import androidx.compose.ui.layout.layout
-import androidx.compose.ui.platform.LocalDensity
-import androidx.compose.ui.platform.LocalHapticFeedback
-import androidx.compose.ui.unit.Constraints
-import androidx.compose.ui.unit.IntOffset
-import androidx.compose.ui.unit.dp
-import kotlinx.coroutines.flow.collect
-import kotlinx.coroutines.flow.combine
-import kotlinx.coroutines.flow.distinctUntilChanged
-import vn.momo.kits.const.Spacing
-import vn.momo.kits.modifier.conditional
-import vn.momo.kits.platform.getPlatformName
-
-private const val BOX_KEY = "LazyColumnWithBouncing_BOX_KEY"
-
-
-@OptIn(ExperimentalMaterialApi::class)
-@Composable
-internal fun overScrollWithPullToRefresh(
-    pullRefreshState: PullToRefreshCustomState?,
-): OverscrollEffect {
-    val density = LocalDensity.current
-    val hapticFeedback = LocalHapticFeedback.current
-
-    return remember(density) {
-        CupertinoOverscrollEffect(
-            pullRefreshState = if (pullRefreshState != null && pullRefreshState.sendHaptic != null) pullRefreshState
-            else pullRefreshState?.copy(
-                sendHaptic = {
-                    hapticFeedback.performHapticFeedback(HapticFeedbackType.LongPress)
-                }),
-            density = density.density,
-            applyClip = false,
-        )
-    }
-}
-
-@OptIn(ExperimentalMaterialApi::class)
-@Composable
-fun LazyColumnWithBouncing(
-    modifier: Modifier = Modifier,
-    modifierIndicator: Modifier = Modifier,
-    state: LazyListState = rememberLazyListState(),
-    contentPadding: PaddingValues = PaddingValues(0.dp),
-    reverseLayout: Boolean = false,
-    verticalArrangement: Arrangement.Vertical = if (!reverseLayout) Arrangement.Top else Arrangement.Bottom,
-    horizontalAlignment: Alignment.Horizontal = Alignment.Start,
-    flingBehavior: FlingBehavior = ScrollableDefaults.flingBehavior(),
-    userScrollEnabled: Boolean = true,
-    pullRefreshState: PullToRefreshCustomState? = null,
-    content: LazyListScope.() -> Unit,
-) {
-    val height = remember { mutableIntStateOf(0) }
-    val maxConstraint = remember { mutableIntStateOf(0) }
-
-    LaunchedEffect(Unit) {
-        val addOn = 1
-        combine(
-            snapshotFlow { maxConstraint.value }.distinctUntilChanged(),
-            snapshotFlow { state.layoutInfo }
-        ) { cHeight, layoutInfo ->
-            height.value = when {
-                height.value == 0 && (state.canScrollForward || state.canScrollBackward) -> 0
-                layoutInfo.viewportSize.height >= cHeight && height.value == 0 -> 0
-                layoutInfo.visibleItemsInfo.lastOrNull()?.key != BOX_KEY -> 0
-                else -> {
-                    val vH = layoutInfo.totalHeight
-                    (cHeight - (vH - height.value) + addOn).coerceIn(0, cHeight)
-                }
-            }
-        }.collect()
-    }
-
-    val measureLayout =
-        remember<MeasureScope.(Measurable, Constraints) -> MeasureResult>(maxConstraint) {
-            { m, c ->
-                val p = m.measure(c.copy(minHeight = 0))
-                maxConstraint.value = c.maxHeight
-                layout(p.width, p.height) {
-                    p.place(IntOffset.Zero)
-                }
-            }
-        }
-
-    if (getPlatformName() == "iOS") {
-
-        val overscroll = overScrollWithPullToRefresh(
-            pullRefreshState = remember {
-                pullRefreshState
-            })
-
-        Box {
-            IosIndicator(
-                effect = overscroll,
-                modifier = modifierIndicator.align(Alignment.TopCenter).padding(top = Spacing.L).size(24.dp),
-            )
-            LazyColumn(
-                modifier = modifier
-                    .layout(measure = measureLayout),
-                state = state,
-                contentPadding = contentPadding,
-                flingBehavior = flingBehavior,
-                horizontalAlignment = horizontalAlignment,
-                verticalArrangement = verticalArrangement,
-                reverseLayout = reverseLayout,
-                userScrollEnabled = userScrollEnabled,
-                overscrollEffect = overscroll,
-            ) {
-                content()
-                item(key = BOX_KEY) {
-                    FakeBox(height)
-                }
-            }
-        }
-    } else {
-        val pullState = rememberPullRefreshState(
-            refreshing = pullRefreshState?.refreshingState?.value ?: false,
-            onRefresh = {
-                pullRefreshState?.onRefresh()
-            },
-        )
-
-        Box(
-            contentAlignment = Alignment.TopCenter,
-            modifier = Modifier.conditional(pullRefreshState != null) {
-                pullRefresh(pullState)
-            }) {
-            LazyColumn(
-                modifier = modifier.calculateHeight(height),
-                state = state,
-                contentPadding = contentPadding,
-                flingBehavior = flingBehavior,
-                horizontalAlignment = horizontalAlignment,
-                verticalArrangement = verticalArrangement,
-                reverseLayout = reverseLayout,
-                userScrollEnabled = userScrollEnabled,
-            ) {
-                content()
-            }
-            if (pullRefreshState != null) {
-                PullRefreshIndicator(
-                    pullRefreshState.refreshingState.value,
-                    pullState,
-                    modifierIndicator.align(Alignment.TopCenter)
-                )
-            }
-
-        }
-    }
-}
-
-@Composable
-private fun IosIndicator(
-    effect: OverscrollEffect?,
-    modifier: Modifier = Modifier,
-) {
-    if (effect !is CupertinoOverscrollEffect) return
-    if (effect.pullRefreshState == null) return
-    val state = effect.pullRefreshState
-
-
-    SpinningProgressBarLoading(
-        progress = state.position, modifier = modifier
-    )
-}
-
-@Composable
-private fun SpinningProgressBarLoading(
-    progress: State<Float>, modifier: Modifier = Modifier
-) {
-    if (progress.value <= 0) {
-        return
-    }
-
-    val hapticFeedback = LocalHapticFeedback.current
-    val isSendHaptic = remember { mutableStateOf(false) }
-
-    val totalStep = 8
-    val stepAngle = 360f / totalStep
-    val baseOpacity = 1.0f / (totalStep + 2)
-    val minAlpha = 0.2f
-
-    val infiniteTransition = rememberInfiniteTransition()
-    val angle = infiniteTransition.animateFloat(
-        initialValue = 0f, targetValue = totalStep.toFloat(), animationSpec = infiniteRepeatable(
-            animation = tween(totalStep * 100, easing = LinearEasing),
-            repeatMode = RepeatMode.Restart
-        )
-    )
-
-    LaunchedEffect(Unit) {
-        snapshotFlow { progress.value }.collect {
-            if (it >= 1.0f && !isSendHaptic.value) {
-                hapticFeedback.performHapticFeedback(HapticFeedbackType.LongPress)
-                isSendHaptic.value = true
-            } else if (progress.value < 1.0f && isSendHaptic.value) {
-                isSendHaptic.value = false
-            }
-        }
-
-    }
-
-    Canvas(modifier = modifier) {
-        val percentage = progress.value
-        val clampedProgress = percentage.coerceIn(0f, 1f)
-        val value = (totalStep * clampedProgress).coerceIn(0f, totalStep.toFloat())
-        val integerPart = value.toInt()
-        val decimalPart = value - integerPart
-
-        if (integerPart <= 0) return@Canvas
-
-        val canvasWidth = size.width
-        val canvasHeight = size.height
-        val width = size.width * 0.3f
-        val height = size.height / 8
-        val cornerRadius = (width.coerceAtMost(height) / 2)
-
-        if (percentage >= 1f) {
-            for (i in 0..360 step 360 / totalStep) {
-                rotate(i.toFloat()) {
-                    drawRoundRect(
-                        color = Color.LightGray.copy(alpha = .7f),
-                        topLeft = Offset(canvasWidth - width, (canvasHeight - height) / 2),
-                        size = Size(width, height),
-                        cornerRadius = CornerRadius(cornerRadius, cornerRadius)
-                    )
-                }
-            }
-
-            val coefficient = 360f / totalStep
-
-            for (i in 1..4) {
-                rotate((angle.value.toInt() + i) * coefficient) {
-                    drawRoundRect(
-                        color = Color.Gray.copy(alpha = (0.2f + 0.2f * i).coerceIn(0f, 1f)),
-                        topLeft = Offset(canvasWidth - width, (canvasHeight - height) / 2),
-                        size = Size(width, height),
-                        cornerRadius = CornerRadius(cornerRadius, cornerRadius)
-                    )
-                }
-            }
-            return@Canvas
-        }
-
-        val topLeft = Offset(canvasWidth - width, (canvasHeight - height) / 2)
-        val rectSize = Size(width, height)
-        val cornerRadiusValue = CornerRadius(cornerRadius, cornerRadius)
-        repeat(integerPart) { i ->
-            val angle = i * stepAngle - 90f
-            val stepOpacity = 1f - (baseOpacity * i)
-
-            val alpha = if (i == integerPart - 1) {
-                (decimalPart * stepOpacity).coerceIn(minAlpha, 1f)
-            } else {
-                stepOpacity.coerceIn(minAlpha, 1f)
-            }
-
-            rotate(angle) {
-                drawRoundRect(
-                    color = Color.Gray.copy(alpha = alpha),
-                    topLeft = topLeft,
-                    size = rectSize,
-                    cornerRadius = cornerRadiusValue
-                )
-            }
-        }
-    }
-}
-
-@Composable
-private fun FakeBox(height: MutableState<Int>) {
-    Box(
-        modifier = Modifier
-            .dynamicHeight(height).fillMaxWidth().background(Color.Red),
-    )
-}
-
-private fun Modifier.calculateHeight(
-    height: MutableState<Int>,
-) = this.layout { m, c ->
-    val p = m.measure(
-        constraints = c.copy(
-            minHeight = 0
-        )
-    )
-    val vH = p.height
-    val cMaxHeight = c.maxHeight
-    val addOn = 0.5.dp.roundToPx()
-    var extraSpace = addOn + height.value
-    if (height.value == 0) {
-        extraSpace = 0
-    }
-    if (vH - extraSpace >= cMaxHeight && height.value != 0) {
-        height.value = 0
-    } else if (vH - extraSpace < cMaxHeight) {
-        height.value = cMaxHeight - (vH - extraSpace) + addOn
-    }
-
-    layout(c.maxWidth, cMaxHeight) {
-        p.place(IntOffset.Zero)
-    }
-}
-
-
-private fun Modifier.dynamicHeight(height: MutableState<Int>) = composed {
-    val measure = remember<MeasureScope.(Measurable, Constraints) -> MeasureResult>(this, height) {
-        { m, c ->
-            val p = m.measure(c)
-            layout(c.maxWidth, height.value) { p.place(IntOffset.Zero) }
-        }
-    }
-    this.layout(measure = measure)
-}
-
-private val LazyListLayoutInfo.totalHeight: Int
-    get() = visibleItemsInfo.sumOf { it.size }

package/compose/src/commonMain/kotlin/vn/momo/kits/components/Loader.kt

@@ -1,108 +0,0 @@
-package vn.momo.kits.components
-
-import androidx.compose.animation.core.FastOutSlowInEasing
-import androidx.compose.animation.core.animateFloatAsState
-import androidx.compose.animation.core.tween
-import androidx.compose.foundation.background
-import androidx.compose.foundation.border
-import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.size
-import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.runtime.Composable
-import androidx.compose.runtime.getValue
-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.application.IsShowBaseLineDebug
-import vn.momo.kits.const.AppTheme
-import vn.momo.kits.const.Colors
-import vn.momo.kits.const.Radius
-import vn.momo.kits.modifier.conditional
-import vn.momo.kits.platform.LottieAnimation
-
-enum class LoaderType {
-    DOT, SPINNER
-}
-
-@Composable
-fun Loader(
-    type: LoaderType = LoaderType.DOT,
-    tintColor: Color? = null,
-    modifier: Modifier = Modifier
-) {
-    when (type) {
-        LoaderType.DOT -> DotLoader(tintColor = tintColor, modifier = modifier)
-        LoaderType.SPINNER -> SpinnerLoader(tintColor = tintColor, modifier = modifier)
-    }
-}
-
-@Composable
-fun DotLoader(
-    tintColor: Color? = null,
-    modifier: Modifier = Modifier
-) {
-    LottieAnimation(
-        path = "files/dot_loading",
-        tintColor = tintColor,
-        modifier = modifier
-            .size(width = 52.dp, height = 18.dp)
-            .conditional(IsShowBaseLineDebug) {
-                border(1.dp, Colors.blue_03)
-            }
-    )
-}
-
-@Composable
-fun SpinnerLoader(
-    tintColor: Color? = null,
-    modifier: Modifier = Modifier
-) {
-    LottieAnimation(
-        path = "files/lottie_circle_loader",
-        tintColor = tintColor,
-        modifier = modifier
-            .size(24.dp)
-            .conditional(IsShowBaseLineDebug) {
-                border(1.dp, Colors.blue_03)
-            }
-    )
-}
-
-@Composable
-fun ProgressBar(
-    percent: Float = 0f,
-    color: Color? = null,
-    modifier: Modifier = Modifier
-) {
-    val clampedPercent = percent.coerceIn(0f, 100f)
-    val animatedProgress by animateFloatAsState(
-        targetValue = clampedPercent / 100f,
-        animationSpec = tween(durationMillis = 200, easing = FastOutSlowInEasing),
-        label = "progressAnimation"
-    )
-
-    val trackColor = AppTheme.current.colors.background.default
-    val fillColor = color ?: AppTheme.current.colors.primary
-
-    Box(
-        modifier = modifier
-            .fillMaxWidth()
-            .height(4.dp)
-            .clip(RoundedCornerShape(Radius.XXS))
-            .background(trackColor)
-            .conditional(IsShowBaseLineDebug) {
-                border(1.dp, Colors.blue_03)
-            }
-    ) {
-        Box(
-            modifier = Modifier
-                .fillMaxWidth(animatedProgress)
-                .height(4.dp)
-                .clip(RoundedCornerShape(Radius.XXS))
-                .background(fillColor)
-        )
-    }
-}

package/compose/src/commonMain/kotlin/vn/momo/kits/components/PaginationDot.kt

@@ -1,56 +0,0 @@
-package vn.momo.kits.components
-
-import androidx.compose.foundation.background
-import androidx.compose.foundation.border
-import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.size
-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 vn.momo.kits.application.IsShowBaseLineDebug
-import vn.momo.kits.const.AppTheme
-import vn.momo.kits.const.Colors
-import vn.momo.kits.const.Spacing
-import vn.momo.kits.modifier.conditional
-
-@Composable
-internal fun Dot(active: Boolean = false, activeColor: Color, modifier: Modifier = Modifier) {
-    return if (active) {
-        Box(
-            modifier = modifier.size(width = 12.dp, height = 4.dp).background(
-                color = activeColor,
-                shape = RoundedCornerShape(4.dp)
-            )
-        )
-    } else {
-        Box(
-            modifier = modifier.size(4.dp)
-                .background(
-                    color = AppTheme.current.colors.background.pressed,
-                    shape = RoundedCornerShape(4.dp)
-                )
-        )
-    }
-}
-
-@Composable
-fun PaginationDot(
-    activeIndex: Int = 0,
-    dataLength: Int = 3
-) {
-    Row(modifier = Modifier.conditional(IsShowBaseLineDebug) {
-        border(1.dp, Colors.blue_03)
-    }) {
-        for (i in 0 until dataLength) {
-            Dot(
-                i == activeIndex,
-                AppTheme.current.colors.primary,
-                modifier = Modifier.padding(end = if (i != dataLength - 1) Spacing.XS else 0.dp)
-            )
-        }
-    }
-}

package/compose/src/commonMain/kotlin/vn/momo/kits/components/PaginationNumber.kt

@@ -1,41 +0,0 @@
-package vn.momo.kits.components
-
-import androidx.compose.foundation.background
-import androidx.compose.foundation.border
-import androidx.compose.foundation.layout.BoxWithConstraints
-import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.unit.dp
-import vn.momo.kits.application.IsShowBaseLineDebug
-import vn.momo.kits.const.Colors
-import vn.momo.kits.const.Spacing
-import vn.momo.kits.const.Typography
-import vn.momo.kits.modifier.conditional
-
-@Composable
-fun PaginationNumber(
-    activeIndex: Int = 0,
-    dataLength: Int = 2
-) {
-    BoxWithConstraints(
-        modifier = Modifier.background(
-            color = Color(0x33000000),
-            shape = RoundedCornerShape(Spacing.L)
-        )
-        .conditional(IsShowBaseLineDebug) {
-            border(1.dp, Colors.blue_03)
-        },
-        contentAlignment = Alignment.Center
-    ) {
-        Text(
-            modifier = Modifier.padding(horizontal = Spacing.S),
-            text = "${1 + activeIndex}/$dataLength",
-            color = Colors.black_01,
-            style = Typography.labelDefaultMedium
-        )
-    }
-}

package/compose/src/commonMain/kotlin/vn/momo/kits/components/PaginationScroll.kt

@@ -1,84 +0,0 @@
-package vn.momo.kits.components
-
-import androidx.compose.foundation.background
-import androidx.compose.foundation.border
-import androidx.compose.foundation.horizontalScroll
-import androidx.compose.foundation.layout.*
-import androidx.compose.foundation.rememberScrollState
-import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.runtime.Composable
-import androidx.compose.runtime.derivedStateOf
-import androidx.compose.runtime.getValue
-import androidx.compose.runtime.remember
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.draw.clip
-import androidx.compose.ui.unit.Dp
-import androidx.compose.ui.unit.dp
-import vn.momo.kits.application.IsShowBaseLineDebug
-import vn.momo.kits.const.AppTheme
-import vn.momo.kits.const.Colors
-import vn.momo.kits.const.Spacing
-import vn.momo.kits.modifier.conditional
-
-private val INDICATOR_WIDTH = 24.dp
-private val PROGRESS_WIDTH = 72.dp
-
-private fun calculateOffset(currentPosition: Int, maxBound: Int): Dp {
-    return if (maxBound == 0) 0.dp else {
-        (PROGRESS_WIDTH - INDICATOR_WIDTH) * (currentPosition / maxBound.toFloat())
-    }
-}
-
-@Composable
-fun PaginationScroll(
-    modifier: Modifier = Modifier,
-    content: @Composable () -> Unit
-) {
-    val scrollState = rememberScrollState()
-    val theme = AppTheme.current
-
-    // Use derivedStateOf to optimize scroll position calculations
-    val indicatorOffset by remember {
-        derivedStateOf {
-            calculateOffset(scrollState.value, scrollState.maxValue)
-        }
-    }
-
-    // Cache theme colors to avoid repeated access
-    val (progressBackground, indicatorColor) = remember(theme) {
-        theme.colors.background.pressed to theme.colors.primary
-    }
-
-    Column(horizontalAlignment = Alignment.CenterHorizontally) {
-        Row(
-            modifier = modifier
-                .fillMaxWidth()
-                .conditional(IsShowBaseLineDebug) {
-                    border(1.dp, Colors.blue_03)
-                }
-                .padding(bottom = Spacing.L)
-                .horizontalScroll(scrollState)
-        ) {
-            content()
-        }
-
-        // Progress indicator
-        Box(
-            modifier = Modifier
-                .clip(RoundedCornerShape(Spacing.XS))
-                .width(PROGRESS_WIDTH)
-                .height(4.dp)
-                .background(color = progressBackground)
-        ) {
-            Box(
-                modifier = Modifier
-                    .offset(x = indicatorOffset)
-                    .clip(RoundedCornerShape(Spacing.XS))
-                    .width(INDICATOR_WIDTH)
-                    .height(4.dp)
-                    .background(color = indicatorColor)
-            )
-        }
-    }
-}

package/compose/src/commonMain/kotlin/vn/momo/kits/components/PaginationWhiteDot.kt

@@ -1,40 +0,0 @@
-package vn.momo.kits.components
-
-import androidx.compose.foundation.background
-import androidx.compose.foundation.border
-import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.padding
-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 vn.momo.kits.application.IsShowBaseLineDebug
-import vn.momo.kits.const.Colors
-import vn.momo.kits.const.Spacing
-import vn.momo.kits.modifier.conditional
-
-@Composable
-fun PaginationWhiteDot(
-    activeIndex: Int = 0,
-    dataLength: Int = 3
-) {
-    Row(
-        modifier = Modifier.background(
-            color = Color(0x33000000),
-            shape = RoundedCornerShape(Spacing.S)
-        )
-        .conditional(IsShowBaseLineDebug) {
-            border(1.dp, Colors.blue_03)
-        }
-        .padding(Spacing.XS)
-    ) {
-        for (i in 0 until dataLength) {
-            Dot(
-                i == activeIndex,
-                Colors.black_01,
-                modifier = Modifier.padding(end = if (i != dataLength - 1) Spacing.XS else 0.dp)
-            )
-        }
-    }
-}