@momo-kits/native-kits 0.162.2-sp.7-debug → 0.162.2-sp.8-debug

package/ios/Input/InputPhoneNumber.swift

@@ -16,6 +16,7 @@ public struct InputPhoneNumber: View {
     public var error: String
     public var errorSpacing: Bool
     public var loading: Bool
+    public var required: Bool
     public var rightIcon: String
     public var rightIconColor: Color?
     public var autofocus: Bool
@@ -24,8 +25,9 @@ public struct InputPhoneNumber: View {
     public var onBlur: (() -> Void)?
     public var onRightIconPressed: (() -> Void)?
     public var accessibilityLabel: String?
-    
+
     @State private var isFocused: Bool = false
+    @FocusState private var isFieldFocused: Bool
     
     public init(
         text: Binding<String>,
@@ -52,6 +54,7 @@ public struct InputPhoneNumber: View {
         self.error = error
         self.errorSpacing = errorSpacing
         self.loading = loading
+        self.required = required
         self.rightIcon = rightIcon
         self.rightIconColor = rightIconColor
         self.autofocus = autofocus
@@ -90,9 +93,13 @@ public struct InputPhoneNumber: View {
                 // Text input
                 ZStack(alignment: .leading) {
                     if text.isEmpty {
-                        MomoText(placeholder, typography: size == .small ? .headerSSemibold : .headerMBold, color: theme.colors.text.hint)
+                        MomoText(
+                            placeholder + (required ? " *" : ""),
+                            typography: size == .small ? .headerSSemibold : .headerMBold,
+                            color: theme.colors.text.hint
+                        )
                     }
-                    
+
                     TextField("", text: textBinding, onEditingChanged: { focused in
                         handleFocusChange(focused)
                     })
@@ -102,6 +109,10 @@ public struct InputPhoneNumber: View {
                     .foregroundColor(theme.colors.text.default)
                     .applyCursorColor(theme.colors.primary)
                     .lineLimit(1)
+                    .focused($isFieldFocused)
+                    .onAppear {
+                        if autofocus { isFieldFocused = true }
+                    }
                     .accessibility(identifier: accessibilityLabel ?? "")
                     .accessibilityValue(textBinding.wrappedValue.isEmpty ? placeholder : textBinding.wrappedValue)
                 }

package/ios/Input/InputSearch.swift

@@ -238,7 +238,13 @@ public struct InputSearch: View {
                     }
                     
                     if isFocused && !text.isEmpty {
-                        SwiftButton(action: { text = "" }) {
+                        SwiftButton(action: {
+                            text = ""
+                            // Kotlin's clear icon fires a callback distinct from
+                            // onChangeText (`onClearPress`, not ported here); route
+                            // through onChangeText so clearing isn't a silent no-op.
+                            onChangeText("")
+                        }) {
                             Image(systemName: "xmark.circle.fill")
                                 .foregroundColor(theme.colors.text.hint)
                                 .frame(width: 16, height: 16)

package/ios/Input/InputTextArea.swift

@@ -109,6 +109,7 @@ public struct InputTextArea: View {
     
     @State private var isFocused = false
     @State private var isBlurred = false
+    @State private var floatingLabelHeight: CGFloat = 16
     
     // Make the initializer public
     public init(
@@ -182,45 +183,88 @@ public struct InputTextArea: View {
                                 }
                             }
                             .padding(.horizontal, Spacing.S)
+                            .background(
+                                GeometryReader { geo in
+                                    Color.clear.onAppear { floatingLabelHeight = geo.size.height }
+                                }
+                            )
                             .background(theme.colors.background.surface)
-                            .offset(x: Spacing.S, y: -height / 10)
+                            // Kotlin centers the label within the box-height-tall decorationBox
+                            // by default, then applies `offsetY = -scaleHeight / 2` — net effect:
+                            // the label ends up centered exactly on the box's top border. Our
+                            // ZStack anchors top-leading instead, so matching that requires
+                            // offsetting by half the label's OWN measured height, not half the
+                            // (104pt-tall) text-area box height.
+                            .offset(x: Spacing.S, y: -floatingLabelHeight / 2)
                             .zIndex(10)
                         }
-                        
+
                         VStack {
-                            ZStack(alignment: .topLeading) {
-                                if text.isEmpty {
-                                    Text(placeholder)
-                                        .foregroundColor(disabled ? theme.colors.text.disable : theme.colors.text.hint)
-                                        .font(.system(size: 16, weight: fontWeight))
-                                        .padding(.horizontal, 16)
-                                        .padding(.vertical, 12)
+                            HStack(alignment: .top, spacing: 0) {
+                                ZStack(alignment: .topLeading) {
+                                    if text.isEmpty {
+                                        Text(placeholder)
+                                            .foregroundColor(disabled ? theme.colors.text.disable : theme.colors.text.hint)
+                                            .font(.system(size: 16, weight: fontWeight))
+                                            .padding(.horizontal, 16)
+                                            .padding(.vertical, 12)
+                                    }
+
+                                    UITextViewWrapper(
+                                        text: $text,
+                                        maxLength: maxLength,
+                                        textColor: disabled ? theme.colors.text.disable : theme.colors.text.default,
+                                        cursorColor: theme.colors.primary,
+                                        fontWeight: fontWeight,
+                                        disabled: disabled,
+                                        onChangeText: onChangeText,
+                                        onDone: {
+                                        // Handle done action if needed
+                                    },
+                                    onFocus: {
+                                        isFocused = true
+                                        onFocus()
+                                    }, onBlur: {
+                                        isFocused = false
+                                        isBlurred = true
+                                        onBlur()
+                                    })
+                                    .frame(height: height)
+                                    .padding(.horizontal, 12)
+                                    .padding(.vertical, 8)
+                                    .disabled(disabled)
                                 }
-                                
-                                UITextViewWrapper(
-                                    text: $text,
-                                    maxLength: maxLength,
-                                    textColor: disabled ? theme.colors.text.disable : theme.colors.text.default,
-                                    cursorColor: theme.colors.primary,
-                                    fontWeight: fontWeight,
-                                    disabled: disabled,
-                                    onChangeText: onChangeText,
-                                    onDone: {
-                                    // Handle done action if needed
-                                },
-                                onFocus: {
-                                    isFocused = true
-                                    onFocus()
-                                }, onBlur: {
-                                    isFocused = false
-                                    isBlurred = true
-                                    onBlur()
-                                })
-                                .frame(height: height)
-                                .padding(.horizontal, 12)
-                                .padding(.vertical, 8)
-                                .disabled(disabled)                            }
-                            
+                                .frame(maxWidth: .infinity)
+
+                                // Clear button (mirrors Compose: focused + non-empty).
+                                if isFocused && !text.isEmpty {
+                                    SwiftUI.Button(action: {
+                                        text = ""
+                                        onChangeText("")
+                                    }) {
+                                        Icon(source: "24_navigation_close_circle_full", size: 16, color: theme.colors.text.hint)
+                                    }
+                                    .padding(.leading, Spacing.XS)
+                                    .padding(.top, 12)
+                                }
+
+                                // Loading indicator and right icon (independent, mirrors
+                                // Compose's RenderRightIcon: both can render at once).
+                                if loading {
+                                    ActivityIndicator(isAnimating: .constant(true), style: .medium)
+                                        .frame(width: 16, height: 16)
+                                        .padding(.leading, Spacing.XS)
+                                        .padding(.top, 12)
+                                }
+                                if !icon.isEmpty {
+                                    SwiftUI.Button(action: onRightIconPressed) {
+                                        Icon(source: icon, size: 24, color: disabled ? theme.colors.text.disable : (iconColor ?? theme.colors.text.default))
+                                    }
+                                    .padding(.leading, Spacing.XS)
+                                    .padding(.top, 12)
+                                }
+                            }
+
                             HStack {
                                 Spacer()
                                 MomoText("\(text.count)/\(maxLength)", typography: .descriptionXsRegular, color: theme.colors.text.hint)

package/ios/InputDropDown/InputDropDown.swift

@@ -16,10 +16,13 @@ private struct RenderRightIcon: View {
     let onPressed: () -> Void
 
     var body: some View {
+        // Mirrors Compose's two independent `if` blocks: loading spinner and icon
+        // can both render at once, not exclusively (not an if/else).
         if loading {
             ActivityIndicator(isAnimating: .constant(true), style: .medium)
                 .frame(width: 16, height: 16)
-        } else if !icon.isEmpty {
+        }
+        if !icon.isEmpty {
             SwiftUI.Button(action: onPressed) {
                 Icon(source: icon, size: 24, color: color)
             }

package/ios/InputMoney/InputMoney.swift

@@ -75,6 +75,7 @@ public struct InputMoney: View {
     public var onBlur: (() -> Void)?
 
     @State private var isFocused: Bool = false
+    @State private var floatingLabelHeight: CGFloat = 16
 
     public init(
         text: Binding<String>,
@@ -141,8 +142,18 @@ public struct InputMoney: View {
                         }
                     }
                     .padding(.horizontal, Spacing.S)
+                    .background(
+                        GeometryReader { geo in
+                            Color.clear.onAppear { floatingLabelHeight = geo.size.height }
+                        }
+                    )
                     .background(theme.colors.background.surface)
-                    .offset(x: Spacing.S, y: -8)
+                    // Kotlin centers the label within the box-height-tall decorationBox by
+                    // default, then applies `offsetY = -size.values.height / 2` — net effect:
+                    // the label ends up centered exactly on the box's top border. Our ZStack
+                    // anchors top-leading instead, so matching that requires offsetting by
+                    // half the label's OWN measured height, not half the box height.
+                    .offset(x: Spacing.S, y: -floatingLabelHeight / 2)
                     .zIndex(10)
                 }
 
@@ -188,13 +199,14 @@ public struct InputMoney: View {
                         }
                     }
 
-                    // Loading indicator
+                    // Loading indicator and right icon can both render (mirrors
+                    // Compose's two independent `if` blocks, not if/else).
                     if loading {
                         ActivityIndicator(isAnimating: .constant(true), style: .medium)
                             .frame(width: 16, height: 16)
                             .padding(.leading, Spacing.S)
-                    } else if !icon.isEmpty {
-                        // Right icon
+                    }
+                    if !icon.isEmpty {
                         SwiftUI.Button(action: { onPressIcon?() }) {
                             Icon(source: icon, size: 24, color: iconTintColor)
                                 .padding(.leading, Spacing.S)