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

package/ios/Colors+Radius+Spacing/Theme.swift

@@ -0,0 +1,295 @@
+//
+//  Theme.swift
+//  MoMoUIKits
+//
+//  Created by sophia on 25/2/26.
+//
+
+import Foundation
+import SwiftUI
+
+// MARK: - Background
+
+public struct Background {
+    public let `default`: Color
+    public let surface: Color
+    public let tonal: Color
+    public let pressed: Color
+    public let selected: Color
+    public let disable: Color
+
+    public init(
+        default defaultColor: Color,
+        surface: Color,
+        tonal: Color,
+        pressed: Color,
+        selected: Color,
+        disable: Color
+    ) {
+        self.default = defaultColor
+        self.surface = surface
+        self.tonal = tonal
+        self.pressed = pressed
+        self.selected = selected
+        self.disable = disable
+    }
+}
+
+// MARK: - TextColors
+
+public struct TextColors {
+    public let `default`: Color
+    public let secondary: Color
+    public let hint: Color
+    public let disable: Color
+
+    public init(
+        default defaultColor: Color,
+        secondary: Color,
+        hint: Color,
+        disable: Color
+    ) {
+        self.default = defaultColor
+        self.secondary = secondary
+        self.hint = hint
+        self.disable = disable
+    }
+}
+
+// MARK: - BorderColors
+
+public struct BorderColors {
+    public let `default`: Color
+    public let disable: Color
+
+    public init(default defaultColor: Color, disable: Color) {
+        self.default = defaultColor
+        self.disable = disable
+    }
+}
+
+// MARK: - ColorSet
+
+public struct ColorSet {
+    public let primary: Color
+    public let secondary: Color
+    public let container: Color
+
+    public init(primary: Color, secondary: Color, container: Color) {
+        self.primary = primary
+        self.secondary = secondary
+        self.container = container
+    }
+}
+
+// MARK: - ColorScheme
+
+public struct ColorScheme {
+    public let primary: Color
+    public let secondary: Color
+    public let gradient: Color
+    public let background: Background
+    public let text: TextColors
+    public let border: BorderColors
+    public let success: ColorSet
+    public let warning: ColorSet
+    public let error: ColorSet
+    public let highlight: ColorSet
+    public let interactive: ColorSet
+
+    public init(
+        primary: Color,
+        secondary: Color,
+        gradient: Color,
+        background: Background,
+        text: TextColors,
+        border: BorderColors,
+        success: ColorSet,
+        warning: ColorSet,
+        error: ColorSet,
+        highlight: ColorSet,
+        interactive: ColorSet
+    ) {
+        self.primary = primary
+        self.secondary = secondary
+        self.gradient = gradient
+        self.background = background
+        self.text = text
+        self.border = border
+        self.success = success
+        self.warning = warning
+        self.error = error
+        self.highlight = highlight
+        self.interactive = interactive
+    }
+}
+
+// MARK: - ThemeAssets
+
+public struct ThemeAssets {
+    public let headerBackground: String?
+
+    public init(headerBackground: String? = nil) {
+        self.headerBackground = headerBackground
+    }
+
+    public var isHeaderImage: Bool {
+        guard let url = headerBackground else { return false }
+        return !url.isEmpty
+    }
+}
+
+// MARK: - Theme
+
+public struct Theme {
+    public let dark: Bool
+    public let colors: ColorScheme
+    public let font: String
+    public let assets: ThemeAssets
+
+    public init(dark: Bool, colors: ColorScheme, font: String, assets: ThemeAssets) {
+        self.dark = dark
+        self.colors = colors
+        self.font = font
+        self.assets = assets
+    }
+
+    public func copy(
+        dark: Bool? = nil,
+        colors: ColorScheme? = nil,
+        font: String? = nil,
+        assets: ThemeAssets? = nil
+    ) -> Theme {
+        Theme(
+            dark: dark ?? self.dark,
+            colors: colors ?? self.colors,
+            font: font ?? self.font,
+            assets: assets ?? self.assets
+        )
+    }
+}
+
+// MARK: - Default Theme (Light)
+
+public let defaultTheme = Theme(
+    dark: false,
+    colors: ColorScheme(
+        primary: Color.momoAsset("ThemeColors/primary"),
+        secondary: Color.momoAsset("ThemeColors/secondary"),
+        gradient: Color.momoAsset("ThemeColors/gradient"),
+        background: Background(
+            default: Color.momoAsset("ThemeColors/background-default"),
+            surface: Color.momoAsset("ThemeColors/background-surface"),
+            tonal: Color.momoAsset("ThemeColors/background-tonal"),
+            pressed: Color.momoAsset("ThemeColors/background-pressed"),
+            selected: Color.momoAsset("ThemeColors/background-selected"),
+            disable: Color.momoAsset("ThemeColors/background-disable")
+        ),
+        text: TextColors(
+            default: Color.momoAsset("ThemeColors/text-default"),
+            secondary: Color.momoAsset("ThemeColors/text-secondary"),
+            hint: Color.momoAsset("ThemeColors/text-hint"),
+            disable: Color.momoAsset("ThemeColors/text-disable")
+        ),
+        border: BorderColors(
+            default: Color.momoAsset("ThemeColors/border-default"),
+            disable: Color.momoAsset("ThemeColors/border-disable")
+        ),
+        success: ColorSet(
+            primary: Colors.green03,
+            secondary: Colors.green07,
+            container: Colors.green08
+        ),
+        warning: ColorSet(
+            primary: Colors.orange03,
+            secondary: Colors.orange07,
+            container: Colors.orange08
+        ),
+        error: ColorSet(
+            primary: Colors.red03,
+            secondary: Colors.red07,
+            container: Colors.red08
+        ),
+        highlight: ColorSet(
+            primary: Colors.mint03,
+            secondary: Colors.mint07,
+            container: Colors.mint08
+        ),
+        interactive: ColorSet(
+            primary: Colors.blue03,
+            secondary: Colors.blue07,
+            container: Colors.blue08
+        )
+    ),
+    font: "MomoTrustSans",
+    assets: ThemeAssets(headerBackground: nil)
+)
+
+// MARK: - Dark Theme
+
+public let darkTheme = Theme(
+    dark: true,
+    colors: ColorScheme(
+        primary: Colors.pink04,
+        secondary: Colors.pink08,
+        gradient: Color(hex: "FDCADE"),
+        background: Background(
+            default: Color(hex: "121212"),
+            surface: Color(hex: "1E1E1E"),
+            tonal: Colors.pink10,
+            pressed: Color(hex: "1A1A1A"),
+            selected: Colors.pink11,
+            disable: Color(hex: "303030")
+        ),
+        text: TextColors(
+            default: Color.white,
+            secondary: Color(hex: "B0B0B0"),
+            hint: Color(hex: "727272"),
+            disable: Color(hex: "505050")
+        ),
+        border: BorderColors(
+            default: Color(hex: "2A2A2A"),
+            disable: Color(hex: "242424")
+        ),
+        success: ColorSet(
+            primary: Colors.green03,
+            secondary: Colors.green07,
+            container: Colors.green08
+        ),
+        warning: ColorSet(
+            primary: Colors.orange03,
+            secondary: Colors.orange07,
+            container: Colors.orange08
+        ),
+        error: ColorSet(
+            primary: Colors.red03,
+            secondary: Colors.red07,
+            container: Colors.red08
+        ),
+        highlight: ColorSet(
+            primary: Colors.mint03,
+            secondary: Colors.mint07,
+            container: Colors.mint08
+        ),
+        interactive: ColorSet(
+            primary: Colors.blue03,
+            secondary: Colors.blue07,
+            container: Colors.blue08
+        )
+    ),
+    font: "MomoTrustSans",
+    assets: ThemeAssets(headerBackground: nil)
+)
+
+// MARK: - AppTheme Environment Key
+
+private struct AppThemeKey: EnvironmentKey {
+    static let defaultValue: Theme = defaultTheme
+}
+
+public extension EnvironmentValues {
+    var appTheme: Theme {
+        get { self[AppThemeKey.self] }
+        set { self[AppThemeKey.self] = newValue }
+    }
+}

package/ios/DateTimePicker/DateTimePicker.swift

@@ -0,0 +1,212 @@
+import SwiftUI
+
+// MARK: - Constants
+
+private let datePickerHeight: CGFloat = 210
+private let datePickerWithLabelsHeight: CGFloat = 238
+
+// MARK: - DateTimePicker
+
+/// A wheel-style date/time picker matching Compose `DateTimePicker`.
+///
+/// The `format` string drives which columns are shown:
+/// - `DD` day, `MM` month, `YYYY` year, `HH` hour, `mm` minute.
+/// - `"HH:mm"` shows hour + minute; a lone `"HH"` switches the hour wheel to a
+///   12-hour clock with an AM/PM column.
+public struct DateTimePicker: View {
+    @Environment(\.appTheme) private var theme
+
+    // MARK: Lifecycle
+
+    public init(
+        format: String = "DD-MM-YYYY",
+        minuteInterval: Int = 1,
+        selectedValue: Date? = nil,
+        minDate: Date? = nil,
+        maxDate: Date? = nil,
+        arrayLabelTime: [String] = [],
+        onChange: @escaping (Date) -> Void
+    ) {
+        self.format = format
+        self.minuteInterval = minuteInterval
+        self.selectedValue = selectedValue
+        self.minDate = minDate
+        self.maxDate = maxDate
+        self.arrayLabelTime = arrayLabelTime
+        self.onChange = onChange
+
+        let calendar = Calendar.current
+        let effectiveSelected = selectedValue ?? DateTimePickerUtils.getCurrentDateTime()
+        let effectiveMin = minDate ?? DateTimePickerUtils.createRelativeDate(years: -10)
+        let effectiveMax = maxDate ?? DateTimePickerUtils.createRelativeDate(years: 10)
+
+        // needCheckRange is true only when the caller supplied no bounds.
+        let needCheckRange = (minDate == nil && maxDate == nil)
+
+        let initialValue: Date
+        if !needCheckRange {
+            initialValue = effectiveSelected
+        } else if effectiveSelected < effectiveMin {
+            initialValue = effectiveMin
+        } else if effectiveSelected > effectiveMax {
+            initialValue = effectiveMax
+        } else {
+            initialValue = effectiveSelected
+        }
+
+        let comps = calendar.dateComponents([.year, .month, .day, .hour, .minute], from: initialValue)
+        self._currentData = State(initialValue: DateTimePickerData(
+            day: comps.day ?? 1,
+            month: comps.month ?? 1,
+            year: comps.year ?? 2000,
+            hour: comps.hour ?? 0,
+            minute: comps.minute ?? 0
+        ))
+
+        self.effectiveMinComponents = calendar.dateComponents([.year, .month, .day, .hour, .minute], from: effectiveMin)
+        self.effectiveMaxComponents = calendar.dateComponents([.year, .month, .day, .hour, .minute], from: effectiveMax)
+        self.needCheckRange = needCheckRange
+    }
+
+    // MARK: Public
+
+    public var body: some View {
+        let components = DateTimePickerUtils.getDateComponents(
+            format: format,
+            currentData: currentData,
+            minDate: effectiveMinComponents,
+            maxDate: effectiveMaxComponents,
+            minuteInterval: minuteInterval
+        )
+        let pickerHeight = arrayLabelTime.isEmpty ? datePickerHeight : datePickerWithLabelsHeight
+
+        return HStack(spacing: Spacing.M) {
+            ForEach(Array(components.enumerated()), id: \.offset) { index, component in
+                let hasLabel = index < arrayLabelTime.count && !arrayLabelTime[index].isEmpty
+
+                VStack(spacing: 0) {
+                    if hasLabel {
+                        MomoText(arrayLabelTime[index], typography: .actionSBold, color: theme.colors.text.default)
+                            .padding(.bottom, Spacing.S)
+                    }
+
+                    WheelPicker(
+                        name: component.name,
+                        data: component.data,
+                        selectedData: selectedDataFor(component.name),
+                        onChange: onWheelChange
+                    )
+                }
+                .frame(maxWidth: .infinity)
+            }
+        }
+        .frame(maxWidth: .infinity)
+        .frame(height: pickerHeight)
+        .background(theme.colors.background.surface)
+        .padding(.horizontal, Spacing.M)
+        .onAppear { emitIfValid() }
+    }
+
+    // MARK: Internal
+
+    let format: String
+    let minuteInterval: Int
+    let selectedValue: Date?
+    let minDate: Date?
+    let maxDate: Date?
+    let arrayLabelTime: [String]
+    let onChange: (Date) -> Void
+
+    @State private var currentData: DateTimePickerData
+
+    private let effectiveMinComponents: DateComponents
+    private let effectiveMaxComponents: DateComponents
+    private let needCheckRange: Bool
+
+    private func selectedDataFor(_ name: String) -> String {
+        switch name {
+        case "day": return DateTimePickerUtils.paddingNum(currentData.day)
+        case "month": return DateTimePickerUtils.paddingNum(currentData.month)
+        case "year": return String(currentData.year)
+        case "hour": return DateTimePickerUtils.paddingNum(currentData.hour)
+        case "minute": return DateTimePickerUtils.paddingNum(currentData.minute)
+        case "timeMode": return currentData.timeMode
+        default: return ""
+        }
+    }
+
+    /// Mirrors Compose `onWheelChangeValue`: applies value and coerces day/month
+    /// to stay within the effective min/max bounds.
+    private func onWheelChange(_ name: String, _ value: String) {
+        var day = name == "day" ? (Int(value) ?? currentData.day) : currentData.day
+        var month = name == "month" ? (Int(value) ?? currentData.month) : currentData.month
+        let year = name == "year" ? (Int(value) ?? currentData.year) : currentData.year
+        let hour = name == "hour" ? (Int(value) ?? currentData.hour) : currentData.hour
+        let minute = name == "minute" ? (Int(value) ?? currentData.minute) : currentData.minute
+        let timeMode = name == "timeMode" ? value : currentData.timeMode
+
+        let maxYear = effectiveMaxComponents.year ?? year
+        let minYear = effectiveMinComponents.year ?? year
+        let maxMonth = effectiveMaxComponents.month ?? 12
+        let minMonth = effectiveMinComponents.month ?? 1
+        let maxDayBound = effectiveMaxComponents.day ?? 31
+        let minDayBound = effectiveMinComponents.day ?? 1
+
+        if name == "year" {
+            if year == maxYear {
+                month = min(max(month, 1), maxMonth)
+            } else if year == minYear {
+                month = min(max(month, minMonth), 12)
+            }
+        }
+
+        if name == "month" || name == "year" {
+            let maxDayOfMonth: Int
+            switch month {
+            case 4, 6, 9, 11: maxDayOfMonth = 30
+            case 2: maxDayOfMonth = (year % 4 == 0 && (year % 100 != 0 || year % 400 == 0)) ? 29 : 28
+            default: maxDayOfMonth = 31
+            }
+
+            if year == maxYear && month == maxMonth {
+                day = min(max(day, 1), maxDayBound)
+            } else if year == minYear && month == minMonth {
+                day = min(max(day, minDayBound), maxDayOfMonth)
+            } else if day > maxDayOfMonth {
+                day = maxDayOfMonth
+            }
+        }
+
+        currentData = DateTimePickerData(
+            day: day,
+            month: month,
+            year: year,
+            hour: hour,
+            minute: minute,
+            timeMode: timeMode
+        )
+        emitIfValid()
+    }
+
+    /// Emit `onChange` only when the assembled date is valid and (when bounds were
+    /// not supplied) within the effective min/max range. Mirrors the Compose
+    /// `snapshotFlow.mapNotNull` filter.
+    private func emitIfValid() {
+        guard let date = currentData.toDate() else { return }
+        if !needCheckRange {
+            onChange(date)
+            return
+        }
+        let calendar = Calendar.current
+        guard
+            let minDate = calendar.date(from: effectiveMinComponents),
+            let maxDate = calendar.date(from: effectiveMaxComponents)
+        else {
+            onChange(date)
+            return
+        }
+        if date >= minDate && date <= maxDate {
+            onChange(date)
+        }
+    }
+}

package/ios/DateTimePicker/DateTimePickerTypes.swift

@@ -0,0 +1,55 @@
+import Foundation
+
+// MARK: - PickerData
+
+/// Internal mutable representation of the picker's current selection.
+/// Mirrors Compose `PickerData`.
+public struct DateTimePickerData: Equatable {
+    public var day: Int
+    public var month: Int
+    public var year: Int
+    public var hour: Int
+    public var minute: Int
+    public var timeMode: String
+
+    public init(
+        day: Int,
+        month: Int,
+        year: Int,
+        hour: Int = 0,
+        minute: Int = 0,
+        timeMode: String = ""
+    ) {
+        self.day = day
+        self.month = month
+        self.year = year
+        self.hour = hour
+        self.minute = minute
+        self.timeMode = timeMode
+    }
+
+    /// Convert to a `DateComponents` based value. Returns `nil` if the date is invalid.
+    public func toDate(calendar: Calendar = Calendar.current) -> Date? {
+        var components = DateComponents()
+        components.year = year
+        components.month = month
+        components.day = day
+        components.hour = hour
+        components.minute = minute
+        components.second = 0
+        return calendar.date(from: components)
+    }
+}
+
+// MARK: - DateComponent
+
+/// A single wheel column descriptor. Mirrors Compose `DateComponent`.
+public struct DateTimePickerComponent: Equatable {
+    public let name: String
+    public let data: [String]
+
+    public init(name: String, data: [String]) {
+        self.name = name
+        self.data = data
+    }
+}