Passer au contenu principal
Dépôt Github : https://github.com/KlipFit/kleep-spm

​
Installation

Cette procédure ne doit être suivie qu’une seule fois, lors de la première installation du SDK dans votre projet. Référez-vous à la section Mise à jour pour les instructions des mises à jour ultérieures.
  1. Ajoutez le package suivant : https://github.com/KlipFit/kleep-spm
  2. Changez la règle de dépendance en : jusqu’à la prochaine version majeure

​
Permissions

Ajoutez la permission suivante à votre projet dans info.plist : NSCameraUsageDescription

​
Utilisation

​
Méthode 1 : requestSize

Cette méthode permet d’implémenter la logique du CTA.
paramètreprioritédescription
productIDrequisL’identifiant de votre produit
retailerNamerequisNom du revendeur
customerIDoptionnelIdentifiant CRM, utilisé pour les analytics
trackingIDoptionnelIdentifiant utilisateur utilisé par la solution de tracking externe
Schéma logique Ce schéma explique comment mettre à jour le CTA ouvrant Kleep. https://www.figma.com/board/BlurZ01lR3JBQZeTUU98TE/Mobile---CTA-Logic?node-id=0-1&t=ccXWciNziIdfhgew-1 Exemple d’implémentation 
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)
          }
        }
    }
}

​
Méthode 2 : loadView

Cette méthode est appelée lorsque le CTA est cliqué. Elle permet de charger les différents écrans. Le développeur intégrant le SDK doit les intégrer dans une bottom sheet.
paramètreprioritédescription
productIDrequisL’identifiant de votre produit
retailerNamerequisNom du revendeur
customerIDoptionnelIdentifiant CRM, utilisé pour les analytics
trackingIDoptionnelIdentifiant utilisé par le fournisseur de tracking externe
Exemple d’implémentation 
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")
        }
        viewController.navigationBar.isHidden = true
        return viewController
    }
    func updateUIViewController(_ uiViewController: KlipftNavigationController, context: Context) {
    }
    typealias UIViewControllerType = KlipftNavigationController
}

​
Méthode 3 : track

Cette méthode permet de tracker des événements personnalisés.
paramètreprioritédescription
eventNamerequisNom de l’événement à tracker
paramsoptionnelInformations associées à l’événement
import Klipfit

Klipfit.shared.track(eventName: String, params: [String: Any]? = nil)
Nous souhaitons tracker 3 événements :
eventNameDéclencheur
product_viewedÀ la consultation de la PDP
product_added_to_cartÀ l’ajout au panier
checkout_completedÀ la confirmation de commande après paiement
product_viewed Paramètres (CSV) Exemple 
{
		productId: str
}
product_added_to_cart Paramètres (CSV) Exemple 
{
    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 Paramètres (CSV) Exemple 
{
    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"
				}
	    }
	    ...
    ],
}