open-index/open-npm huggingface dataset:
npm package: @qwentes/booking-tool
Description: ###CSS default variables:
Latest version: 0.6.3

# Booking tool

###CSS default variables:

```
--qw-booking-tool-gap-xs: 8px;
--qw-booking-tool-gap-sm: 12px;
--qw-booking-tool-gap-md: 16px;
--qw-booking-tool-gap-lg: 24px;

--qw-booking-tool-primary-dark: black;
--qw-booking-tool-primary-soft: darkgrey;

--qw-booking-tool-neutral-medium: #999;
--qw-booking-tool-neutral-regular: #ccc;
--qw-booking-tool-neutral-lightest: #fff;
```

### Component settings - all optionals (default in brackets):

```
startDate: momentjs date instance (today)
endDate: momentjs date instance (today + day)
dateFormat: string ('D MMM YY')
focusedInput: string 'startDate' | 'endDate' | null (null)
numberOfAdults: number (0)
numberOfChildren: number (0)
showDates: boolean (true)
language: string (en-gb)
labelTranslations: Object (DEFAULT_LABELS)
showAdults: boolean (true),
showChildren: boolean (true),
numberOfMonths: number (2),

---------------------------------------------------------

DEFAULT_LABELS = {
  arrival: 'Arrival',
  departure: 'Departure',
  adults: 'Adults n°',
  child: 'Child n°',
  bookNow: 'Book now'
}
```

### Params emitted onBookNow:

```
momentStartDate: start date momentjs instance,
momentEndDate: end date momentjs instance,,
nativeStartDate: start date native js instance,
nativeEndDate: end date native js instance,
timestampStartDate: timestamp start date,
timestampEndDate: timestamp end date,
checkInDate: days (in number) of the start date,
checkInMonthYear: months and year (in number) of the start date,
checkOutDate: days (in number) of the end date,
checkOutMonthYear: months and year (in number) of the end date,
numberOfAdults: number of adults selected,
numberOfChildren: number of children selected,
```

To trigger the event, add a listener to the custom event 'bookNow'.
The callback will return an object with a property `detail` containing the params described previously.