Components: after purchase - Funeli

Upsells and the download page. Add these components to a step in the editor and change their settings in the inspector, or ask an agent to; the settings below are the same in both.

Upsell offer

Type UpsellOffer. Offers an add-on after purchase. One-click card: accept charges pricing.offers[offerId] to the saved payment method, decline skips; while charging accept shows a spinner, both buttons are disabled and failures show inline. It has its own buttons (no Button needed), sends upsell_view, and cannot be used in checkoutSheet.

Setting	Type	Required	Description
`title`	string	yes	Offer headline, keep <=40 chars
`description`	string	yes	What the buyer gets, keep <=120 chars
`icon`	”activity” \| “alarm” \| “apple” \| “award” \| “baby” \| “battery” \| “bed” \| “bike” \| “brain” \| “calendar” \| “check” \| “chart” \| “clock” \| “coffee” \| “dumbbell” \| “flame” \| “flower” \| “footprints” \| “gift” \| “heart” \| “leaf” \| “lightning” \| “lock” \| “moon” \| “mountain” \| “music” \| “person” \| “ruler” \| “salad” \| “scale” \| “shield” \| “smile” \| “sparkles” \| “star” \| “sun” \| “target” \| “thumbs-up” \| “timer” \| “trophy” \| “upload” \| “users” \| “water” \| “yoga” \| “x” \| “zap” \| “heart-pulse” \| “stethoscope” \| “pill” \| “syringe” \| “thermometer” \| “weight” \| “hand-heart” \| “eye” \| “ear” \| “bone” \| “carrot” \| “cherry” \| “cookie” \| “pizza” \| “sandwich” \| “egg” \| “fish” \| “beef” \| “wheat” \| “cup-soda” \| “wine” \| “candy” \| “soup” \| “milk” \| “waves” \| “medal” \| “flag” \| “goal” \| “bed-double” \| “cloud-moon” \| “sunrise” \| “sunset” \| “wind” \| “feather” \| “brain-circuit” \| “book-open” \| “headphones” \| “glasses” \| “home” \| “briefcase” \| “car” \| “plane” \| “map-pin” \| “globe” \| “dog” \| “cat” \| “shopping-bag” \| “wallet” \| “credit-card” \| “piggy-bank” \| “gamepad” \| “tv” \| “smartphone” \| “laptop” \| “camera” \| “palette” \| “graduation-cap” \| “smile-plus” \| “frown” \| “meh” \| “laugh” \| “angry” \| “heart-crack” \| “party-popper” \| “check-circle” \| “x-circle” \| “alert-triangle” \| “info” \| “help-circle” \| “plus” \| “minus” \| “arrow-right” \| “trending-up” \| “trending-down” \| “bar-chart” \| “pie-chart” \| “percent” \| “tag” \| “badge-check” \| “crown” \| “gem” \| “rocket” \| “key” \| “bell” \| “mail” \| “phone” \| “message-circle” \| “search” \| “settings” \| “sliders” \| “refresh” \| “infinity” \| “hourglass” \| “calendar-check” \| “list-checks” \| “clipboard” \| “file-text” \| “lightbulb” \| “puzzle” \| “magnet” \| “anchor” \| “user-check” \| “user-plus” \| “users-round” \| “handshake” \| “thumbs-down” \| “star-half”	no	Icon at the top of the card Default: `"gift"`.
`priceLabel`	string	no	Display price text, e.g. “$19.99”; omit to format the pricing.offers amount automatically. Display only: the charge is always the offer amount
`originalPriceLabel`	string	no	Crossed-out price text; omit to use the offer originalAmount
`acceptLabel`	string	no	Primary button text, keep <=24 chars Default: `"Add to my plan"`.
`declineLabel`	string	no	Text link that skips the offer, keep <=24 chars Default: `"No, thanks"`.
`offerId`	string	no	pricing.offers id charged one-click on accept (create it with set_offer); also recorded in upsell analytics. Removing the offer clears it, adding an offer fills an empty one; publish is refused while it is missing

Example

{
  "title": "Add the Nutrition Guide",
  "description": "100+ easy recipes matched to your plan, with weekly shopping lists and quick-prep options.",
  "icon": "salad",
  "priceLabel": "$19.99",
  "originalPriceLabel": "$39.99",
  "acceptLabel": "Add to my plan",
  "declineLabel": "No, thanks",
  "offerId": "nutrition_guide"
}

Store buttons

Type StoreButtons. Links to both app stores. Official-style App Store / Google Play badges; at least one URL is required. layout, buttonWidth and align arrange them. Static; place on the success step.

Setting	Type	Required	Description
`title`	string	no	Line above the badges, keep <=60 chars, e.g. “Download the app and log in with your email”
`appStoreUrl`	string	no	App Store listing URL; omit to hide the badge. At least one store URL is required
`googlePlayUrl`	string	no	Google Play listing URL; omit to hide the badge. At least one store URL is required
`layout`	”row” \| “stack”	no	row: badges side by side (wrapping on narrow screens). stack: one under the other Default: `"row"`.
`buttonWidth`	”auto” \| “full”	no	auto keeps official badge proportions (164px) and centers them; full stretches badges to the available width Default: `"auto"`.
`align`	”left” \| “center”	no	Horizontal alignment of badges when buttonWidth is auto; ignored for full Default: `"center"`.
`sticky`	boolean	no	Pin the badges to the bottom bar like a sticky Button (use on a final download screen); false = in the page flow Default: `false`.

Example

{
  "title": "Download the app and continue with your email",
  "appStoreUrl": "https://apps.apple.com/",
  "googlePlayUrl": "https://play.google.com/",
  "layout": "row",
  "buttonWidth": "auto",
  "align": "center"
}