@momo-kits/native-kits 0.0.1-beta.5 → 0.0.2-alpha.1-debug

package/ios/Application/Components.swift

@@ -0,0 +1,270 @@
+//
+//  Components.swift
+//  Pods
+//
+//  Created by sophia on 24/1/25.
+//
+
+import SwiftUI
+
+// MARK: - Enums
+
+public enum TitlePosition {
+    case left, center
+}
+
+public enum HeaderType {
+    case `default`, extended, none
+}
+
+public enum AnimatedHeaderRatio {
+    case ratio16_9
+    case ratio1_1
+    case ratio3_2
+
+    var value: CGFloat {
+        switch self {
+        case .ratio16_9: return 16.0 / 9.0
+        case .ratio1_1:  return 1.0
+        case .ratio3_2:  return 3.0 / 2.0
+        }
+    }
+}
+
+
+// MARK: - Animated Header Config
+
+public struct AnimatedHeader {
+    public var aspectRatio: AnimatedHeaderRatio = .ratio16_9
+    public var isSurface: Bool = true
+    public var composable: (_ scrollState: CGFloat) -> AnyView = { _ in AnyView(EmptyView()) }
+
+    public init(
+        aspectRatio: AnimatedHeaderRatio = .ratio16_9,
+        isSurface: Bool = true,
+        composable: @escaping (_ scrollState: CGFloat) -> AnyView = { _ in AnyView(EmptyView()) }
+    ) {
+        self.aspectRatio = aspectRatio
+        self.isSurface = isSurface
+        self.composable = composable
+    }
+}
+
+// MARK: - Utils
+
+func safeAreaTopInset() -> CGFloat {
+    if #available(iOS 15.0, *) {
+        return UIApplication.shared.connectedScenes
+            .compactMap { ($0 as? UIWindowScene)?.keyWindow?.safeAreaInsets.top }
+            .first ?? 0
+    } else {
+        return UIApplication.shared.connectedScenes
+            .compactMap { ($0 as? UIWindowScene)?.windows.first?.safeAreaInsets.top }
+            .first ?? 0
+    }
+}
+
+// MARK: - Header Background
+
+public struct HeaderBackground: View {
+    var headerType: HeaderType = .default
+    var scrollState: CGFloat
+    var headerTransparent: Bool = false
+    var fullScreenContent: Bool = false
+
+    public init(
+        headerType: HeaderType = .default,
+        scrollState: CGFloat = 0,
+        headerTransparent: Bool = false,
+        fullScreenContent: Bool = false
+    ) {
+        self.headerType = headerType
+        self.scrollState = scrollState
+        self.headerTransparent = headerTransparent
+        self.fullScreenContent = fullScreenContent
+    }
+
+    public var body: some View {
+        let statusBarHeight = safeAreaTopInset()
+        let opacity = max(0, 1 - scrollState / 200)
+        let height = fullScreenContent ? 0 :  statusBarHeight + 52
+        let backgroundColor = headerTransparent ? Color.clear : Colors.black01
+
+        Group {
+            switch headerType {
+            case .default:
+                ZStack(alignment: .bottom) {
+                    Rectangle()
+                        .fill(backgroundColor)
+                        .opacity(headerTransparent ? 0 : opacity)
+                        .frame(height: height)
+                        .shadow(color: Colors.black20.opacity(0.2), radius: 10, x: 0, y: -2)
+                        .background(backgroundColor)
+                        .overlay(
+                            headerTransparent ? AnyView(EmptyView()) :
+                            AnyView(
+                                Rectangle()
+                                    .fill(LinearGradient(
+                                        gradient: Gradient(colors: [
+                                            Color(red: 1, green: 0.8, blue: 0.87),
+                                            Color(red: 1, green: 0.8, blue: 0.87).opacity(0.5)
+                                        ]),
+                                        startPoint: .top,
+                                        endPoint: .bottom))
+                                    .opacity(opacity)
+                                    .frame(height: height))
+                        )
+                    if !headerTransparent {
+                        Rectangle()
+                            .fill(Color.black.opacity(0.1))
+                            .frame(height: 1)
+                            .frame(maxWidth: .infinity)
+                    }
+                }
+
+            case .extended:
+                ZStack {
+                    if !headerTransparent {
+                        Colors.black01
+                        LinearGradient(
+                            gradient: Gradient(colors: [
+                                Color(red: 1, green: 0.8, blue: 0.87),
+                                Color(red: 1, green: 0.8, blue: 0.87).opacity(0)
+                            ]),
+                            startPoint: .top,
+                            endPoint: .bottom
+                        )
+                        .opacity(opacity)
+                        .frame(height: 154)
+                    }
+                }
+
+            case .none:
+                EmptyView()
+            }
+        }
+    }
+}
+
+// MARK: - Bottom-tab root preference
+
+/// Set by `BottomTab` on appear so its enclosing `StackScreen` can detect that
+/// it's hosting a self-contained bottom-tab surface and skip its own bottom
+/// safe-area reservation — mirrors Compose's `Navigation.markAsBottomTabRoot()`
+/// (`navigation.isBottomTabRoot`, read by `StackScreen.kt`'s `MainContent`).
+/// Without this, `BottomTab`'s own internal safe-area handling gets an extra,
+/// unwanted inset stacked on top of it by the outer `StackScreen`, pushing the
+/// tab bar up higher than the true bottom inset.
+public struct IsBottomTabRootKey: PreferenceKey {
+    public static var defaultValue: Bool = false
+    public static func reduce(value: inout Bool, nextValue: () -> Bool) {
+        value = value || nextValue()
+    }
+}
+
+// MARK: - Header View
+
+public struct Header: View {
+    var headerType: HeaderType = .default
+    var titlePosition: TitlePosition
+    var title: String
+    /// Optional rich title (mirrors Compose's `HeaderTitle`); `.user` renders an
+    /// avatar group instead of `title`. Defaults to nil → plain `title` text.
+    var headerTitle: HeaderTitle?
+    var headerRight:  (()->any View)? = {HeaderRight()}
+    var goBack: (() -> Void)?
+    var opacity: CGFloat = 1
+    var animatedHeader: AnimatedHeader?
+    var scrollState: CGFloat = 0
+    var inputSearchProps: InputSearchProps?
+    var tintColor: Color?
+    /// Title opacity; used by the animated search header to fade the title out on scroll.
+    var titleOpacity: CGFloat = 1
+
+    public init(
+        headerType: HeaderType = .default,
+        titlePosition: TitlePosition,
+        title: String,
+        headerTitle: HeaderTitle? = nil,
+        headerRight:  (()->any View)? = {HeaderRight()},
+        goBack: (() -> Void)? = nil,
+        opacity: CGFloat = 1,
+        animatedHeader: AnimatedHeader? = nil,
+        scrollState: CGFloat = 0,
+        inputSearchProps: InputSearchProps? = nil,
+        tintColor: Color? = nil,
+        titleOpacity: CGFloat = 1
+    ) {
+        self.headerType = headerType
+        self.titlePosition = titlePosition
+        self.title = title
+        self.headerTitle = headerTitle
+        self.headerRight = headerRight
+        self.goBack = goBack
+        self.opacity = opacity
+        self.animatedHeader = animatedHeader
+        self.scrollState = scrollState
+        self.inputSearchProps = inputSearchProps
+        self.tintColor = tintColor
+        self.titleOpacity = titleOpacity
+    }
+
+    public var body: some View {
+
+        let backgroundButtonColor: Color = tintColor == Colors.black01 ? Colors.black20.opacity(0.6) : Colors.black01.opacity(0.6)
+        let borderColor: Color = tintColor == Colors.black01 ? Colors.black01.opacity(0.2) : Colors.black20.opacity(0.2)
+
+        if headerType != .none {
+            VStack(spacing: 0) {
+                ZStack {
+                    // MARK: - Left and Right Controls
+                    HStack {
+                        if let goBack = goBack {
+                            SwiftUI.Button(action: goBack) {
+                                Circle()
+                                    .stroke(borderColor, lineWidth: 0.2)
+                                    .background(Circle().fill(backgroundButtonColor))
+                                    .frame(width: 28, height: 28)
+                                    .overlay(
+                                            Icon(source: "arrow-back", size: 20, color: tintColor ?? Colors.black17)
+                                    )
+                            }
+                        }
+
+                        Spacer()
+
+                        if let headerRight = headerRight {
+                            AnyView(headerRight())
+                        }
+                    }
+                    .padding(.horizontal, 12)
+
+                    // MARK: - Title or Search
+                    HStack {
+                        if titlePosition == .left && goBack != nil {
+                            Spacer().frame(width: 38)
+                        }
+
+                        if let inputProps = inputSearchProps {
+                            InputSearch(props: inputProps)
+                        } else if case let .user(userData)? = headerTitle {
+                            if #available(iOS 16.0, *) {
+                                HeaderUserView(userData)
+                            }
+                        } else {
+                            MomoText(headerTitle?.defaultTitle ?? title, typography: .headerDefaultBold, color: tintColor ?? Colors.black17, maxLines: 1)
+                                .opacity(titleOpacity)
+                                .frame(maxWidth: titlePosition == .center ? UIScreen.main.bounds.width - 252 : nil)
+                                .frame(maxWidth: titlePosition == .center ? .infinity : UIScreen.main.bounds.width - 172, alignment: titlePosition == .center ? .center : .leading)
+                        }
+
+                        Spacer()
+                    }
+                    .padding(.horizontal)
+                }
+                .background(Color.clear)
+                .frame(height: 52)
+            }
+        }
+    }
+}

package/ios/Application/ComposeApi.swift

@@ -0,0 +1,22 @@
+import Foundation
+
+public protocol ComposeApi {
+    func request(funcName: String, params: Any, _ completion: ((String) -> Void)?)
+    func request(funcName: String, params: Any) -> String
+}
+
+// Default implementation
+public class ComposeApiImpl: ComposeApi {
+    public static let shared = ComposeApiImpl()
+    
+    private init() {}
+    
+    public func request(funcName: String, params: Any, _ completion: ((String) -> Void)?) {
+        // Implement your API request logic here
+    }
+    
+    public func request(funcName: String, params: Any) -> String {
+        // Implement your API request logic here
+        return ""
+    }
+} 

package/ios/Application/FloatingButton.swift

@@ -0,0 +1,174 @@
+import SwiftUI
+import Combine
+
+public enum FABSize {
+    case small
+    case `default`
+    /// Backward-compatible alias for older iOS call sites. Compose names this
+    /// size `DEFAULT`.
+    case large
+}
+
+public enum FABPosition {
+    case end
+    /// Backward-compatible alias for older iOS call sites. Compose names this
+    /// position `END`.
+    case right
+    case center
+}
+
+public struct FabProps {
+    public let icon: String?
+    public let iconColor: Color?
+    public let label: String?
+    public let onClick: (() -> Void)?
+    public let containerColor: Color?
+    public let size: FABSize?
+    public let iconSize: CGFloat?
+    public let scrollOffset: CGFloat?
+    public let position: FABPosition?
+    public let bottomPadding: CGFloat?
+    public let renderComponent: (() -> AnyView)?
+    
+    public init(
+        icon: String? = nil,
+        iconColor: Color? = .white,
+        label: String? = nil,
+        onClick: (() -> Void)? = nil,
+        containerColor: Color? = Colors.primary,
+        size: FABSize? = .default,
+        iconSize: CGFloat? = nil,
+        scrollOffset: CGFloat? = nil,
+        position: FABPosition? = .end,
+        bottomPadding: CGFloat? = nil,
+        renderComponent: (() -> AnyView)? = nil
+    ) {
+        self.icon = icon
+        self.iconColor = iconColor
+        self.label = label
+        self.onClick = onClick
+        self.containerColor = containerColor
+        self.size = size
+        self.iconSize = iconSize
+        self.scrollOffset = scrollOffset
+        self.position = position
+        self.bottomPadding = bottomPadding
+        self.renderComponent = renderComponent
+    }
+}
+
+public struct FloatingButton: View {
+    @State private var lastScrollOffset: CGFloat = 0
+    @State private var isExpanded: Bool = false
+    @State private var internalScrollOffset: CGFloat = 0
+    @State private var showText: Bool = true
+    @State private var fullWidth: CGFloat? = nil
+    @State private var currentWidth: CGFloat = 0
+    @State private var lastDirection: String? = nil
+    
+    private let props: FabProps
+    private var keyboardOffset: CGFloat
+    private var scrollOffset: CGFloat
+    private var bottomPadding: CGFloat { props.bottomPadding ?? 12 + keyboardOffset}
+    private var position: FABPosition? { props.position ?? .end }
+    private var containerColor: Color? { props.containerColor ?? Colors.primary }
+    private var iconColor: Color? { props.iconColor ?? .white }
+    private var label: String? { props.label }
+    private var icon: String? { props.icon }
+    private var size: FABSize? { props.size }
+    private var iconSize: CGFloat? { props.iconSize ?? defaultIconSize}
+    private var onClick: (() -> Void)? { props.onClick }
+    private var renderComponent: (() -> AnyView)? { props.renderComponent }
+    
+    public init(props: FabProps, keyboardOffset: CGFloat = 0, scrollOffset: CGFloat = 0) {
+        self.props = props
+        self.keyboardOffset = keyboardOffset
+        self.scrollOffset = scrollOffset
+    }
+    
+    private var height: CGFloat {
+        if(iconSize == nil) {
+            size == .small ? 36 : 48
+        }
+        else {
+            iconSize!
+        }
+    }
+    
+    private var minWidth: CGFloat {
+        size == .small ? 36 : 48
+    }
+    
+    private var defaultIconSize: CGFloat {
+        size == .small ? 12 : 24
+    }
+    
+    public var body: some View {
+        Group {
+            if ((icon?.isEmpty) == nil), let render = renderComponent {
+                render()
+            } else {
+                content
+            }
+        }
+        .onTapGesture {
+            onClick?()
+        }
+        .padding(Spacing.M)
+        .frame(height: height + (Spacing.M * 2))
+        .background(containerColor)
+        .cornerRadius(100)
+        .padding(.bottom, bottomPadding)
+        .frame(alignment: position == .center ? .center : .trailing)
+        .onAppear {
+            internalScrollOffset = scrollOffset
+            isExpanded = label != nil
+        }
+        .onReceive(Just(scrollOffset)) { newValue in
+            let direction = newValue > internalScrollOffset ? "down" : "up"
+
+            if direction != lastDirection {
+                lastDirection = direction
+                if direction == "down" {
+                    withAnimation(.easeOut(duration: 0.1)) {
+                        isExpanded = false
+                    }
+                    DispatchQueue.main.asyncAfter(deadline: .now() + 0.1) {
+                        showText = false
+                    }
+                } else {
+                    showText = true
+                    withAnimation(.easeIn(duration: 0.1)) {
+                        isExpanded = true
+                    }
+                    
+                }
+            }
+        }
+    }
+    
+    private var content: some View {
+        HStack(spacing: 0) {
+            ImageView(icon ?? "")
+                .scaledToFit()
+                .frame(width: iconSize, height: iconSize)
+                .foregroundColor(iconColor)
+            
+            if let label = label {
+                if showText {
+                    Spacer().frame(width: 8)
+                    MomoText(label, typography: .actionDefaultBold, color: .white, maxLines: 1)
+                        .background(
+                            GeometryReader { geo in
+                                Color.clear.onAppear {
+                                    fullWidth = geo.size.width
+                                }
+                            }
+                        )
+                        .opacity(isExpanded ? 1 : 0)
+                }
+            }
+
+        }
+    }
+}