<tl-promo-code>
| HTML tag | <tl-promo-code> |
| React | import { TlPromoCode } from '@ticketlayer/elements-react' |
| Category | Purchase |
| Runs in | web (browser DOM) |
tl-promo-code - an input plus Apply button that redeems a presale or promo code for the current cart (POST /sales/presale-codes/redeem through the SDK). Redemption unlocks gated pricing on the customer; the SDK re-reads the cart and publishes cart:updated, so tl-cart and badges re-render on their own.
The API has no un-redeem, so the applied state offers only "use a different code", which clears the input for another redemption.
<tl-promo-code></tl-promo-code>
Properties
| Property | Attribute | Description | Type | Default |
|---|---|---|---|---|
buttonLabel | button-label | Apply button label. | string | 'Apply' |
placeholder | placeholder | Input placeholder. | string | 'Promo or presale code' |
Events
| Event | Description | Type |
|---|---|---|
tlError | CustomEvent<{ message: string; }> | |
tlPromoApplied | CustomEvent<TlPromoApplied> |
Events are CustomEvents; the payload is on event.detail. In HTML, listen with element.addEventListener('tlXxx', handler); in React the wrapper exposes each one as an onTlXxx prop.