@momo-kits/native-kits 0.157.1-beta.9-debug → 0.157.1-com.1-debug

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

@@ -8,8 +8,11 @@ import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.IntrinsicSize
 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.offset
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
@@ -221,7 +224,7 @@ private class TooltipPositionProvider(
 fun Tooltip(
     state: TooltipState,
     title: String? = null,
-    description: String? = null,
+    description: String,
     buttons: List<TooltipButton> = emptyList(),
     placement: TooltipPlacement = TooltipPlacement.TOP,
     align: TooltipAlign = TooltipAlign.CENTER,
@@ -282,6 +285,7 @@ private fun TooltipPopupContent(
         Column(
             modifier = Modifier
                 .widthIn(max = tooltipMaxWidth)
+                .width(IntrinsicSize.Max)
                 .background(Colors.black_17, tooltipShape)
                 .clip(tooltipShape)
                 .conditional(IsShowBaseLineDebug) {
@@ -289,8 +293,8 @@ private fun TooltipPopupContent(
                 }
                 .padding(Spacing.M)
         ) {
-            Row {
-                Column(modifier = Modifier.weight(1f, fill = false)) {
+            Row(Modifier.fillMaxWidth()) {
+                Column(modifier = Modifier.weight(1f)) {
                     if (!title.isNullOrEmpty()) {
                         Text(
                             text = title,
@@ -307,7 +311,6 @@ private fun TooltipPopupContent(
                             style = Typography.descriptionDefaultRegular,
                             color = Colors.black_01,
                             maxLines = 2,
-                            modifier = Modifier.padding(bottom = Spacing.M),
                             overflow = TextOverflow.Ellipsis,
                         )
                     }
@@ -330,6 +333,7 @@ private fun TooltipPopupContent(
                 }
             }
             if (buttons.isNotEmpty()) {
+                Spacer(Modifier.height(Spacing.M))
                 TooltipButtons(
                     buttons = buttons,
                     modifier = Modifier.align(Alignment.End),
@@ -488,6 +492,7 @@ private fun TooltipButtons(buttons: List<TooltipButton>, modifier: Modifier = Mo
                 TooltipSecondaryButton(
                     title = secondary.title ?: "",
                     onPress = secondary.onPress ?: {},
+                    modifier = Modifier.weight(1f, fill = false),
                 )
                 Spacer(modifier = Modifier.width(Spacing.S))
                 TooltipPrimaryButton(
@@ -520,6 +525,12 @@ private fun TooltipSingleButton(btn: TooltipButton) {
         )
     }
 }
+
+private const val MAX_BUTTON_LENGTH = 16
+
+private fun String.limitWithEllipsis(max: Int = 16): String {
+    return if (length > max) take(max) + "…" else this
+}
 @Composable
 private fun TooltipPrimaryButton(
     title: String,
@@ -527,7 +538,7 @@ private fun TooltipPrimaryButton(
 ) {
     Button(
         onClick = onPress,
-        title = title,
+        title = title.limitWithEllipsis(),
         type = ButtonType.SECONDARY,
         size = Size.MEDIUM,
         isFull = false,
@@ -537,18 +548,21 @@ private fun TooltipPrimaryButton(
 private fun TooltipSecondaryButton(
     title: String,
     onPress: () -> Unit,
+    modifier: Modifier = Modifier,
 ) {
     Box(
-        modifier = Modifier
+        modifier = modifier
             .activeOpacityClickable {
                 onPress()
             }
             .padding(horizontal = Spacing.M, vertical = Spacing.S),
     ) {
         Text(
-            text = title,
+            text = title.limitWithEllipsis(),
             color = Colors.black_01,
             style = Typography.actionSBold,
+            maxLines = 1,
+            overflow = TextOverflow.Ellipsis,
         )
     }
 }

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

@@ -0,0 +1,192 @@
+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.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.rememberScrollState
+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.draw.clip
+import androidx.compose.ui.draw.drawBehind
+import androidx.compose.ui.geometry.CornerRadius
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.PathEffect
+import androidx.compose.ui.graphics.drawscope.Stroke
+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.Radius
+import vn.momo.kits.const.Spacing
+import vn.momo.kits.const.Typography
+import vn.momo.kits.modifier.activeOpacityClickable
+import vn.momo.kits.modifier.conditional
+
+data class UploadImage(
+    val uri: String? = null,
+    val loading: Boolean = false,
+)
+
+@Composable
+fun Uploader(
+    images: List<UploadImage>,
+    modifier: Modifier = Modifier,
+    numberOfImages: Int = 1,
+    disabled: Boolean = false,
+    width: Dp = 64.dp,
+    height: Dp = 64.dp,
+    onAdd: () -> Unit = {},
+    onCancel: ((image: UploadImage, index: Int) -> Unit)? = null,
+    onPressImage: (image: UploadImage, index: Int) -> Unit = { _, _ -> },
+) {
+    val shouldShowPicker = remember(images.size, numberOfImages) {
+        images.size < numberOfImages
+    }
+
+    Row(
+        modifier = modifier
+            .conditional(IsShowBaseLineDebug) { border(1.dp, Colors.blue_03) },
+        horizontalArrangement = Arrangement.spacedBy(Spacing.S),
+        verticalAlignment = Alignment.Top,
+    ) {
+        if (shouldShowPicker) {
+            UploaderPickerCell(
+                disabled = disabled,
+                width = width,
+                height = height,
+                onAdd = onAdd,
+            )
+        }
+
+        Row(
+            modifier = Modifier.horizontalScroll(rememberScrollState()),
+            horizontalArrangement = Arrangement.spacedBy(Spacing.S),
+        ) {
+            images.forEachIndexed { index, image ->
+                UploaderImageItem(
+                    image = image,
+                    width = width,
+                    height = height,
+                    index = index,
+                    onCancel = onCancel,
+                    onPressImage = { onPressImage(image, index) },
+                )
+            }
+        }
+    }
+}
+
+@Composable
+private fun UploaderPickerCell(
+    disabled: Boolean,
+    width: Dp,
+    height: Dp,
+    onAdd: () -> Unit,
+) {
+    val theme = AppTheme.current
+    val mainColor = if (disabled) theme.colors.text.disable else theme.colors.text.hint
+    val borderColor = if (disabled) theme.colors.border.disable else theme.colors.border.default
+
+    Box(
+        modifier = Modifier
+            .size(width = width, height = height)
+            .clip(RoundedCornerShape(Radius.XS))
+            .dashedBorder(color = borderColor, radius = Radius.XS)
+            .activeOpacityClickable(enabled = !disabled, onClick = onAdd),
+        contentAlignment = Alignment.Center,
+    ) {
+        Column(
+            horizontalAlignment = Alignment.CenterHorizontally,
+            verticalArrangement = Arrangement.spacedBy(Spacing.XXS),
+        ) {
+            Icon(
+                source = "16_navigation_plus",
+                color = mainColor,
+                size = 16.dp,
+            )
+            Text(
+                text = "Thêm hình",
+                style = Typography.descriptionXsRegular,
+                color = mainColor,
+            )
+        }
+    }
+}
+
+@Composable
+private fun UploaderImageItem(
+    image: UploadImage,
+    width: Dp,
+    height: Dp,
+    index: Int,
+    onCancel: ((image: UploadImage, index: Int) -> Unit)?,
+    onPressImage: () -> Unit,
+) {
+    Box(
+        modifier = Modifier
+            .size(width = width, height = height)
+            .activeOpacityClickable(onClick = onPressImage),
+    ) {
+        Image(
+            source = image.uri ?: "",
+            modifier = Modifier
+                .fillMaxSize()
+                .clip(RoundedCornerShape(Radius.XS)),
+        )
+
+        if (onCancel != null && !image.loading) {
+            Icon(
+                source = "navigation_close_circle_full",
+                size = 16.dp,
+                color = null,
+                modifier = Modifier
+                    .align(Alignment.TopEnd)
+                    .padding(top = Spacing.XXS, end = Spacing.XXS)
+                    .activeOpacityClickable { onCancel(image, index) },
+            )
+        }
+
+        if (image.loading) {
+            Box(
+                modifier = Modifier
+                    .fillMaxSize()
+                    .clip(RoundedCornerShape(Radius.XS))
+                    .background(Color(0x66FFFFFF)),
+                contentAlignment = Alignment.Center,
+            ) {
+                Skeleton()
+            }
+        }
+    }
+}
+
+private fun Modifier.dashedBorder(
+    color: Color,
+    radius: Dp,
+    strokeWidth: Dp = 1.dp,
+    dashWidth: Float = 10f,
+    dashGap: Float = 6f,
+): Modifier = this.drawBehind {
+    val strokePx = strokeWidth.toPx()
+    val pathEffect = PathEffect.dashPathEffect(floatArrayOf(dashWidth, dashGap), 0f)
+    val cornerRadiusPx = radius.toPx()
+    drawRoundRect(
+        color = color,
+        style = Stroke(
+            width = strokePx,
+            pathEffect = pathEffect,
+        ),
+        cornerRadius = CornerRadius(cornerRadiusPx, cornerRadiusPx),
+    )
+}

package/gradle.properties

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

package/ios/Input/Input.swift

@@ -311,6 +311,10 @@ private struct SecureInputField: UIViewRepresentable {
             textField.text = text
         }
         textField.isEnabled = !isDisabled
+        if textField.keyboardType != keyboardType {
+            textField.keyboardType = keyboardType
+            textField.reloadInputViews()
+        }
     }
 
     class Coordinator: NSObject, UITextFieldDelegate {

package/local.properties

@@ -4,5 +4,5 @@
 # Location of the SDK. This is only used by Gradle.
 # For customization when using a Version Control System, please read the
 # header note.
-#Thu Jan 09 10:43:10 ICT 2025
-sdk.dir=/Users/sophia/Library/Android/sdk
+#Mon Dec 22 10:07:29 ICT 2025
+sdk.dir=/Users/phuc/Library/Android/sdk

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@momo-kits/native-kits",
-  "version": "0.157.1-beta.9-debug",
+  "version": "0.157.1-com.1-debug",
   "private": false,
   "dependencies": {},
   "devDependencies": {},

package/src/doctor/README.md

@@ -0,0 +1,73 @@
+# @momo-kits/doctor
+
+> Momo Kits Doctor CLI tool for running health checks on your Mini App to ensure compatibility with the MoMo Platform.
+
+[![npm version](https://img.shields.io/npm/v/@momo-kits/doctor.svg)](https://www.npmjs.com/package/@momo-kits/doctor)
+[![License: MIT](https://img.shields.io/badge/license-MIT-green.svg)](LICENSE)
+
+## Table of Contents
+
+- [Installation](#installation)
+- [Usage](#usage)
+  - [Check](#check)
+  - [Doctor](#doctor)
+- [CLI Options](#cli-options)
+
+## Installation
+
+Install globally for CLI use:
+
+```bash
+npm install -g @momo-kits/doctor
+# or
+yarn global add @momo-kits/doctor
+```
+
+Install locally as a dev dependency:
+
+```bash
+npm install --save-dev @momo-kits/doctor
+# or
+yarn add --dev @momo-kits/doctor
+```
+
+## Usage
+
+The CLI provides two core commands:
+
+### Check
+
+Run an interactive session to perform individual health checks:
+
+```bash
+momo-kits check
+```
+
+You will be prompted to select one of the following tasks:
+
+- **Check core dependencies**: Verify usage of `@momo-kits/core`.
+- **Scan native module usage**: Detect any native module imports or calls.
+- **Calculate component adoption rate**: Analyze how many components used in Design System.
+- **Scan for deprecated MaxAPI functions**: Identify MaxAPI calls that are removed or deprecated.
+
+### Doctor
+
+Run all checks in sequence and receive a final health summary:
+
+```bash
+momo-kits doctor
+```
+
+The tool will:
+
+1. Check core dependencies
+2. Scan native module usage
+3. Calculate component adoption rate
+4. Scan for deprecated MaxAPI usage
+5. Output a summary indicating overall app health
+
+## CLI Options
+
+- `--help`        Show help information
+- `--version`     Display the current CLI version
+- `LOG_LEVEL`     Set log verbosity (`debug`, `info`, `warn`, `error`)