@momo-kits/native-kits 0.152.4-scale.4 → 0.152.5-klib.1

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

@@ -1,78 +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.height
-import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.widthIn
-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.const.AppTheme
-import vn.momo.kits.const.Colors
-import vn.momo.kits.const.Radius
-import vn.momo.kits.const.Spacing
-import vn.momo.kits.const.Typography
-import vn.momo.kits.const.scaleSize
-
-
-@Composable
-fun Badge(label: String = "Label", backgroundColor: Color? = null) {
-    val primaryColors = listOf(
-        Color(0xFFF0F0F0),
-        Color(0xFFEB2F96),
-        Color(0xFF962AF0),
-        Color(0xFF4E4BFF),
-        Color(0xFF007AFF),
-        Color(0xFF13C2C2),
-        Color(0xFF34C759),
-        Color(0xFFA0D911),
-        Color(0xFFFFCC00),
-        Color(0xFFFA8C16),
-        Color(0xFFFA541C),
-        Color(0xFFF5222D)
-    )
-
-    fun isNumber(label: String): Boolean {
-        val numberRegex = "^\\d+$".toRegex()
-        return numberRegex.matches(label)
-    }
-
-    fun formatTitle(label: String): String {
-        if (isNumber(label) && label.toInt() > 99) {
-            return "99+"
-        }
-        return label
-    }
-
-    var badgeColor =
-        if (isNumber(label)) {
-            AppTheme.current.colors.error.primary
-        } else {
-            AppTheme.current.colors.warning.primary
-        }
-
-    if (backgroundColor != null && primaryColors.contains(backgroundColor)) {
-        badgeColor = backgroundColor
-    }
-    val scaleSize = scaleSize(16f)
-
-    Box(
-        modifier = Modifier
-            .height(scaleSize.dp)
-            .widthIn(min = scaleSize.dp)
-            .background(color = badgeColor, shape = RoundedCornerShape(Radius.M))
-            .border(width = 1.dp, shape = RoundedCornerShape(Radius.M), color = Colors.black_01)
-            .padding(horizontal = Spacing.XS), contentAlignment = Alignment.Center
-    ) {
-        Text(
-            text = formatTitle(label),
-            color = Colors.black_01,
-            style = Typography.actionXxsBold
-        )
-    }
-}

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

@@ -1,27 +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.size
-import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.unit.dp
-import vn.momo.kits.const.Colors
-import vn.momo.kits.const.Radius
-
-enum class DotSize(val size: Int) {
-    Small(10),
-    Large(16)
-}
-
-@Composable
-fun BadgeDot(size: DotSize = DotSize.Large, modifier: Modifier = Modifier) {
-    Box(
-        modifier = modifier
-            .size(size.size.dp)
-            .border(width = 1.dp, color = Colors.black_01, shape = RoundedCornerShape(Radius.S))
-            .background(color = Colors.red_03, shape = RoundedCornerShape(Radius.S))
-    )
-}

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

@@ -1,334 +0,0 @@
-package vn.momo.kits.components
-
-import androidx.compose.foundation.Canvas
-import androidx.compose.foundation.background
-import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.Row
-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.remember
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.geometry.CornerRadius
-import androidx.compose.ui.geometry.Offset
-import androidx.compose.ui.geometry.Rect
-import androidx.compose.ui.geometry.RoundRect
-import androidx.compose.ui.geometry.Size
-import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.graphics.Path
-import androidx.compose.ui.graphics.graphicsLayer
-import androidx.compose.ui.layout.ContentScale
-import androidx.compose.ui.platform.LocalDensity
-import androidx.compose.ui.text.rememberTextMeasurer
-import androidx.compose.ui.text.style.TextAlign
-import androidx.compose.ui.text.style.TextOverflow
-import androidx.compose.ui.unit.Dp
-import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
-import vn.momo.kits.const.AppTheme
-import vn.momo.kits.const.Colors
-import vn.momo.kits.const.Typography
-import vn.momo.kits.const.getFontFamily
-import vn.momo.kits.const.scaleSize
-
-@Composable
-fun BadgeRibbon(
-    position: RibbonPosition = RibbonPosition.TopRight,
-    label: String = "Label",
-    isRound: Boolean = false,
-    modifier: Modifier = Modifier,
-) {
-    val theme = AppTheme.current
-
-    val rotate = if (position == RibbonPosition.TopRight || position == RibbonPosition.BottomRight) 180f else 0f
-    val useUpTail = position == RibbonPosition.BottomLeft || position == RibbonPosition.TopRight
-    val verticalAlignment = when(position){
-        RibbonPosition.TopLeft, RibbonPosition.BottomRight -> Alignment.Top
-        RibbonPosition.BottomLeft, RibbonPosition.TopRight -> Alignment.Bottom
-    }
-
-    Row(
-        modifier = modifier
-            .height(ribbonHeight)
-            .graphicsLayer { rotationZ = rotate },
-        verticalAlignment = verticalAlignment
-    ) {
-        if (useUpTail) {
-            UpTail()
-        } else {
-            DownTail()
-        }
-
-        if (isRound) {
-            renderRoundContent(label, rotate, theme.colors.warning.primary)
-        } else {
-            renderSkewContent(label, rotate, theme.colors.warning.primary)
-        }
-    }
-}
-
-@Composable
-fun renderRoundContent(label: String, rotate: Float, backgroundColor: Color){
-    Box(
-        modifier = Modifier
-            .height(roundHeight)
-            .background(
-                color = backgroundColor,
-                shape = RoundedCornerShape(
-                    topEnd = roundRightRadius,
-                    bottomEnd = roundRightRadius,
-                )
-            )
-            .padding(end = roundPaddingEnd),
-        contentAlignment = Alignment.Center,
-    ) {
-        Label(label, rotate)
-    }
-}
-
-@Composable
-fun renderSkewContent(label: String, rotate: Float, backgroundColor: Color){
-    Box(
-        modifier = Modifier
-            .height(skewBodyHeight)
-            .background(backgroundColor),
-        contentAlignment = Alignment.Center
-    ) {
-        Label(label, rotate)
-    }
-    RightTail()
-}
-
-@Composable
-fun Label(label: String, rotate: Float){
-    Text(
-        text = label,
-        color = Colors.black_01,
-        maxLines = 1,
-        overflow = TextOverflow.Ellipsis,
-        style = Typography.labelXsMedium,
-        modifier = Modifier.graphicsLayer { rotationZ = rotate }
-    )
-}
-
-@Composable
-fun UpTail() {
-    Image(
-        source = "https://static.momocdn.net/app/img/kits/utils/Head_down_4x.png",
-        modifier = Modifier
-            .graphicsLayer { rotationZ = 180f }
-            .width(headTailWidth)
-            .height(headTailHeight),
-        options = Options(
-            contentScale = ContentScale.FillBounds,
-        )
-    )
-}
-
-@Composable
-fun DownTail() {
-    Image(
-        source = "https://static.momocdn.net/app/img/kits/utils/Head_4x.png",
-        modifier = Modifier
-            .width(headTailWidth)
-            .height(headTailHeight),
-        options = Options(
-            contentScale = ContentScale.FillBounds,
-        )
-    )
-}
-
-@Composable
-fun RightTail() {
-    Image(
-        source = "https://static.momocdn.net/app/img/kits/utils/Tail_4x.png",
-        modifier = Modifier
-            .width(skewTailWidth)
-            .height(skewTailHeight),
-        options = Options(
-            contentScale = ContentScale.FillBounds,
-        )
-    )
-}
-
-@Composable
-fun RoundedBadgeRibbon(
-    text: String = "Label",
-    position: RibbonPosition = RibbonPosition.TopLeft,
-    modifier: Modifier = Modifier
-) {
-    val theme = AppTheme.current
-    val density = LocalDensity.current
-    val style = Typography.labelXsMedium
-    val fontFamily = style.fontFamily
-
-    val scaledFontSize = scaleSize(style.fontSize.value).sp
-    val fontFamilyResult = getFontFamily(fontFamily?.toString() ?: theme.font, style.fontWeight)
-
-    val fontSize = remember(scaledFontSize) { scaledFontSize }
-    val font = remember(fontFamilyResult) { fontFamilyResult }
-    val textMeasurer = rememberTextMeasurer()
-
-    val textLayoutResult = remember(text, fontSize, font) {
-        textMeasurer.measure(
-            text = text,
-            style = style.copy(fontSize = fontSize, fontFamily = font)
-        )
-    }
-
-    val textWidth = with(density) { textLayoutResult.size.width.toDp() }
-    val textHeight = with(density) { textLayoutResult.size.height.toDp() }
-
-    val minRibbonHeight = (textHeight * 1.2f).coerceAtLeast(16.dp)
-    val paddingBottom = minRibbonHeight / 4f
-    val badgeHeight = minRibbonHeight + paddingBottom
-    val horizontalPadding = paddingBottom
-    val badgeWidth = (textWidth + horizontalPadding * 2).coerceAtLeast(28.dp)
-
-    val (rotateZ, scaleY, scaleX) = when (position) {
-        RibbonPosition.TopLeft -> Triple(0f, 1f, -1f)
-        RibbonPosition.TopRight -> Triple(0f, 1f, 1f)
-        RibbonPosition.BottomRight -> Triple(0f, -1f, 1f)
-        RibbonPosition.BottomLeft -> Triple(0f, -1f, -1f)
-    }
-
-    Box(
-        modifier = modifier
-            .size(width = badgeWidth, height = badgeHeight)
-            .graphicsLayer {
-                rotationZ = rotateZ
-                this.scaleY = scaleY
-                this.scaleX = scaleX
-            }
-    ) {
-        val roundedRect = (badgeHeight - paddingBottom) / 2f
-
-        Canvas(modifier = Modifier.matchParentSize()) {
-            val width = size.width
-            val height = size.height
-            val ribbonHeight = height - paddingBottom.toPx()
-            val cornerRadius = roundedRect.toPx()
-
-            val mainColor = Color(0xFFFA541C)
-            val tailColor = Color(0xFFC41B24)
-
-            val headWidth = 4.dp.toPx()
-            val leftSectionWidth = width * (9f / 28f)
-            val middleSectionWidth = width - leftSectionWidth - headWidth
-            val rightX = leftSectionWidth + middleSectionWidth
-
-            // 1. Tail + 2. BG
-            val leftMiddlePath = Path().apply {
-                addRoundRect(
-                    RoundRect(
-                        rect = Rect(
-                            left = 0f,
-                            top = 0f,
-                            right = rightX + 1f,
-                            bottom = ribbonHeight
-                        ),
-                        topLeft = CornerRadius(cornerRadius, cornerRadius),
-                        topRight = CornerRadius.Zero,
-                        bottomRight = CornerRadius.Zero,
-                        bottomLeft = CornerRadius(cornerRadius, cornerRadius)
-                    )
-                )
-            }
-            drawPath(
-                path = leftMiddlePath,
-                color = mainColor
-            )
-
-            // 3. Head
-            val headPath = Path().apply {
-                addRoundRect(
-                    RoundRect(
-                        rect = Rect(
-                            left = rightX,
-                            top = 0f,
-                            right = rightX + headWidth,
-                            bottom = ribbonHeight
-                        ),
-                        topLeft = CornerRadius.Zero,
-                        topRight = CornerRadius(cornerRadius, cornerRadius),
-                        bottomRight = CornerRadius.Zero,
-                        bottomLeft = CornerRadius.Zero
-                    )
-                )
-            }
-            drawPath(
-                path = headPath,
-                color = mainColor
-            )
-
-            // Draw bottom tail section
-            val tailY = ribbonHeight
-            val tailHeight = paddingBottom.toPx()
-            val halfHeadWidth = headWidth / 2f
-            val tailStartX = rightX + headWidth - halfHeadWidth
-
-            // Background square (main color)
-            drawRect(
-                color = mainColor,
-                topLeft = Offset(tailStartX, tailY),
-                size = Size(halfHeadWidth, halfHeadWidth)
-            )
-
-            val tailRoundRadius = tailHeight
-            val tailRightPath = Path().apply {
-                addRoundRect(
-                    RoundRect(
-                        rect = Rect(
-                            left = tailStartX,
-                            top = tailY,
-                            right = tailStartX + halfHeadWidth,
-                            bottom = tailY + tailHeight
-                        ),
-                        topLeft = CornerRadius.Zero,
-                        topRight = CornerRadius(tailRoundRadius, tailRoundRadius),
-                        bottomRight = CornerRadius(tailRoundRadius, tailRoundRadius),
-                        bottomLeft = CornerRadius.Zero
-                    )
-                )
-            }
-            drawPath(
-                path = tailRightPath,
-                color = tailColor
-            )
-        }
-
-        Text(
-            text = text,
-            modifier = Modifier
-                .padding(bottom = paddingBottom)
-                .padding(horizontal = paddingBottom / 2)
-                .align(Alignment.Center)
-                .graphicsLayer {
-                    rotationZ = rotateZ
-                    this.scaleY = scaleY
-                    this.scaleX = scaleX
-                },
-            textAlign = TextAlign.Center,
-            style = Typography.labelXsMedium,
-            maxLines = 1,
-            overflow = TextOverflow.Ellipsis,
-            color = Colors.black_01
-        )
-    }
-}
-
-val ribbonHeight: Dp = 20.dp
-val roundHeight: Dp = 16.dp
-val skewBodyHeight: Dp = 16.dp
-val roundRightRadius: Dp = 12.dp
-val roundPaddingEnd: Dp = 6.dp
-val skewTailWidth: Dp = 8.dp
-val skewTailHeight: Dp = 16.dp
-val headTailWidth: Dp = 5.dp
-val headTailHeight: Dp = 20.dp
-
-enum class RibbonPosition {TopLeft, TopRight, BottomLeft, BottomRight}