@momo-kits/native-kits 0.162.2-beta.26-debug → 0.162.2-beta.27-debug

package/ios/Stepper/Stepper.swift

@@ -1,220 +0,0 @@
-import SwiftUI
-
-// ---------------------------------------------------------------------------
-// Size variant
-// ---------------------------------------------------------------------------
-
-public enum StepperSize {
-    case large
-    case small
-}
-
-private struct StepperSizeSpec {
-    let buttonSize: CGFloat
-    let iconSize: CGFloat
-    let numberMinWidth: CGFloat
-    let numberHeight: CGFloat
-}
-
-private func stepperSizeSpec(_ size: StepperSize) -> StepperSizeSpec {
-    switch size {
-    case .large:
-        return StepperSizeSpec(buttonSize: 36, iconSize: 22, numberMinWidth: 32, numberHeight: 28)
-    case .small:
-        return StepperSizeSpec(buttonSize: 28, iconSize: 18, numberMinWidth: 28, numberHeight: 24)
-    }
-}
-
-// ---------------------------------------------------------------------------
-// Disabled spec — mirrors Compose `disabled: Any` (Bool or per-part array)
-// ---------------------------------------------------------------------------
-
-public struct StepperDisabled {
-    let minus: Bool
-    let plus: Bool
-
-    fileprivate var number: Bool { minus && plus }
-
-    public init(minus: Bool, plus: Bool) {
-        self.minus = minus
-        self.plus = plus
-    }
-
-    /// All parts share the same disabled state.
-    public init(_ all: Bool) {
-        self.minus = all
-        self.plus = all
-    }
-}
-
-extension StepperDisabled: ExpressibleByBooleanLiteral {
-    public init(booleanLiteral value: Bool) {
-        self.init(value)
-    }
-}
-
-// ---------------------------------------------------------------------------
-// Private sub-views
-// ---------------------------------------------------------------------------
-
-private struct StepperButton: View {
-    @Environment(\.appTheme) private var theme
-
-    var sign: String
-    var size: StepperSize
-    var disabled: Bool
-    var onPress: () -> Void
-
-    var body: some View {
-        let specs = stepperSizeSpec(size)
-        let iconColor: Color = disabled ? theme.colors.text.disable : theme.colors.primary
-        let iconName = sign == "-" ? "24_navigation_minus_circle" : "24_navigation_plus_circle"
-
-        SwiftUI.Button(action: { if !disabled { onPress() } }) {
-            ZStack {
-                Circle().fill(theme.colors.background.disable)
-                Icon(source: iconName, size: specs.iconSize, color: iconColor)
-            }
-            .frame(width: specs.buttonSize, height: specs.buttonSize)
-        }
-        .buttonStyle(.plain)
-        .disabled(disabled)
-    }
-}
-
-private struct StepperNumberView: View {
-    @Environment(\.appTheme) private var theme
-
-    @Binding var text: String
-    var size: StepperSize
-    var disabled: Bool
-    var editable: Bool
-
-    var body: some View {
-        let specs = stepperSizeSpec(size)
-        let textColor: Color = disabled ? theme.colors.text.disable : theme.colors.text.default
-        let borderColor: Color = disabled ? theme.colors.border.disable : theme.colors.border.default
-
-        Group {
-            if editable {
-                TextField("", text: $text)
-                    .keyboardType(.numberPad)
-                    .multilineTextAlignment(.center)
-                    .disabled(disabled)
-            } else {
-                MomoText(text, typography: .descriptionDefaultRegular, color: textColor)
-            }
-        }
-        .font(.system(size: scaleSize(12)))
-        .ignoreBoldTextSetting()
-        .foregroundColor(textColor)
-        .frame(minWidth: specs.numberMinWidth)
-        .frame(height: specs.numberHeight)
-        .padding(.horizontal, Spacing.XS)
-        .overlay(
-            RoundedRectangle(cornerRadius: Radius.S)
-                .stroke(borderColor, lineWidth: 1)
-        )
-    }
-}
-
-// ---------------------------------------------------------------------------
-// Public API — MomoStepper
-// ---------------------------------------------------------------------------
-
-/// MomoStepper — quantity +/- control. Layout: [- button] [value] [+ button].
-///
-/// Named `MomoStepper` to avoid shadowing SwiftUI's built-in `Stepper`.
-///
-/// - Parameters:
-///   - value: Binding to the current value. Clamped to `min...max`.
-///   - min: Minimum allowed value (default 0). Minus auto-disables at this bound.
-///   - max: Maximum allowed value (default 100). Plus auto-disables at this bound.
-///   - step: Amount added/subtracted per press (default 1).
-///   - size: Visual size variant (default `.large`).
-///   - disabled: Disable state — `true` for everything, or `StepperDisabled(minus:plus:)`.
-///   - editable: When `true` the number display becomes a keyboard input (default false).
-///   - onValueChange: Callback invoked with the new value on every change.
-public struct MomoStepper: View {
-    @Binding private var value: Int
-    private let min: Int
-    private let max: Int
-    private let step: Int
-    private let size: StepperSize
-    private let disabled: StepperDisabled
-    private let editable: Bool
-    private let onValueChange: (Int) -> Void
-
-    @State private var editingText: String = ""
-
-    public init(
-        value: Binding<Int>,
-        min: Int = 0,
-        max: Int = 100,
-        step: Int = 1,
-        size: StepperSize = .large,
-        disabled: StepperDisabled = false,
-        editable: Bool = false,
-        onValueChange: @escaping (Int) -> Void = { _ in }
-    ) {
-        self._value = value
-        self.min = min
-        self.max = max
-        self.step = step
-        self.size = size
-        self.disabled = disabled
-        self.editable = editable
-        self.onValueChange = onValueChange
-    }
-
-    private func clamp(_ raw: Int) -> Int {
-        Swift.max(min, Swift.min(max, raw))
-    }
-
-    private func applyValue(_ raw: Int) {
-        let parsed = clamp(raw)
-        value = parsed
-        editingText = String(parsed)
-        onValueChange(parsed)
-    }
-
-    public var body: some View {
-        let effectiveMinusDisabled = disabled.minus || value <= min
-        let effectivePlusDisabled = disabled.plus || value >= max
-
-        HStack(spacing: Spacing.S) {
-            StepperButton(
-                sign: "-",
-                size: size,
-                disabled: effectiveMinusDisabled,
-                onPress: { applyValue(value - step) }
-            )
-
-            StepperNumberView(
-                text: Binding(
-                    get: { editable ? editingText : String(value) },
-                    set: { newText in
-                        editingText = newText
-                        let parsed = Int(newText.filter { $0.isNumber }) ?? 0
-                        applyValue(parsed)
-                    }
-                ),
-                size: size,
-                disabled: disabled.number,
-                editable: editable
-            )
-
-            StepperButton(
-                sign: "+",
-                size: size,
-                disabled: effectivePlusDisabled,
-                onPress: { applyValue(value + step) }
-            )
-        }
-        .onAppear {
-            let clamped = clamp(value)
-            if clamped != value { value = clamped }
-            editingText = String(clamped)
-        }
-    }
-}

package/ios/Steps/Steps.swift

@@ -1,451 +0,0 @@
-import SwiftUI
-
-// ─── Data model ────────────────────────────────────────────────────────────────
-
-/// A single step rendered inside a ``Steps`` indicator.
-public struct StepItem: Identifiable {
-    public let id = UUID()
-    public let title: String
-    public let description: String?
-    public let error: Bool
-    public let time: String?
-
-    public init(
-        title: String,
-        description: String? = nil,
-        error: Bool = false,
-        time: String? = nil
-    ) {
-        self.title = title
-        self.description = description
-        self.error = error
-        self.time = time
-    }
-}
-
-// ─── Enumerations ──────────────────────────────────────────────────────────────
-
-public enum StepsSize {
-    case small
-    case large
-}
-
-public enum StepsAlign {
-    case left
-    case right
-    case center
-    case stretch
-}
-
-// ─── Internal status ───────────────────────────────────────────────────────────
-
-private enum StepStatus {
-    case incomplete
-    case current
-    case completed
-    case error
-    case disabled
-}
-
-private func resolveStatus(
-    activeIndex: Int,
-    currentIndex: Int,
-    error: Bool,
-    disabled: Bool
-) -> StepStatus {
-    if disabled { return .disabled }
-    if error { return .error }
-    if activeIndex == currentIndex { return .current }
-    if activeIndex > currentIndex { return .completed }
-    return .incomplete
-}
-
-// ─── Color helpers ─────────────────────────────────────────────────────────────
-
-private func resolveIconBgAndBorder(_ status: StepStatus, theme: Theme) -> (bg: Color, border: Color) {
-    switch status {
-    case .current, .completed:
-        return (theme.colors.primary, theme.colors.background.tonal)
-    case .error:
-        return (theme.colors.error.primary, theme.colors.error.container)
-    case .disabled:
-        return (Colors.pink08, Colors.pink10)
-    case .incomplete:
-        return (Colors.black06, theme.colors.border.default)
-    }
-}
-
-private func resolveTitleColor(_ status: StepStatus, theme: Theme) -> Color {
-    switch status {
-    case .current:
-        return theme.colors.primary
-    case .error:
-        return theme.colors.error.primary
-    case .disabled:
-        return theme.colors.text.disable
-    default:
-        return theme.colors.text.default
-    }
-}
-
-// ─── Step bubble ───────────────────────────────────────────────────────────────
-
-private struct StepBubble: View {
-    @Environment(\.appTheme) private var theme
-
-    let index: Int
-    let isActive: Bool
-    let error: Bool
-    let size: StepsSize
-    let status: StepStatus
-    let useNumber: Bool
-    let customIcon: String?
-
-    private var bubbleSize: CGFloat { size == .small ? 16 : 24 }
-    private var innerSize: CGFloat { size == .small ? 12 : 16 }
-    private var dotSize: CGFloat { size == .small ? 6 : 8 }
-
-    var body: some View {
-        let colors = resolveIconBgAndBorder(status, theme: theme)
-        ZStack {
-            Circle()
-                .fill(colors.bg)
-                .overlay(Circle().strokeBorder(colors.border, lineWidth: 2))
-
-            bubbleContent
-        }
-        .frame(width: bubbleSize, height: bubbleSize)
-    }
-
-    @ViewBuilder
-    private var bubbleContent: some View {
-        if useNumber {
-            MomoText(
-                "\(index + 1)",
-                typography: .headerXsSemibold,
-                color: Colors.black01
-            )
-        } else if isActive {
-            if let customIcon = customIcon, !customIcon.isEmpty {
-                Icon(source: customIcon, size: innerSize, color: Colors.black01)
-            } else {
-                Circle()
-                    .fill(Colors.black01)
-                    .frame(width: dotSize, height: dotSize)
-            }
-        } else {
-            Icon(
-                source: error ? "navigation_close" : "notifications_check",
-                size: innerSize,
-                color: Colors.black01
-            )
-        }
-    }
-}
-
-// ─── Horizontal layout ─────────────────────────────────────────────────────────
-
-private struct StepsHorizontal: View {
-    @Environment(\.appTheme) private var theme
-
-    let steps: [StepItem]
-    let activeIndex: Int
-    let size: StepsSize
-    let useNumber: Bool
-    let align: StepsAlign
-    let customIcon: String?
-    let disabled: Bool
-    let onPress: ((StepItem, Int) -> Void)?
-
-    private var completedLine: Color { theme.colors.primary.opacity(0.2) }
-    private var defaultLine: Color { theme.colors.background.default }
-
-    var body: some View {
-        HStack(alignment: .top, spacing: 0) {
-            ForEach(Array(steps.enumerated()), id: \.element.id) { index, item in
-                column(index: index, item: item)
-                    .frame(maxWidth: .infinity)
-            }
-        }
-        .frame(maxWidth: .infinity)
-    }
-
-    @ViewBuilder
-    private func column(index: Int, item: StepItem) -> some View {
-        let status = resolveStatus(
-            activeIndex: activeIndex,
-            currentIndex: index,
-            error: item.error,
-            disabled: disabled
-        )
-        let isActiveOrError = status == .current || status == .error
-        let titleStyle: TypographyStyle = isActiveOrError
-            ? .headerXsSemibold : .descriptionDefaultRegular
-        let descStyle: TypographyStyle = size == .small
-            ? .descriptionXsRegular : .descriptionDefaultRegular
-        let titleColor = resolveTitleColor(status, theme: theme)
-        let subColor = disabled ? theme.colors.text.disable : theme.colors.text.hint
-
-        let colAlignment = horizontalAlignment(for: index)
-        let textAlignment = textAlign(for: index)
-
-        let hideLineLeft = align == .left || (align == .stretch && index == 0)
-        let hideLineRight = align == .right || (align == .stretch && index == steps.count - 1)
-
-        let lineLeft: Color = index == 0
-            ? Color.clear
-            : (activeIndex >= index ? completedLine : defaultLine)
-        let lineRight: Color = index == steps.count - 1
-            ? Color.clear
-            : (activeIndex > index ? completedLine : defaultLine)
-
-        let clickable = status == .completed && onPress != nil && !disabled
-
-        VStack(alignment: colAlignment, spacing: 0) {
-            if let time = item.time, !time.isEmpty {
-                MomoText(time, typography: .descriptionXsRegular, color: subColor)
-                    .multilineTextAlignment(textAlignment)
-                    .frame(maxWidth: .infinity, alignment: frameAlignment(colAlignment))
-            }
-
-            HStack(spacing: 0) {
-                if !hideLineLeft {
-                    lineLeft
-                        .frame(height: 2)
-                        .frame(maxWidth: .infinity)
-                        .clipShape(RoundedCorner(radius: Radius.XS, corners: [.topRight, .bottomRight]))
-                }
-                StepBubble(
-                    index: index,
-                    isActive: activeIndex == index,
-                    error: item.error,
-                    size: size,
-                    status: status,
-                    useNumber: useNumber,
-                    customIcon: customIcon
-                )
-                .padding(.leading, hideLineLeft ? 0 : Spacing.XS)
-                .padding(.trailing, hideLineRight ? 0 : Spacing.XS)
-                .padding(.vertical, Spacing.XS)
-                if !hideLineRight {
-                    lineRight
-                        .frame(height: 2)
-                        .frame(maxWidth: .infinity)
-                        .clipShape(RoundedCorner(radius: Radius.XS, corners: [.topLeft, .bottomLeft]))
-                }
-            }
-            .frame(maxWidth: .infinity)
-
-            if !item.title.isEmpty {
-                MomoText(item.title, typography: titleStyle, color: titleColor)
-                    .multilineTextAlignment(textAlignment)
-                    .frame(maxWidth: .infinity, alignment: frameAlignment(colAlignment))
-                    .padding(.bottom, Spacing.XXS)
-            }
-
-            if let desc = item.description, !desc.isEmpty {
-                MomoText(desc, typography: descStyle, color: subColor)
-                    .multilineTextAlignment(textAlignment)
-                    .frame(maxWidth: .infinity, alignment: frameAlignment(colAlignment))
-            }
-        }
-        .contentShape(Rectangle())
-        .onTapGesture {
-            if clickable { onPress?(item, index) }
-        }
-    }
-
-    private func horizontalAlignment(for index: Int) -> HorizontalAlignment {
-        switch align {
-        case .left: return .leading
-        case .right: return .trailing
-        case .center: return .center
-        case .stretch:
-            if index == 0 { return .leading }
-            if index == steps.count - 1 { return .trailing }
-            return .center
-        }
-    }
-
-    private func textAlign(for index: Int) -> TextAlignment {
-        switch align {
-        case .left: return .leading
-        case .right: return .trailing
-        case .center: return .center
-        case .stretch:
-            if index == 0 { return .leading }
-            if index == steps.count - 1 { return .trailing }
-            return .center
-        }
-    }
-
-    private func frameAlignment(_ h: HorizontalAlignment) -> Alignment {
-        switch h {
-        case .leading: return .leading
-        case .trailing: return .trailing
-        default: return .center
-        }
-    }
-}
-
-// ─── Vertical layout ───────────────────────────────────────────────────────────
-
-private struct StepsVertical: View {
-    @Environment(\.appTheme) private var theme
-
-    let steps: [StepItem]
-    let activeIndex: Int
-    let size: StepsSize
-    let useNumber: Bool
-    let customIcon: String?
-    let disabled: Bool
-    let onPress: ((StepItem, Int) -> Void)?
-
-    private var completedLine: Color { theme.colors.primary.opacity(0.2) }
-    private var defaultLine: Color { theme.colors.background.default }
-    private var useSmall: Bool { size == .small }
-    private var connectorHeight: CGFloat { useSmall ? 24 : 32 }
-
-    var body: some View {
-        VStack(spacing: 0) {
-            ForEach(Array(steps.enumerated()), id: \.element.id) { index, item in
-                row(index: index, item: item)
-            }
-        }
-        .frame(maxWidth: .infinity)
-    }
-
-    @ViewBuilder
-    private func row(index: Int, item: StepItem) -> some View {
-        let status = resolveStatus(
-            activeIndex: activeIndex,
-            currentIndex: index,
-            error: item.error,
-            disabled: disabled
-        )
-        let isActiveOrError = status == .current || status == .error
-        let isLast = index == steps.count - 1
-
-        let titleStyle: TypographyStyle = isActiveOrError
-            ? (useSmall ? .headerXsSemibold : .headerSSemibold)
-            : (useSmall ? .descriptionDefaultRegular : .bodyDefaultRegular)
-        let descStyle: TypographyStyle = useSmall
-            ? .descriptionXsRegular : .descriptionDefaultRegular
-
-        let titleColor = resolveTitleColor(status, theme: theme)
-        let subColor = disabled ? theme.colors.text.disable : theme.colors.text.hint
-        let lineColor = activeIndex > index ? completedLine : defaultLine
-
-        let clickable = status == .completed && onPress != nil && !disabled
-
-        HStack(alignment: .top, spacing: 0) {
-            VStack(spacing: 0) {
-                StepBubble(
-                    index: index,
-                    isActive: activeIndex == index,
-                    error: item.error,
-                    size: size,
-                    status: status,
-                    useNumber: useNumber,
-                    customIcon: customIcon
-                )
-                if !isLast {
-                    lineColor
-                        .frame(width: 2, height: connectorHeight)
-                        .padding(.vertical, Spacing.XS)
-                }
-            }
-            .padding(.trailing, Spacing.M)
-
-            VStack(alignment: .leading, spacing: 0) {
-                HStack(alignment: .top, spacing: 0) {
-                    MomoText(item.title, typography: titleStyle, color: titleColor)
-                        .lineLimit(2)
-                        .frame(maxWidth: .infinity, alignment: .leading)
-                        .padding(.trailing, Spacing.S)
-                    if let time = item.time, !time.isEmpty {
-                        MomoText(time, typography: .descriptionXsRegular, color: subColor)
-                    }
-                }
-                .frame(maxWidth: .infinity)
-
-                if let desc = item.description, !desc.isEmpty {
-                    MomoText(desc, typography: descStyle, color: subColor)
-                        .frame(maxWidth: .infinity, alignment: .leading)
-                        .padding(.top, Spacing.XXS)
-                }
-            }
-            .frame(maxWidth: .infinity)
-            .padding(.bottom, isLast ? 0 : Spacing.S)
-        }
-        .frame(maxWidth: .infinity)
-        .contentShape(Rectangle())
-        .onTapGesture {
-            if clickable { onPress?(item, index) }
-        }
-    }
-}
-
-// ─── Public API ────────────────────────────────────────────────────────────────
-
-/// Steps — guided progress indicator through a sequence of procedural steps.
-///
-/// Mirrors the Compose `Steps` component.
-public struct Steps: View {
-    private let steps: [StepItem]
-    private let activeIndex: Int
-    private let horizontal: Bool
-    private let size: StepsSize
-    private let useNumber: Bool
-    private let align: StepsAlign
-    private let customIcon: String?
-    private let disabled: Bool
-    private let onPress: ((StepItem, Int) -> Void)?
-
-    public init(
-        steps: [StepItem],
-        activeIndex: Int,
-        horizontal: Bool = false,
-        size: StepsSize = .large,
-        useNumber: Bool = false,
-        align: StepsAlign = .center,
-        customIcon: String? = nil,
-        disabled: Bool = false,
-        onPress: ((StepItem, Int) -> Void)? = nil
-    ) {
-        self.steps = steps
-        self.activeIndex = activeIndex
-        self.horizontal = horizontal
-        self.size = size
-        self.useNumber = useNumber
-        self.align = align
-        self.customIcon = customIcon
-        self.disabled = disabled
-        self.onPress = onPress
-    }
-
-    public var body: some View {
-        if horizontal {
-            StepsHorizontal(
-                steps: steps,
-                activeIndex: activeIndex,
-                size: size,
-                useNumber: useNumber,
-                align: align,
-                customIcon: customIcon,
-                disabled: disabled,
-                onPress: onPress
-            )
-        } else {
-            StepsVertical(
-                steps: steps,
-                activeIndex: activeIndex,
-                size: size,
-                useNumber: useNumber,
-                customIcon: customIcon,
-                disabled: disabled,
-                onPress: onPress
-            )
-        }
-    }
-}