@momo-kits/native-kits 0.0.1-beta.4 → 0.2.0-kt22

package/ios/Input/InputPhoneNumber.swift

@@ -0,0 +1,158 @@
+//
+//  InputPhoneNumber.swift
+//  Pods
+//
+//  Created by sophia on 20/10/25.
+//
+
+import SwiftUI
+
+public struct InputPhoneNumber: View {
+    @Binding public var text: String
+    
+    public var placeholder: String
+    public var size: InputSize
+    public var hintText: String
+    public var error: String
+    public var loading: Bool
+    public var rightIcon: String
+    public var rightIconColor: Color
+    public var onFocus: (() -> Void)?
+    public var onBlur: (() -> Void)?
+    public var onRightIconPressed: (() -> Void)?
+    
+    @State private var isFocused: Bool = false
+    
+    public init(
+        text: Binding<String>,
+        placeholder: String = "0123456789",
+        size: InputSize = .small,
+        hintText: String = "",
+        error: String = "",
+        loading: Bool = false,
+        required: Bool = false,
+        rightIcon: String = "",
+        rightIconColor: Color = Colors.black12,
+        onFocus: (() -> Void)? = nil,
+        onBlur: (() -> Void)? = nil,
+        onRightIconPressed: (() -> Void)? = nil
+    ) {
+        self._text = text
+        self.placeholder = placeholder
+        self.size = size
+        self.hintText = hintText
+        self.error = error
+        self.loading = loading
+        self.rightIcon = rightIcon
+        self.rightIconColor = rightIconColor
+        self.onFocus = onFocus
+        self.onBlur = onBlur
+        self.onRightIconPressed = onRightIconPressed
+    }
+    
+    // MARK: - Body
+    public var body: some View {
+        VStack(alignment: .leading, spacing: 4) {
+            HStack(spacing: 0) {
+                // 🇻🇳 Flag
+                ImageView("https://static.momocdn.net/app/img/icon/ic-qrcode-package/ic_vn_flag.png")
+                    .frame(width: 24, height: 24)
+                    .padding(.trailing, Spacing.XS)
+                
+                MomoText("+84", typography: size == .small ? .headerSSemibold : .headerMBold)
+                    .foregroundColor(Colors.black17)
+                
+                Rectangle()
+                    .fill(Colors.black04)
+                    .frame(width: 1, height: size == .small ? 24 : 32)
+                    .padding(.horizontal, Spacing.M)
+                
+                // Text input
+                ZStack(alignment: .leading) {
+                    if text.isEmpty {
+                        MomoText(placeholder, typography: size == .small ? .headerSSemibold : .headerMBold, color: Colors.black12)
+                    }
+                    
+                    TextField("", text: $text, onEditingChanged: { focused in
+                        handleFocusChange(focused)
+                    })
+                    .keyboardType(.numberPad)
+                    .font(size == .small ? .header_s_semibold : .header_m_bold)
+                    .foregroundColor(Colors.black17)
+                    .applyPrimaryCursorColor()
+                    .lineLimit(1)
+                    
+                }
+                
+                // Clear button
+                if isFocused && !text.isEmpty {
+                    SwiftUI.Button(action: { text = "" }) {
+                        Icon(source: "24_navigation_close_circle_full", size: 16, color: Colors.black12)
+                            .padding(.leading, Spacing.S)
+                    }
+                }
+                
+                // Loading indicator
+                if loading {
+                    ActivityIndicator(isAnimating: .constant(true), style: .medium)
+                        .frame(width: 16, height: 16)
+                }
+                
+                // ✅ Right icon
+                if !rightIcon.isEmpty {
+                    SwiftUI.Button(action: { onRightIconPressed?() }) {
+                        Icon(source: rightIcon, size: 24, color: rightIconColor)
+                            .padding(.leading, Spacing.S)
+                    }
+                }
+            }
+            .padding(.horizontal, Spacing.M)
+            .frame(height: scaleSize(size == .small ? 48 : 56, 1.1))
+            .background(
+                RoundedRectangle(cornerRadius: Radius.S)
+                    .fill(Colors.black01)
+            )
+            .overlay(
+                RoundedRectangle(cornerRadius: Radius.S)
+                    .stroke(borderColor(), lineWidth: isFocused ? 1.5 : 1)
+            )
+            
+            // Error or hint
+            ErrorView(
+                errorMessage: error,
+                errorSpacing: false,
+                hintText: hintText
+            )
+        }
+    }
+    
+    // MARK: - Helpers
+    
+    private func handleFocusChange(_ focused: Bool) {
+        isFocused = focused
+        if focused {
+            onFocus?()
+        } else {
+            onBlur?()
+        }
+    }
+    
+    private func borderColor() -> Color {
+        if !error.isEmpty { return Colors.red03 }
+        if isFocused { return Colors.primary }
+        return Colors.black04
+    }
+}
+
+private extension View {
+    func applyPrimaryCursorColor() -> some View {
+        if #available(iOS 15.0, *) {
+            // Modern SwiftUI: use .tint() for cursor
+            return self.tint(Colors.primary)
+        } else {
+            // iOS 13–14: return unchanged (no tint support)
+            return self
+        }
+    }
+}
+

package/ios/Input/InputSearch.swift

@@ -0,0 +1,238 @@
+//
+//  InputSearch.swift
+//  Pods
+//
+//  Created by dung.pham2 on 3/12/24.
+//
+import SwiftUI
+
+// MARK: - RenderRightIconSearch
+
+struct RenderRightIconSearch: View {
+    let loading: Bool
+    let icon: String
+    let color: Color
+    let onClick: () -> Void
+    
+    var body: some View {
+        HStack(spacing: 0) {
+            if loading {
+                ActivityIndicator(isAnimating: .constant(true), style: .medium)
+                    .frame(width: 16, height: 16)
+                    .padding(.horizontal, Spacing.S)
+            }
+            if !icon.isEmpty {
+                Divider()
+                    .frame(width: 1)
+                    .background(Colors.primary)
+                    .padding(.leading, Spacing.S)
+                
+                Image(systemName: icon)
+                    .foregroundColor(color)
+                    .frame(width: 24, height: 24)
+                    .padding(.leading, Spacing.S)
+                    .onTapGesture(perform: onClick)
+            }
+        }
+    }
+}
+
+public struct InputSearchProps {
+    @Binding var text: String
+    var buttonText: String = ""
+    var showButtonText: Bool = false
+    var showBorder: Bool = true
+    var placeholder: String = ""
+    var onChangeText: (String) -> Void = { _ in }
+    var onPressButtonText: () -> Void = {}
+    var error: String = ""
+    var disabled: Bool = false
+    var icon: String = ""
+    var iconColor: Color = Colors.text
+    var onRightIconPressed: () -> Void = {}
+    var onFocus: () -> Void = {}
+    var onBlur: () -> Void = {}
+    var loading: Bool = false
+    var fontWeight: Font.Weight = .regular
+    var keyboardType: UIKeyboardType = .default
+    
+    public init(text: Binding<String>,
+                buttonText: String = "",
+                showButtonText: Bool = false,
+                showBorder: Bool = true,
+                placeholder: String = "",
+                onChangeText: @escaping (String) -> Void = { _ in },
+                onPressButtonText: @escaping () -> Void = {},
+                error: String = "",
+                disabled: Bool = false,
+                icon: String = "",
+                iconColor: Color = Colors.text,
+                onRightIconPressed: @escaping () -> Void = {},
+                onFocus: @escaping () -> Void = {},
+                onBlur: @escaping () -> Void = {},
+                loading: Bool = false,
+                fontWeight: Font.Weight = .regular,
+                keyboardType: UIKeyboardType = .default) {
+        self._text = text
+        self.buttonText = buttonText
+        self.showButtonText = showButtonText
+        self.showBorder = showBorder
+        self.placeholder = placeholder
+        self.onChangeText = onChangeText
+        self.onPressButtonText = onPressButtonText
+        self.error = error
+        self.disabled = disabled
+        self.icon = icon
+        self.iconColor = iconColor
+        self.onRightIconPressed = onRightIconPressed
+        self.onFocus = onFocus
+        self.onBlur = onBlur
+        self.loading = loading
+        self.fontWeight = fontWeight
+        self.keyboardType = keyboardType
+        }
+}
+
+// MARK: - InputSearch
+
+public struct InputSearch: View {
+    @Binding var text: String
+    var buttonText: String = ""
+    var showButtonText: Bool = false
+    var showBorder: Bool = true
+    var placeholder: String = ""
+    var onChangeText: (String) -> Void = { _ in }
+    var onPressButtonText: () -> Void = {}
+    var error: String = ""
+    var disabled: Bool = false
+    var icon: String = ""
+    var iconColor: Color = Colors.text
+    var onRightIconPressed: () -> Void = {}
+    var onFocus: () -> Void = {}
+    var onBlur: () -> Void = {}
+    var loading: Bool = false
+    var fontWeight: Font.Weight = .regular
+    var keyboardType: UIKeyboardType = .default
+    
+    @State private var isFocused = false
+    @State private var isBlurred = false
+    
+    public init(text: Binding<String>,
+                buttonText: String = "",
+                showButtonText: Bool = false,
+                showBorder: Bool = true,
+                placeholder: String = "",
+                onChangeText: @escaping (String) -> Void = { _ in },
+                onPressButtonText: @escaping () -> Void = {},
+                error: String = "",
+                disabled: Bool = false,
+                icon: String = "",
+                iconColor: Color = Colors.text,
+                onRightIconPressed: @escaping () -> Void = {},
+                onFocus: @escaping () -> Void = {},
+                onBlur: @escaping () -> Void = {},
+                loading: Bool = false,
+                fontWeight: Font.Weight = .regular,
+                keyboardType: UIKeyboardType = .default) {
+        self._text = text
+        self.buttonText = buttonText
+        self.showButtonText = showButtonText
+        self.showBorder = showBorder
+        self.placeholder = placeholder
+        self.onChangeText = onChangeText
+        self.onPressButtonText = onPressButtonText
+        self.error = error
+        self.disabled = disabled
+        self.icon = icon
+        self.iconColor = iconColor
+        self.onRightIconPressed = onRightIconPressed
+        self.onFocus = onFocus
+        self.onBlur = onBlur
+        self.loading = loading
+        self.fontWeight = fontWeight
+        self.keyboardType = keyboardType
+        }
+
+    
+    public var body: some View {
+        VStack(alignment: .leading, spacing: 0) {
+            HStack(spacing: 0) {
+                HStack {
+                    Image(systemName: "magnifyingglass")
+                        .foregroundColor(Colors.black12)
+                        .frame(width: 24, height: 24)
+                        .padding(.trailing, Spacing.XS)
+                    
+                    ZStack(alignment: .leading) {
+                        if text.isEmpty {
+                            Text(placeholder)
+                                .foregroundColor(disabled ? Colors.black08 : Colors.black12)
+                                .font(.system(size: 16, weight: fontWeight))
+                        }
+                        TextField("", text: $text, onEditingChanged: { editing in
+                            isFocused = editing
+                            if editing {
+                                onFocus()
+                            } else if isBlurred {
+                                onBlur()
+                            }
+                            if editing && !isBlurred {
+                                isBlurred = true
+                            }
+                        }, onCommit: {})
+                        .disabled(disabled)
+                        .foregroundColor(disabled ? Colors.black08 : Colors.black17)
+                        .font(.system(size: 15, weight: fontWeight))
+                        .keyboardType(keyboardType)
+                    }
+                    
+                    if isFocused && !text.isEmpty {
+                        SwiftButton(action: { text = "" }) {
+                            Image(systemName: "xmark.circle.fill")
+                                .foregroundColor(Colors.black12)
+                                .frame(width: 16, height: 16)
+                        }
+                        .padding(.leading, Spacing.S)
+                    }
+                    
+                    RenderRightIconSearch(loading: loading, icon: icon, color: disabled ? Colors.black08 : iconColor, onClick: onRightIconPressed)
+                }
+                .padding(.horizontal, Spacing.M)
+                .padding(.vertical, Spacing.S)
+                .background(Colors.black01)
+                .cornerRadius(Radius.XL)
+                .overlay(
+                    RoundedRectangle(cornerRadius: Radius.XL)
+                        .stroke(getBorderColor(isFocused: isFocused, error: error, disabled: disabled), lineWidth: showBorder ? 1 : 0)
+                )
+                .frame(maxWidth: showButtonText ? .infinity : nil, alignment: .leading)
+                
+                if showButtonText {
+                    SwiftButton(action: onPressButtonText) {
+                        Text(buttonText)
+                            .foregroundColor(Colors.black17)
+                            .font(.system(size: 14, weight: .medium))
+                    }
+                    .padding(.leading, Spacing.L)
+                }
+            }
+        }
+    }
+}
+
+// MARK: - Helper Functions
+
+func getBorderColor(isFocused: Bool, error: String, disabled: Bool) -> Color {
+    if disabled {
+        return Colors.black08
+    } else if !error.isEmpty {
+        return Colors.red03
+    } else if isFocused {
+        return Colors.primary
+    } else {
+        return Colors.black04
+    }
+}
+
+
+

package/ios/Input/InputTextArea.swift

@@ -0,0 +1,242 @@
+//
+//  InputTextArea.swift
+//  Pods
+//
+//  Created by dung.pham2 on 2/12/24.
+//
+import SwiftUI
+
+// Make these constants public
+public let MAX_LENGTH = 300
+public let DEFAULT_HEIGHT: CGFloat = 104
+
+struct UITextViewWrapper: UIViewRepresentable {
+    @Binding var text: String
+    var onDone: (() -> Void)?
+    var onFocus: (() -> Void)?
+    var onBlur: (() -> Void)?
+    
+    func makeUIView(context: Context) -> UITextView {
+        let textView = UITextView()
+        textView.delegate = context.coordinator
+        return textView
+    }
+    
+    func updateUIView(_ uiView: UITextView, context: Context) {
+        uiView.text = text
+    }
+    
+    func makeCoordinator() -> Coordinator {
+        Coordinator(self)
+    }
+    
+    class Coordinator: NSObject, UITextViewDelegate {
+        var parent: UITextViewWrapper
+        
+        init(_ parent: UITextViewWrapper) {
+            self.parent = parent
+        }
+        
+        func textViewDidChange(_ textView: UITextView) {
+            parent.text = textView.text
+        }
+        
+        func textViewDidBeginEditing(_ textView: UITextView) {
+            parent.onFocus?()
+        }
+        
+        func textViewDidEndEditing(_ textView: UITextView) {
+            parent.onBlur?()
+        }
+        
+        func textView(_ textView: UITextView, shouldChangeTextIn range: NSRange, replacementText text: String) -> Bool {
+            if text == "\n" {
+                parent.onDone?()
+                return false
+            }
+            return true
+        }
+    }
+}
+
+// Make the struct public
+public struct InputTextArea: View {
+    @Binding var text: String
+    var maxLength: Int = MAX_LENGTH
+    var height: CGFloat = DEFAULT_HEIGHT
+    var floatingValue: String = ""
+    var floatingValueColor: Color = .gray
+    var floatingIcon: String = ""
+    var floatingIconColor: Color = .black
+    var placeholder: String = ""
+    var onChangeText: (String) -> Void = { _ in }
+    var error: String = ""
+    var errorSpacing: Bool = false
+    var disabled: Bool = false
+    var icon: String = ""
+    var iconColor: Color = .black
+    var onRightIconPressed: () -> Void = {}
+    var onFocus: () -> Void = {}
+    var onBlur: () -> Void = {}
+    var loading: Bool = false
+    var required: Bool = false
+    var fontWeight: Font.Weight = .regular
+    var keyboardType: UIKeyboardType = .default
+    
+    @State private var isFocused = false
+    @State private var isBlurred = false
+    
+    // Make the initializer public
+    public init(
+        text: Binding<String>,
+        maxLength: Int = MAX_LENGTH,
+        height: CGFloat = DEFAULT_HEIGHT,
+        floatingValue: String = "",
+        floatingValueColor: Color = .gray,
+        floatingIcon: String = "",
+        floatingIconColor: Color = .black,
+        placeholder: String = "",
+        onChangeText: @escaping (String) -> Void = { _ in },
+        error: String = "",
+        errorSpacing: Bool = false,
+        disabled: Bool = false,
+        icon: String = "",
+        iconColor: Color = Colors.pink03,
+        onRightIconPressed: @escaping () -> Void = {},
+        onFocus: @escaping () -> Void = {},
+        onBlur: @escaping () -> Void = {},
+        loading: Bool = false,
+        required: Bool = false,
+        fontWeight: Font.Weight = .regular,
+        keyboardType: UIKeyboardType = .default
+    ) {
+        self._text = text
+        self.maxLength = maxLength
+        self.height = height
+        self.floatingValue = floatingValue
+        self.floatingValueColor = floatingValueColor
+        self.floatingIcon = floatingIcon
+        self.floatingIconColor = floatingIconColor
+        self.placeholder = placeholder
+        self.onChangeText = onChangeText
+        self.error = error
+        self.errorSpacing = errorSpacing
+        self.disabled = disabled
+        self.icon = icon
+        self.iconColor = iconColor
+        self.onRightIconPressed = onRightIconPressed
+        self.onFocus = onFocus
+        self.onBlur = onBlur
+        self.loading = loading
+        self.required = required
+        self.fontWeight = fontWeight
+        self.keyboardType = keyboardType
+    }
+    
+    public var body: some View {
+        VStack(alignment: .leading, spacing: 0) {
+                    ZStack(alignment: .topLeading) {
+                        if !floatingValue.isEmpty || !floatingIcon.isEmpty {
+                            HStack(spacing: 4) {
+                                Text(floatingValue)
+                                    .font(.caption)
+                                    .foregroundColor(disabled ? .gray : floatingValueColor)
+                                
+                                if required {
+                                    Text("*")
+                                        .font(.caption)
+                                        .foregroundColor(.red)
+                                }
+                                
+                                if !floatingIcon.isEmpty {
+                                    Image(systemName: floatingIcon)
+                                        .font(.caption)
+                                        .foregroundColor(disabled ? .gray : floatingIconColor)
+                                }
+                            }
+                            .padding(.horizontal, 8)
+                            .background(Colors.black01)
+                            .offset(x: Spacing.S, y: -height / 10)
+                            .zIndex(10)
+                        }
+                        
+                        VStack {
+                            ZStack(alignment: .topLeading) {
+                                if text.isEmpty {
+                                    Text(placeholder)
+                                        .foregroundColor(disabled ? .gray : .gray)
+                                        .font(.system(size: 16, weight: fontWeight))
+                                        .padding(.horizontal, 16)
+                                        .padding(.vertical, 12)
+                                }
+                                
+                                UITextViewWrapper(text: $text, 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)                            }
+                            
+                            HStack {
+                                Spacer()
+                                Text("\(text.count)/\(maxLength)")
+                                    .font(.caption)
+                                    .foregroundColor(.gray)
+                            }
+                            .padding(.horizontal, 16)
+                            .padding(.bottom, 12)
+                        }
+                        .background(Color.white)
+                        .cornerRadius(8)
+                        .overlay(
+                            RoundedRectangle(cornerRadius: 8)
+                                .stroke(borderColor, lineWidth: 1)
+                        )
+                    }
+                    
+                    if !error.isEmpty {
+                        Text(error)
+                            .font(.caption)
+                            .foregroundColor(.red)
+                            .padding(.top, errorSpacing ? 8 : 4)
+                    }
+                }
+                .onReceive(NotificationCenter.default.publisher(for: UIResponder.keyboardWillShowNotification)) { _ in
+                    if !isBlurred {
+                        isFocused = true
+                        onFocus()
+                    }
+                }
+                .onReceive(NotificationCenter.default.publisher(for: UIResponder.keyboardWillHideNotification)) { _ in
+                    if isFocused {
+                        isFocused = false
+                        isBlurred = true
+                        onBlur()
+                    }
+                }
+    }
+    
+    private var borderColor: Color {
+        if disabled {
+            return Colors.black03
+        } else if !error.isEmpty {
+            return .red
+        } else if isFocused {
+            return Colors.pink03
+        } else {
+            return Colors.border
+        }
+
+    }
+}
+
+