Getting Started with Reachu Swift SDK

Get up and running with the Reachu Swift SDK in your iOS application in just a few minutes.

Prerequisites

• Xcode 15.0or later
• iOS 15.0+(iPhone & iPad)
• Swift 5.9or later
• A Reachu account with API credentials

Quick Start

The entire setup takes less than 5 minutes! Just add the package, create a config file, and you're ready to build amazing shopping experiences.

Step 1: Installation

Swift Package Manager (Recommended)

Using Xcode

1. Open your Xcode project

2. Go to File → Add Package Dependencies...

3. Enter the repository URL:

 https://github.com/ReachuDevteam/ReachuSwiftSDK.git

4. Select the version: 1.0.0 (or latest version)
5. Choose your modulesbased on your needs

Using Package.swift

If you're using Swift Package Manager directly, add this to your Package.swift:

Package.swift

// swift-tools-version: 5.9
import PackageDescription

let package = Package(
 name: "YourApp",
 platforms: [
 .iOS(.v15) // iPhone & iPad
 ],
 dependencies: [
 .package(url: "https://github.com/ReachuDevteam/ReachuSwiftSDK.git", from: "1.0.0")
 ],
 targets: [
 .target(
 name: "YourApp",
 dependencies: [
 // Choose your modules (see module selection below)
 .product(name: "ReachuUI", package: "ReachuSwiftSDK"),
 ]
 ),
 ]
)

CocoaPods

Add this to your Podfile:

Podfile

platform :ios, '15.0'

target 'YourApp' do
 use_frameworks!
 
 # Reachu Swift SDK
 pod 'ReachuSwiftSDK', :git => 'https://github.com/ReachuDevteam/ReachuSwiftSDK.git', :tag => '1.0.0'
end

Then run:

pod install

Stable Release

This is the stable release (1.0.0) of Reachu Swift SDK. For beta versions, you can specify 1.0.0-beta.1 explicitly.

Step 2: Choose Your Modules

The Reachu Swift SDK is modular. Import only what you need:

Core + UI Components(Recommended)

.product(name: "ReachuUI", package: "ReachuSwiftSDK")

**Use for:**Most iOS apps with ecommerce features

• Shopping cart, checkout, product catalog
• Beautiful SwiftUI components
• Automatic Stripe payment integration
• Everything you need for a complete shop

Core Only(Advanced)

.product(name: "ReachuCore", package: "ReachuSwiftSDK")

**Use for:**Custom UI implementations

• GraphQL API access
• Cart and checkout logic
• Build your own UI from scratch

Core + Live Shopping(Live Streaming)

.product(name: "ReachuLiveShow", package: "ReachuSwiftSDK")
.product(name: "ReachuLiveUI", package: "ReachuSwiftSDK")

**Use for:**Apps with livestream shopping (like TV2 demo)

• Tipio.no integration
• Real-time chat and interactions
• Live product showcases
• WebSocket events

New Features

The SDK now includes advanced features:

• Market Availability Check - Automatically hide components when market is unavailable
• Campaign Lifecycle - Control component visibility based on campaign dates
• Localization - Multi-language support for all SDK components

Step 3: Create Configuration File

Create a reachu-config.json file in your Xcode project:

**

1. Right-click your project → New File → Empty file****2. Name it reachu-config.json3. Make sure "Add to targets" is checkedMinimal configuration:**

reachu-config.json

{
 "apiKey": "YOUR_API_KEY_HERE",
 "environment": "production",
 "theme": {
 "name": "My App Theme",
 "mode": "automatic"
 },
 "cart": {
 "floatingCartPosition": "bottomRight",
 "floatingCartDisplayMode": "minimal",
 "floatingCartSize": "small",
 "enableGuestCheckout": true,
 "requirePhoneNumber": true,
 "defaultShippingCountry": "US",
 "supportedPaymentMethods": ["stripe", "klarna", "paypal"]
 }
}

What You Need to Change

• apiKey: Your Reachu API key (get it from dashboard)
• defaultShippingCountry: Your primary market (e.g., "US", "NO", "SE")
• supportedPaymentMethods: Payment providers you want to use

Everything else works with these defaults!

Step 4: Initialize SDK in Your App

Load the configuration in your app's init and set up global state managers:

App.swift

import SwiftUI
import ReachuCore
import ReachuUI
import ReachuDesignSystem

@main
struct MyApp: App {
 // MARK: - Global State Managers
 // Initialize CartManager and CheckoutDraft once for the entire app
 @StateObject private var cartManager = CartManager()
 @StateObject private var checkoutDraft = CheckoutDraft()
 
 init() {
 // Load configuration from reachu-config.json
 // This reads the config file with API key, theme colors, and settings
 ConfigurationLoader.loadConfiguration()
 
 // Option 1: Use device locale for country detection
 // ConfigurationLoader.loadConfiguration()
 
 // Option 2: Force a specific country (for testing)
 // ConfigurationLoader.loadConfiguration(userCountryCode: "DE")
 }
 
 var body: some Scene {
 WindowGroup {
 ContentView()
 // Inject managers as environment objects
 // This makes them available to ALL child views via @EnvironmentObject
 .environmentObject(cartManager)
 .environmentObject(checkoutDraft)
 // Show checkout overlay when user taps checkout button
 .sheet(isPresented: $cartManager.isCheckoutPresented) {
 RCheckoutOverlay()
 .environmentObject(cartManager)
 .environmentObject(checkoutDraft)
 }
 // Global floating cart indicator (optional)
 .overlay {
 RFloatingCartIndicator()
 .environmentObject(cartManager)
 }
 }
 }
}

Key Components: - CartManager: Global cart state with automatic sync and persistence

• CheckoutDraft: Geographic normalization and checkout state management
• ConfigurationLoader.loadConfiguration(): Loads reachu-config.json and initializes SDK

Automatic Payment Setup

When you call ConfigurationLoader.loadConfiguration(), the SDK automatically:

• Initializes Stripe payments (if StripeCore is available)
• Fetches your Stripe publishable key from Reachu API
• Falls back to test key if API is unavailable
• **No additional code required!**Just add stripe to supportedPaymentMethods in your config and it works!

Step 5: Your First Implementation

Basic Product Display

ProductListView.swift

import SwiftUI
import ReachuUI
import ReachuCore

struct ProductListView: View {
 @StateObject private var viewModel = ProductViewModel()
 
 var body: some View {
 NavigationView {
 ScrollView {
 LazyVGrid(columns: [
 GridItem(.flexible()),
 GridItem(.flexible())
 ], spacing: 16) {
 ForEach(viewModel.products) { product in
 RProductCard(
 product: product,
 variant: .grid,
 onTap: { 
 // Navigate to product detail
 },
 onAddToCart: { 
 viewModel.addToCart(product)
 }
 )
 }
 }
 .padding()
 }
 .navigationTitle("Products")
 .task {
 await viewModel.loadProducts()
 }
 }
 }
}

ViewModel Implementation

ProductViewModel.swift

import Foundation
import ReachuCore

@MainActor
class ProductViewModel: ObservableObject {
 @Published var products: [Product] = []
 @Published var cart: Cart?
 @Published var isLoading = false
 
 private let sdk = ReachuSDK.shared
 
 func loadProducts() async {
 isLoading = true
 defer { isLoading = false }
 
 do {
 self.products = try await sdk.channel.product.getAll(
 currency: "USD",
 limit: 20
 )
 } catch {
 print("Failed to load products: \(error)")
 }
 }
 
 func addToCart(_ product: Product) async {
 do {
 if cart == nil {
 cart = try await sdk.cart.create(
 customerSessionId: UUID().uuidString,
 currency: "USD"
 )
 }
 
 cart = try await sdk.cart.addItem(
 cartId: cart!.id,
 productId: product.id,
 quantity: 1
 )
 } catch {
 print("Failed to add to cart: \(error)")
 }
 }
}

Step 6: Testing Your Setup

Using Mock Data

For development and testing, use the built-in mock data:

TestView.swift

import SwiftUI
import ReachuUI

#if DEBUG
import ReachuTesting

struct TestView: View {
 private let mockProducts = ReachuMockDataProvider.shared.sampleProducts
 
 var body: some View {
 ScrollView {
 VStack(spacing: 16) {
 ForEach(mockProducts) { product in
 RProductCard(
 product: product,
 variant: .hero,
 showDescription: true
 )
 }
 }
 .padding()
 }
 }
}

#Preview {
 TestView()
}
#endif

SwiftUI Previews

The SDK includes preview support for easy development:

ProductCard+Preview.swift

#if DEBUG
import SwiftUI
import ReachuUI
import ReachuTesting

struct ProductCard_Previews: PreviewProvider {
 static var previews: some View {
 Group {
 RProductCard(
 product: ReachuMockDataProvider.shared.sampleProducts[0],
 variant: .grid
 )
 .previewDisplayName("Grid Variant")
 
 RProductCard(
 product: ReachuMockDataProvider.shared.sampleProducts[1], 
 variant: .hero,
 showDescription: true
 )
 .previewDisplayName("Hero Variant")
 }
 .previewLayout(.sizeThatFits)
 .padding()
 }
}
#endif

Common Issues & Solutions

Issue: Module not found

error: No such module 'ReachuUI'

**Solution:**Make sure you've added the correct module to your target dependencies and that the package has been resolved successfully.

Issue: Minimum deployment target

error: compiling for iOS 14.0, but module requires iOS 15.0

**Solution:**1. Open your project in Xcode 2. Select your app target 3. Go to "General" tab 4. Set "Minimum Deployments" → iOS 15.0### Issue: GraphQL connection errors

error: Network request failed

**Solution:**Check your API key and base URL. Make sure you're using the correct environment configuration.

Next Steps

Now that you have the SDK set up, explore these areas:

• Configuration Guide - Complete configuration options
• UI Components - SwiftUI components for ecommerce
• Checkout System - Cart and checkout flow
• Market Availability - Automatic market detection
• Campaign Lifecycle - Time-based campaigns and component control
• Localization - Multi-language support
• API Reference - Complete API documentation
• Examples - Complete implementation examples

Dark/Light Mode Support

Reachu SDK provides complete dark/light mode supportout of the box! All UI components automatically adapt to iOS system settings.

Quick Setup

Add theme configuration to your reachu-config.json:

{
 "theme": {
 "mode": "automatic",
 "lightColors": {
 "primary": "#007AFF",
 "surface": "#FFFFFF"
 },
 "darkColors": {
 "primary": "#0A84FF", 
 "surface": "#1C1C1E"
 }
 }
}

Features:

• Automatic system following - Respects iOS dark/light mode
• Manual override - Force light or dark mode
• Complete customization - Define your own colors
• Professional appearance - iOS-standard styling

Learn More

Complete Dark/Light Mode Guide - Full theming documentation Theme Examples - Ready-to-use configurations

---

Next Steps

Essential Guides: - Dark/Light Mode Guide - Complete theming system

• UI Components - Product cards, sliders, checkout
• Complete Example - Full shopping app

Advanced Topics: - API Reference - Core functionality

• Configuration - Advanced settings

---

Need help?

Join our Discord community or email us at support@reachu.io