excursions
Component displaying excursions available for a particular hotel from the Musement API for a particular date range.
Displays excursions from Musement.
Screenshots
Usage
Add the following script tag to your web page to load the microfrontend. Note: This is required only once per webpage, even when you embed multiple instances of the microfrontend.
<script src="https://nonprod.cloud.tui.com/osp/ao/ui/excursions/current/excursions.esm.js" defer></script>Add the following HTML code anywhere in your webpage at the position where you want the microfrontend to show. You can create multiple instances of the microfrontend.
<tui-excursions
locale="VALUE"
market="VALUE">
</tui-excursions>Examples
An MFE that displays excursions cards with excursions from Musement. Texts and currency is configured by provided market and locale.
<tui-excursions
hotel-id="94325"
market="uk"
locale="en-GB"
rating-icon="tui"
coordinates="28.995642,-13.498936"
start-date="2024-09-01"
end-date="2024-09-03">
</tui-excursions>
Attributes
This microfrontend accepts the following attributes:
| Name | Description | Values | Default | Required |
|---|---|---|---|---|
coordinates | Hotel id to retrieve coordinates from | no | ||
end-date | End date for stop searching from. Format YYYY-MM-DD | no | ||
hotel-id | Hotel id to retrieve coordinates from | no | ||
limit | Number of activities to fetch | no | ||
locale | Locale to be used within UI | da-DK, de-AT, de-CH, de-DE, en-GB, en-IE, fi-FI, fr-BE, fr-CH, fr-FR, nb-NO, nl-BE, nl-NL, sv-SE | yes | |
market | Market to which API calls would be sent | at, be, ch, de, dk, fc, fi, fr, ie, nl, no, se, tuifly_be, tuifly_fr, tuifly_ma, uk | yes | |
mode | If set to integrated no main heading is displayed and smaller box-shadow is applied | no | ||
start-date | Start date from where search from. Format YYYY-MM-DD | no | ||
theme | Theme to be used in UI | firstchoice, tui-light | no | |
tracking-id | The id to be used for click tracking | no | ||
utm-medium | The medium value for utm analytics script | no |
Events
This microfrontend emits the following events:
| Event | Schema |
|---|---|
Emitted when component initialization is finished. | |
Emitted when component encountered an error. | |