@qite/tide-booking-component 1.4.38 → 1.4.40

package/build/build-esm/qsm/components/double-search-input-group/index.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
+import { DoubleFieldConfig } from '../../types';
 interface Props {
-  fieldKey: string;
+  fieldConfig: DoubleFieldConfig;
   showReverse?: boolean;
 }
 declare const DoubleSearchInputGroup: React.FC<Props>;

package/build/build-esm/qsm/components/search-input/index.d.ts

@@ -8,6 +8,7 @@ interface SearchInputProps {
   label: string;
   isSecondInput?: boolean;
   isDoubleInput?: boolean;
+  isDisabled?: boolean;
 }
 declare const SearchInput: React.FC<SearchInputProps>;
 export default SearchInput;

package/build/build-esm/qsm/components/search-input-group/index.d.ts

@@ -1,11 +1,13 @@
 import React from 'react';
+import { BaseFieldConfig } from '../../types';
 interface Props {
-  fieldKey: string;
+  fieldConfig: BaseFieldConfig;
   enableMobileFilter?: boolean;
   highlightTarget?: string;
   isSecondInput?: boolean;
   isDoubleInput?: boolean;
   readOnlyForced?: boolean;
+  isDisabled?: boolean;
 }
 declare const SearchInputGroup: React.FC<Props>;
 export default SearchInputGroup;

package/build/build-esm/qsm/store/qsm-slice.d.ts

@@ -1,6 +1,7 @@
-import { MobileFilterType, Room, TravelerType, TravelType, TravelClass, TypeaheadOption } from '../types';
+import { MobileFilterType, Room, TravelerType, TravelType, TravelClass, TypeaheadOption, QsmType } from '../types';
 import { ReactNode } from 'react';
 export interface QSMState {
+  qsmType?: QsmType;
   selectedOrigin?: string;
   selectedDestination?: string;
   selectedAirport?: string;
@@ -31,6 +32,7 @@ export interface QSMState {
     after: number;
   };
   travelTypes: TravelType[];
+  tripType: 'oneway' | 'roundtrip' | 'openjaw';
   selectedTravelType?: string;
   travelClasses: TravelClass[];
   selectedTravelClass?: string;
@@ -45,7 +47,8 @@ export interface QSMState {
   rooms: Room[];
   [key: string]: any;
 }
-export declare const setOrigin: import('@reduxjs/toolkit').ActionCreatorWithPayload<string, 'qsm/setOrigin'>,
+export declare const setSelectedQsmType: import('@reduxjs/toolkit').ActionCreatorWithPayload<QsmType, 'qsm/setSelectedQsmType'>,
+  setOrigin: import('@reduxjs/toolkit').ActionCreatorWithPayload<string, 'qsm/setOrigin'>,
   setDestination: import('@reduxjs/toolkit').ActionCreatorWithPayload<string, 'qsm/setDestination'>,
   setAirport: import('@reduxjs/toolkit').ActionCreatorWithPayload<string, 'qsm/setAirport'>,
   setFromDate: import('@reduxjs/toolkit').ActionCreatorWithOptionalPayload<string | undefined, 'qsm/setFromDate'>,
@@ -85,6 +88,7 @@ export declare const setOrigin: import('@reduxjs/toolkit').ActionCreatorWithPayl
     | undefined,
     'qsm/setSelectedFlexRange'
   >,
+  setTripType: import('@reduxjs/toolkit').ActionCreatorWithPayload<'oneway' | 'roundtrip' | 'openjaw', 'qsm/setTripType'>,
   setTravelTypes: import('@reduxjs/toolkit').ActionCreatorWithPayload<TravelType[], 'qsm/setTravelTypes'>,
   setSelectedTravelType: import('@reduxjs/toolkit').ActionCreatorWithPayload<any, 'qsm/setSelectedTravelType'>,
   setTravelClasses: import('@reduxjs/toolkit').ActionCreatorWithPayload<TravelType[], 'qsm/setTravelClasses'>,

package/build/build-esm/qsm/types.d.ts

@@ -1,35 +1,29 @@
 import { ReactNode } from 'react';
 export interface QSMConfiguration {
-  type: 'hotel' | 'roundTrip' | 'flight';
+  type?: QsmType;
   askRooms?: boolean;
   askTravelType?: boolean;
+  allowOneWay?: boolean;
+  allowRoundtrip?: boolean;
   allowOpenJaw?: boolean;
   allowMultiCity?: boolean;
   askTravelClass?: boolean;
-  allowOneWay?: boolean;
   additionalFilters?: AdditionalFilters;
   askTravelers: boolean;
-  searchFields: FieldConfig[];
-  origins: Origin[];
-  originTypeAhead: boolean;
-  onOriginChange: (origin: string) => void;
-  destinations: Destination[];
-  destinationTypeAhead: boolean;
-  destinationIcon: ReactNode;
-  onDestinationChange: (destination: string) => void;
-  airports: Airport[];
-  airportTypeAhead: boolean;
-  airportIcon: ReactNode;
-  onAirportChange: (airport: string) => void;
-  travelTypes: TravelType[];
-  travelTypeIcon: ReactNode;
-  travelClasses: TravelClass[];
-  travelClassIcon: ReactNode;
+  askNationality?: boolean;
+  departureAirport?: BaseFieldConfig;
+  destinationAirport?: BaseFieldConfig;
+  returnAirport?: BaseFieldConfig;
+  destination?: BaseFieldConfig;
+  travelTypes?: TravelType[];
+  travelTypeIcon?: ReactNode;
+  travelClasses?: TravelClass[];
+  travelClassIcon?: ReactNode;
   dateFlexibility?: DateFlexibility[];
   minDate?: Date;
   maxDate?: Date;
-  showReturnDate: boolean;
-  datesIcon: ReactNode;
+  showReturnDate?: boolean;
+  datesIcon?: ReactNode;
   defaultTravelers?: number;
   maxTravelers?: number;
   maxChildAge?: number;
@@ -39,10 +33,12 @@ export interface QSMConfiguration {
   nationalities: Nationality[];
   languageCode?: string;
 }
+export type QsmType = 'multidestination' | 'hotel' | 'roundTrip' | 'flight' | 'hotel-flight' | 'package' | 'ticket' | 'car' | 'transfers' | 'cruises';
 export interface BaseFieldConfig {
   fieldKey: string;
   label: string;
   placeholder: string;
+  icon: ReactNode;
   options: TypeaheadOption[];
   autoComplete?: boolean;
   onChange?: (data: any) => void;
@@ -62,6 +58,7 @@ export interface DoubleFieldConfig {
   type: 'double';
   fieldKey: string;
   showReverse?: boolean;
+  disableReturnField?: boolean;
   fields: BaseFieldConfig[];
 }
 export type FieldConfig = SingleFieldConfig | DoubleFieldConfig;
@@ -69,18 +66,6 @@ export interface AdditionalFilters {
   showDirectFlights: boolean;
   includeLuggage: boolean;
 }
-export interface Origin {
-  key: string;
-  value: string;
-}
-export interface Destination {
-  key: string;
-  value: string;
-}
-export interface Airport {
-  key: string;
-  value: string;
-}
 export interface DateFlexibility {
   name: string;
   before: number;

package/build/build-esm/search-results/components/filters/flight-filters.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface FiltersProps {
+  isOpen: boolean;
+  handleSetIsOpen: () => void;
+  isLoading?: boolean;
+}
+declare const FlightFilters: React.FC<FiltersProps>;
+export default FlightFilters;

package/build/build-esm/search-results/components/flight/flight-accommodation-results.d.ts

@@ -1,4 +1,7 @@
 import React from 'react';
-interface FlightAccommodationResultsProps {}
+import { ExtendedFlightSearchResponseItem } from '../../types';
+interface FlightAccommodationResultsProps {
+  searchResults: ExtendedFlightSearchResponseItem[];
+}
 declare const FlightAccommodationResults: React.FC<FlightAccommodationResultsProps>;
 export default FlightAccommodationResults;

package/build/build-esm/search-results/components/flight/flight-option.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { ExtendedFlightSearchResponseItem } from '../../types';
+interface FlightOptionProps {
+  item: ExtendedFlightSearchResponseItem;
+}
+declare const FlightOption: React.FC<FlightOptionProps>;
+export default FlightOption;

package/build/build-esm/search-results/components/flight/flight-search-context/index.d.ts

@@ -0,0 +1,36 @@
+import React from 'react';
+import { ExtendedFlightSearchResponseItem, Filters, SortByType } from '../../../types';
+interface FlightFilterContextProps {
+  children: React.ReactNode;
+  tideConnection: any;
+}
+interface FlightSearchContext {
+  isHubReady: boolean;
+  currentRequestId: number;
+  valuesManuallyChanged: boolean;
+  flightsLoading: boolean;
+  flightSearchResults: ExtendedFlightSearchResponseItem[];
+  filteredResults: ExtendedFlightSearchResponseItem[];
+  filters: Filters;
+  sortByTypes: SortByType[];
+  selectedSortByType: SortByType;
+  airlineResults: ExtendedFlightSearchResponseItem[];
+  numberOfStopsResults: ExtendedFlightSearchResponseItem[];
+  departureRangeResults: ExtendedFlightSearchResponseItem[];
+  departureAirportsResults: ExtendedFlightSearchResponseItem[];
+  arrivalAirportsResults: ExtendedFlightSearchResponseItem[];
+  travelTimeResults: ExtendedFlightSearchResponseItem[];
+  priceResults: ExtendedFlightSearchResponseItem[];
+  onFlightSearch: () => void;
+  setFlightSearchResults: (results: ExtendedFlightSearchResponseItem[]) => void;
+  setFilters: (filters: Filters) => void;
+  setFilteredResults: (results: ExtendedFlightSearchResponseItem[]) => void;
+  setSelectedSortByType: (val: SortByType) => void;
+  resetFilters: () => void;
+  setValuesManuallyChanged: (val: boolean) => void;
+  onFilter: () => void;
+}
+declare const FlightSearchContext: React.Context<FlightSearchContext>;
+export declare const FlightSearchProvider: React.FC<FlightFilterContextProps>;
+export declare const useFlightSearch: () => FlightSearchContext;
+export {};

package/build/build-esm/search-results/components/icon.d.ts

@@ -5,6 +5,7 @@ interface IconProps {
   title?: string;
   width?: number;
   height?: number;
+  fill?: string;
 }
 declare const Icon: React.FC<IconProps>;
 export default Icon;

package/build/build-esm/search-results/components/item-picker/index.d.ts

@@ -1,12 +1,14 @@
 import React from 'react';
-import { TravelClass, TravelType } from '../../types';
+import { SortByType, TravelClass, TravelType } from '../../types';
 interface ItemPickerProps {
-  items: TravelType[] | TravelClass[];
+  items: TravelType[] | TravelClass[] | SortByType[];
   selection: string | undefined;
+  selectedSortByType?: SortByType;
   label: string;
   placeholder: string;
   classModifier: string;
-  onPick: (picked: string) => void;
+  valueFormatter?: (value: string, direction?: string) => string;
+  onPick: (picked: string, direction?: string) => void;
 }
 declare const ItemPicker: React.FC<ItemPickerProps>;
 export default ItemPicker;

package/build/build-esm/search-results/components/search-results-container/flight-search-results.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+interface FlightResultsContainerProps {
+  isMobile: boolean;
+}
+declare const FlightResultsContainer: React.FC<FlightResultsContainerProps>;
+export default FlightResultsContainer;

package/build/build-esm/search-results/store/search-results-slice.d.ts

@@ -3,6 +3,7 @@ import { BookingPackage, BookingPackageItem, EntryLight } from '@qite/tide-clien
 export interface SearchResultsState {
   results: BookingPackageItem[];
   selectedHotelId: number | null;
+  selectedFlightId: string | null;
   bookingPackageDetails: BookingPackage | null;
   entry: EntryLight | null;
   isLoading: boolean;
@@ -18,6 +19,7 @@ export declare const setResults: import('@reduxjs/toolkit').ActionCreatorWithPay
     'searchResults/setResults'
   >,
   setSelectedHotel: import('@reduxjs/toolkit').ActionCreatorWithPayload<number | null, 'searchResults/setSelectedHotel'>,
+  setSelectedFlight: import('@reduxjs/toolkit').ActionCreatorWithPayload<string | null, 'searchResults/setSelectedFlight'>,
   setBookingPackageDetails: import('@reduxjs/toolkit').ActionCreatorWithPayload<
     {
       details: BookingPackage;

package/build/build-esm/search-results/types.d.ts

@@ -1,10 +1,13 @@
+import { FlightSearchResponseItem } from '@qite/tide-client';
 import { ReactNode } from 'react';
+export type SRPType = 'hotel' | 'flight' | 'hotel-flight' | 'roundTrip';
 export interface SearchResultsConfiguration {
-  type: 'hotel' | 'roundTrip' | 'flight' | 'hotel-flight';
+  type: SRPType;
   tideConnection: {
     host: string;
     apiKey: string;
     catalogueIds?: number[];
+    officeId?: number;
   };
   showFilters: boolean;
   filterIcon?: ReactNode;
@@ -109,3 +112,30 @@ export interface SortingOption {
   label: string;
   icon?: ReactNode;
 }
+export interface ExtendedFlightSearchResponseItem extends FlightSearchResponseItem {
+  requestId: number;
+  guid: string;
+}
+export interface Sequence {
+  requestId: number;
+  sequenceId: number;
+}
+export interface FilterValue {
+  name: string;
+  id: number | string;
+  lowestPrice: number;
+}
+export interface Filters {
+  airlines: FilterValue[];
+  numberOfStops: FilterValue[];
+  departureRanges: FilterValue[];
+  departureAirports: FilterValue[];
+  arrivalAirports: FilterValue[];
+  travelTimes: FilterValue[];
+  prices: FilterValue[];
+}
+export interface SortByType {
+  direction: 'asc' | 'desc';
+  label: string;
+  icon?: ReactNode;
+}

package/build/build-esm/search-results/utils/flight-utils.d.ts

@@ -0,0 +1,16 @@
+import { FlightSearchResponseFlight, FlightSearchResponseFlightSegment } from '@qite/tide-client';
+import { ExtendedFlightSearchResponseItem, SortByType } from '../types';
+import { DepartureRange } from '../../shared/types';
+export declare const getOutwardFlight: (flightResult: ExtendedFlightSearchResponseItem) => FlightSearchResponseFlight | undefined;
+export declare const getFlightSegments: (flight: FlightSearchResponseFlight | undefined) => FlightSearchResponseFlightSegment[];
+export declare const getDepartureSegment: (flight: FlightSearchResponseFlight | undefined) => FlightSearchResponseFlightSegment | undefined;
+export declare const getArrivalSegment: (flight: FlightSearchResponseFlight | undefined) => FlightSearchResponseFlightSegment | undefined;
+export declare const getNumberOfStops: (flight: FlightSearchResponseFlight | undefined) => number;
+export declare const getNumberOfStopsLabel: (
+  flight: FlightSearchResponseFlight | undefined,
+  directLabel: string,
+  stopsLabel: string,
+  stopLabel: string
+) => string;
+export declare const getDepartureRangeName: (translations: any, range: DepartureRange | undefined) => string;
+export declare const getSortingName: (translations: any, sortByType: SortByType) => string;

package/build/build-esm/shared/components/flyin.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+type FlyInProps = {
+  isOpen: boolean;
+  setIsOpen: (open: boolean) => void;
+  className?: string;
+  onPanelRef?: (el: HTMLDivElement | null) => void;
+};
+declare const FlyIn: React.FC<FlyInProps>;
+export default FlyIn;

package/build/build-esm/shared/types.d.ts

@@ -2,3 +2,9 @@ export interface ApiSettingsState {
   apiUrl: string;
   apiKey: string;
 }
+export declare enum DepartureRange {
+  Morning = 0,
+  Afternoon = 1,
+  Evening = 2,
+  Night = 3
+}

package/build/build-esm/shared/utils/localization-util.d.ts

@@ -1,6 +1,8 @@
 export declare const languages: string[];
 export declare const defaultLanguage = 'nl-BE';
 export declare const formatPrice: (price: number, currencyCode: string, locale?: string) => string;
+import { DateStruct } from '@qite/tide-client';
+import { DepartureRange } from '../types';
 export declare const getTranslations: (language: string) => {
   STEPS: {
     PERSONAL_DETAILS: string;
@@ -137,8 +139,11 @@ export declare const getTranslations: (language: string) => {
     CHILD: string;
     CHILDREN: string;
     GENDER: string;
+    GENDER_ID: string;
     MALE: string;
+    MALE_GENDER: string;
     FEMALE: string;
+    FEMALE_GENDER: string;
     OTHER: string;
     MAIN_BOOKER: string;
     FIRST_NAME: string;
@@ -249,6 +254,85 @@ export declare const getTranslations: (language: string) => {
     LABEL_CREATING: string;
     LABEL_PRINTING: string;
   };
+  QSM: {
+    MULTIDESTINATION: string;
+    PACKAGES: string;
+    TRANSPORT_HOTEL: string;
+    ACCOMMODATION: string;
+    TRANSPORTS: string;
+    TICKET_ONLY: string;
+    RENT_A_CAR: string;
+    TRANSFERS: string;
+    CRUISES: string;
+    ONE_ACCOMMODATION: string;
+    MULTIPLE_ACCOMMODATIONS: string;
+    TRAVEL_CLASS_LABEL: string;
+    TRAVEL_CLASS_PLACEHOLDER: string;
+    TRAVEL_TYPE_LABEL: string;
+    TRAVEL_TYPE_PLACEHOLDER: string;
+    NATIONALITY_LABEL: string;
+    NATIONALITY_PLACEHOLDER: string;
+    TRAVELERS_LABEL: string;
+    ADD_ROOM: string;
+    REMOVE_ROOM: string;
+    MAX_TRAVELERS_REACHED: string;
+    ADULTS: string;
+    CHILDREN: string;
+    BABIES: string;
+    CHOOSE_DATES: string;
+    DEPARTURE_DATE: string;
+    RETURN_DATE: string;
+    CONFIRM: string;
+    TRAVELERS: string;
+  };
+  SRP: {
+    NO_RESULTS: string;
+    TOTAL_RESULTS_LABEL: string;
+    RESET: string;
+    LUGGAGEINCLUDED: string;
+    CANCEL: string;
+    APPLY: string;
+    LOADING: string;
+    SEARCHRESULTCTA: string;
+    SORTBY: string;
+    PRICE_ASC: string;
+    PRICE_DESC: string;
+    DEPARTURE_ASC: string;
+    FILTERS: string;
+    SHOW_ITINERARY: string;
+    ITINERARY_TITLE: string;
+    DOSSIER_NUMBER: string;
+    PACKAGE_PRICE_PER_PERSON: string;
+    TOTAL: string;
+    DAY_BY_DAY: string;
+    START: string;
+    END: string;
+    EXTENDED: string;
+    COMPACT: string;
+    LIST: string;
+    SELECT: string;
+    DEPARTURE: string;
+    RETURN: string;
+    DIRECT: string;
+    STOPS: string;
+    STOP: string;
+    STOP_TIME: string;
+    ACCOMMODATION: string;
+    VIEW_DETAILS: string;
+    NIGHTS: string;
+    MORNING_RANGE: string;
+    AFTERNOON_RANGE: string;
+    EVENING_RANGE: string;
+    NIGHT_RANGE: string;
+    DEPARTURE_RANGE: string;
+    DEPARTURE_AIRPORTS: string;
+    ARRIVAL_AIRPORTS: string;
+    PRICE: string;
+    DEPARTURE_TIME_ASC: string;
+    DEPARTURE_TIME_DESC: string;
+    DURATION_ASC: string;
+    DURATION_DESC: string;
+  };
 };
 export declare const locales: {
   'ar-SA': Locale;
@@ -273,3 +357,10 @@ export declare const getPriceDifferenceText: (price: number, currencyCode: strin
 export declare function format(text: string, args: any[]): string;
 export declare const formatTime: (date: Date) => string;
 export declare const formatDate: (date: Date) => string;
+export declare const dateToDateStruct: (date: Date | undefined) => DateStruct;
+export declare const timeFromDateTime: (dateTime: Date | undefined) => string;
+export declare const longFormatDate: (dateTime: Date | undefined, language: string) => string;
+export declare const durationTicksInHoursString: (durationInTicks: number) => string;
+export declare const durationInTicksInMinutes: (durationInTicks: number) => number;
+export declare const minutesToHoursString: (totalMinutes: number) => string;
+export declare const rangeFromDateTimeInMinutes: (dateTime: Date | undefined) => DepartureRange;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qite/tide-booking-component",
-  "version": "1.4.38",
+  "version": "1.4.40",
   "description": "React Booking wizard & Booking product component for Tide",
   "main": "build/build-cjs/index.js",
   "module": "build/build-esm/index.js",
@@ -27,7 +27,7 @@
   "devDependencies": {
     "@jsonurl/jsonurl": "^1.1.4",
     "@popperjs/core": "^2.10.2",
-    "@qite/tide-client": "^1.1.134",
+    "@qite/tide-client": "^1.1.137",
     "@reach/router": "^1.3.4",
     "@reduxjs/toolkit": "^1.6.0",
     "@rollup/plugin-commonjs": "^19.0.1",
@@ -72,6 +72,7 @@
     "uuid": "^8.3.2"
   },
   "dependencies": {
-    "react-html-comment": "^2.0.16"
+    "react-html-comment": "^2.0.16",
+    "signalr-no-jquery": "^0.2.1"
   }
 }

package/rollup.config.js

@@ -9,8 +9,8 @@ import typescript from 'rollup-plugin-typescript2';
 export default {
   input: 'src/index.ts',
   output: [
-    { file: packageJson.main, format: 'cjs', banner: '/* eslint-disable */' },
-    { file: packageJson.module, format: 'esm', banner: '/* eslint-disable */' }
+    { file: packageJson.main, format: 'cjs', banner: '/* eslint-disable */', inlineDynamicImports: true },
+    { file: packageJson.module, format: 'esm', banner: '/* eslint-disable */', inlineDynamicImports: true }
   ],
   plugins: [peerDepsExternal(), json(), nodeResolve(), commonjs(), typescript(), del({ targets: ['build/*'] })]
 };

package/src/booking-product/components/dates.tsx

@@ -129,7 +129,7 @@ const Dates: React.FC<DatesProps> = ({ value, duration, onChange, availableDateP
             panelActive && 'qsm__panel--active',
             !mqm?.matches && 'qsm__panel--mobile'
           ])}
-          style={mqm?.matches ? styles.popper : undefined}
+          style={mqm?.matches ? (styles.popper as any) : undefined}
           {...attributes.popper}>
           <DateRangePicker
             fromDate={value?.fromDate}

package/src/booking-wizard/features/booking/booking-slice.ts

@@ -177,7 +177,8 @@ const fetchPackageDetails = createAsyncThunk('booking/details', async (_, { disp
       airlines: bookingAttributes.flight.outwardAirlines,
       flightNumbers: bookingAttributes.flight.outwardNumbers,
       fareCode: bookingAttributes.flight.outwardFareCode,
-      marketingName: bookingAttributes.flight.outwardMarketingName
+      marketingName: bookingAttributes.flight.outwardMarketingName,
+      luggageIncluded: bookingAttributes.flight.luggageIncluded
     } as SelectedFlight;
 
     if (bookingAttributes.flight.returnCode) {
@@ -188,7 +189,8 @@ const fetchPackageDetails = createAsyncThunk('booking/details', async (_, { disp
         airlines: bookingAttributes.flight.returnAirlines,
         flightNumbers: bookingAttributes.flight.returnNumbers,
         fareCode: bookingAttributes.flight.returnFareCode,
-        marketingName: bookingAttributes.flight.returnMarketingName
+        marketingName: bookingAttributes.flight.returnMarketingName,
+        luggageIncluded: bookingAttributes.flight.luggageIncluded
       } as SelectedFlight;
     }
   }

package/src/booking-wizard/types.ts

@@ -134,6 +134,7 @@ export interface FlightInfo {
   returnClass: string;
   returnDepartureDate: string | null;
   returnArrivalDate: string | null;
+  luggageIncluded: boolean; // used to get correct flight from amadeus
 }
 
 export interface TravelersFormValues {