Recipe Card

Embed a single recipe card in search grids, shelves, or product pages. The card is an opaque WebView component (FeatureRoute.Recipe.Card).

Visual Overview

displayVariant (1–3) and orientation (VERTICAL / HORIZONTAL) combine into six layouts:

	Vertical	Horizontal
Variant 1
Variant 2
Variant 3

Parameters

Parameter	Type	Required	Default	What it does
displayRecipe	DisplayRecipe	yes	—	Which recipe to show (Mealz id or external id).
orientation	RecipeCardOrientation	no	VERTICAL	VERTICAL or HORIZONTAL layout.
dimensions	RecipeCardDimensions?	no	orientation defaults	Pixel height (and optional width). Defaults: vertical height 360, horizontal height 188; width fills parent unless set.
displayVariant	Int?	no	null	Visual variant of the card (SSR display_variant).
navigationCallback	RecipeCardNavigationCallback	yes	—	Open recipe details when the shopper taps the card.
modifier	Compose Modifier	no	—	Layout wrapper.
stateContent	state overlays	no	library default	Optional loading UI.

DisplayRecipe

Variant	Fields	When to use
FromMealzRecipeId(id)	Mealz recipe id	You know the Mealz id.
FromExternalRecipeId(id)	Your / retailer recipe id	Recipe mapped in Mealz under an external id.

Shelves / search

Do not pass surrounding product SKUs into DisplayRecipe anymore. Resolve shelf slots in batch with RecipeResolver.resolveRecipes(contexts), then render each non-null result with RecipeCard. Requires a store set via setSelectedStoreWithExternalId.

RecipeCardNavigationCallback

Callback	Required	What you must do
goToRecipeDetails	yes	(DisplayRecipe, serves: Int?) -> Unit — open recipe details with optional guest count.

Base NavigationCallback redirects (redirectToLogIn, redirectToStoreLocator, redirectToCart, exit) default to no-ops on this component — only goToRecipeDetails matters.

Serves

Inside Mealz WebViews, SSR resolves portions automatically: if the recipe is already in the basket, the basket guest count wins over the recipe default. When you handle goToRecipeDetails, always forward the serves argument as-is into RecipeDetailsScreen / RecipeDetailsViewController — do not substitute your own default or the recipe's number-of-guests.

Inject

RecipeCard(
    displayRecipe = DisplayRecipe.FromMealzRecipeId("12838"),
    orientation = RecipeCardOrientation.VERTICAL,
    displayVariant = 1,
    navigationCallback = RecipeCardNavigationCallback(
        goToRecipeDetails = { recipe, serves ->
            // Forward serves as-is into RecipeDetailsScreen — do not substitute a default
        }
    )
)

Shelves / Search — RecipeResolver

When you show Mealz recipes between products on shelf or search pages:

1. Build one RecipeContext(productIds, position) per slot.
2. Call suspend RecipeResolver.resolveRecipes(contexts) once (or when contexts change).
3. For each non-null DisplayRecipe in the result map, render a RecipeCard.

val resolved = RecipeResolver.resolveRecipes(
    listOf(RecipeContext(productIds = nearbySkus, position = 0))
)
// resolved[0]?.let { RecipeCard(displayRecipe = it, …) }