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

package/example/ios/Example/Foundation/PopupDemo.swift

@@ -1,389 +0,0 @@
-
-import MoMoUIKits
-import SwiftUI
-
-// MARK: - PopupDemo
-
-struct PopupDemo: View {
-    @EnvironmentObject var popups: PopupStates
-    @State var otpValue: String = ""
-    
-    @State var showingTopFirstFloat: Bool = false
-    @State var showingTopSecondFloat: Bool = false
-    @State var showingBottomFirstFloat: Bool = false
-    @State var showingBottomSecondFloat: Bool = false
-
-    @State var showingMiddlePopup: Bool = false
-    @State var showingFirstPopup: Bool = false
-
-    @State var showingFirstActionSheet: Bool = false
-    @State var showingSecondActionSheet: Bool = false
-
-    func onChange(otp: String) {
-        print(otp)
-    }
-    
-    var body: some View {
-        let hideAll: () -> () = {
-            self.showingTopFirstFloat = false
-            self.showingTopSecondFloat = false
-            self.showingBottomFirstFloat = false
-            self.showingBottomSecondFloat = false
-
-            self.showingFirstPopup = false
-
-            self.showingFirstActionSheet = false
-            self.showingSecondActionSheet = false
-        }
-
-        return ZStack {
-            Rectangle()
-                .fill(Colors.background)
-                .ignoresSafeArea()
-            ScrollView {
-                LazyVStack(spacing: 12) {
-                    Group {
-                        SectionHeader(name: "Design system", count: 4)
-                            .padding(.bottom, 12)
-
-                        PopupButton(isShowing: $popups.showingOTP, hideAll: hideAll) {
-                            PopupTypeView(
-                                title: "Show OTP keyboard",
-                                detail: "Top popup show otp keyboard"
-                            ) {
-                                ActionSheetImage()
-                            }
-                        }
-                        PopupButton(isShowing: $popups.showingDisplay, hideAll: hideAll) {
-                            PopupTypeView(
-                                title: "Show Popup Display",
-                                detail: "Top popup display"
-                            ) {
-                                PopupImage(style: .default)
-                            }
-                        }
-                    }
-                    
-                    Group {
-                        SectionHeader(name: "Floats", count: 4)
-                            .padding(.bottom, 12)
-
-                        PopupButton(isShowing: $showingTopFirstFloat, hideAll: hideAll) {
-                            PopupTypeView(
-                                title: "Top version 1",
-                                detail: "Top float with a picture and one button"
-                            ) {
-                                FloatsImage(position: .top)
-                            }
-                        }
-                        PopupButton(isShowing: $showingTopSecondFloat, hideAll: hideAll) {
-                            PopupTypeView(
-                                title: "Top version 2",
-                                detail: "Top float with a picture"
-                            ) {
-                                FloatsImage(position: .top)
-                            }
-                        }
-                        PopupButton(isShowing: $showingBottomFirstFloat, hideAll: hideAll) {
-                            PopupTypeView(
-                                title: "Bottom version 1",
-                                detail: "Bottom float with a picture"
-                            ) {
-                                FloatsImage(position: .bottom)
-                            }
-                        }
-                        PopupButton(isShowing: $showingBottomSecondFloat, hideAll: hideAll) {
-                            PopupTypeView(
-                                title: "Bottom version 2",
-                                detail: "Bottom float with a picture"
-                            ) {
-                                FloatsImage(position: .bottom)
-                            }
-                        }
-                    }
-
-                    Group {
-                        SectionHeader(name: "Popups", count: 2)
-                            .padding(EdgeInsets(top: 20, leading: 0, bottom: 12, trailing: 0))
-
-                        PopupButton(isShowing: $showingFirstPopup, hideAll: hideAll) {
-                            PopupTypeView(
-                                title: "Bottom version 1",
-                                detail: "Popup bottom"
-                            ) {
-                                PopupImage(style: .bottomFirst)
-                            }
-                        }
-                    }
-
-                    Group {
-                        SectionHeader(name: "Action sheets", count: 2)
-                            .padding(EdgeInsets(top: 20, leading: 0, bottom: 12, trailing: 0))
-
-                        PopupButton(isShowing: $showingFirstActionSheet, hideAll: hideAll) {
-                            PopupTypeView(
-                                title: "Version 1",
-                                detail: "Action sheets"
-                            ) {
-                                ActionSheetImage()
-                            }
-                        }
-                        PopupButton(isShowing: $showingSecondActionSheet, hideAll: hideAll) {
-                            PopupTypeView(
-                                title: "Version 2",
-                                detail: "Action sheets"
-                            ) {
-                                ActionSheetImage()
-                            }
-                        }
-                    }
-                }
-            }
-
-            // MARK: - Designed popup system
-            .popup(isPresented: $popups.showingOTP, type: .toast, position: .bottom, backgroundColor: .black.opacity(0.4)) {
-                VStack {
-                    OTPKeyboard(value: $otpValue, length: 8, onChange: onChange, onClose: {
-                        popups.showingOTP = false
-                    }).padding()
-                }
-                .background(Colors.background)
-            }
-            .popup(isPresented: $popups.showingDisplay, type: .default, backgroundColor: .black.opacity(0.4)) {
-                PopupDisplay(isPresented: $popups.showingDisplay, title: "Tiêu đề", description: "Đây là nội dung Đây là nội dung Đây là nội dung Đây là nội dung Đây là nội dung", url: "https://images.unsplash.com/photo-1672671246846-2efd7789f913?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2662&q=80", buttonDirection: .row, buttonType: .button)
-            }
-            
-            // MARK: - Designed floats
-
-            .popup(isPresented: $showingTopFirstFloat, type: .floater(), position: .top, animation: .spring()) {
-                FloatTopFirst()
-            }
-            .popup(isPresented: $showingTopSecondFloat, type: .floater(), position: .top, animation: .spring(), autohideIn: 3) {
-                FloatTopSecond()
-            }
-            .popup(isPresented: $showingBottomFirstFloat, type: .floater(), position: .bottom, animation: .spring(), autohideIn: 2) {
-                FloatBottomFirst()
-            }
-            .popup(isPresented: $showingBottomSecondFloat, type: .floater(), position: .bottom, animation: .spring(), autohideIn: 5) {
-                FloatBottomSecond()
-            }
-
-            // MARK: - Designed popups
-
-            .popup(isPresented: $showingFirstPopup, type: .floater(), position: .bottom, closeOnTapOutside: true, backgroundColor: .black.opacity(0.4)) {
-                PopupExample(isPresented: $showingFirstPopup)
-            }
-
-            // MARK: - Designed sheets
-
-            .popup(isPresented: $popups.showingOTP, type: .toast, position: .bottom, backgroundColor: .black.opacity(0.4)) {
-                VStack {
-                    OTPKeyboard(value: .constant(""), length: 8, onClose: {
-                        popups.showingOTP = false
-                    }).padding()
-                }
-                .background(Colors.background)
-            }
-
-            .popup(isPresented: $showingFirstActionSheet, type: .toast, position: .bottom, backgroundColor: .black.opacity(0.4)) {
-                ActionSheetFirst()
-            }
-            .popup(isPresented: $showingSecondActionSheet, type: .toast, position: .bottom, backgroundColor: .black.opacity(0.4)) {
-                ActionSheetSecond()
-            }
-        }
-    }
-}
-
-// MARK: - SectionHeader
-
-private struct SectionHeader: View {
-    let name: String
-    let count: Int
-
-    var body: some View {
-        HStack {
-            Text(name)
-                .font(.system(size: 24, weight: .bold))
-                .foregroundColor(Colors.text)
-
-            Spacer()
-
-            HStack(spacing: 4) {
-                Text("\(count)")
-                    .font(.system(size: 18))
-                    .foregroundColor(Colors.text)
-                    .opacity(0.8)
-
-                Text("types")
-                    .font(.system(size: 18))
-                    .foregroundColor(Colors.text)
-                    .opacity(0.5)
-            }
-        }
-        .padding(.horizontal, 20)
-    }
-}
-
-// MARK: - PopupTypeView
-
-private struct PopupTypeView<Content>: View where Content: View {
-    let title: String
-    let detail: String
-    @ViewBuilder let icon: () -> Content
-
-    var body: some View {
-        ZStack(alignment: .leading) {
-            RoundedRectangle(cornerRadius: 12)
-                .fill(Colors.card)
-
-            HStack {
-                icon()
-                VStack(alignment: .leading, spacing: 0) {
-                    Text(title)
-                        .font(.system(size: 18))
-                        .foregroundColor(Colors.text)
-                    Text(detail)
-                        .lineLimit(1)
-                        .font(.system(size: 13))
-                        .foregroundColor(Colors.text)
-                        .opacity(0.4)
-                }
-            }
-            .padding()
-        }
-        .padding(.horizontal, 20)
-    }
-}
-
-// MARK: - PopupButton
-
-private struct PopupButton<Content>: View where Content: View {
-    @Binding var isShowing: Bool
-
-    var hideAll: () -> ()
-
-    @ViewBuilder let content: () -> Content
-
-    var body: some View {
-        Button {
-            hideAll()
-            isShowing.toggle()
-        } label: {
-            content()
-        }
-    }
-}
-
-// MARK: - AlertImageView
-
-private struct AlertImageView<Content>: View where Content: View {
-    let hex: String
-    let alignment: Alignment
-
-    @ViewBuilder let content: (Color) -> Content
-
-    var body: some View {
-        let color = Color(hex: hex)
-        return ZStack(alignment: alignment) {
-            Rectangle()
-                .fill(color)
-                .opacity(0.24)
-                .frame(width: 40, height: 40)
-            content(color)
-        }
-        .cornerRadius(10)
-    }
-}
-
-// MARK: - FloatsImage
-
-private struct FloatsImage: View {
-    enum Position {
-        case top
-        case bottom
-
-        // MARK: Internal
-
-        func toAligment() -> Alignment {
-            switch self {
-            case .top:
-                return .top
-            case .bottom:
-                return .bottom
-            }
-        }
-    }
-
-    let position: Position
-
-    var body: some View {
-        AlertImageView(hex: "9265F8", alignment: position.toAligment()) { color in
-            Rectangle()
-                .fill(color)
-                .frame(width: 24, height: 4)
-                .cornerRadius(12)
-                .padding(.all, 8)
-        }
-    }
-}
-
-// MARK: - PopupImage
-
-private struct PopupImage: View {
-    enum Style {
-        case `default`
-        case bottomFirst
-        case bottomSecond
-
-        // MARK: Internal
-
-        func toAligment() -> Alignment {
-            switch self {
-            case .default:
-                return .center
-            case .bottomFirst,
-                 .bottomSecond:
-                return .bottom
-            }
-        }
-    }
-
-    let style: Style
-
-    var body: some View {
-        AlertImageView(hex: "CCE7A2", alignment: style.toAligment()) { color in
-            switch style {
-            case .default:
-                RoundedRectangle(cornerRadius: 4)
-                    .fill(color)
-                    .frame(width: 24, height: 20)
-
-            case .bottomFirst:
-                RoundedRectangle(cornerRadius: 4)
-                    .fill(color)
-                    .frame(width: 24, height: 20)
-                    .padding(.bottom, 4)
-
-            case .bottomSecond:
-                RoundedRectangle(cornerRadius: 4)
-                    .fill(color)
-                    .frame(width: 40, height: 20)
-                    .padding(0)
-            }
-        }
-    }
-}
-
-// MARK: - ActionSheetImage
-
-private struct ActionSheetImage: View {
-    var body: some View {
-        AlertImageView(hex: "FFB93D", alignment: .bottom) { color in
-            RoundedRectangle(cornerRadius: 4)
-                .fill(color)
-                .frame(width: 40, height: 20)
-                .padding(0)
-        }
-    }
-}

package/example/ios/Example/Foundation/TextInputDemo.swift

@@ -1,36 +0,0 @@
-//
-//  TextInputDemo.swift
-//  Example
-//
-//  Created by Nguyen Hoang Son on 26/12/2022.
-//
-
-import Foundation
-import SwiftUI
-import MoMoUIKits
-
-public struct TextInputDemo: View {
-    @State var value: String = ""
-    @State var password: String = ""
-    public init(){
-        
-    }
-    
-    func onTextChange(value: String){
-        print("CHANGE",value)
-    }
-    
-    func onBlur(){
-        print("BLUR")
-    }
-    
-    public var body: some View{
-        return VStack{
-//            Input(placeholder: "Placeholder", floatingValue: "Floating value", multilines: true)
-            Input($value, placeholder: "Placeholder", multilines: false, onChange: onTextChange)
-            Input($password, placeholder: "Placeholder", floatingValue: "Floating value", multilines: false, isSecure: true)
-        }
-    }
-    
-   
-}

package/example/ios/Example/Foundation/TypographyDemo.swift

@@ -1,53 +0,0 @@
-//
-//  TypographyDemo.swift
-//  Example
-//
-//  Created by Wem on 13/12/2022.
-//
-
-import Foundation
-import SwiftUI
-
-struct TypographyDemo: View {
-
-    var body: some View {
-        ScrollView {
-            Group {
-                VStack {
-                    Text("Text").font(.h1)
-                    Text("Text").font(.h2)
-                    Text("Text").font(.h3)
-                    Text("Text").font(.h4)
-                }
-                VStack {
-                    Text("Text").font(.title1)
-                    Text("Text").font(.title2)
-                    Text("Text").font(.title3)
-                }
-                VStack {
-                    Text("Text").font(.headerText1)
-                    Text("Text").font(.headerText2)
-                    Text("Text").font(.headerText3)
-                    Text("Text").font(.paragraph)
-                }
-                VStack {
-                    Text("Text").font(.description1)
-                    Text("Text").font(.description2)
-                    Text("Text").font(.description3)
-                }
-                VStack {
-                    Text("Text").font(.label1)
-                    Text("Text").font(.label2)
-                    Text("Text").font(.label3)
-                    Text("Text").font(.label4)
-                }
-                VStack {
-                    Text("Text").font(.action1)
-                    Text("Text").font(.action2)
-                    Text("Text").font(.action3)
-                    Text("Text").font(.action4)
-                }
-            }.padding(16)
-        }.padding(.top)
-    }
-}

package/example/ios/Example/Foundation.swift

@@ -1,26 +0,0 @@
-//
-//  Foundation.swift
-//  Example
-//
-//  Created by Wem on 13/12/2022.
-//
-
-import Foundation
-import SwiftUI
-
-struct Foundation: View {
-    var foundations: [ComponentModel]
-    
-    var body: some View {
-        NavigationView {
-            List(foundations) { item in
-                NavigationLink {
-                    ComponentDetail(item)
-                } label: {
-                    ComponentItem(item)
-                }
-            }
-            .navigationTitle("Foundations")
-        }
-    }
-}

package/example/ios/Example/Info.plist

@@ -1,18 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
-<plist version="1.0">
-<dict>
-	<key>UIAppFonts</key>
-	<array>
-		<string>SFProText-Bold.ttf</string>
-		<string>SFProText-Regular.ttf</string>
-		<string>SFProText-Semibold.ttf</string>
-		<string>SFProText-Light.ttf</string>
-		<string>SFProText-Heavy.ttf</string>
-		<string>SFProText-Medium.ttf</string>
-		<string>SFProText-Black.ttf</string>
-		<string>SFProText-Thin.ttf</string>
-		<string>SFProText-Ultralight.ttf</string>
-	</array>
-</dict>
-</plist>

package/example/ios/Example/Library/CheckboxDemo.swift

@@ -1,19 +0,0 @@
-
-import MoMoUIKits
-import SwiftUI
-// MARK: - SwipeableDemo
-
-struct CheckboxDemo: View {
-    @State var value: Bool = true
-    
-    func onChange(value: Bool){
-        print(value)
-    }
-    
-    var body: some View {
-        VStack{
-            Checkbox($value, onChange: onChange)
-            Checkbox($value,disabled: true, onChange: onChange)
-        }
-    }
-}

package/example/ios/Example/Library/SwipeableDemo.swift

@@ -1,105 +0,0 @@
-
-import MoMoUIKits
-import SwiftUI
-
-// MARK: - SwipeableDemo
-
-struct SwipeableDemo: View {
-    @State var data = (1 ... 10).map { "Item \($0)" }
-    @State var currentUserInteractionCellID: String?
-
-    var body: some View {
-        GeometryReader { _ in
-            ScrollView {
-                LazyVStack(alignment: .center, spacing: 10) {
-                    ForEach(data, id: \.self) { item in
-                        RowView(item: item, deletionCallback: { item in
-                            self.data = self.data.filter { anyItem->Bool in
-                                anyItem != item
-                            }
-                        }, currentUserInteractionCellID: $currentUserInteractionCellID)
-                    }
-                }.animation(.default, value: data)
-                    .padding(20)
-            }
-        }
-    }
-}
-
-// MARK: - RowView
-
-struct RowView: View {
-    var item: String
-    var deletionCallback: (String)->()
-    @Binding var currentUserInteractionCellID: String?
-
-    var body: some View {
-        Text(item)
-            .frame(maxWidth: .infinity)
-            .padding(.vertical, 16)
-            .background(RoundedRectangle(cornerRadius: 5).foregroundColor(.green))
-            .swipeCell(id: self.item, leadingSideGroup: leftGroup(), trailingSideGroup: rightGroup())
-            .onTapGesture {}
-    }
-
-    func leftGroup()->[SwipeCellActionItem] {
-        return [SwipeCellActionItem(buttonView: {
-            self.pinView(swipeOut: false)
-            
-        }, swipeOutButtonView: {
-            self.pinView(swipeOut: true)
-        }, buttonWidth: 80, backgroundColor: .yellow, swipeOutAction: true, swipeOutHapticFeedbackType: .success, swipeOutIsDestructive: false)
-            {}]
-    }
-    
-    func pinView(swipeOut: Bool)->AnyView {
-        Group {
-            Spacer()
-            VStack(spacing: 2) {
-                Image(systemName: "pin").font(.system(size: 24)).foregroundColor(.white)
-            }.frame(maxHeight: 80).padding(.horizontal, swipeOut ? 20 : 5)
-            if swipeOut == false {
-                Spacer()
-            }
-        }.animation(.default).castToAnyView()
-    }
-    
-    func rightGroup()->[SwipeCellActionItem] {
-        return [
-            SwipeCellActionItem(buttonView: {
-                VStack(spacing: 2) {
-                    Image(systemName: "person.crop.circle.badge.plus").font(.system(size: 22)).foregroundColor(.white)
-                    Text("Share").fixedSize().font(.system(size: 12)).foregroundColor(.white)
-                }.frame(maxHeight: 80).castToAnyView()
-
-            }, backgroundColor: .blue) {
-                print("share action!")
-            },
-            SwipeCellActionItem(buttonView: {
-                VStack(spacing: 2) {
-                    Image(systemName: "folder.fill").font(.system(size: 22)).foregroundColor(.white)
-                    Text("Move").fixedSize().font(.system(size: 12)).foregroundColor(.white)
-                }.frame(maxHeight: 80).castToAnyView()
-          
-            }, backgroundColor: .purple, actionCallback: {
-                print("folder action")
-            }),
-            
-            SwipeCellActionItem(buttonView: {
-                self.trashView(swipeOut: false)
-            }, swipeOutButtonView: {
-                self.trashView(swipeOut: true)
-            }, backgroundColor: .red, swipeOutAction: true, swipeOutHapticFeedbackType: .warning, swipeOutIsDestructive: true) {
-                print("delete action")
-                self.deletionCallback(item)
-            }
-        ]
-    }
-    
-    func trashView(swipeOut: Bool)->AnyView {
-        VStack(spacing: 3) {
-            Image(systemName: "trash").font(.system(size: swipeOut ? 28 : 22)).foregroundColor(.white)
-            Text("Delete").fixedSize().font(.system(size: swipeOut ? 16 : 12)).foregroundColor(.white)
-        }.frame(maxHeight: 80).animation(.default).castToAnyView()
-    }
-}

package/example/ios/Example/Library/SwitchDemo.swift

@@ -1,19 +0,0 @@
-
-import MoMoUIKits
-import SwiftUI
-// MARK: - SwipeableDemo
-
-struct SwitchDemo: View {
-    @State var value: Bool = true
-    
-    func onChange(value: Bool){
-        print(value)
-    }
-    
-    var body: some View {
-        VStack{
-            Switch($value, onChange: onChange)
-            Switch($value, disabled: true)
-        }
-    }
-}

package/example/ios/Example/Library.swift

@@ -1,26 +0,0 @@
-//
-//  Library.swift
-//  Example
-//
-//  Created by Wem on 13/12/2022.
-//
-
-import Foundation
-import SwiftUI
-
-struct Library: View {
-    var libraries: [ComponentModel]
-    
-    var body: some View {
-        NavigationView {
-            List(libraries) { item in
-                NavigationLink {
-                    ComponentDetail(item)
-                } label: {
-                    ComponentItem(item)
-                }
-            }
-            .navigationTitle("Libraries")
-        }
-    }
-}