The Social Stats Component

Description

The Social Stats component displays notifications regarding a hotel as pressure points to customers. Currently, the two types "This hotel has been booked in the last 24 hours" and "This hotel is very popular with our customers" are supported for hotels.

Screenshots

The default view of the component.

Example of the component with LG size.

Example of the component with MD size.

Example of the component with SM size.

Example of the component with XS size.

Maintainer	picr-developmentb2c-tuicom@tui.com
Locales	`en-US`, `de-DE`, `fr-FR`

Usage

Add the following script tag (or something similar) to your web page to have the component load. Note: This is required only once per webpage, even when you embed multiple instances of the component.

<script src="https://cloud.tui.com/6m/search/social-stats/master/main.js" async defer></script>

Add the following HTML code anywhere in your webpage at the position where you want the component to show. You can create multiple instances of the component. Remember to replace VALUE with actual valid values for the given attribute.

<tui-social-notification
	type="VALUE"
	reference="VALUE"
	variant="VALUE">
</tui-social-notification>

Examples

This component displays in English language and informs the customer that the hotel with reference 6648 was booked during the last 24 hours.
```
<tui-social-notification
	variant="last-booked"
	reference="6648"
	locale="en-US">
</tui-social-notification>
```
This component displays in German language and informs the customer that some person has viewed the hotel with reference 6648 during the last hour.
```
<tui-social-notification
	variant="current-views"
	reference="6648"
	locale="de-DE">
</tui-social-notification>
```

Attributes

This component can be configured with the following attributes: