SearchBar

SearchBar

To create your own search bar that returns products, you create a class that implements BaseSearchComponent.

Boilerplate

import SwiftUI
import MealziOSSDK

@available(iOS 14, *)
public struct MyCustomSearchView: SearchProtocol {
    public func content(params: SearchParameters) -> some View {
        // your implementation here
    }
}

Full Example

import SwiftUI
import MealziOSSDK

@available(iOS 14, *)
public struct MyCustomSearchView: SearchProtocol {
    public init() {}
    public func content(params: SearchParameters) -> some View {
        VStack(spacing: 10.0) {
            HStack(spacing: 10.0) {
                HStack(spacing: 10.0) {
                    TextField(Localization.catalog.searchTitle.localised, text: params.searchText)
                        .frame(height: 45.0)
                        .disableAutocorrection(true)
                    Button(action: params.onApply, label: {
                        Image.mealzIcon(icon: .search)
                            .renderingMode(.template)
                            .foregroundColor(Color.mealzColor(.white))
                            .padding(10)
                            .background(Color.mealzColor(.primary)).clipShape(Circle())
                            .shadow(radius: 2.0)
                    })
                        .darkenView(!longerThanThreeChars)
                        .disabled(!longerThanThreeChars)
                }
                    .padding([.leading], 16).frame(height: 45.0)
                    .padding([.trailing], 2)
                    .overlay(Capsule().stroke(Color.gray, lineWidth: 1.0))
            }.padding(10)
            Spacer()
        }
    }
}

with

public struct SearchParameters {
    /// Text result from the user input, bindable
    public let searchText: Binding<String>
    /// A closure that executes the function passed in
    public let onApply: () -> Void