SizeGuide (SwiftUI)

ComponentTryYourSize (Swift)

The “Size guide” button: “Size guide” → “Calculating your size…” → “Your size: M”. A tap opens the window. It takes the SwiftUI font and colour of where you put it.

public init(client: TryYourSize, product: String, variant: Variant = .link, label: String? = nil,
    onRecommendation: ((Recommendation) -> Void)? = nil)

Parameters

clientTryYourSizeRequired

Your client.

productStringRequired

Your product ID or SKU.

variantVariantOptional= .link

.link (link-sized text with the mark, 44 pt hit area) or .button (a small bordered button).

labelString?Optional= nil

your own words instead of "Size guide".

onRecommendation((Recommendation) -> Void)?Optional= nil

the shopper's recommended size, on appear and on every change (sizes only).

Example

SwiftKotlinReact NativeFlutter

// SwiftUI, where your "Size guide" link was
SizeGuide(client: tys, product: "SKU-123") { rec in
    if rec.status == .ready, !touched { selectedSize = rec.size }
}

// Compose, where your "Size guide" link was
SizeGuide(tys, "SKU-123", textStyle = MaterialTheme.typography.bodyMedium) { rec ->
    if (rec.status == Recommendation.Status.READY && !touched) selected = rec.size
}

<SizeGuide
  product="SKU-123"
  onRecommendation={(rec) => rec.status === "ready" && !touched && setSize(rec.size)}
/>

const SizeGuide(product: 'SKU-123') // listen to tys.onRecommendation to preselect