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

package/ios/Information/Information.swift

@@ -0,0 +1,156 @@
+import SwiftUI
+
+public enum InformationState {
+    case `default`
+    case warning
+    case error
+}
+
+public struct Information: View {
+    @Environment(\.appTheme) private var theme
+
+    private let title: String?
+    private let description: String
+    private let state: InformationState
+    private let image: String?
+    private let onPressAction: (() -> Void)?
+    private let showIcon: Bool
+    private let action: String?
+    private let showIconClose: Bool
+    private let onPressClose: (() -> Void)?
+    private let highlightText: [String]
+
+    public init(
+        title: String? = nil,
+        description: String = "Description",
+        state: InformationState = .default,
+        image: String? = nil,
+        onPressAction: (() -> Void)? = nil,
+        showIcon: Bool = true,
+        action: String? = nil,
+        showIconClose: Bool = true,
+        onPressClose: (() -> Void)? = nil,
+        highlightText: [String] = []
+    ) {
+        self.title = title
+        self.description = description
+        self.state = state
+        self.image = image
+        self.onPressAction = onPressAction
+        self.showIcon = showIcon
+        self.action = action
+        self.showIconClose = showIconClose
+        self.onPressClose = onPressClose
+        self.highlightText = highlightText
+    }
+
+    private var borderColor: Color {
+        switch state {
+        case .default: return Colors.blue07
+        case .warning: return Colors.yellow06
+        case .error: return Colors.red07
+        }
+    }
+
+    private var backgroundColor: Color {
+        switch state {
+        case .default: return Colors.blue10
+        case .warning: return Colors.yellow09
+        case .error: return Colors.red10
+        }
+    }
+
+    private var accentColor: Color {
+        switch state {
+        case .default: return Colors.blue03
+        case .warning: return Colors.orange03
+        case .error: return Colors.red03
+        }
+    }
+
+    private var iconSource: String {
+        switch state {
+        case .default: return "notifications_info"
+        case .warning: return "24_notifications_alert_triangle"
+        case .error: return "24_notifications_alert_octagon"
+        }
+    }
+
+    public var body: some View {
+        VStack(alignment: .leading, spacing: 0) {
+            HStack(alignment: .top, spacing: 0) {
+                if let image {
+                    ImageView(image)
+                        .frame(width: 40, height: 40)
+                        .clipShape(RoundedRectangle(cornerRadius: Radius.S))
+                        .padding(.trailing, Spacing.S)
+                } else if showIcon {
+                    Icon(source: iconSource, size: 16, color: accentColor)
+                        .padding(.trailing, Spacing.S)
+                }
+
+                VStack(alignment: .leading, spacing: 0) {
+                    if let title {
+                        MomoText(title, typography: .labelDefaultMedium)
+                    }
+                    MomoText(description, typography: .descriptionDefaultRegular, highlightText: highlightText)
+                }
+                .frame(maxWidth: .infinity, alignment: .leading)
+
+                if let onPressClose, showIconClose {
+                    Icon(source: "navigation_close", size: 16, color: theme.colors.text.default)
+                        .contentShape(Rectangle())
+                        .onTapGesture(perform: onPressClose)
+                }
+            }
+
+            if let action, let onPressAction {
+                MomoText(action, typography: .actionXsBold, color: accentColor)
+                    .frame(maxWidth: .infinity, alignment: .trailing)
+                    .contentShape(Rectangle())
+                    .onTapGesture(perform: onPressAction)
+                    .padding(.top, Spacing.S)
+            }
+        }
+        .padding(Spacing.M)
+        .background(
+            RoundedRectangle(cornerRadius: Radius.S)
+                .fill(backgroundColor)
+        )
+        .overlay(
+            RoundedRectangle(cornerRadius: Radius.S)
+                .stroke(borderColor, lineWidth: 0.5)
+        )
+    }
+}
+
+// MARK: - Preview
+#if DEBUG
+struct Information_Previews: PreviewProvider {
+    static var previews: some View {
+        VStack(spacing: 16) {
+            Information(
+                title: "Information",
+                description: "This is a default information message."
+            )
+            Information(
+                title: "Warning",
+                description: "This is a warning message.",
+                state: .warning
+            )
+            Information(
+                title: "Error",
+                description: "This is an error message.",
+                state: .error,
+                onPressAction: {}, action: "Retry"
+            )
+            Information(
+                description: "Dismissible information.",
+                onPressClose: {}
+            )
+        }
+        .padding()
+        .previewLayout(.sizeThatFits)
+    }
+}
+#endif

package/ios/Input/ErrorView.swift

@@ -0,0 +1,58 @@
+//
+//  ErrorView.swift
+//  Pods
+//
+//  Created by sophia on 13/1/26.
+//
+
+import SwiftUI
+
+public struct ErrorView: View {
+    @Environment(\.appTheme) private var theme
+    @Environment(\.momoFontScale) private var fontScale
+
+    public var errorMessage: String
+    public var errorSpacing: Bool
+    public var hintText: String
+    
+    public init(
+        errorMessage: String = "",
+        errorSpacing: Bool = false,
+        hintText: String = ""
+    ) {
+        self.errorMessage = errorMessage
+        self.errorSpacing = errorSpacing
+        self.hintText = hintText
+    }
+    
+    public var body: some View {
+        if !errorMessage.isEmpty || !hintText.isEmpty {
+            HStack(alignment: .top, spacing: 4) {
+                Icon(source: "ic_error", size: fontScale(16), color: displayColor())
+                MomoText(
+                    displayText(),
+                    typography: .descriptionDefaultRegular,
+                    color: displayColor()
+                )
+            }
+            .padding(.top, Spacing.XS)
+        } else if errorSpacing {
+            Spacer()
+                .padding(.top, Spacing.XS)
+                .frame(height: 18)
+        }
+    }
+    
+    // MARK: - Helpers
+    
+    private func displayColor() -> Color {
+        !errorMessage.isEmpty ? theme.colors.error.primary : theme.colors.text.hint
+    }
+    
+    private func displayText() -> String {
+        if !errorMessage.isEmpty {
+            return errorMessage
+        }
+        return hintText.isEmpty ? "Không thể chỉnh sửa" : hintText
+    }
+}