Reference
<tl-checkout-wrapper>
Wrap any content and open the checkout modal when it is activated.
| HTML tag | <tl-checkout-wrapper> |
| React | import { TlCheckoutWrapper } from '@ticketlayer/elements-react' |
| Category | Checkout |
| Runs in | web (browser DOM) |
Wrap any content and open the checkout modal when it is activated.
Wraps any content and opens the Ticketlayer checkout modal when clicked. Uses the SDK's modal manager which handles the iframe overlay.
Properties#
| Property | Attribute | Description | Type | Default |
|---|---|---|---|---|
disabled | disabled | Whether the wrapper is disabled | boolean | false |
Events#
| Event | Description | Type |
|---|---|---|
tlClose | Emitted when the modal closes | CustomEvent<void> |
tlComplete | Emitted when checkout completes successfully | CustomEvent<OrderResult> |
tlError | Emitted when an error occurs | CustomEvent<{ message: string; }> |
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.
Slots#
| Slot | Description |
|---|---|
| Content to display (typically a checkout button) |