Skip to main content

<tl-event-card>

HTML tag<tl-event-card>
Reactimport { TlEventCard } from '@ticketlayer/elements-react'
CategoryDiscovery
Runs inweb (browser DOM), native (planned React Native set)

Properties

PropertyAttributeDescriptionTypeDefault
event--Event data to display (tl-event-list passes this)TlEventCardEvent | undefinedundefined
eventIdevent-idLoad the event from the SDK by id when no event is given, so a single card works standalone (e.g. on a Webflow page).string | undefinedundefined

Events

EventDescriptionType
tlClickEmitted when the card is clickedCustomEvent<{ eventId: string; }>
tlErrorEmitted when the event could not be loaded by idCustomEvent<{ 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.

Used by: <tl-event-list>