Mobile SDK - iOS - Kleep Docs

Github Repository: https://github.com/KlipFit/kleep-spm Version history: see iOS SDK - Version history for the latest version and the changes in each release.

Installation

This process needs to be followed only once, the first time you need to install the SDK in your project. To update the SDK later, in Xcode choose File > Packages > Update to Latest Package Versions (see the version history).

Add the following package: https://github.com/KlipFit/kleep-spm
Change dependency rule to: up to next major version

Permissions

Add the following permission to your project on info.plist: NSCameraUsageDescription

Usage

Method 1: `requestSize`

This method allows to implement the logic of the CTA.

parameter	priority	description
productID	required	You product ID
retailerName	required	Name of the retailer
customerID	optional	CRM identifier, used for analytics
trackingID	optional	User ID used by external tracking solution

Logic schema This schema explains how to update the CTA opening Kleep. https://www.figma.com/board/BlurZ01lR3JBQZeTUU98TE/Mobile---CTA-Logic?node-id=0-1&t=ccXWciNziIdfhgew-1 Implementation example

import Klipfit

struct ContentView: View {
    @State var isOpenView = false
        
    var body: some View {
        VStack {
            Spacer()
            Button("Open Kleep") {
                isOpenView = true
            }
            Spacer(minLength: 40)
            
            Button("obtenir la taille") {
                Klipfit.shared.requestSize(productID: String, retailerName: String, trackingID: String, customerID: String) { kleepResult in
                    switch kleepResult {
                    case .notSupported:
		                    // Hide CTA
                        print("NotSupported")
                    case .noRecommendationYet:
		                    // Display CTA with neutral label
                        print("NoRecommendationYet")
                    case .recommendationFound(let result):
		                    // Display CTA with size reco
                        print("RecommendationFound: ", result)
                    }
                }
            }
	            Spacer()
        }
        .sheet(isPresented: $isOpenView) {
            KlipFitFindSizeView { result, variantID in 
								// addToCart(variantID)
	          }
        }
    }
}

Method 2: `loadView`

This method is called when the CTA is clicked. It allows to load the different screens. The developper integrating the SDK should embed them into a bottom sheet.

parameter	priority	description
productID	required	You product ID
retailerName	required	Name of the retailer
customerID	optional	CRM identifier, used for analytics
trackingID	optional	ID used by external tracking provider

Implementation example

struct KlipFitFindSizeView: UIViewControllerRepresentable {
		
		public var onResult: KleepOnResultCompletion

    func makeUIViewController(context: Context) -> KlipftNavigationController {
        guard let viewController =
        KlipftNavigationController.loadView(
                productID: String,
                retailerName: String,
                language: KleepLanguageCode, // .fr .en .es .it .pt .nl 
                trackingID: "",
                customerID: "",
                stocks: [String : Bool]?,
                onResult: onResult
        )
        else {
            fatalError("ViewController not implemented in storyboard")
        }
        return viewController
    }
    func updateUIViewController(_ uiViewController: KlipftNavigationController, context: Context) {
    }
    typealias UIViewControllerType = KlipftNavigationController
}

Present the returned KlipftNavigationController the way you like: SwiftUI .sheet, or .pageSheet, .fullScreen or .overFullScreen in UIKit, including on top of another modal. The size guide stays inside the safe area and draws its own navigation bar (back and close): there is nothing to hide or configure. Requires SDK 4.3.0 or later. The SDK currently supports 6 UI languages, passed as language: KleepLanguageCode:

Supported languages (6)

fr — French (default)
en — English
es — Spanish
it — Italian
pt — Portuguese
nl — Dutch

If a language you need isn’t in the list, contact your Kleep representative.

Method 3: `track`

This method allows to track custom events.

parameter	priority	description
eventName	required	Name of the event to track
params	optional	Info associated to the event

import Klipfit

Klipfit.shared.track(eventName: String, params: [String: Any]? = nil)

We want to track 3 events:

eventName	Trigger
`product_viewed`	Upon PDP viewed
`product_added_to_cart`	Upon product added to the cart
`checkout_completed`	Upon order confirmation after the payment

product_viewed Parameters

Property	Type	Description	Priority
`productId`	String	The ID of the product matching the Product Catalog feed.	required

Example

{
		productId: str
}

product_added_to_cart Parameters

Property	Type	Description	Priority
`productId`	String	The ID of the product matching the Product Catalog feed.	required
`variantId`	String	The ID of the variant matching the Product Catalog feed.	required
`cart`	Array	An array containing the updated information of the cart’s products.	optional
`cart[].productId`	String	The ID of the product matching the Product Catalog feed.	required
`cart[].variantId`	String	The ID of the variant matching the Product Catalog feed.	required
`cart[].sku`	String	Product’s SKU	optional
`cart[].ean`	String	Product’s EAN	optional
`cart[].size`	String	Label of the size of the product in the cart.	required
`cart[].quantity`	Number	Number of items in the cart.	required
`cart[].price`	Object	Price of the product.	optional
`cart[].price.amount`	String	Amount to pay for the item	optional
`cart[].price.currencyCode`	String	EUR, USD…	optional

Example

{
    productId: str,
    variantId: str,
    cart: [
	    {
		    productId: "123ABC456",
		    variantId: "123ABC456-00R",
				sku: "XYZ",
		    size: "S",
		    quantity: 2,
		    price: {
						amount: "50",
				    currencyCode: "EUR"		    
		    }
	    },
	    {
		    productId: "123ABC456",
		    variantId: "123ABC456-00R",
		    sku: "XYZ",
		    size: "S",
		    quantity: 1,
		    price: {
				    amount: "40",
				    currencyCode: "USD"
				}
	    }
	    ...
    ],
}

checkout_completed Parameters

Property	Type	Description	Priority
`orderId`	String	The ID of the order matching the Order Data feed.	required
`cart`	Array	An array containing the information of the ordered products.	optional
`cart[].lineItemId`	String	The ID of the cart line item matching the Order Data feed.	required
`cart[].productId`	String	The ID of the product matching the Product Catalog feed.	required
`cart[].variantId`	String	The ID of the variant matching the Product Catalog feed.	required
`cart[].sku`	String	Product’s SKU	optional
`cart[].ean`	String	Product’s EAN	optional
`cart[].size`	String	Label of the size of the product in the cart.	required
`cart[].quantity`	Number	Number of items in the cart.	required
`cart[].price`	Object	Price of the product.	optional
`cart[].price.amount`	String	Amount to pay for the item	optional
`cart[].price.currencyCode`	String	EUR, USD…	optional

Example

{
    orderId: "000001",
    cart: [
	    {
		    lineItemId: "000001#1",
		    productId: "123ABC456",
		    variantId: "123ABC456-00R",
				sku: "XYZ",
		    size: "S",
		    quantity: 2,
		    price: {
						amount: "50",
				    currencyCode: "EUR"		    
		    }
	    },
	    {
			  lineItemId: "000000#2",
		    productId: "123ABC456",
		    variantId: "123ABC456-00R",
		    sku: "XYZ",
		    size: "S",
		    quantity: 1,
		    price: {
				    amount: "40",
				    currencyCode: "USD"
				}
	    }
	    ...
    ],
}

A/B testing

Kleep runs experiments on parts of the sizing flow (CTA copy, layout, timing) to keep improving conversion, using the same experimentation layer already used across Kleep’s web integrations, built on PostHog. PostHog is embedded inside the Kleep SDK — you don’t need to add the PostHog SDK yourself, request any extra permission, or call any additional method. Here’s how the variant assignment flows internally: The assignment is keyed on a stable on-device ID, so a given install keeps seeing the same variant for the duration of the experiment instead of being re-rolled on every launch. You don’t read or set the variant yourself — Kleep resolves it internally and reports the conversion delta per variant on its side.

Welcome

CMS

Mobile

Data

Privacy

Mobile SDK - iOS

Installation

Permissions

Usage

Method 1: `requestSize`

Method 2: `loadView`

Method 3: `track`

A/B testing

​Installation

​Permissions

​Usage

​Method 1: requestSize

​Method 2: loadView

​Method 3: track

​A/B testing

Installation

Permissions

Usage

Method 1: `requestSize`

Method 2: `loadView`

Method 3: `track`

A/B testing