# Component: Promo Code Redeem

**Available from:** Release 106

**Purpose**: Allow customers to redeem a promo code during acquisition. Most commonly used in cart and checkout pages.

Initial promo code component appearance:

{% embed url="<https://69c2cf3a42a094f3cd354b8d-ojozztnsdo.chromatic.com/?path=/story/shop-components-checkout-promo-code-redeem--default&full=1&shortcuts=false&singleStory=true&embed=true>" %}

Once the initial CTA is clicked:

<figure><img src="/files/lnFVbWtj3aI1isW52uvh" alt=""><figcaption></figcaption></figure>

When the promo code is successfully applied:

<figure><img src="/files/fikfmmHaV1yOzDJDeDBL" alt=""><figcaption></figcaption></figure>

If the promo code could not be applied:

<figure><img src="/files/ZDl5JzILaP2VSMSLsjJ7" alt=""><figcaption></figcaption></figure>

## Props

| Prop Label                               | Type   | Default Value                                        | Notes                                                                                                                                                                                                                   |
| ---------------------------------------- | ------ | ---------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Prompt for customers to use a promo code | String | Add promotional code                                 | This prop controls the text that is displayed to an end customer. If they click this text, it turns into an input field.                                                                                                |
| Promo code input placeholder text        | String | Promotional code                                     | This prop controls the placeholder text displayed in the promo code input field.                                                                                                                                        |
| CTA to apply promo code                  | String | Apply                                                | Drives the text that appears on the button that the customer will click to add the promo code to their basket.                                                                                                          |
| Successful promo code message            | String | {{promoCode}} applied                                | This displays when the customer successfully applies their promo code. Read more about Limio variables here: [Limio Variables](/components/component-library/list-of-variables-that-can-be-used-in-limio-components.md) |
| Invalid promo code message               | String | This promo code is invalid and could not be applied. | This text will show to customers for any error returned when trying to redeem a code. In the future we might split this out but for simplicity it should be driven by any API error for now.                            |


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.limio.com/components/component-library/cart-components/component-promo-code-redeem.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.