> ## Documentation Index
> Fetch the complete documentation index at: https://docs.funeli.top/llms.txt
> Use this file to discover all available pages before exploring further.

# Components: after purchase

> Reference for the Funeli after purchase components: what each one is for, every setting with its type and default, and a working example.

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 |

> [accordion] Example
>
> ```json theme={null}
> {
>   "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`. |

> [accordion] Example
>
> ```json theme={null}
> {
>   "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"
> }
> ```


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.