@qite/tide-booking-component 1.4.29 → 1.4.31

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (43) hide show
  1. package/build/build-cjs/index.js +621 -2822
  2. package/build/build-cjs/search-results/store/search-results-slice.d.ts +6 -3
  3. package/build/build-cjs/search-results/types.d.ts +9 -12
  4. package/build/build-esm/index.js +617 -2625
  5. package/build/build-esm/search-results/store/search-results-slice.d.ts +6 -3
  6. package/build/build-esm/search-results/types.d.ts +9 -12
  7. package/package.json +2 -3
  8. package/src/booking-product/components/dates.tsx +9 -4
  9. package/src/booking-wizard/components/step-indicator.tsx +11 -2
  10. package/src/booking-wizard/features/booking/booking-slice.ts +27 -2
  11. package/src/booking-wizard/features/booking/booking.tsx +32 -15
  12. package/src/booking-wizard/features/booking/selectors.ts +6 -0
  13. package/src/booking-wizard/features/flight-options/index.tsx +27 -3
  14. package/src/booking-wizard/features/product-options/option-room.tsx +1 -1
  15. package/src/booking-wizard/features/product-options/options-form.tsx +14 -4
  16. package/src/booking-wizard/features/room-options/room.tsx +1 -1
  17. package/src/booking-wizard/features/sidebar/index.tsx +4 -1
  18. package/src/booking-wizard/features/sidebar/sidebar-util.ts +1 -3
  19. package/src/booking-wizard/features/sidebar/sidebar.tsx +112 -104
  20. package/src/booking-wizard/features/travelers-form/travelers-form-slice.ts +1 -0
  21. package/src/booking-wizard/features/travelers-form/travelers-form.tsx +146 -10
  22. package/src/booking-wizard/settings-context.ts +2 -1
  23. package/src/booking-wizard/types.ts +1 -0
  24. package/src/qsm/components/search-input-group/index.tsx +17 -8
  25. package/src/search-results/components/hotel/hotel-accommodation-results.tsx +78 -83
  26. package/src/search-results/components/hotel/hotel-card.tsx +54 -24
  27. package/src/search-results/components/icon.tsx +13 -0
  28. package/src/search-results/components/item-picker/index.tsx +5 -7
  29. package/src/search-results/components/search-results-container/search-results-container.tsx +72 -117
  30. package/src/search-results/components/tab-views/index.tsx +22 -3
  31. package/src/search-results/features/flights/flight-search-results-self-contained.tsx +0 -13
  32. package/src/search-results/features/hotels/hotel-flight-search-results-self-contained.tsx +1 -8
  33. package/src/search-results/features/hotels/hotel-search-results-self-contained.tsx +1 -14
  34. package/src/search-results/features/roundtrips/roundtrip-search-results-self-contained.tsx +1 -9
  35. package/src/search-results/store/search-results-slice.ts +11 -4
  36. package/src/search-results/types.ts +11 -16
  37. package/src/shared/translations/en-GB.json +5 -1
  38. package/src/shared/translations/fr-BE.json +5 -1
  39. package/src/shared/translations/nl-BE.json +5 -1
  40. package/styles/components/_form.scss +51 -2
  41. package/styles/components/_passenger-picker.scss +3 -2
  42. package/styles/components/_qsm.scss +1 -1
  43. package/styles/qsm/_qsm.scss +67 -6
@@ -1025,7 +1025,7 @@ var enJson = {
1025
1025
  PRINT_OFFER_BUTTON: PRINT_OFFER_BUTTON
1026
1026
  };
1027
1027
 
1028
- var formatPrice = function (price, currencyCode, locale) {
1028
+ var formatPrice$1 = function (price, currencyCode, locale) {
1029
1029
  if (locale === void 0) {
1030
1030
  locale = 'nl-BE';
1031
1031
  }
@@ -1067,7 +1067,7 @@ function getLocale(code) {
1067
1067
  }
1068
1068
  }
1069
1069
  var getPriceDifferenceText = function (price, currencyCode) {
1070
- return price > 0 ? '+ '.concat(formatPrice(Math.abs(price), currencyCode)) : '- '.concat(formatPrice(Math.abs(price), currencyCode));
1070
+ return price > 0 ? '+ '.concat(formatPrice$1(Math.abs(price), currencyCode)) : '- '.concat(formatPrice$1(Math.abs(price), currencyCode));
1071
1071
  };
1072
1072
  function format(text, args) {
1073
1073
  return text.replace(/{([0-9]+)}/g, function (match, index) {
@@ -7561,16 +7561,16 @@ var formatPriceByMode = function (price, priceMode, personCount, duration, perPe
7561
7561
  if (!price) return '';
7562
7562
  switch (priceMode) {
7563
7563
  case 0:
7564
- return ''.concat(formatPrice(price, currencyCode));
7564
+ return ''.concat(formatPrice$1(price, currencyCode));
7565
7565
  case 1:
7566
7566
  var perPersonPrice = price / personCount;
7567
- return ''.concat(formatPrice(perPersonPrice, currencyCode), ' / ').concat(perPersonLabel);
7567
+ return ''.concat(formatPrice$1(perPersonPrice, currencyCode), ' / ').concat(perPersonLabel);
7568
7568
  case 2:
7569
7569
  var perNightPrice = price / duration;
7570
- return ''.concat(formatPrice(perNightPrice, currencyCode), ' / ').concat(perNightLabel);
7570
+ return ''.concat(formatPrice$1(perNightPrice, currencyCode), ' / ').concat(perNightLabel);
7571
7571
  case 3:
7572
7572
  var perPersonPerNightPrice = price / duration;
7573
- return ''.concat(formatPrice(perPersonPerNightPrice, currencyCode), ' / ').concat(perPersonPerNightLabel);
7573
+ return ''.concat(formatPrice$1(perPersonPerNightPrice, currencyCode), ' / ').concat(perPersonPerNightLabel);
7574
7574
  }
7575
7575
  };
7576
7576
 
@@ -9611,7 +9611,8 @@ var Dates = function (_a) {
9611
9611
  onChange = _a.onChange;
9612
9612
  var language = useContext(SettingsContext$1).language;
9613
9613
  var translations = getTranslations(language);
9614
- var mql = typeof window !== 'undefined' ? window.matchMedia('(min-width: 1200px)') : undefined;
9614
+ var mql = typeof window !== 'undefined' ? window.matchMedia('(min-width: 992px)') : undefined;
9615
+ var mqm = typeof window !== 'undefined' ? window.matchMedia('(min-width: 768px)') : undefined;
9615
9616
  var _b = useState(null),
9616
9617
  referenceElement = _b[0],
9617
9618
  setReferenceElement = _b[1];
@@ -9622,8 +9623,12 @@ var Dates = function (_a) {
9622
9623
  panelActive = _d[0],
9623
9624
  setPanelActive = _d[1];
9624
9625
  var _e = usePopper(referenceElement, popperElement, {
9625
- placement: 'top',
9626
+ placement: (mql === null || mql === void 0 ? void 0 : mql.matches) ? 'top' : 'bottom',
9626
9627
  modifiers: [
9628
+ {
9629
+ name: 'flip',
9630
+ enabled: false
9631
+ },
9627
9632
  {
9628
9633
  name: 'offset',
9629
9634
  options: {
@@ -9706,9 +9711,9 @@ var Dates = function (_a) {
9706
9711
  className: buildClassName([
9707
9712
  'qsm__panel qsm__panel--bordered qsm__panel--dates-pricing',
9708
9713
  panelActive && 'qsm__panel--active',
9709
- !(mql === null || mql === void 0 ? void 0 : mql.matches) && 'qsm__panel--mobile'
9714
+ !(mqm === null || mqm === void 0 ? void 0 : mqm.matches) && 'qsm__panel--mobile'
9710
9715
  ]),
9711
- style: (mql === null || mql === void 0 ? void 0 : mql.matches) ? styles.popper : undefined
9716
+ style: (mqm === null || mqm === void 0 ? void 0 : mqm.matches) ? styles.popper : undefined
9712
9717
  },
9713
9718
  attributes.popper
9714
9719
  ),
@@ -14829,7 +14834,7 @@ var NoneOption = function (_a) {
14829
14834
  return x.requirementType === 2;
14830
14835
  });
14831
14836
  var noneSelected = !selectedOption;
14832
- var priceDifferencetext = selectedOption ? '- '.concat(formatPrice(Math.abs(selectedOption.line.price), currencyCode)) : '';
14837
+ var priceDifferencetext = selectedOption ? '- '.concat(formatPrice$1(Math.abs(selectedOption.line.price), currencyCode)) : '';
14833
14838
  return React.createElement(
14834
14839
  React.Fragment,
14835
14840
  null,
@@ -16091,7 +16096,7 @@ var OptionRoom = function (_a) {
16091
16096
  e.preventDefault();
16092
16097
  };
16093
16098
  var getPriceDifferenceText = function (price) {
16094
- return price > 0 ? '+ '.concat(formatPrice(Math.abs(price), currencyCode)) : '- '.concat(formatPrice(Math.abs(price), currencyCode));
16099
+ return price > 0 ? '+ '.concat(formatPrice$1(Math.abs(price), currencyCode)) : '- '.concat(formatPrice$1(Math.abs(price), currencyCode));
16095
16100
  };
16096
16101
  var getAccommodationPriceDifference = function (accommodation) {
16097
16102
  var _a;
@@ -17430,7 +17435,7 @@ var Sidebar = function (_a) {
17430
17435
  { className: 'pricing-summary__property' },
17431
17436
  React.createElement('h6', { className: 'pricing-summary__title' }, translations.SIDEBAR.BASE_PRICE)
17432
17437
  ),
17433
- React.createElement('div', { className: 'pricing-summary__value' }, formatPrice(basePrice, currencyCode))
17438
+ React.createElement('div', { className: 'pricing-summary__value' }, formatPrice$1(basePrice, currencyCode))
17434
17439
  )
17435
17440
  ),
17436
17441
  !isEmpty(includedCosts) &&
@@ -17453,7 +17458,7 @@ var Sidebar = function (_a) {
17453
17458
  React.createElement(
17454
17459
  'div',
17455
17460
  { className: 'pricing-summary__value' },
17456
- formatPrice(priceDetail.price * priceDetail.amount, currencyCode)
17461
+ formatPrice$1(priceDetail.price * priceDetail.amount, currencyCode)
17457
17462
  )
17458
17463
  ),
17459
17464
  React.createElement(
@@ -17488,7 +17493,7 @@ var Sidebar = function (_a) {
17488
17493
  React.createElement(
17489
17494
  'div',
17490
17495
  { className: 'pricing-summary__value' },
17491
- formatPrice(priceDetail.price * priceDetail.amount, currencyCode)
17496
+ formatPrice$1(priceDetail.price * priceDetail.amount, currencyCode)
17492
17497
  )
17493
17498
  ),
17494
17499
  React.createElement(
@@ -17530,7 +17535,7 @@ var Sidebar = function (_a) {
17530
17535
  React.createElement(
17531
17536
  'div',
17532
17537
  { className: 'pricing' },
17533
- React.createElement('div', { className: 'pricing__price' }, formatPrice(totalPrice, currencyCode))
17538
+ React.createElement('div', { className: 'pricing__price' }, formatPrice$1(totalPrice, currencyCode))
17534
17539
  )
17535
17540
  )
17536
17541
  ),
@@ -17548,7 +17553,7 @@ var Sidebar = function (_a) {
17548
17553
  React.createElement(
17549
17554
  'div',
17550
17555
  { className: 'pricing' },
17551
- React.createElement('div', { className: 'pricing__price' }, formatPrice(deposit, currencyCode))
17556
+ React.createElement('div', { className: 'pricing__price' }, formatPrice$1(deposit, currencyCode))
17552
17557
  )
17553
17558
  )
17554
17559
  ),
@@ -17564,7 +17569,7 @@ var Sidebar = function (_a) {
17564
17569
  translations.SIDEBAR.DEPOSIT_TEXT1,
17565
17570
  React.createElement('strong', null, translations.SIDEBAR.DEPOSIT_TEXT2),
17566
17571
  translations.SIDEBAR.DEPOSIT_TEXT3,
17567
- formatPrice(remainingAmount, currencyCode),
17572
+ formatPrice$1(remainingAmount, currencyCode),
17568
17573
  translations.SIDEBAR.DEPOSIT_TEXT4,
17569
17574
  React.createElement('strong', null, translations.SIDEBAR.DEPOSIT_TEXT5),
17570
17575
  translations.SIDEBAR.DEPOSIT_TEXT6
@@ -17591,7 +17596,7 @@ var Sidebar = function (_a) {
17591
17596
  React.createElement(
17592
17597
  'div',
17593
17598
  { className: 'pricing' },
17594
- React.createElement('div', { className: 'pricing__price' }, formatPrice(totalPrice, currencyCode))
17599
+ React.createElement('div', { className: 'pricing__price' }, formatPrice$1(totalPrice, currencyCode))
17595
17600
  )
17596
17601
  )
17597
17602
  )
@@ -24755,20 +24760,27 @@ var SearchInputGroup = function (_a) {
24755
24760
  dispatch(setFieldValue({ fieldKey: fieldKey, value: input }));
24756
24761
  dispatch(setSearchResults([]));
24757
24762
  if (small) return;
24758
- if (input.length === 3 && autoComplete) {
24759
- var exactIataMatch = findExactIataMatch(options, input);
24763
+ dispatch(setActiveSearchField(fieldKey));
24764
+ dispatch(setSearchResults(match(input)));
24765
+ },
24766
+ [dispatch, fieldKey, small, match, options]
24767
+ );
24768
+ var handleKeyDown = useCallback(
24769
+ function (e) {
24770
+ if (!['Tab', 'Enter'].includes(e.key)) return;
24771
+ if (value.length === 3 && autoComplete) {
24772
+ var exactIataMatch = findExactIataMatch(options, value);
24760
24773
  if (exactIataMatch) {
24774
+ if (e.key === 'Enter') {
24775
+ e.preventDefault();
24776
+ }
24761
24777
  dispatch(setFieldValue({ fieldKey: fieldKey, value: exactIataMatch.value }));
24762
24778
  dispatch(setSearchResults([]));
24763
24779
  dispatch(setActiveSearchField(null));
24764
- return;
24765
24780
  }
24766
24781
  }
24767
- // Normal typeahead behavior
24768
- dispatch(setActiveSearchField(fieldKey));
24769
- dispatch(setSearchResults(match(input)));
24770
24782
  },
24771
- [dispatch, fieldKey, small, match, options]
24783
+ [value, autoComplete, options, dispatch, fieldKey]
24772
24784
  );
24773
24785
  var handleOptionSelect = useCallback(
24774
24786
  function (option) {
@@ -24837,6 +24849,7 @@ var SearchInputGroup = function (_a) {
24837
24849
  onClick: function (e) {
24838
24850
  return e.stopPropagation();
24839
24851
  },
24852
+ onKeyDown: handleKeyDown,
24840
24853
  onChange: function (e) {
24841
24854
  return !small && !readOnlyForced && handleInputChange(e.target.value);
24842
24855
  },
@@ -25534,6 +25547,7 @@ var initialState = {
25534
25547
  isLoading: false,
25535
25548
  filters: [],
25536
25549
  sortKey: null,
25550
+ activeTab: 'compact',
25537
25551
  currentPage: 1
25538
25552
  };
25539
25553
  var searchResultsSlice = createSlice({
@@ -25565,6 +25579,9 @@ var searchResultsSlice = createSlice({
25565
25579
  setSortKey: function (state, action) {
25566
25580
  state.sortKey = action.payload;
25567
25581
  },
25582
+ setActiveTab: function (state, action) {
25583
+ state.activeTab = action.payload;
25584
+ },
25568
25585
  setCurrentPage: function (state, action) {
25569
25586
  state.currentPage = action.payload;
25570
25587
  },
@@ -25573,15 +25590,17 @@ var searchResultsSlice = createSlice({
25573
25590
  state.isLoading = false;
25574
25591
  state.filters = [];
25575
25592
  state.sortKey = null;
25593
+ state.activeTab = 'compact';
25576
25594
  state.currentPage = 1;
25577
25595
  }
25578
25596
  }
25579
25597
  });
25580
- (_a = searchResultsSlice.actions), _a.setResults;
25581
- _a.setIsLoading;
25582
- var setFilters = _a.setFilters,
25583
- resetFilters = _a.resetFilters;
25584
- _a.setSortKey;
25598
+ var setResults = ((_a = searchResultsSlice.actions), _a.setResults),
25599
+ setIsLoading = _a.setIsLoading,
25600
+ setFilters = _a.setFilters,
25601
+ resetFilters = _a.resetFilters,
25602
+ setSortKey = _a.setSortKey,
25603
+ setActiveTab = _a.setActiveTab;
25585
25604
  _a.setCurrentPage;
25586
25605
  _a.resetSearchState;
25587
25606
  var searchResultsReducer = searchResultsSlice.reducer;
@@ -25864,6 +25883,27 @@ var Icon = function (_a) {
25864
25883
  fill: 'currentColor'
25865
25884
  })
25866
25885
  );
25886
+ case 'ui-utensils':
25887
+ return React.createElement(
25888
+ 'svg',
25889
+ {
25890
+ className: ['icon', 'icon--'.concat(name), className]
25891
+ .filter(function (className) {
25892
+ return !isEmpty(className);
25893
+ })
25894
+ .join(' '),
25895
+ width: width,
25896
+ height: height,
25897
+ viewBox: '0 0 416 512'
25898
+ },
25899
+ React.createElement(HTMLComment, {
25900
+ text: '!Font Awesome Free v5.15.4 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2026 Fonticons, Inc.'
25901
+ }),
25902
+ title && React.createElement('title', null, title),
25903
+ React.createElement('path', {
25904
+ d: 'M207.9 15.2c.8 4.7 16.1 94.5 16.1 128.8 0 52.3-27.8 89.6-68.9 104.6L168 486.7c.7 13.7-10.2 25.3-24 25.3H80c-13.7 0-24.7-11.5-24-25.3l12.9-238.1C27.7 233.6 0 196.2 0 144 0 109.6 15.3 19.9 16.1 15.2 19.3-5.1 61.4-5.4 64 16.3v141.2c1.3 3.4 15.1 3.2 16 0 1.4-25.3 7.9-139.2 8-141.8 3.3-20.8 44.7-20.8 47.9 0 .2 2.7 6.6 116.5 8 141.8.9 3.2 14.8 3.4 16 0V16.3c2.6-21.6 44.8-21.4 48-1.1zm119.2 285.7l-15 185.1c-1.2 14 9.9 26 23.9 26h56c13.3 0 24-10.7 24-24V24c0-13.2-10.7-24-24-24-82.5 0-221.4 178.5-64.9 300.9z'
25905
+ })
25906
+ );
25867
25907
  case 'ui-flight':
25868
25908
  return React.createElement(
25869
25909
  'svg',
@@ -26986,7 +27026,6 @@ var ItemPicker = function (_a) {
26986
27026
  placeholder = _a.placeholder,
26987
27027
  classModifier = _a.classModifier,
26988
27028
  onPick = _a.onPick;
26989
- var dispatch = useDispatch();
26990
27029
  var _b = useState(false),
26991
27030
  isDropdownOpen = _b[0],
26992
27031
  setIsDropdownOpen = _b[1];
@@ -26997,8 +27036,8 @@ var ItemPicker = function (_a) {
26997
27036
  var dropdownMenuRef = useRef(null);
26998
27037
  var toggleButtonRef = useRef(null);
26999
27038
  var handlePick = function (picked) {
27000
- dispatch(onPick(picked));
27001
27039
  setIsDropdownOpen(false);
27040
+ onPick(picked);
27002
27041
  };
27003
27042
  useEffect(function () {
27004
27043
  var handleClickOutside = function (event) {
@@ -27025,15 +27064,16 @@ var ItemPicker = function (_a) {
27025
27064
  [isDropdownOpen]
27026
27065
  );
27027
27066
  return React.createElement(
27028
- 'label',
27067
+ 'div',
27029
27068
  { className: 'dropdown__input ' + classModifier },
27030
27069
  React.createElement('span', { className: 'dropdown__label' }, label),
27031
27070
  React.createElement(
27032
27071
  'div',
27033
- { className: 'dropdown' },
27072
+ { className: 'dropdown', ref: dropdownRef },
27034
27073
  React.createElement(
27035
27074
  'button',
27036
27075
  {
27076
+ type: 'button',
27037
27077
  className: 'dropdown-toggle '.concat(isDropdownOpen ? 'dropdown-toggle--open' : ''),
27038
27078
  onClick: function () {
27039
27079
  return setIsDropdownOpen(function (prev) {
@@ -27363,2571 +27403,324 @@ var Itinerary = function (_a) {
27363
27403
  };
27364
27404
 
27365
27405
  var TabViews = function () {
27406
+ var dispatch = useDispatch();
27407
+ var activeTab = useSelector(function (state) {
27408
+ return state.searchResults;
27409
+ }).activeTab;
27410
+ var handleSortChange = function (tab) {
27411
+ dispatch(setActiveTab(tab));
27412
+ };
27366
27413
  return React.createElement(
27367
27414
  'div',
27368
27415
  { className: 'search__results__tab-views' },
27369
27416
  React.createElement(
27370
27417
  'button',
27371
- { type: 'button', className: 'search__results__tab-view search__results__tab-view--active' },
27418
+ {
27419
+ type: 'button',
27420
+ className: 'search__results__tab-view '.concat(activeTab === 'extended' ? 'search__results__tab-view--active' : ''),
27421
+ onClick: function () {
27422
+ return handleSortChange('extended');
27423
+ }
27424
+ },
27372
27425
  React.createElement(Icon, { name: 'ui-extended', height: 16 }),
27373
27426
  'Extended'
27374
27427
  ),
27375
27428
  React.createElement(
27376
27429
  'button',
27377
- { type: 'button', className: 'search__results__tab-view' },
27430
+ {
27431
+ type: 'button',
27432
+ className: 'search__results__tab-view '.concat(activeTab === 'compact' ? 'search__results__tab-view--active' : ''),
27433
+ onClick: function () {
27434
+ return handleSortChange('compact');
27435
+ }
27436
+ },
27378
27437
  React.createElement(Icon, { name: 'ui-compact', height: 16 }),
27379
27438
  'Compact'
27380
27439
  ),
27381
27440
  React.createElement(
27382
27441
  'button',
27383
- { type: 'button', className: 'search__results__tab-view' },
27442
+ {
27443
+ type: 'button',
27444
+ className: 'search__results__tab-view '.concat(activeTab === 'comparator' ? 'search__results__tab-view--active' : ''),
27445
+ onClick: function () {
27446
+ return handleSortChange('comparator');
27447
+ }
27448
+ },
27384
27449
  React.createElement(Icon, { name: 'ui-comparator', height: 16 }),
27385
27450
  'Comparator'
27386
27451
  )
27387
27452
  );
27388
27453
  };
27389
27454
 
27390
- var FlightResults = function (_a) {
27391
- var isDeparture = _a.isDeparture;
27455
+ var HotelCard = function (_a) {
27456
+ var result = _a.result;
27457
+ return React.createElement(
27458
+ 'div',
27459
+ {
27460
+ key: result.id,
27461
+ className: 'search__result-card__wrapper',
27462
+ onMouseEnter: function (e) {
27463
+ return (e.currentTarget.style.transform = 'scale(1.02)');
27464
+ },
27465
+ onMouseLeave: function (e) {
27466
+ return (e.currentTarget.style.transform = 'scale(1)');
27467
+ }
27468
+ },
27469
+ React.createElement(
27470
+ 'div',
27471
+ { className: 'search__result-card__img-wrapper' },
27472
+ React.createElement('img', { src: result.image, alt: result.title, className: 'search__result-card__img' }),
27473
+ React.createElement(
27474
+ 'div',
27475
+ { className: 'search__result-card__price__wrapper' },
27476
+ React.createElement('span', { className: 'search__result-card__price__label' }, 'Total price'),
27477
+ React.createElement('span', { className: 'search__result-card__price' }, result.price)
27478
+ )
27479
+ ),
27480
+ React.createElement(
27481
+ 'div',
27482
+ { className: 'search__result-card__content' },
27483
+ React.createElement(
27484
+ 'div',
27485
+ { className: 'search__result-card__content__wrapper' },
27486
+ React.createElement(
27487
+ 'div',
27488
+ { className: 'search__result-card__header' },
27489
+ React.createElement(
27490
+ 'div',
27491
+ { className: 'search__result-card__header__wrapper' },
27492
+ result.stars &&
27493
+ React.createElement(
27494
+ 'div',
27495
+ { className: 'rating' },
27496
+ __spreadArray([], Array(result.stars), true).map(function (_, index) {
27497
+ return React.createElement(Icon, { name: 'ui-star', key: 'rating-star-'.concat(index + 1), width: 14, height: 14 });
27498
+ })
27499
+ ),
27500
+ React.createElement('h3', { className: 'search__result-card__title' }, result.title)
27501
+ )
27502
+ ),
27503
+ React.createElement(
27504
+ 'a',
27505
+ { className: 'search__result-card__location' },
27506
+ React.createElement(Icon, { name: 'ui-location', height: 16 }),
27507
+ result.location
27508
+ ),
27509
+ React.createElement(
27510
+ 'div',
27511
+ { className: 'search__result-card__options' },
27512
+ result.accommodation &&
27513
+ React.createElement(
27514
+ 'div',
27515
+ { className: 'search__result-card__option' },
27516
+ React.createElement(Icon, { name: 'ui-bed', height: 16 }),
27517
+ result.accommodation
27518
+ ),
27519
+ result.regime &&
27520
+ React.createElement(
27521
+ 'div',
27522
+ { className: 'search__result-card__option' },
27523
+ React.createElement(Icon, { name: 'ui-utensils', height: 16 }),
27524
+ result.regime
27525
+ )
27526
+ ),
27527
+ React.createElement('p', { className: 'search__result-card__description' }, result.description)
27528
+ ),
27529
+ React.createElement(
27530
+ 'div',
27531
+ { className: 'search__result-card__footer' },
27532
+ React.createElement(
27533
+ 'button',
27534
+ {
27535
+ type: 'button',
27536
+ className: 'cta cta--select',
27537
+ onClick: function () {
27538
+ return console.log('Clicked on customCard with id:', result.id);
27539
+ }
27540
+ },
27541
+ result.ctaText
27542
+ )
27543
+ )
27544
+ )
27545
+ );
27546
+ };
27547
+
27548
+ var renderResults = function (results, context, cmsMap, activeTab) {
27549
+ var renderedResults = results.map(function (result, index) {
27550
+ var cmsItem = cmsMap.get(result.productId);
27551
+ var mappedResult = mapSearchResult(result, cmsItem);
27552
+ if (
27553
+ (context === null || context === void 0 ? void 0 : context.showCustomCards) &&
27554
+ (context === null || context === void 0 ? void 0 : context.customCardRenderer)
27555
+ ) {
27556
+ return React.createElement(
27557
+ 'div',
27558
+ { key: ''.concat(mappedResult.id, '-').concat(index), className: 'search__result-card' },
27559
+ context.customCardRenderer(mappedResult)
27560
+ );
27561
+ }
27562
+ return React.createElement(HotelCard, { key: ''.concat(mappedResult.id, '-').concat(index), result: mappedResult });
27563
+ });
27564
+ return React.createElement(
27565
+ 'div',
27566
+ { className: 'search__results__cards '.concat(activeTab ? 'search__results__cards--'.concat(activeTab) : '') },
27567
+ renderedResults
27568
+ );
27569
+ };
27570
+ var mapSearchResult = function (searchResult, cmsItem) {
27571
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
27572
+ return {
27573
+ type: 'hotel',
27574
+ id: searchResult.code,
27575
+ title:
27576
+ ((_b = (_a = cmsItem === null || cmsItem === void 0 ? void 0 : cmsItem.content) === null || _a === void 0 ? void 0 : _a.general) === null || _b === void 0
27577
+ ? void 0
27578
+ : _b.title) || searchResult.name,
27579
+ image:
27580
+ (_e =
27581
+ (_d = (_c = cmsItem === null || cmsItem === void 0 ? void 0 : cmsItem.content) === null || _c === void 0 ? void 0 : _c.images) === null || _d === void 0
27582
+ ? void 0
27583
+ : _d.thumbnailPicture) === null || _e === void 0
27584
+ ? void 0
27585
+ : _e.url,
27586
+ description:
27587
+ ((_g = (_f = cmsItem === null || cmsItem === void 0 ? void 0 : cmsItem.content) === null || _f === void 0 ? void 0 : _f.descriptions) === null ||
27588
+ _g === void 0
27589
+ ? void 0
27590
+ : _g.introductionTitle) || '',
27591
+ location:
27592
+ searchResult.locationName && searchResult.countryName
27593
+ ? ''.concat(searchResult.locationName, ', ').concat(searchResult.countryName)
27594
+ : ((_h = cmsItem === null || cmsItem === void 0 ? void 0 : cmsItem.parentItem) === null || _h === void 0 ? void 0 : _h.name) || '',
27595
+ price: formatPrice(searchResult.price),
27596
+ ctaText: 'View details',
27597
+ days: calculateNights(searchResult.stayFromDate, searchResult.stayToDate),
27598
+ accommodation: searchResult.accommodationName,
27599
+ regime: searchResult.regimeName,
27600
+ stars:
27601
+ ((_k = (_j = cmsItem === null || cmsItem === void 0 ? void 0 : cmsItem.content) === null || _j === void 0 ? void 0 : _j.general) === null || _k === void 0
27602
+ ? void 0
27603
+ : _k.stars) || searchResult.hotelStars
27604
+ };
27605
+ };
27606
+ var formatPrice = function (price) {
27607
+ if (!price) {
27608
+ return 'Price unavailable';
27609
+ }
27610
+ return '$'.concat(Math.round(price).toLocaleString());
27611
+ };
27612
+ var calculateNights = function (fromDate, toDate) {
27613
+ var from = new Date(fromDate).getTime(); // returns a number
27614
+ var to = new Date(toDate).getTime(); // returns a number
27615
+ var diffTime = Math.abs(to - from);
27616
+ var diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
27617
+ return ''.concat(diffDays, ' nights');
27618
+ };
27619
+ var HotelAccommodationResults = function (_a) {
27620
+ var _b;
27621
+ var isLoading = _a.isLoading,
27622
+ context = _a.context;
27623
+ if (isLoading) {
27624
+ return React.createElement(
27625
+ React.Fragment,
27626
+ null,
27627
+ (_b = context === null || context === void 0 ? void 0 : context.customSpinner) !== null && _b !== void 0 ? _b : React.createElement(Spinner, null)
27628
+ );
27629
+ }
27630
+ var _c = useSelector(function (state) {
27631
+ return state.searchResults;
27632
+ }),
27633
+ results = _c.results,
27634
+ activeTab = _c.activeTab;
27635
+ if (!results.length) {
27636
+ return React.createElement('div', { className: 'no-results' }, context.noResultsLabel || 'No results found.');
27637
+ }
27638
+ var cmsMap = React.useMemo(
27639
+ function () {
27640
+ var _a;
27641
+ var map = new Map();
27642
+ (_a = context.cmsHotelData) === null || _a === void 0
27643
+ ? void 0
27644
+ : _a.forEach(function (item) {
27645
+ var _a, _b, _c;
27646
+ var id =
27647
+ (_c =
27648
+ (_b = (_a = item === null || item === void 0 ? void 0 : item.content) === null || _a === void 0 ? void 0 : _a.general) === null || _b === void 0
27649
+ ? void 0
27650
+ : _b.product) === null || _c === void 0
27651
+ ? void 0
27652
+ : _c.tideId;
27653
+ if (id) map.set(id, item);
27654
+ });
27655
+ return map;
27656
+ },
27657
+ [context.cmsHotelData]
27658
+ );
27659
+ var firstResult = results === null || results === void 0 ? void 0 : results[0];
27660
+ var firstResultDay = (firstResult === null || firstResult === void 0 ? void 0 : firstResult.fromDate) ? format$1(parseISO(firstResult.fromDate), 'd') : null;
27661
+ var firstResultMonth = (firstResult === null || firstResult === void 0 ? void 0 : firstResult.fromDate)
27662
+ ? format$1(parseISO(firstResult.fromDate), 'MMM')
27663
+ : null;
27392
27664
  return React.createElement(
27393
27665
  React.Fragment,
27394
27666
  null,
27395
27667
  React.createElement(
27396
27668
  'div',
27397
- { className: 'search__results__label' },
27669
+ { className: 'search__results__label search__results__label--secondary' },
27398
27670
  React.createElement(
27399
27671
  'div',
27400
27672
  { className: 'search__results__label__date' },
27401
- React.createElement('p', { className: 'search__results__label__date-date' }, isDeparture ? '19' : '26'),
27402
- React.createElement('p', null, 'Jan')
27673
+ React.createElement('p', { className: 'search__results__label__date-date' }, firstResultDay),
27674
+ React.createElement('p', null, firstResultMonth)
27403
27675
  ),
27404
27676
  React.createElement(
27405
27677
  'div',
27406
27678
  { className: 'search__results__label__text' },
27407
- React.createElement('h3', null, 'Select ', React.createElement('strong', null, isDeparture ? 'Departure' : 'Return'))
27679
+ React.createElement('h3', null, 'Select ', React.createElement('strong', null, 'Accommodation'))
27408
27680
  )
27409
27681
  ),
27410
- isDeparture &&
27682
+ renderResults(results, context, cmsMap, activeTab)
27683
+ );
27684
+ };
27685
+
27686
+ var RoundTripResults = function () {
27687
+ return React.createElement(
27688
+ 'div',
27689
+ { className: 'search__results__cards search__results__cards--comparator' },
27690
+ React.createElement(
27691
+ 'div',
27692
+ { className: 'search__result-card' },
27411
27693
  React.createElement(
27412
27694
  'div',
27413
- { className: 'search__results__cards search__results__cards--extended' },
27695
+ { className: 'search__result-card__allotment' },
27414
27696
  React.createElement(
27415
27697
  'div',
27416
- { className: 'flight' },
27698
+ { className: 'search__result-card__allotment__title__wrapper' },
27699
+ React.createElement(
27700
+ 'h3',
27701
+ { className: 'search__result-card__allotment__title' },
27702
+ 'Rondreis Noord-India: Rajasthan',
27703
+ React.createElement(
27704
+ 'span',
27705
+ { className: 'search__result-card__allotment__badge' },
27706
+ React.createElement(Icon, { name: 'ui-circle-check', width: 14, height: 14 }),
27707
+ 'GAR'
27708
+ )
27709
+ ),
27417
27710
  React.createElement(
27418
27711
  'div',
27419
- { className: 'flight__option' },
27712
+ { className: 'search__result-card__allotment__container' },
27420
27713
  React.createElement(
27421
27714
  'div',
27422
- { className: 'flight__content' },
27715
+ { className: 'search__result-card__allotment__header' },
27423
27716
  React.createElement(
27424
27717
  'div',
27425
- { className: 'flight__flights' },
27718
+ { className: 'search__result-card__allotment__wrapper' },
27426
27719
  React.createElement(
27427
27720
  'div',
27428
- { className: 'flight__flight' },
27429
- React.createElement(
27430
- 'div',
27431
- { className: 'flight__flight__header' },
27432
- React.createElement('div', { className: 'flight__status__container' }),
27433
- React.createElement(
27434
- 'div',
27435
- { className: 'flight__price' },
27436
- React.createElement('span', { className: 'price price--decrease' }),
27437
- React.createElement('button', { type: 'button', className: 'cta cta--selected' }, 'Selected')
27438
- )
27439
- )
27440
- ),
27441
- React.createElement(
27442
- 'div',
27443
- { className: 'flight__flight' },
27444
- React.createElement(
27445
- 'div',
27446
- { className: 'flight__flight__container' },
27447
- React.createElement(
27448
- 'div',
27449
- { className: 'flight__flight__wrapper' },
27450
- React.createElement(
27451
- 'div',
27452
- { className: 'flight__logo__wrapper' },
27453
- React.createElement('img', {
27454
- src: 'https://media.tidesoftware.be/media/shared/Airlines/XX.png?height=256',
27455
- alt: '',
27456
- className: 'flight__logo'
27457
- }),
27458
- React.createElement('span', null, 'Example Airline')
27459
- ),
27460
- React.createElement(
27461
- 'div',
27462
- { className: 'flight__info' },
27463
- React.createElement(
27464
- 'div',
27465
- { className: 'flight__info__times' },
27466
- React.createElement('strong', null, '08:30 JFK'),
27467
- React.createElement('p', null, 'Mon 12 Feb 2025')
27468
- ),
27469
- React.createElement(
27470
- 'div',
27471
- { className: 'flight__info__duration' },
27472
- React.createElement('p', null, '7h 45m'),
27473
- React.createElement(
27474
- 'div',
27475
- { className: 'flight__info__duration__stops' },
27476
- React.createElement('div', { className: 'flight__info__duration__stop' })
27477
- ),
27478
- React.createElement('span', null, '1 stop')
27479
- ),
27480
- React.createElement(
27481
- 'div',
27482
- { className: 'flight__info__times flight__info__times--arrival' },
27483
- React.createElement('strong', null, '22:15 AMS'),
27484
- React.createElement('p', null, 'Tue 13 Feb 2025'),
27485
- React.createElement('span', { className: 'flight__info__times__days' }, '+1 day')
27486
- )
27487
- )
27488
- ),
27489
- React.createElement(
27490
- 'div',
27491
- { className: 'flight__detail__btn__wrapper' },
27492
- React.createElement(
27493
- 'div',
27494
- { className: 'flight__detail__btn' },
27495
- React.createElement(Icon, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
27496
- )
27497
- )
27498
- ),
27499
- React.createElement(
27500
- 'div',
27501
- { className: 'flight__detail' },
27502
- React.createElement(
27503
- 'div',
27504
- { className: 'flight__info' },
27505
- React.createElement(
27506
- 'div',
27507
- { className: 'flight__info__times__wrapper' },
27508
- React.createElement(
27509
- 'div',
27510
- { className: 'flight__info__times' },
27511
- React.createElement('p', null, '08:30'),
27512
- React.createElement('strong', null, 'JFK'),
27513
- React.createElement('p', null, 'Mon 12 Feb 2025')
27514
- ),
27515
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
27516
- ),
27517
- React.createElement(
27518
- 'div',
27519
- { className: 'flight__info__duration' },
27520
- React.createElement('p', null, '6h 20m'),
27521
- React.createElement('div', { className: 'flight__info__duration__stops' }),
27522
- React.createElement('span', null, 'Example Airline'),
27523
- React.createElement('strong', null, 'EA123')
27524
- ),
27525
- React.createElement(
27526
- 'div',
27527
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
27528
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
27529
- React.createElement(
27530
- 'div',
27531
- { className: 'flight__info__times flight__info__times--arrival' },
27532
- React.createElement('p', null, '20:50'),
27533
- React.createElement('strong', null, 'LHR'),
27534
- React.createElement('p', null, 'Mon 12 Feb 2025')
27535
- )
27536
- )
27537
- ),
27538
- React.createElement(
27539
- 'div',
27540
- { className: 'flight__info' },
27541
- React.createElement('div', { className: 'flight__info__times' }),
27542
- React.createElement(
27543
- 'div',
27544
- { className: 'flight__info__duration flight__info__duration--waittime' },
27545
- React.createElement(
27546
- 'div',
27547
- { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
27548
- React.createElement(Icon, { name: 'ui-clock', width: 24, height: 24 })
27549
- ),
27550
- React.createElement(
27551
- 'div',
27552
- { className: 'flight__info__duration__stoptime' },
27553
- React.createElement('span', null, 'Stop time'),
27554
- React.createElement('strong', null, '1h 15m')
27555
- )
27556
- ),
27557
- React.createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
27558
- ),
27559
- React.createElement(
27560
- 'div',
27561
- { className: 'flight__info' },
27562
- React.createElement(
27563
- 'div',
27564
- { className: 'flight__info__times__wrapper' },
27565
- React.createElement(
27566
- 'div',
27567
- { className: 'flight__info__times' },
27568
- React.createElement('p', null, '22:05'),
27569
- React.createElement('strong', null, 'LHR'),
27570
- React.createElement('p', null, 'Mon 12 Feb 2025')
27571
- ),
27572
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
27573
- ),
27574
- React.createElement(
27575
- 'div',
27576
- { className: 'flight__info__duration' },
27577
- React.createElement('p', null, '1h 10m'),
27578
- React.createElement('div', { className: 'flight__info__duration__stops' }),
27579
- React.createElement('span', null, 'Example Airline'),
27580
- React.createElement('strong', null, 'EA456')
27581
- ),
27582
- React.createElement(
27583
- 'div',
27584
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
27585
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
27586
- React.createElement(
27587
- 'div',
27588
- { className: 'flight__info__times flight__info__times--arrival' },
27589
- React.createElement('p', null, '23:15'),
27590
- React.createElement('strong', null, 'AMS'),
27591
- React.createElement('p', null, 'Mon 12 Feb 2025')
27592
- )
27593
- )
27594
- )
27595
- ),
27596
- React.createElement('div', { className: 'flight__rate' })
27597
- )
27598
- )
27599
- )
27600
- )
27601
- ),
27602
- React.createElement(
27603
- 'div',
27604
- { className: 'flight' },
27605
- React.createElement(
27606
- 'div',
27607
- { className: 'flight__option' },
27608
- React.createElement(
27609
- 'div',
27610
- { className: 'flight__content' },
27611
- React.createElement(
27612
- 'div',
27613
- { className: 'flight__flights' },
27614
- React.createElement(
27615
- 'div',
27616
- { className: 'flight__flight' },
27617
- React.createElement(
27618
- 'div',
27619
- { className: 'flight__flight__header' },
27620
- React.createElement('div', { className: 'flight__status__container' }),
27621
- React.createElement(
27622
- 'div',
27623
- { className: 'flight__price' },
27624
- React.createElement('span', { className: 'price price--decrease' }, '- \u20AC 375,98'),
27625
- React.createElement('button', { type: 'button', className: 'cta cta--select' }, 'Select')
27626
- )
27627
- )
27628
- ),
27629
- React.createElement(
27630
- 'div',
27631
- { className: 'flight__flight' },
27632
- React.createElement(
27633
- 'div',
27634
- { className: 'flight__flight__container' },
27635
- React.createElement(
27636
- 'div',
27637
- { className: 'flight__flight__wrapper' },
27638
- React.createElement(
27639
- 'div',
27640
- { className: 'flight__logo__wrapper' },
27641
- React.createElement('img', {
27642
- src: 'https://media.tidesoftware.be/media/shared/Airlines/XX.png?height=256',
27643
- alt: '',
27644
- className: 'flight__logo'
27645
- }),
27646
- React.createElement('span', null, 'Example Airline')
27647
- ),
27648
- React.createElement(
27649
- 'div',
27650
- { className: 'flight__info' },
27651
- React.createElement(
27652
- 'div',
27653
- { className: 'flight__info__times' },
27654
- React.createElement('strong', null, '08:30 JFK'),
27655
- React.createElement('p', null, 'Mon 12 Feb 2025')
27656
- ),
27657
- React.createElement(
27658
- 'div',
27659
- { className: 'flight__info__duration' },
27660
- React.createElement('p', null, '7h 45m'),
27661
- React.createElement(
27662
- 'div',
27663
- { className: 'flight__info__duration__stops' },
27664
- React.createElement('div', { className: 'flight__info__duration__stop' })
27665
- ),
27666
- React.createElement('span', null, '1 stop')
27667
- ),
27668
- React.createElement(
27669
- 'div',
27670
- { className: 'flight__info__times flight__info__times--arrival' },
27671
- React.createElement('strong', null, '22:15 AMS'),
27672
- React.createElement('p', null, 'Tue 13 Feb 2025'),
27673
- React.createElement('span', { className: 'flight__info__times__days' }, '+1 day')
27674
- )
27675
- )
27676
- ),
27677
- React.createElement(
27678
- 'div',
27679
- { className: 'flight__detail__btn__wrapper' },
27680
- React.createElement(
27681
- 'div',
27682
- { className: 'flight__detail__btn' },
27683
- React.createElement(Icon, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
27684
- )
27685
- )
27686
- ),
27687
- React.createElement(
27688
- 'div',
27689
- { className: 'flight__detail' },
27690
- React.createElement(
27691
- 'div',
27692
- { className: 'flight__info' },
27693
- React.createElement(
27694
- 'div',
27695
- { className: 'flight__info__times__wrapper' },
27696
- React.createElement(
27697
- 'div',
27698
- { className: 'flight__info__times' },
27699
- React.createElement('p', null, '08:30'),
27700
- React.createElement('strong', null, 'JFK'),
27701
- React.createElement('p', null, 'Mon 12 Feb 2025')
27702
- ),
27703
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
27704
- ),
27705
- React.createElement(
27706
- 'div',
27707
- { className: 'flight__info__duration' },
27708
- React.createElement('p', null, '6h 20m'),
27709
- React.createElement('div', { className: 'flight__info__duration__stops' }),
27710
- React.createElement('span', null, 'Example Airline'),
27711
- React.createElement('strong', null, 'EA123')
27712
- ),
27713
- React.createElement(
27714
- 'div',
27715
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
27716
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
27717
- React.createElement(
27718
- 'div',
27719
- { className: 'flight__info__times flight__info__times--arrival' },
27720
- React.createElement('p', null, '20:50'),
27721
- React.createElement('strong', null, 'LHR'),
27722
- React.createElement('p', null, 'Mon 12 Feb 2025')
27723
- )
27724
- )
27725
- ),
27726
- React.createElement(
27727
- 'div',
27728
- { className: 'flight__info' },
27729
- React.createElement('div', { className: 'flight__info__times' }),
27730
- React.createElement(
27731
- 'div',
27732
- { className: 'flight__info__duration flight__info__duration--waittime' },
27733
- React.createElement(
27734
- 'div',
27735
- { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
27736
- React.createElement(Icon, { name: 'ui-clock', width: 24, height: 24 })
27737
- ),
27738
- React.createElement(
27739
- 'div',
27740
- { className: 'flight__info__duration__stoptime' },
27741
- React.createElement('span', null, 'Stop time'),
27742
- React.createElement('strong', null, '1h 15m')
27743
- )
27744
- ),
27745
- React.createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
27746
- ),
27747
- React.createElement(
27748
- 'div',
27749
- { className: 'flight__info' },
27750
- React.createElement(
27751
- 'div',
27752
- { className: 'flight__info__times__wrapper' },
27753
- React.createElement(
27754
- 'div',
27755
- { className: 'flight__info__times' },
27756
- React.createElement('p', null, '22:05'),
27757
- React.createElement('strong', null, 'LHR'),
27758
- React.createElement('p', null, 'Mon 12 Feb 2025')
27759
- ),
27760
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
27761
- ),
27762
- React.createElement(
27763
- 'div',
27764
- { className: 'flight__info__duration' },
27765
- React.createElement('p', null, '1h 10m'),
27766
- React.createElement('div', { className: 'flight__info__duration__stops' }),
27767
- React.createElement('span', null, 'Example Airline'),
27768
- React.createElement('strong', null, 'EA456')
27769
- ),
27770
- React.createElement(
27771
- 'div',
27772
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
27773
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
27774
- React.createElement(
27775
- 'div',
27776
- { className: 'flight__info__times flight__info__times--arrival' },
27777
- React.createElement('p', null, '23:15'),
27778
- React.createElement('strong', null, 'AMS'),
27779
- React.createElement('p', null, 'Mon 12 Feb 2025')
27780
- )
27781
- )
27782
- )
27783
- ),
27784
- React.createElement('div', { className: 'flight__rate' })
27785
- )
27786
- )
27787
- )
27788
- )
27789
- ),
27790
- React.createElement(
27791
- 'div',
27792
- { className: 'flight' },
27793
- React.createElement(
27794
- 'div',
27795
- { className: 'flight__option' },
27796
- React.createElement(
27797
- 'div',
27798
- { className: 'flight__content' },
27799
- React.createElement(
27800
- 'div',
27801
- { className: 'flight__flights' },
27802
- React.createElement(
27803
- 'div',
27804
- { className: 'flight__flight' },
27805
- React.createElement(
27806
- 'div',
27807
- { className: 'flight__flight__header' },
27808
- React.createElement('div', { className: 'flight__status__container' }),
27809
- React.createElement(
27810
- 'div',
27811
- { className: 'flight__price' },
27812
- React.createElement('span', { className: 'price price--decrease' }, '- \u20AC 375,98'),
27813
- React.createElement('button', { type: 'button', className: 'cta cta--select' }, 'Select')
27814
- )
27815
- )
27816
- ),
27817
- React.createElement(
27818
- 'div',
27819
- { className: 'flight__flight' },
27820
- React.createElement(
27821
- 'div',
27822
- { className: 'flight__flight__container' },
27823
- React.createElement(
27824
- 'div',
27825
- { className: 'flight__flight__wrapper' },
27826
- React.createElement(
27827
- 'div',
27828
- { className: 'flight__logo__wrapper' },
27829
- React.createElement('img', {
27830
- src: 'https://media.tidesoftware.be/media/shared/Airlines/XX.png?height=256',
27831
- alt: '',
27832
- className: 'flight__logo'
27833
- }),
27834
- React.createElement('span', null, 'Example Airline')
27835
- ),
27836
- React.createElement(
27837
- 'div',
27838
- { className: 'flight__info' },
27839
- React.createElement(
27840
- 'div',
27841
- { className: 'flight__info__times' },
27842
- React.createElement('strong', null, '08:30 JFK'),
27843
- React.createElement('p', null, 'Mon 12 Feb 2025')
27844
- ),
27845
- React.createElement(
27846
- 'div',
27847
- { className: 'flight__info__duration' },
27848
- React.createElement('p', null, '7h 45m'),
27849
- React.createElement(
27850
- 'div',
27851
- { className: 'flight__info__duration__stops' },
27852
- React.createElement('div', { className: 'flight__info__duration__stop' })
27853
- ),
27854
- React.createElement('span', null, '1 stop')
27855
- ),
27856
- React.createElement(
27857
- 'div',
27858
- { className: 'flight__info__times flight__info__times--arrival' },
27859
- React.createElement('strong', null, '22:15 AMS'),
27860
- React.createElement('p', null, 'Tue 13 Feb 2025'),
27861
- React.createElement('span', { className: 'flight__info__times__days' }, '+1 day')
27862
- )
27863
- )
27864
- ),
27865
- React.createElement(
27866
- 'div',
27867
- { className: 'flight__detail__btn__wrapper' },
27868
- React.createElement(
27869
- 'div',
27870
- { className: 'flight__detail__btn' },
27871
- React.createElement(Icon, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
27872
- )
27873
- )
27874
- ),
27875
- React.createElement(
27876
- 'div',
27877
- { className: 'flight__detail' },
27878
- React.createElement(
27879
- 'div',
27880
- { className: 'flight__info' },
27881
- React.createElement(
27882
- 'div',
27883
- { className: 'flight__info__times__wrapper' },
27884
- React.createElement(
27885
- 'div',
27886
- { className: 'flight__info__times' },
27887
- React.createElement('p', null, '08:30'),
27888
- React.createElement('strong', null, 'JFK'),
27889
- React.createElement('p', null, 'Mon 12 Feb 2025')
27890
- ),
27891
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
27892
- ),
27893
- React.createElement(
27894
- 'div',
27895
- { className: 'flight__info__duration' },
27896
- React.createElement('p', null, '6h 20m'),
27897
- React.createElement('div', { className: 'flight__info__duration__stops' }),
27898
- React.createElement('span', null, 'Example Airline'),
27899
- React.createElement('strong', null, 'EA123')
27900
- ),
27901
- React.createElement(
27902
- 'div',
27903
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
27904
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
27905
- React.createElement(
27906
- 'div',
27907
- { className: 'flight__info__times flight__info__times--arrival' },
27908
- React.createElement('p', null, '20:50'),
27909
- React.createElement('strong', null, 'LHR'),
27910
- React.createElement('p', null, 'Mon 12 Feb 2025')
27911
- )
27912
- )
27913
- ),
27914
- React.createElement(
27915
- 'div',
27916
- { className: 'flight__info' },
27917
- React.createElement('div', { className: 'flight__info__times' }),
27918
- React.createElement(
27919
- 'div',
27920
- { className: 'flight__info__duration flight__info__duration--waittime' },
27921
- React.createElement(
27922
- 'div',
27923
- { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
27924
- React.createElement(Icon, { name: 'ui-clock', width: 24, height: 24 })
27925
- ),
27926
- React.createElement(
27927
- 'div',
27928
- { className: 'flight__info__duration__stoptime' },
27929
- React.createElement('span', null, 'Stop time'),
27930
- React.createElement('strong', null, '1h 15m')
27931
- )
27932
- ),
27933
- React.createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
27934
- ),
27935
- React.createElement(
27936
- 'div',
27937
- { className: 'flight__info' },
27938
- React.createElement(
27939
- 'div',
27940
- { className: 'flight__info__times__wrapper' },
27941
- React.createElement(
27942
- 'div',
27943
- { className: 'flight__info__times' },
27944
- React.createElement('p', null, '22:05'),
27945
- React.createElement('strong', null, 'LHR'),
27946
- React.createElement('p', null, 'Mon 12 Feb 2025')
27947
- ),
27948
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
27949
- ),
27950
- React.createElement(
27951
- 'div',
27952
- { className: 'flight__info__duration' },
27953
- React.createElement('p', null, '1h 10m'),
27954
- React.createElement('div', { className: 'flight__info__duration__stops' }),
27955
- React.createElement('span', null, 'Example Airline'),
27956
- React.createElement('strong', null, 'EA456')
27957
- ),
27958
- React.createElement(
27959
- 'div',
27960
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
27961
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
27962
- React.createElement(
27963
- 'div',
27964
- { className: 'flight__info__times flight__info__times--arrival' },
27965
- React.createElement('p', null, '23:15'),
27966
- React.createElement('strong', null, 'AMS'),
27967
- React.createElement('p', null, 'Mon 12 Feb 2025')
27968
- )
27969
- )
27970
- )
27971
- ),
27972
- React.createElement('div', { className: 'flight__rate' })
27973
- )
27974
- )
27975
- )
27976
- )
27977
- ),
27978
- React.createElement(
27979
- 'div',
27980
- { className: 'flight' },
27981
- React.createElement(
27982
- 'div',
27983
- { className: 'flight__option' },
27984
- React.createElement(
27985
- 'div',
27986
- { className: 'flight__content' },
27987
- React.createElement(
27988
- 'div',
27989
- { className: 'flight__flights' },
27990
- React.createElement(
27991
- 'div',
27992
- { className: 'flight__flight' },
27993
- React.createElement(
27994
- 'div',
27995
- { className: 'flight__flight__header' },
27996
- React.createElement('div', { className: 'flight__status__container' }),
27997
- React.createElement(
27998
- 'div',
27999
- { className: 'flight__price' },
28000
- React.createElement('span', { className: 'price price--decrease' }, '- \u20AC 375,98'),
28001
- React.createElement('button', { type: 'button', className: 'cta cta--select' }, 'Select')
28002
- )
28003
- )
28004
- ),
28005
- React.createElement(
28006
- 'div',
28007
- { className: 'flight__flight' },
28008
- React.createElement(
28009
- 'div',
28010
- { className: 'flight__flight__container' },
28011
- React.createElement(
28012
- 'div',
28013
- { className: 'flight__flight__wrapper' },
28014
- React.createElement(
28015
- 'div',
28016
- { className: 'flight__logo__wrapper' },
28017
- React.createElement('img', {
28018
- src: 'https://media.tidesoftware.be/media/shared/Airlines/XX.png?height=256',
28019
- alt: '',
28020
- className: 'flight__logo'
28021
- }),
28022
- React.createElement('span', null, 'Example Airline')
28023
- ),
28024
- React.createElement(
28025
- 'div',
28026
- { className: 'flight__info' },
28027
- React.createElement(
28028
- 'div',
28029
- { className: 'flight__info__times' },
28030
- React.createElement('strong', null, '08:30 JFK'),
28031
- React.createElement('p', null, 'Mon 12 Feb 2025')
28032
- ),
28033
- React.createElement(
28034
- 'div',
28035
- { className: 'flight__info__duration' },
28036
- React.createElement('p', null, '7h 45m'),
28037
- React.createElement(
28038
- 'div',
28039
- { className: 'flight__info__duration__stops' },
28040
- React.createElement('div', { className: 'flight__info__duration__stop' })
28041
- ),
28042
- React.createElement('span', null, '1 stop')
28043
- ),
28044
- React.createElement(
28045
- 'div',
28046
- { className: 'flight__info__times flight__info__times--arrival' },
28047
- React.createElement('strong', null, '22:15 AMS'),
28048
- React.createElement('p', null, 'Tue 13 Feb 2025'),
28049
- React.createElement('span', { className: 'flight__info__times__days' }, '+1 day')
28050
- )
28051
- )
28052
- ),
28053
- React.createElement(
28054
- 'div',
28055
- { className: 'flight__detail__btn__wrapper' },
28056
- React.createElement(
28057
- 'div',
28058
- { className: 'flight__detail__btn' },
28059
- React.createElement(Icon, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
28060
- )
28061
- )
28062
- ),
28063
- React.createElement(
28064
- 'div',
28065
- { className: 'flight__detail' },
28066
- React.createElement(
28067
- 'div',
28068
- { className: 'flight__info' },
28069
- React.createElement(
28070
- 'div',
28071
- { className: 'flight__info__times__wrapper' },
28072
- React.createElement(
28073
- 'div',
28074
- { className: 'flight__info__times' },
28075
- React.createElement('p', null, '08:30'),
28076
- React.createElement('strong', null, 'JFK'),
28077
- React.createElement('p', null, 'Mon 12 Feb 2025')
28078
- ),
28079
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
28080
- ),
28081
- React.createElement(
28082
- 'div',
28083
- { className: 'flight__info__duration' },
28084
- React.createElement('p', null, '6h 20m'),
28085
- React.createElement('div', { className: 'flight__info__duration__stops' }),
28086
- React.createElement('span', null, 'Example Airline'),
28087
- React.createElement('strong', null, 'EA123')
28088
- ),
28089
- React.createElement(
28090
- 'div',
28091
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
28092
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
28093
- React.createElement(
28094
- 'div',
28095
- { className: 'flight__info__times flight__info__times--arrival' },
28096
- React.createElement('p', null, '20:50'),
28097
- React.createElement('strong', null, 'LHR'),
28098
- React.createElement('p', null, 'Mon 12 Feb 2025')
28099
- )
28100
- )
28101
- ),
28102
- React.createElement(
28103
- 'div',
28104
- { className: 'flight__info' },
28105
- React.createElement('div', { className: 'flight__info__times' }),
28106
- React.createElement(
28107
- 'div',
28108
- { className: 'flight__info__duration flight__info__duration--waittime' },
28109
- React.createElement(
28110
- 'div',
28111
- { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
28112
- React.createElement(Icon, { name: 'ui-clock', width: 24, height: 24 })
28113
- ),
28114
- React.createElement(
28115
- 'div',
28116
- { className: 'flight__info__duration__stoptime' },
28117
- React.createElement('span', null, 'Stop time'),
28118
- React.createElement('strong', null, '1h 15m')
28119
- )
28120
- ),
28121
- React.createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
28122
- ),
28123
- React.createElement(
28124
- 'div',
28125
- { className: 'flight__info' },
28126
- React.createElement(
28127
- 'div',
28128
- { className: 'flight__info__times__wrapper' },
28129
- React.createElement(
28130
- 'div',
28131
- { className: 'flight__info__times' },
28132
- React.createElement('p', null, '22:05'),
28133
- React.createElement('strong', null, 'LHR'),
28134
- React.createElement('p', null, 'Mon 12 Feb 2025')
28135
- ),
28136
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
28137
- ),
28138
- React.createElement(
28139
- 'div',
28140
- { className: 'flight__info__duration' },
28141
- React.createElement('p', null, '1h 10m'),
28142
- React.createElement('div', { className: 'flight__info__duration__stops' }),
28143
- React.createElement('span', null, 'Example Airline'),
28144
- React.createElement('strong', null, 'EA456')
28145
- ),
28146
- React.createElement(
28147
- 'div',
28148
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
28149
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
28150
- React.createElement(
28151
- 'div',
28152
- { className: 'flight__info__times flight__info__times--arrival' },
28153
- React.createElement('p', null, '23:15'),
28154
- React.createElement('strong', null, 'AMS'),
28155
- React.createElement('p', null, 'Mon 12 Feb 2025')
28156
- )
28157
- )
28158
- )
28159
- ),
28160
- React.createElement('div', { className: 'flight__rate' })
28161
- )
28162
- )
28163
- )
28164
- )
28165
- )
28166
- ),
28167
- !isDeparture &&
28168
- React.createElement(
28169
- 'div',
28170
- { className: 'search__results__cards search__results__cards--extended' },
28171
- React.createElement(
28172
- 'div',
28173
- { className: 'flight' },
28174
- React.createElement(
28175
- 'div',
28176
- { className: 'flight__option' },
28177
- React.createElement(
28178
- 'div',
28179
- { className: 'flight__content' },
28180
- React.createElement(
28181
- 'div',
28182
- { className: 'flight__flights' },
28183
- React.createElement(
28184
- 'div',
28185
- { className: 'flight__flight' },
28186
- React.createElement(
28187
- 'div',
28188
- { className: 'flight__flight__header' },
28189
- React.createElement('div', { className: 'flight__status__container' }),
28190
- React.createElement(
28191
- 'div',
28192
- { className: 'flight__price' },
28193
- React.createElement('span', { className: 'price price--decrease' }),
28194
- React.createElement('button', { type: 'button', className: 'cta cta--selected' }, 'Selected')
28195
- )
28196
- )
28197
- ),
28198
- React.createElement(
28199
- 'div',
28200
- { className: 'flight__flight' },
28201
- React.createElement(
28202
- 'div',
28203
- { className: 'flight__flight__container' },
28204
- React.createElement(
28205
- 'div',
28206
- { className: 'flight__flight__wrapper' },
28207
- React.createElement(
28208
- 'div',
28209
- { className: 'flight__logo__wrapper' },
28210
- React.createElement('img', {
28211
- src: 'https://media.tidesoftware.be/media/shared/Airlines/XX.png?height=256',
28212
- alt: '',
28213
- className: 'flight__logo'
28214
- }),
28215
- React.createElement('span', null, 'Example Airline')
28216
- ),
28217
- React.createElement(
28218
- 'div',
28219
- { className: 'flight__info' },
28220
- React.createElement(
28221
- 'div',
28222
- { className: 'flight__info__times' },
28223
- React.createElement('strong', null, '08:30 JFK'),
28224
- React.createElement('p', null, 'Mon 12 Feb 2025')
28225
- ),
28226
- React.createElement(
28227
- 'div',
28228
- { className: 'flight__info__duration' },
28229
- React.createElement('p', null, '7h 45m'),
28230
- React.createElement(
28231
- 'div',
28232
- { className: 'flight__info__duration__stops' },
28233
- React.createElement('div', { className: 'flight__info__duration__stop' })
28234
- ),
28235
- React.createElement('span', null, '1 stop')
28236
- ),
28237
- React.createElement(
28238
- 'div',
28239
- { className: 'flight__info__times flight__info__times--arrival' },
28240
- React.createElement('strong', null, '22:15 AMS'),
28241
- React.createElement('p', null, 'Tue 13 Feb 2025'),
28242
- React.createElement('span', { className: 'flight__info__times__days' }, '+1 day')
28243
- )
28244
- )
28245
- ),
28246
- React.createElement(
28247
- 'div',
28248
- { className: 'flight__detail__btn__wrapper' },
28249
- React.createElement(
28250
- 'div',
28251
- { className: 'flight__detail__btn' },
28252
- React.createElement(Icon, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
28253
- )
28254
- )
28255
- ),
28256
- React.createElement(
28257
- 'div',
28258
- { className: 'flight__detail' },
28259
- React.createElement(
28260
- 'div',
28261
- { className: 'flight__info' },
28262
- React.createElement(
28263
- 'div',
28264
- { className: 'flight__info__times__wrapper' },
28265
- React.createElement(
28266
- 'div',
28267
- { className: 'flight__info__times' },
28268
- React.createElement('p', null, '08:30'),
28269
- React.createElement('strong', null, 'JFK'),
28270
- React.createElement('p', null, 'Mon 12 Feb 2025')
28271
- ),
28272
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
28273
- ),
28274
- React.createElement(
28275
- 'div',
28276
- { className: 'flight__info__duration' },
28277
- React.createElement('p', null, '6h 20m'),
28278
- React.createElement('div', { className: 'flight__info__duration__stops' }),
28279
- React.createElement('span', null, 'Example Airline'),
28280
- React.createElement('strong', null, 'EA123')
28281
- ),
28282
- React.createElement(
28283
- 'div',
28284
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
28285
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
28286
- React.createElement(
28287
- 'div',
28288
- { className: 'flight__info__times flight__info__times--arrival' },
28289
- React.createElement('p', null, '20:50'),
28290
- React.createElement('strong', null, 'LHR'),
28291
- React.createElement('p', null, 'Mon 12 Feb 2025')
28292
- )
28293
- )
28294
- ),
28295
- React.createElement(
28296
- 'div',
28297
- { className: 'flight__info' },
28298
- React.createElement('div', { className: 'flight__info__times' }),
28299
- React.createElement(
28300
- 'div',
28301
- { className: 'flight__info__duration flight__info__duration--waittime' },
28302
- React.createElement(
28303
- 'div',
28304
- { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
28305
- React.createElement(Icon, { name: 'ui-clock', width: 24, height: 24 })
28306
- ),
28307
- React.createElement(
28308
- 'div',
28309
- { className: 'flight__info__duration__stoptime' },
28310
- React.createElement('span', null, 'Stop time'),
28311
- React.createElement('strong', null, '1h 15m')
28312
- )
28313
- ),
28314
- React.createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
28315
- ),
28316
- React.createElement(
28317
- 'div',
28318
- { className: 'flight__info' },
28319
- React.createElement(
28320
- 'div',
28321
- { className: 'flight__info__times__wrapper' },
28322
- React.createElement(
28323
- 'div',
28324
- { className: 'flight__info__times' },
28325
- React.createElement('p', null, '22:05'),
28326
- React.createElement('strong', null, 'LHR'),
28327
- React.createElement('p', null, 'Mon 12 Feb 2025')
28328
- ),
28329
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
28330
- ),
28331
- React.createElement(
28332
- 'div',
28333
- { className: 'flight__info__duration' },
28334
- React.createElement('p', null, '1h 10m'),
28335
- React.createElement('div', { className: 'flight__info__duration__stops' }),
28336
- React.createElement('span', null, 'Example Airline'),
28337
- React.createElement('strong', null, 'EA456')
28338
- ),
28339
- React.createElement(
28340
- 'div',
28341
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
28342
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
28343
- React.createElement(
28344
- 'div',
28345
- { className: 'flight__info__times flight__info__times--arrival' },
28346
- React.createElement('p', null, '23:15'),
28347
- React.createElement('strong', null, 'AMS'),
28348
- React.createElement('p', null, 'Mon 12 Feb 2025')
28349
- )
28350
- )
28351
- )
28352
- ),
28353
- React.createElement('div', { className: 'flight__rate' })
28354
- )
28355
- )
28356
- )
28357
- )
28358
- ),
28359
- React.createElement(
28360
- 'div',
28361
- { className: 'flight' },
28362
- React.createElement(
28363
- 'div',
28364
- { className: 'flight__option' },
28365
- React.createElement(
28366
- 'div',
28367
- { className: 'flight__content' },
28368
- React.createElement(
28369
- 'div',
28370
- { className: 'flight__flights' },
28371
- React.createElement(
28372
- 'div',
28373
- { className: 'flight__flight' },
28374
- React.createElement(
28375
- 'div',
28376
- { className: 'flight__flight__header' },
28377
- React.createElement('div', { className: 'flight__status__container' }),
28378
- React.createElement(
28379
- 'div',
28380
- { className: 'flight__price' },
28381
- React.createElement('span', { className: 'price price--decrease' }, '- \u20AC 375,98'),
28382
- React.createElement('button', { type: 'button', className: 'cta cta--select' }, 'Select')
28383
- )
28384
- )
28385
- ),
28386
- React.createElement(
28387
- 'div',
28388
- { className: 'flight__flight' },
28389
- React.createElement(
28390
- 'div',
28391
- { className: 'flight__flight__container' },
28392
- React.createElement(
28393
- 'div',
28394
- { className: 'flight__flight__wrapper' },
28395
- React.createElement(
28396
- 'div',
28397
- { className: 'flight__logo__wrapper' },
28398
- React.createElement('img', {
28399
- src: 'https://media.tidesoftware.be/media/shared/Airlines/XX.png?height=256',
28400
- alt: '',
28401
- className: 'flight__logo'
28402
- }),
28403
- React.createElement('span', null, 'Example Airline')
28404
- ),
28405
- React.createElement(
28406
- 'div',
28407
- { className: 'flight__info' },
28408
- React.createElement(
28409
- 'div',
28410
- { className: 'flight__info__times' },
28411
- React.createElement('strong', null, '08:30 JFK'),
28412
- React.createElement('p', null, 'Mon 12 Feb 2025')
28413
- ),
28414
- React.createElement(
28415
- 'div',
28416
- { className: 'flight__info__duration' },
28417
- React.createElement('p', null, '7h 45m'),
28418
- React.createElement(
28419
- 'div',
28420
- { className: 'flight__info__duration__stops' },
28421
- React.createElement('div', { className: 'flight__info__duration__stop' })
28422
- ),
28423
- React.createElement('span', null, '1 stop')
28424
- ),
28425
- React.createElement(
28426
- 'div',
28427
- { className: 'flight__info__times flight__info__times--arrival' },
28428
- React.createElement('strong', null, '22:15 AMS'),
28429
- React.createElement('p', null, 'Tue 13 Feb 2025'),
28430
- React.createElement('span', { className: 'flight__info__times__days' }, '+1 day')
28431
- )
28432
- )
28433
- ),
28434
- React.createElement(
28435
- 'div',
28436
- { className: 'flight__detail__btn__wrapper' },
28437
- React.createElement(
28438
- 'div',
28439
- { className: 'flight__detail__btn' },
28440
- React.createElement(Icon, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
28441
- )
28442
- )
28443
- ),
28444
- React.createElement(
28445
- 'div',
28446
- { className: 'flight__detail' },
28447
- React.createElement(
28448
- 'div',
28449
- { className: 'flight__info' },
28450
- React.createElement(
28451
- 'div',
28452
- { className: 'flight__info__times__wrapper' },
28453
- React.createElement(
28454
- 'div',
28455
- { className: 'flight__info__times' },
28456
- React.createElement('p', null, '08:30'),
28457
- React.createElement('strong', null, 'JFK'),
28458
- React.createElement('p', null, 'Mon 12 Feb 2025')
28459
- ),
28460
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
28461
- ),
28462
- React.createElement(
28463
- 'div',
28464
- { className: 'flight__info__duration' },
28465
- React.createElement('p', null, '6h 20m'),
28466
- React.createElement('div', { className: 'flight__info__duration__stops' }),
28467
- React.createElement('span', null, 'Example Airline'),
28468
- React.createElement('strong', null, 'EA123')
28469
- ),
28470
- React.createElement(
28471
- 'div',
28472
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
28473
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
28474
- React.createElement(
28475
- 'div',
28476
- { className: 'flight__info__times flight__info__times--arrival' },
28477
- React.createElement('p', null, '20:50'),
28478
- React.createElement('strong', null, 'LHR'),
28479
- React.createElement('p', null, 'Mon 12 Feb 2025')
28480
- )
28481
- )
28482
- ),
28483
- React.createElement(
28484
- 'div',
28485
- { className: 'flight__info' },
28486
- React.createElement('div', { className: 'flight__info__times' }),
28487
- React.createElement(
28488
- 'div',
28489
- { className: 'flight__info__duration flight__info__duration--waittime' },
28490
- React.createElement(
28491
- 'div',
28492
- { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
28493
- React.createElement(Icon, { name: 'ui-clock', width: 24, height: 24 })
28494
- ),
28495
- React.createElement(
28496
- 'div',
28497
- { className: 'flight__info__duration__stoptime' },
28498
- React.createElement('span', null, 'Stop time'),
28499
- React.createElement('strong', null, '1h 15m')
28500
- )
28501
- ),
28502
- React.createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
28503
- ),
28504
- React.createElement(
28505
- 'div',
28506
- { className: 'flight__info' },
28507
- React.createElement(
28508
- 'div',
28509
- { className: 'flight__info__times__wrapper' },
28510
- React.createElement(
28511
- 'div',
28512
- { className: 'flight__info__times' },
28513
- React.createElement('p', null, '22:05'),
28514
- React.createElement('strong', null, 'LHR'),
28515
- React.createElement('p', null, 'Mon 12 Feb 2025')
28516
- ),
28517
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
28518
- ),
28519
- React.createElement(
28520
- 'div',
28521
- { className: 'flight__info__duration' },
28522
- React.createElement('p', null, '1h 10m'),
28523
- React.createElement('div', { className: 'flight__info__duration__stops' }),
28524
- React.createElement('span', null, 'Example Airline'),
28525
- React.createElement('strong', null, 'EA456')
28526
- ),
28527
- React.createElement(
28528
- 'div',
28529
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
28530
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
28531
- React.createElement(
28532
- 'div',
28533
- { className: 'flight__info__times flight__info__times--arrival' },
28534
- React.createElement('p', null, '23:15'),
28535
- React.createElement('strong', null, 'AMS'),
28536
- React.createElement('p', null, 'Mon 12 Feb 2025')
28537
- )
28538
- )
28539
- )
28540
- ),
28541
- React.createElement('div', { className: 'flight__rate' })
28542
- )
28543
- )
28544
- )
28545
- )
28546
- ),
28547
- React.createElement(
28548
- 'div',
28549
- { className: 'flight' },
28550
- React.createElement(
28551
- 'div',
28552
- { className: 'flight__option' },
28553
- React.createElement(
28554
- 'div',
28555
- { className: 'flight__content' },
28556
- React.createElement(
28557
- 'div',
28558
- { className: 'flight__flights' },
28559
- React.createElement(
28560
- 'div',
28561
- { className: 'flight__flight' },
28562
- React.createElement(
28563
- 'div',
28564
- { className: 'flight__flight__header' },
28565
- React.createElement('div', { className: 'flight__status__container' }),
28566
- React.createElement(
28567
- 'div',
28568
- { className: 'flight__price' },
28569
- React.createElement('span', { className: 'price price--decrease' }, '- \u20AC 375,98'),
28570
- React.createElement('button', { type: 'button', className: 'cta cta--select' }, 'Select')
28571
- )
28572
- )
28573
- ),
28574
- React.createElement(
28575
- 'div',
28576
- { className: 'flight__flight' },
28577
- React.createElement(
28578
- 'div',
28579
- { className: 'flight__flight__container' },
28580
- React.createElement(
28581
- 'div',
28582
- { className: 'flight__flight__wrapper' },
28583
- React.createElement(
28584
- 'div',
28585
- { className: 'flight__logo__wrapper' },
28586
- React.createElement('img', {
28587
- src: 'https://media.tidesoftware.be/media/shared/Airlines/XX.png?height=256',
28588
- alt: '',
28589
- className: 'flight__logo'
28590
- }),
28591
- React.createElement('span', null, 'Example Airline')
28592
- ),
28593
- React.createElement(
28594
- 'div',
28595
- { className: 'flight__info' },
28596
- React.createElement(
28597
- 'div',
28598
- { className: 'flight__info__times' },
28599
- React.createElement('strong', null, '08:30 JFK'),
28600
- React.createElement('p', null, 'Mon 12 Feb 2025')
28601
- ),
28602
- React.createElement(
28603
- 'div',
28604
- { className: 'flight__info__duration' },
28605
- React.createElement('p', null, '7h 45m'),
28606
- React.createElement(
28607
- 'div',
28608
- { className: 'flight__info__duration__stops' },
28609
- React.createElement('div', { className: 'flight__info__duration__stop' })
28610
- ),
28611
- React.createElement('span', null, '1 stop')
28612
- ),
28613
- React.createElement(
28614
- 'div',
28615
- { className: 'flight__info__times flight__info__times--arrival' },
28616
- React.createElement('strong', null, '22:15 AMS'),
28617
- React.createElement('p', null, 'Tue 13 Feb 2025'),
28618
- React.createElement('span', { className: 'flight__info__times__days' }, '+1 day')
28619
- )
28620
- )
28621
- ),
28622
- React.createElement(
28623
- 'div',
28624
- { className: 'flight__detail__btn__wrapper' },
28625
- React.createElement(
28626
- 'div',
28627
- { className: 'flight__detail__btn' },
28628
- React.createElement(Icon, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
28629
- )
28630
- )
28631
- ),
28632
- React.createElement(
28633
- 'div',
28634
- { className: 'flight__detail' },
28635
- React.createElement(
28636
- 'div',
28637
- { className: 'flight__info' },
28638
- React.createElement(
28639
- 'div',
28640
- { className: 'flight__info__times__wrapper' },
28641
- React.createElement(
28642
- 'div',
28643
- { className: 'flight__info__times' },
28644
- React.createElement('p', null, '08:30'),
28645
- React.createElement('strong', null, 'JFK'),
28646
- React.createElement('p', null, 'Mon 12 Feb 2025')
28647
- ),
28648
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
28649
- ),
28650
- React.createElement(
28651
- 'div',
28652
- { className: 'flight__info__duration' },
28653
- React.createElement('p', null, '6h 20m'),
28654
- React.createElement('div', { className: 'flight__info__duration__stops' }),
28655
- React.createElement('span', null, 'Example Airline'),
28656
- React.createElement('strong', null, 'EA123')
28657
- ),
28658
- React.createElement(
28659
- 'div',
28660
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
28661
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
28662
- React.createElement(
28663
- 'div',
28664
- { className: 'flight__info__times flight__info__times--arrival' },
28665
- React.createElement('p', null, '20:50'),
28666
- React.createElement('strong', null, 'LHR'),
28667
- React.createElement('p', null, 'Mon 12 Feb 2025')
28668
- )
28669
- )
28670
- ),
28671
- React.createElement(
28672
- 'div',
28673
- { className: 'flight__info' },
28674
- React.createElement('div', { className: 'flight__info__times' }),
28675
- React.createElement(
28676
- 'div',
28677
- { className: 'flight__info__duration flight__info__duration--waittime' },
28678
- React.createElement(
28679
- 'div',
28680
- { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
28681
- React.createElement(Icon, { name: 'ui-clock', width: 24, height: 24 })
28682
- ),
28683
- React.createElement(
28684
- 'div',
28685
- { className: 'flight__info__duration__stoptime' },
28686
- React.createElement('span', null, 'Stop time'),
28687
- React.createElement('strong', null, '1h 15m')
28688
- )
28689
- ),
28690
- React.createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
28691
- ),
28692
- React.createElement(
28693
- 'div',
28694
- { className: 'flight__info' },
28695
- React.createElement(
28696
- 'div',
28697
- { className: 'flight__info__times__wrapper' },
28698
- React.createElement(
28699
- 'div',
28700
- { className: 'flight__info__times' },
28701
- React.createElement('p', null, '22:05'),
28702
- React.createElement('strong', null, 'LHR'),
28703
- React.createElement('p', null, 'Mon 12 Feb 2025')
28704
- ),
28705
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
28706
- ),
28707
- React.createElement(
28708
- 'div',
28709
- { className: 'flight__info__duration' },
28710
- React.createElement('p', null, '1h 10m'),
28711
- React.createElement('div', { className: 'flight__info__duration__stops' }),
28712
- React.createElement('span', null, 'Example Airline'),
28713
- React.createElement('strong', null, 'EA456')
28714
- ),
28715
- React.createElement(
28716
- 'div',
28717
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
28718
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
28719
- React.createElement(
28720
- 'div',
28721
- { className: 'flight__info__times flight__info__times--arrival' },
28722
- React.createElement('p', null, '23:15'),
28723
- React.createElement('strong', null, 'AMS'),
28724
- React.createElement('p', null, 'Mon 12 Feb 2025')
28725
- )
28726
- )
28727
- )
28728
- ),
28729
- React.createElement('div', { className: 'flight__rate' })
28730
- )
28731
- )
28732
- )
28733
- )
28734
- ),
28735
- React.createElement(
28736
- 'div',
28737
- { className: 'flight' },
28738
- React.createElement(
28739
- 'div',
28740
- { className: 'flight__option' },
28741
- React.createElement(
28742
- 'div',
28743
- { className: 'flight__content' },
28744
- React.createElement(
28745
- 'div',
28746
- { className: 'flight__flights' },
28747
- React.createElement(
28748
- 'div',
28749
- { className: 'flight__flight' },
28750
- React.createElement(
28751
- 'div',
28752
- { className: 'flight__flight__header' },
28753
- React.createElement('div', { className: 'flight__status__container' }),
28754
- React.createElement(
28755
- 'div',
28756
- { className: 'flight__price' },
28757
- React.createElement('span', { className: 'price price--decrease' }, '- \u20AC 375,98'),
28758
- React.createElement('button', { type: 'button', className: 'cta cta--select' }, 'Select')
28759
- )
28760
- )
28761
- ),
28762
- React.createElement(
28763
- 'div',
28764
- { className: 'flight__flight' },
28765
- React.createElement(
28766
- 'div',
28767
- { className: 'flight__flight__container' },
28768
- React.createElement(
28769
- 'div',
28770
- { className: 'flight__flight__wrapper' },
28771
- React.createElement(
28772
- 'div',
28773
- { className: 'flight__logo__wrapper' },
28774
- React.createElement('img', {
28775
- src: 'https://media.tidesoftware.be/media/shared/Airlines/XX.png?height=256',
28776
- alt: '',
28777
- className: 'flight__logo'
28778
- }),
28779
- React.createElement('span', null, 'Example Airline')
28780
- ),
28781
- React.createElement(
28782
- 'div',
28783
- { className: 'flight__info' },
28784
- React.createElement(
28785
- 'div',
28786
- { className: 'flight__info__times' },
28787
- React.createElement('strong', null, '08:30 JFK'),
28788
- React.createElement('p', null, 'Mon 12 Feb 2025')
28789
- ),
28790
- React.createElement(
28791
- 'div',
28792
- { className: 'flight__info__duration' },
28793
- React.createElement('p', null, '7h 45m'),
28794
- React.createElement(
28795
- 'div',
28796
- { className: 'flight__info__duration__stops' },
28797
- React.createElement('div', { className: 'flight__info__duration__stop' })
28798
- ),
28799
- React.createElement('span', null, '1 stop')
28800
- ),
28801
- React.createElement(
28802
- 'div',
28803
- { className: 'flight__info__times flight__info__times--arrival' },
28804
- React.createElement('strong', null, '22:15 AMS'),
28805
- React.createElement('p', null, 'Tue 13 Feb 2025'),
28806
- React.createElement('span', { className: 'flight__info__times__days' }, '+1 day')
28807
- )
28808
- )
28809
- ),
28810
- React.createElement(
28811
- 'div',
28812
- { className: 'flight__detail__btn__wrapper' },
28813
- React.createElement(
28814
- 'div',
28815
- { className: 'flight__detail__btn' },
28816
- React.createElement(Icon, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
28817
- )
28818
- )
28819
- ),
28820
- React.createElement(
28821
- 'div',
28822
- { className: 'flight__detail' },
28823
- React.createElement(
28824
- 'div',
28825
- { className: 'flight__info' },
28826
- React.createElement(
28827
- 'div',
28828
- { className: 'flight__info__times__wrapper' },
28829
- React.createElement(
28830
- 'div',
28831
- { className: 'flight__info__times' },
28832
- React.createElement('p', null, '08:30'),
28833
- React.createElement('strong', null, 'JFK'),
28834
- React.createElement('p', null, 'Mon 12 Feb 2025')
28835
- ),
28836
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
28837
- ),
28838
- React.createElement(
28839
- 'div',
28840
- { className: 'flight__info__duration' },
28841
- React.createElement('p', null, '6h 20m'),
28842
- React.createElement('div', { className: 'flight__info__duration__stops' }),
28843
- React.createElement('span', null, 'Example Airline'),
28844
- React.createElement('strong', null, 'EA123')
28845
- ),
28846
- React.createElement(
28847
- 'div',
28848
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
28849
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
28850
- React.createElement(
28851
- 'div',
28852
- { className: 'flight__info__times flight__info__times--arrival' },
28853
- React.createElement('p', null, '20:50'),
28854
- React.createElement('strong', null, 'LHR'),
28855
- React.createElement('p', null, 'Mon 12 Feb 2025')
28856
- )
28857
- )
28858
- ),
28859
- React.createElement(
28860
- 'div',
28861
- { className: 'flight__info' },
28862
- React.createElement('div', { className: 'flight__info__times' }),
28863
- React.createElement(
28864
- 'div',
28865
- { className: 'flight__info__duration flight__info__duration--waittime' },
28866
- React.createElement(
28867
- 'div',
28868
- { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
28869
- React.createElement(Icon, { name: 'ui-clock', width: 24, height: 24 })
28870
- ),
28871
- React.createElement(
28872
- 'div',
28873
- { className: 'flight__info__duration__stoptime' },
28874
- React.createElement('span', null, 'Stop time'),
28875
- React.createElement('strong', null, '1h 15m')
28876
- )
28877
- ),
28878
- React.createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
28879
- ),
28880
- React.createElement(
28881
- 'div',
28882
- { className: 'flight__info' },
28883
- React.createElement(
28884
- 'div',
28885
- { className: 'flight__info__times__wrapper' },
28886
- React.createElement(
28887
- 'div',
28888
- { className: 'flight__info__times' },
28889
- React.createElement('p', null, '22:05'),
28890
- React.createElement('strong', null, 'LHR'),
28891
- React.createElement('p', null, 'Mon 12 Feb 2025')
28892
- ),
28893
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
28894
- ),
28895
- React.createElement(
28896
- 'div',
28897
- { className: 'flight__info__duration' },
28898
- React.createElement('p', null, '1h 10m'),
28899
- React.createElement('div', { className: 'flight__info__duration__stops' }),
28900
- React.createElement('span', null, 'Example Airline'),
28901
- React.createElement('strong', null, 'EA456')
28902
- ),
28903
- React.createElement(
28904
- 'div',
28905
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
28906
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
28907
- React.createElement(
28908
- 'div',
28909
- { className: 'flight__info__times flight__info__times--arrival' },
28910
- React.createElement('p', null, '23:15'),
28911
- React.createElement('strong', null, 'AMS'),
28912
- React.createElement('p', null, 'Mon 12 Feb 2025')
28913
- )
28914
- )
28915
- )
28916
- ),
28917
- React.createElement('div', { className: 'flight__rate' })
28918
- )
28919
- )
28920
- )
28921
- )
28922
- )
28923
- ),
28924
- React.createElement(
28925
- 'div',
28926
- { className: 'search__results__options' },
28927
- React.createElement('p', null, 'There are more transports at your disposal'),
28928
- React.createElement('a', { href: '#' }, 'More options')
28929
- )
28930
- );
28931
- };
28932
-
28933
- var HotelCard = function (_a) {
28934
- var result = _a.result;
28935
- var context = useContext(SearchResultsConfigurationContext);
28936
- return React.createElement(
28937
- 'div',
28938
- { className: 'search__result-card' },
28939
- React.createElement(
28940
- 'div',
28941
- { className: 'search__result-card__wrapper' },
28942
- React.createElement(
28943
- 'div',
28944
- { className: 'search__result-card__image-wrapper' },
28945
- React.createElement('img', { src: result.image, alt: result.title, className: 'search__result-card__image' })
28946
- ),
28947
- React.createElement(
28948
- 'div',
28949
- { className: 'search__result-card__content' },
28950
- result.location &&
28951
- React.createElement(
28952
- 'div',
28953
- { className: 'search__result-card__location' },
28954
- React.createElement(
28955
- 'svg',
28956
- { id: 'ui-marker', viewBox: '0 0 13.33 20' },
28957
- React.createElement('path', {
28958
- d: 'M6.67,0A6.67,6.67,0,0,0,0,6.67,6.78,6.78,0,0,0,.8,9.84l5.5,10a.42.42,0,0,0,.57.16A.49.49,0,0,0,7,19.79l5.5-10A6.67,6.67,0,0,0,6.67,0Zm0,10A3.34,3.34,0,1,1,10,6.67,3.34,3.34,0,0,1,6.67,10Z',
28959
- transform: 'translate(0 0)'
28960
- })
28961
- ),
28962
- result.location
28963
- ),
28964
- React.createElement('h3', { className: 'search__result-card__title' }, result.title),
28965
- result.description && React.createElement('p', { className: 'search__result-card__description' }, result.description),
28966
- React.createElement(
28967
- 'div',
28968
- { className: 'search__result-card__footer' },
28969
- React.createElement('span', { className: 'search__result-card__price' }, result.price),
28970
- React.createElement(
28971
- 'button',
28972
- {
28973
- className: 'search__result-card__button',
28974
- onClick: function () {
28975
- var _a;
28976
- return (_a = context === null || context === void 0 ? void 0 : context.onResultClick) === null || _a === void 0
28977
- ? void 0
28978
- : _a.call(context, result.id);
28979
- }
28980
- },
28981
- result.ctaText
28982
- )
28983
- )
28984
- )
28985
- )
28986
- );
28987
- };
28988
-
28989
- var mockedHotelResults = [
28990
- {
28991
- type: 'hotel',
28992
- id: 'HTFSWILLCARL',
28993
- title: 'HTFSWILLCARL',
28994
- image: 'https://images.unsplash.com/photo-1573790387438-4da905039392?q=80&w=1925&auto=format&fit=crop',
28995
- description: '2 persoons kamer',
28996
- location: 'Tenerif, Spanje',
28997
- price: '$2244',
28998
- ctaText: 'Bekijk details',
28999
- days: '7 nights',
29000
- flightInfo: null,
29001
- accommodation: null,
29002
- regime: null,
29003
- stars: 5
29004
- },
29005
- {
29006
- type: 'hotel',
29007
- id: 'HTFSSOFTROCK',
29008
- title: 'HTFSSOFTROCK',
29009
- image: 'https://images.unsplash.com/photo-1573790387438-4da905039392?q=80&w=1925&auto=format&fit=crop',
29010
- description: '3 persoons kamer',
29011
- location: 'Tenerif, Spanje',
29012
- price: '$2244',
29013
- ctaText: 'Bekijk details',
29014
- days: '7 nights',
29015
- flightInfo: null,
29016
- accommodation: null,
29017
- regime: null,
29018
- stars: 5
29019
- },
29020
- {
29021
- type: 'hotel',
29022
- id: 'HTFSROYGAR',
29023
- title: 'HTFSROYGAR',
29024
- image: 'https://images.unsplash.com/photo-1573790387438-4da905039392?q=80&w=1925&auto=format&fit=crop',
29025
- description: '4 persoons kamer',
29026
- location: 'Tenerif, Spanje',
29027
- price: '$2496',
29028
- ctaText: 'Bekijk details',
29029
- days: '7 nights',
29030
- flightInfo: null,
29031
- accommodation: null,
29032
- regime: null,
29033
- stars: 5
29034
- },
29035
- {
29036
- type: 'hotel',
29037
- id: 'HTFSCONBEL',
29038
- title: 'HTFSCONBEL',
29039
- image: 'https://images.unsplash.com/photo-1573790387438-4da905039392?q=80&w=1925&auto=format&fit=crop',
29040
- description: '5 persoons kamer',
29041
- location: 'Tenerif, Spanje',
29042
- price: '$6784.8',
29043
- ctaText: 'Bekijk details',
29044
- days: '7 nights',
29045
- flightInfo: null,
29046
- accommodation: null,
29047
- regime: null,
29048
- stars: 5
29049
- }
29050
- ];
29051
- var HotelAccommodationResults = function (_a) {
29052
- var _b;
29053
- var isLoading = _a.isLoading,
29054
- context = _a.context;
29055
- var renderResults = function (results) {
29056
- var renderedResults = results.map(function (result, index) {
29057
- if (
29058
- (context === null || context === void 0 ? void 0 : context.showCustomCards) &&
29059
- (context === null || context === void 0 ? void 0 : context.customCardRenderer)
29060
- ) {
29061
- return React.createElement(
29062
- 'div',
29063
- { key: ''.concat(result.id, '-').concat(index), className: 'search__result-card' },
29064
- context.customCardRenderer(result)
29065
- );
29066
- }
29067
- return React.createElement(HotelCard, { key: ''.concat(result.id, '-').concat(index), result: result });
29068
- });
29069
- return React.createElement('div', { className: 'search__results__cards' }, renderedResults);
29070
- };
29071
- return React.createElement(
29072
- React.Fragment,
29073
- null,
29074
- React.createElement(
29075
- 'div',
29076
- { className: 'search__results__label search__results__label--secondary' },
29077
- React.createElement(
29078
- 'div',
29079
- { className: 'search__results__label__date' },
29080
- React.createElement('p', { className: 'search__results__label__date-date' }, '19'),
29081
- React.createElement('p', null, 'Jan')
29082
- ),
29083
- React.createElement(
29084
- 'div',
29085
- { className: 'search__results__label__text' },
29086
- React.createElement('h3', null, 'Select ', React.createElement('strong', null, 'Accomodation'))
29087
- )
29088
- ),
29089
- isLoading
29090
- ? (_b = context.customSpinner) !== null && _b !== void 0
29091
- ? _b
29092
- : React.createElement(Spinner, null)
29093
- : mockedHotelResults.length === 0
29094
- ? React.createElement('div', { className: 'no-results' }, context.noResultsLabel || 'No results found.')
29095
- : renderResults(mockedHotelResults)
29096
- );
29097
- };
29098
-
29099
- var FlightAccommodationResults = function () {
29100
- return React.createElement(
29101
- React.Fragment,
29102
- null,
29103
- React.createElement(
29104
- 'div',
29105
- { className: 'search__results__label search__results__label--secondary' },
29106
- React.createElement(
29107
- 'div',
29108
- { className: 'search__results__label__date' },
29109
- React.createElement('p', { className: 'search__results__label__date-date' }, '19'),
29110
- React.createElement('p', null, 'Jan')
29111
- ),
29112
- React.createElement(
29113
- 'div',
29114
- { className: 'search__results__label__text' },
29115
- React.createElement('h3', null, 'Select ', React.createElement('strong', null, 'Accomodation'))
29116
- )
29117
- ),
29118
- React.createElement(
29119
- 'div',
29120
- { className: 'search__results__cards search__results__cards--extended' },
29121
- React.createElement(
29122
- 'div',
29123
- { key: 1, className: 'search__result-card' },
29124
- React.createElement(
29125
- 'div',
29126
- { className: 'flight' },
29127
- React.createElement(
29128
- 'div',
29129
- { className: 'flight__option' },
29130
- React.createElement(
29131
- 'div',
29132
- { className: 'flight__content' },
29133
- React.createElement(
29134
- 'div',
29135
- { className: 'flight__flights' },
29136
- React.createElement(
29137
- 'div',
29138
- { className: 'flight__flight' },
29139
- React.createElement(
29140
- 'div',
29141
- { className: 'flight__flight__header' },
29142
- React.createElement('div', { className: 'flight__status__container' }),
29143
- React.createElement(
29144
- 'div',
29145
- { className: 'flight__price' },
29146
- React.createElement('span', { className: 'price price--increase' }, '- \u20AC 375,98'),
29147
- React.createElement('button', { type: 'button', className: 'cta cta--select' }, 'Select')
29148
- )
29149
- )
29150
- ),
29151
- React.createElement(
29152
- 'div',
29153
- { className: 'flight__flight' },
29154
- React.createElement(
29155
- 'div',
29156
- { className: 'flight__flight__container' },
29157
- React.createElement(
29158
- 'div',
29159
- { className: 'flight__flight__wrapper' },
29160
- React.createElement(
29161
- 'div',
29162
- { className: 'flight__logo__wrapper' },
29163
- React.createElement('img', {
29164
- src: 'https://media.tidesoftware.be/media/shared/Airlines/XX.png?height=256',
29165
- alt: '',
29166
- className: 'flight__logo'
29167
- }),
29168
- React.createElement('span', null, 'Example Airline')
29169
- ),
29170
- React.createElement(
29171
- 'div',
29172
- { className: 'flight__info' },
29173
- React.createElement(
29174
- 'div',
29175
- { className: 'flight__info__times' },
29176
- React.createElement('strong', null, '08:30 JFK'),
29177
- React.createElement('p', null, 'Mon 12 Feb 2025')
29178
- ),
29179
- React.createElement(
29180
- 'div',
29181
- { className: 'flight__info__duration' },
29182
- React.createElement('p', null, '7h 45m'),
29183
- React.createElement(
29184
- 'div',
29185
- { className: 'flight__info__duration__stops' },
29186
- React.createElement('div', { className: 'flight__info__duration__stop' })
29187
- ),
29188
- React.createElement('span', null, '1 stop')
29189
- ),
29190
- React.createElement(
29191
- 'div',
29192
- { className: 'flight__info__times flight__info__times--arrival' },
29193
- React.createElement('strong', null, '22:15 AMS'),
29194
- React.createElement('p', null, 'Tue 13 Feb 2025'),
29195
- React.createElement('span', { className: 'flight__info__times__days' }, '+1 day')
29196
- )
29197
- )
29198
- ),
29199
- React.createElement(
29200
- 'div',
29201
- { className: 'flight__detail__btn__wrapper' },
29202
- React.createElement(
29203
- 'div',
29204
- { className: 'flight__detail__btn' },
29205
- React.createElement(Icon, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
29206
- )
29207
- )
29208
- ),
29209
- React.createElement(
29210
- 'div',
29211
- { className: 'flight__detail' },
29212
- React.createElement(
29213
- 'div',
29214
- { className: 'flight__info' },
29215
- React.createElement(
29216
- 'div',
29217
- { className: 'flight__info__times__wrapper' },
29218
- React.createElement(
29219
- 'div',
29220
- { className: 'flight__info__times' },
29221
- React.createElement('p', null, '08:30'),
29222
- React.createElement('strong', null, 'JFK'),
29223
- React.createElement('p', null, 'Mon 12 Feb 2025')
29224
- ),
29225
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
29226
- ),
29227
- React.createElement(
29228
- 'div',
29229
- { className: 'flight__info__duration' },
29230
- React.createElement('p', null, '6h 20m'),
29231
- React.createElement('div', { className: 'flight__info__duration__stops' }),
29232
- React.createElement('span', null, 'Example Airline'),
29233
- React.createElement('strong', null, 'EA123')
29234
- ),
29235
- React.createElement(
29236
- 'div',
29237
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
29238
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
29239
- React.createElement(
29240
- 'div',
29241
- { className: 'flight__info__times flight__info__times--arrival' },
29242
- React.createElement('p', null, '20:50'),
29243
- React.createElement('strong', null, 'LHR'),
29244
- React.createElement('p', null, 'Mon 12 Feb 2025')
29245
- )
29246
- )
29247
- ),
29248
- React.createElement(
29249
- 'div',
29250
- { className: 'flight__info' },
29251
- React.createElement('div', { className: 'flight__info__times' }),
29252
- React.createElement(
29253
- 'div',
29254
- { className: 'flight__info__duration flight__info__duration--waittime' },
29255
- React.createElement(
29256
- 'div',
29257
- { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
29258
- React.createElement(Icon, { name: 'ui-clock', width: 24, height: 24 })
29259
- ),
29260
- React.createElement(
29261
- 'div',
29262
- { className: 'flight__info__duration__stoptime' },
29263
- React.createElement('span', null, 'Stop time'),
29264
- React.createElement('strong', null, '1h 15m')
29265
- )
29266
- ),
29267
- React.createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
29268
- ),
29269
- React.createElement(
29270
- 'div',
29271
- { className: 'flight__info' },
29272
- React.createElement(
29273
- 'div',
29274
- { className: 'flight__info__times__wrapper' },
29275
- React.createElement(
29276
- 'div',
29277
- { className: 'flight__info__times' },
29278
- React.createElement('p', null, '22:05'),
29279
- React.createElement('strong', null, 'LHR'),
29280
- React.createElement('p', null, 'Mon 12 Feb 2025')
29281
- ),
29282
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
29283
- ),
29284
- React.createElement(
29285
- 'div',
29286
- { className: 'flight__info__duration' },
29287
- React.createElement('p', null, '1h 10m'),
29288
- React.createElement('div', { className: 'flight__info__duration__stops' }),
29289
- React.createElement('span', null, 'Example Airline'),
29290
- React.createElement('strong', null, 'EA456')
29291
- ),
29292
- React.createElement(
29293
- 'div',
29294
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
29295
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
29296
- React.createElement(
29297
- 'div',
29298
- { className: 'flight__info__times flight__info__times--arrival' },
29299
- React.createElement('p', null, '23:15'),
29300
- React.createElement('strong', null, 'AMS'),
29301
- React.createElement('p', null, 'Mon 12 Feb 2025')
29302
- )
29303
- )
29304
- )
29305
- ),
29306
- React.createElement('div', { className: 'flight__rate' })
29307
- )
29308
- )
29309
- )
29310
- )
29311
- )
29312
- ),
29313
- React.createElement(
29314
- 'div',
29315
- { key: 2, className: 'search__result-card' },
29316
- React.createElement(
29317
- 'div',
29318
- { className: 'flight' },
29319
- React.createElement(
29320
- 'div',
29321
- { className: 'flight__option' },
29322
- React.createElement(
29323
- 'div',
29324
- { className: 'flight__content' },
29325
- React.createElement(
29326
- 'div',
29327
- { className: 'flight__flights' },
29328
- React.createElement(
29329
- 'div',
29330
- { className: 'flight__flight' },
29331
- React.createElement(
29332
- 'div',
29333
- { className: 'flight__flight__header' },
29334
- React.createElement('div', { className: 'flight__status__container' }),
29335
- React.createElement(
29336
- 'div',
29337
- { className: 'flight__price' },
29338
- React.createElement('span', { className: 'price price--increase' }, '- \u20AC 375,98'),
29339
- React.createElement('button', { type: 'button', className: 'cta cta--select' }, 'Select')
29340
- )
29341
- )
29342
- ),
29343
- React.createElement(
29344
- 'div',
29345
- { className: 'flight__flight' },
29346
- React.createElement(
29347
- 'div',
29348
- { className: 'flight__flight__container' },
29349
- React.createElement(
29350
- 'div',
29351
- { className: 'flight__flight__wrapper' },
29352
- React.createElement(
29353
- 'div',
29354
- { className: 'flight__logo__wrapper' },
29355
- React.createElement('img', {
29356
- src: 'https://media.tidesoftware.be/media/shared/Airlines/XX.png?height=256',
29357
- alt: '',
29358
- className: 'flight__logo'
29359
- }),
29360
- React.createElement('span', null, 'Example Airline')
29361
- ),
29362
- React.createElement(
29363
- 'div',
29364
- { className: 'flight__info' },
29365
- React.createElement(
29366
- 'div',
29367
- { className: 'flight__info__times' },
29368
- React.createElement('strong', null, '08:30 JFK'),
29369
- React.createElement('p', null, 'Mon 12 Feb 2025')
29370
- ),
29371
- React.createElement(
29372
- 'div',
29373
- { className: 'flight__info__duration' },
29374
- React.createElement('p', null, '7h 45m'),
29375
- React.createElement(
29376
- 'div',
29377
- { className: 'flight__info__duration__stops' },
29378
- React.createElement('div', { className: 'flight__info__duration__stop' })
29379
- ),
29380
- React.createElement('span', null, '1 stop')
29381
- ),
29382
- React.createElement(
29383
- 'div',
29384
- { className: 'flight__info__times flight__info__times--arrival' },
29385
- React.createElement('strong', null, '22:15 AMS'),
29386
- React.createElement('p', null, 'Tue 13 Feb 2025'),
29387
- React.createElement('span', { className: 'flight__info__times__days' }, '+1 day')
29388
- )
29389
- )
29390
- ),
29391
- React.createElement(
29392
- 'div',
29393
- { className: 'flight__detail__btn__wrapper' },
29394
- React.createElement(
29395
- 'div',
29396
- { className: 'flight__detail__btn' },
29397
- React.createElement(Icon, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
29398
- )
29399
- )
29400
- ),
29401
- React.createElement(
29402
- 'div',
29403
- { className: 'flight__detail' },
29404
- React.createElement(
29405
- 'div',
29406
- { className: 'flight__info' },
29407
- React.createElement(
29408
- 'div',
29409
- { className: 'flight__info__times__wrapper' },
29410
- React.createElement(
29411
- 'div',
29412
- { className: 'flight__info__times' },
29413
- React.createElement('p', null, '08:30'),
29414
- React.createElement('strong', null, 'JFK'),
29415
- React.createElement('p', null, 'Mon 12 Feb 2025')
29416
- ),
29417
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
29418
- ),
29419
- React.createElement(
29420
- 'div',
29421
- { className: 'flight__info__duration' },
29422
- React.createElement('p', null, '6h 20m'),
29423
- React.createElement('div', { className: 'flight__info__duration__stops' }),
29424
- React.createElement('span', null, 'Example Airline'),
29425
- React.createElement('strong', null, 'EA123')
29426
- ),
29427
- React.createElement(
29428
- 'div',
29429
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
29430
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
29431
- React.createElement(
29432
- 'div',
29433
- { className: 'flight__info__times flight__info__times--arrival' },
29434
- React.createElement('p', null, '20:50'),
29435
- React.createElement('strong', null, 'LHR'),
29436
- React.createElement('p', null, 'Mon 12 Feb 2025')
29437
- )
29438
- )
29439
- ),
29440
- React.createElement(
29441
- 'div',
29442
- { className: 'flight__info' },
29443
- React.createElement('div', { className: 'flight__info__times' }),
29444
- React.createElement(
29445
- 'div',
29446
- { className: 'flight__info__duration flight__info__duration--waittime' },
29447
- React.createElement(
29448
- 'div',
29449
- { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
29450
- React.createElement(Icon, { name: 'ui-clock', width: 24, height: 24 })
29451
- ),
29452
- React.createElement(
29453
- 'div',
29454
- { className: 'flight__info__duration__stoptime' },
29455
- React.createElement('span', null, 'Stop time'),
29456
- React.createElement('strong', null, '1h 15m')
29457
- )
29458
- ),
29459
- React.createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
29460
- ),
29461
- React.createElement(
29462
- 'div',
29463
- { className: 'flight__info' },
29464
- React.createElement(
29465
- 'div',
29466
- { className: 'flight__info__times__wrapper' },
29467
- React.createElement(
29468
- 'div',
29469
- { className: 'flight__info__times' },
29470
- React.createElement('p', null, '22:05'),
29471
- React.createElement('strong', null, 'LHR'),
29472
- React.createElement('p', null, 'Mon 12 Feb 2025')
29473
- ),
29474
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
29475
- ),
29476
- React.createElement(
29477
- 'div',
29478
- { className: 'flight__info__duration' },
29479
- React.createElement('p', null, '1h 10m'),
29480
- React.createElement('div', { className: 'flight__info__duration__stops' }),
29481
- React.createElement('span', null, 'Example Airline'),
29482
- React.createElement('strong', null, 'EA456')
29483
- ),
29484
- React.createElement(
29485
- 'div',
29486
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
29487
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
29488
- React.createElement(
29489
- 'div',
29490
- { className: 'flight__info__times flight__info__times--arrival' },
29491
- React.createElement('p', null, '23:15'),
29492
- React.createElement('strong', null, 'AMS'),
29493
- React.createElement('p', null, 'Mon 12 Feb 2025')
29494
- )
29495
- )
29496
- )
29497
- ),
29498
- React.createElement('div', { className: 'flight__rate' })
29499
- )
29500
- )
29501
- )
29502
- )
29503
- )
29504
- ),
29505
- React.createElement(
29506
- 'div',
29507
- { key: 3, className: 'search__result-card' },
29508
- React.createElement(
29509
- 'div',
29510
- { className: 'flight' },
29511
- React.createElement(
29512
- 'div',
29513
- { className: 'flight__option' },
29514
- React.createElement(
29515
- 'div',
29516
- { className: 'flight__content' },
29517
- React.createElement(
29518
- 'div',
29519
- { className: 'flight__flights' },
29520
- React.createElement(
29521
- 'div',
29522
- { className: 'flight__flight' },
29523
- React.createElement(
29524
- 'div',
29525
- { className: 'flight__flight__header' },
29526
- React.createElement('div', { className: 'flight__status__container' }),
29527
- React.createElement(
29528
- 'div',
29529
- { className: 'flight__price' },
29530
- React.createElement('span', { className: 'price price--increase' }, '- \u20AC 375,98'),
29531
- React.createElement('button', { type: 'button', className: 'cta cta--select' }, 'Select')
29532
- )
29533
- )
29534
- ),
29535
- React.createElement(
29536
- 'div',
29537
- { className: 'flight__flight' },
29538
- React.createElement(
29539
- 'div',
29540
- { className: 'flight__flight__container' },
29541
- React.createElement(
29542
- 'div',
29543
- { className: 'flight__flight__wrapper' },
29544
- React.createElement(
29545
- 'div',
29546
- { className: 'flight__logo__wrapper' },
29547
- React.createElement('img', {
29548
- src: 'https://media.tidesoftware.be/media/shared/Airlines/XX.png?height=256',
29549
- alt: '',
29550
- className: 'flight__logo'
29551
- }),
29552
- React.createElement('span', null, 'Example Airline')
29553
- ),
29554
- React.createElement(
29555
- 'div',
29556
- { className: 'flight__info' },
29557
- React.createElement(
29558
- 'div',
29559
- { className: 'flight__info__times' },
29560
- React.createElement('strong', null, '08:30 JFK'),
29561
- React.createElement('p', null, 'Mon 12 Feb 2025')
29562
- ),
29563
- React.createElement(
29564
- 'div',
29565
- { className: 'flight__info__duration' },
29566
- React.createElement('p', null, '7h 45m'),
29567
- React.createElement(
29568
- 'div',
29569
- { className: 'flight__info__duration__stops' },
29570
- React.createElement('div', { className: 'flight__info__duration__stop' })
29571
- ),
29572
- React.createElement('span', null, '1 stop')
29573
- ),
29574
- React.createElement(
29575
- 'div',
29576
- { className: 'flight__info__times flight__info__times--arrival' },
29577
- React.createElement('strong', null, '22:15 AMS'),
29578
- React.createElement('p', null, 'Tue 13 Feb 2025'),
29579
- React.createElement('span', { className: 'flight__info__times__days' }, '+1 day')
29580
- )
29581
- )
29582
- ),
29583
- React.createElement(
29584
- 'div',
29585
- { className: 'flight__detail__btn__wrapper' },
29586
- React.createElement(
29587
- 'div',
29588
- { className: 'flight__detail__btn' },
29589
- React.createElement(Icon, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
29590
- )
29591
- )
29592
- ),
29593
- React.createElement(
29594
- 'div',
29595
- { className: 'flight__detail' },
29596
- React.createElement(
29597
- 'div',
29598
- { className: 'flight__info' },
29599
- React.createElement(
29600
- 'div',
29601
- { className: 'flight__info__times__wrapper' },
29602
- React.createElement(
29603
- 'div',
29604
- { className: 'flight__info__times' },
29605
- React.createElement('p', null, '08:30'),
29606
- React.createElement('strong', null, 'JFK'),
29607
- React.createElement('p', null, 'Mon 12 Feb 2025')
29608
- ),
29609
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
29610
- ),
29611
- React.createElement(
29612
- 'div',
29613
- { className: 'flight__info__duration' },
29614
- React.createElement('p', null, '6h 20m'),
29615
- React.createElement('div', { className: 'flight__info__duration__stops' }),
29616
- React.createElement('span', null, 'Example Airline'),
29617
- React.createElement('strong', null, 'EA123')
29618
- ),
29619
- React.createElement(
29620
- 'div',
29621
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
29622
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
29623
- React.createElement(
29624
- 'div',
29625
- { className: 'flight__info__times flight__info__times--arrival' },
29626
- React.createElement('p', null, '20:50'),
29627
- React.createElement('strong', null, 'LHR'),
29628
- React.createElement('p', null, 'Mon 12 Feb 2025')
29629
- )
29630
- )
29631
- ),
29632
- React.createElement(
29633
- 'div',
29634
- { className: 'flight__info' },
29635
- React.createElement('div', { className: 'flight__info__times' }),
29636
- React.createElement(
29637
- 'div',
29638
- { className: 'flight__info__duration flight__info__duration--waittime' },
29639
- React.createElement(
29640
- 'div',
29641
- { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
29642
- React.createElement(Icon, { name: 'ui-clock', width: 24, height: 24 })
29643
- ),
29644
- React.createElement(
29645
- 'div',
29646
- { className: 'flight__info__duration__stoptime' },
29647
- React.createElement('span', null, 'Stop time'),
29648
- React.createElement('strong', null, '1h 15m')
29649
- )
29650
- ),
29651
- React.createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
29652
- ),
29653
- React.createElement(
29654
- 'div',
29655
- { className: 'flight__info' },
29656
- React.createElement(
29657
- 'div',
29658
- { className: 'flight__info__times__wrapper' },
29659
- React.createElement(
29660
- 'div',
29661
- { className: 'flight__info__times' },
29662
- React.createElement('p', null, '22:05'),
29663
- React.createElement('strong', null, 'LHR'),
29664
- React.createElement('p', null, 'Mon 12 Feb 2025')
29665
- ),
29666
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
29667
- ),
29668
- React.createElement(
29669
- 'div',
29670
- { className: 'flight__info__duration' },
29671
- React.createElement('p', null, '1h 10m'),
29672
- React.createElement('div', { className: 'flight__info__duration__stops' }),
29673
- React.createElement('span', null, 'Example Airline'),
29674
- React.createElement('strong', null, 'EA456')
29675
- ),
29676
- React.createElement(
29677
- 'div',
29678
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
29679
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
29680
- React.createElement(
29681
- 'div',
29682
- { className: 'flight__info__times flight__info__times--arrival' },
29683
- React.createElement('p', null, '23:15'),
29684
- React.createElement('strong', null, 'AMS'),
29685
- React.createElement('p', null, 'Mon 12 Feb 2025')
29686
- )
29687
- )
29688
- )
29689
- ),
29690
- React.createElement('div', { className: 'flight__rate' })
29691
- )
29692
- )
29693
- )
29694
- )
29695
- )
29696
- ),
29697
- React.createElement(
29698
- 'div',
29699
- { key: 4, className: 'search__result-card' },
29700
- React.createElement(
29701
- 'div',
29702
- { className: 'flight' },
29703
- React.createElement(
29704
- 'div',
29705
- { className: 'flight__option' },
29706
- React.createElement(
29707
- 'div',
29708
- { className: 'flight__content' },
29709
- React.createElement(
29710
- 'div',
29711
- { className: 'flight__flights' },
29712
- React.createElement(
29713
- 'div',
29714
- { className: 'flight__flight' },
29715
- React.createElement(
29716
- 'div',
29717
- { className: 'flight__flight__header' },
29718
- React.createElement('div', { className: 'flight__status__container' }),
29719
- React.createElement(
29720
- 'div',
29721
- { className: 'flight__price' },
29722
- React.createElement('span', { className: 'price price--increase' }, '- \u20AC 375,98'),
29723
- React.createElement('button', { type: 'button', className: 'cta cta--select' }, 'Select')
29724
- )
29725
- )
29726
- ),
29727
- React.createElement(
29728
- 'div',
29729
- { className: 'flight__flight' },
29730
- React.createElement(
29731
- 'div',
29732
- { className: 'flight__flight__container' },
29733
- React.createElement(
29734
- 'div',
29735
- { className: 'flight__flight__wrapper' },
29736
- React.createElement(
29737
- 'div',
29738
- { className: 'flight__logo__wrapper' },
29739
- React.createElement('img', {
29740
- src: 'https://media.tidesoftware.be/media/shared/Airlines/XX.png?height=256',
29741
- alt: '',
29742
- className: 'flight__logo'
29743
- }),
29744
- React.createElement('span', null, 'Example Airline')
29745
- ),
29746
- React.createElement(
29747
- 'div',
29748
- { className: 'flight__info' },
29749
- React.createElement(
29750
- 'div',
29751
- { className: 'flight__info__times' },
29752
- React.createElement('strong', null, '08:30 JFK'),
29753
- React.createElement('p', null, 'Mon 12 Feb 2025')
29754
- ),
29755
- React.createElement(
29756
- 'div',
29757
- { className: 'flight__info__duration' },
29758
- React.createElement('p', null, '7h 45m'),
29759
- React.createElement(
29760
- 'div',
29761
- { className: 'flight__info__duration__stops' },
29762
- React.createElement('div', { className: 'flight__info__duration__stop' })
29763
- ),
29764
- React.createElement('span', null, '1 stop')
29765
- ),
29766
- React.createElement(
29767
- 'div',
29768
- { className: 'flight__info__times flight__info__times--arrival' },
29769
- React.createElement('strong', null, '22:15 AMS'),
29770
- React.createElement('p', null, 'Tue 13 Feb 2025'),
29771
- React.createElement('span', { className: 'flight__info__times__days' }, '+1 day')
29772
- )
29773
- )
29774
- ),
29775
- React.createElement(
29776
- 'div',
29777
- { className: 'flight__detail__btn__wrapper' },
29778
- React.createElement(
29779
- 'div',
29780
- { className: 'flight__detail__btn' },
29781
- React.createElement(Icon, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
29782
- )
29783
- )
29784
- ),
29785
- React.createElement(
29786
- 'div',
29787
- { className: 'flight__detail' },
29788
- React.createElement(
29789
- 'div',
29790
- { className: 'flight__info' },
29791
- React.createElement(
29792
- 'div',
29793
- { className: 'flight__info__times__wrapper' },
29794
- React.createElement(
29795
- 'div',
29796
- { className: 'flight__info__times' },
29797
- React.createElement('p', null, '08:30'),
29798
- React.createElement('strong', null, 'JFK'),
29799
- React.createElement('p', null, 'Mon 12 Feb 2025')
29800
- ),
29801
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
29802
- ),
29803
- React.createElement(
29804
- 'div',
29805
- { className: 'flight__info__duration' },
29806
- React.createElement('p', null, '6h 20m'),
29807
- React.createElement('div', { className: 'flight__info__duration__stops' }),
29808
- React.createElement('span', null, 'Example Airline'),
29809
- React.createElement('strong', null, 'EA123')
29810
- ),
29811
- React.createElement(
29812
- 'div',
29813
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
29814
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
29815
- React.createElement(
29816
- 'div',
29817
- { className: 'flight__info__times flight__info__times--arrival' },
29818
- React.createElement('p', null, '20:50'),
29819
- React.createElement('strong', null, 'LHR'),
29820
- React.createElement('p', null, 'Mon 12 Feb 2025')
29821
- )
29822
- )
29823
- ),
29824
- React.createElement(
29825
- 'div',
29826
- { className: 'flight__info' },
29827
- React.createElement('div', { className: 'flight__info__times' }),
29828
- React.createElement(
29829
- 'div',
29830
- { className: 'flight__info__duration flight__info__duration--waittime' },
29831
- React.createElement(
29832
- 'div',
29833
- { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
29834
- React.createElement(Icon, { name: 'ui-clock', width: 24, height: 24 })
29835
- ),
29836
- React.createElement(
29837
- 'div',
29838
- { className: 'flight__info__duration__stoptime' },
29839
- React.createElement('span', null, 'Stop time'),
29840
- React.createElement('strong', null, '1h 15m')
29841
- )
29842
- ),
29843
- React.createElement('div', { className: 'flight__info__times flight__info__times--arrival' })
29844
- ),
29845
- React.createElement(
29846
- 'div',
29847
- { className: 'flight__info' },
29848
- React.createElement(
29849
- 'div',
29850
- { className: 'flight__info__times__wrapper' },
29851
- React.createElement(
29852
- 'div',
29853
- { className: 'flight__info__times' },
29854
- React.createElement('p', null, '22:05'),
29855
- React.createElement('strong', null, 'LHR'),
29856
- React.createElement('p', null, 'Mon 12 Feb 2025')
29857
- ),
29858
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-depart', width: 30, height: 20 }))
29859
- ),
29860
- React.createElement(
29861
- 'div',
29862
- { className: 'flight__info__duration' },
29863
- React.createElement('p', null, '1h 10m'),
29864
- React.createElement('div', { className: 'flight__info__duration__stops' }),
29865
- React.createElement('span', null, 'Example Airline'),
29866
- React.createElement('strong', null, 'EA456')
29867
- ),
29868
- React.createElement(
29869
- 'div',
29870
- { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
29871
- React.createElement('div', null, React.createElement(Icon, { name: 'ui-plane-arrive', width: 30, height: 20 })),
29872
- React.createElement(
29873
- 'div',
29874
- { className: 'flight__info__times flight__info__times--arrival' },
29875
- React.createElement('p', null, '23:15'),
29876
- React.createElement('strong', null, 'AMS'),
29877
- React.createElement('p', null, 'Mon 12 Feb 2025')
29878
- )
29879
- )
29880
- )
29881
- ),
29882
- React.createElement('div', { className: 'flight__rate' })
29883
- )
29884
- )
29885
- )
29886
- )
29887
- )
29888
- )
29889
- )
29890
- );
29891
- };
29892
-
29893
- var RoundTripResults = function () {
29894
- return React.createElement(
29895
- 'div',
29896
- { className: 'search__results__cards search__results__cards--comparator' },
29897
- React.createElement(
29898
- 'div',
29899
- { className: 'search__result-card' },
29900
- React.createElement(
29901
- 'div',
29902
- { className: 'search__result-card__allotment' },
29903
- React.createElement(
29904
- 'div',
29905
- { className: 'search__result-card__allotment__title__wrapper' },
29906
- React.createElement(
29907
- 'h3',
29908
- { className: 'search__result-card__allotment__title' },
29909
- 'Rondreis Noord-India: Rajasthan',
29910
- React.createElement(
29911
- 'span',
29912
- { className: 'search__result-card__allotment__badge' },
29913
- React.createElement(Icon, { name: 'ui-circle-check', width: 14, height: 14 }),
29914
- 'GAR'
29915
- )
29916
- ),
29917
- React.createElement(
29918
- 'div',
29919
- { className: 'search__result-card__allotment__container' },
29920
- React.createElement(
29921
- 'div',
29922
- { className: 'search__result-card__allotment__header' },
29923
- React.createElement(
29924
- 'div',
29925
- { className: 'search__result-card__allotment__wrapper' },
29926
- React.createElement(
29927
- 'div',
29928
- { className: 'search__result-card__allotment__date' },
29929
- React.createElement(Icon, { name: 'ui-plane', height: 16 }),
29930
- React.createElement('div', { className: 'search__result-card__allotment__date--from' }, '05-04-2026')
27721
+ { className: 'search__result-card__allotment__date' },
27722
+ React.createElement(Icon, { name: 'ui-plane', height: 16 }),
27723
+ React.createElement('div', { className: 'search__result-card__allotment__date--from' }, '05-04-2026')
29931
27724
  ),
29932
27725
  React.createElement(
29933
27726
  'div',
@@ -30136,37 +27929,249 @@ var RoundTripResults = function () {
30136
27929
  );
30137
27930
  };
30138
27931
 
27932
+ var enrichFiltersWithResults = function (results, filters) {
27933
+ if (!results || results.length === 0 || !filters) {
27934
+ return filters !== null && filters !== void 0 ? filters : [];
27935
+ }
27936
+ for (var _i = 0, filters_1 = filters; _i < filters_1.length; _i++) {
27937
+ var filter = filters_1[_i];
27938
+ if (filter.property === 'price' && (filter.min == null || filter.max == null)) {
27939
+ var prices = results
27940
+ .map(function (r) {
27941
+ var _a;
27942
+ return (_a = r.price) !== null && _a !== void 0 ? _a : 0;
27943
+ })
27944
+ .filter(function (p) {
27945
+ return p > 0;
27946
+ });
27947
+ if (prices.length > 0) {
27948
+ filter.min = Math.floor(Math.min.apply(Math, prices));
27949
+ filter.max = Math.ceil(Math.max.apply(Math, prices));
27950
+ }
27951
+ }
27952
+ }
27953
+ return filters;
27954
+ };
27955
+
30139
27956
  var SearchResultsContainer = function () {
30140
- var _a, _b, _c, _d;
27957
+ var _a, _b, _c;
30141
27958
  var isMobile = useMediaQuery('(max-width: 1200px)');
30142
- useDispatch();
27959
+ var dispatch = useDispatch();
30143
27960
  var context = useContext(SearchResultsConfigurationContext);
30144
- var _e = useSelector(function (state) {
27961
+ var _d = useSelector(function (state) {
30145
27962
  return state.searchResults;
30146
27963
  }),
30147
- results = _e.results,
30148
- isLoading = _e.isLoading,
30149
- filters = _e.filters,
30150
- sortKey = _e.sortKey;
30151
- var _f = useState(0),
30152
- searchTrigger = _f[0],
30153
- setSearchTrigger = _f[1];
30154
- var _g = useState(false);
27964
+ results = _d.results,
27965
+ isLoading = _d.isLoading,
27966
+ filters = _d.filters,
27967
+ sortKey = _d.sortKey;
27968
+ var _e = useState(0),
27969
+ searchTrigger = _e[0],
27970
+ setSearchTrigger = _e[1];
27971
+ var _f = useState(false),
27972
+ initialFiltersSet = _f[0],
27973
+ setInitialFiltersSet = _f[1];
27974
+ var _g = useState([]);
30155
27975
  _g[0];
30156
- _g[1];
30157
- var _h = useState([]);
30158
- _h[0];
30159
- _h[1];
27976
+ var setInitialFilters = _g[1];
30160
27977
  useEffect(
30161
27978
  function () {
30162
- // nog statisch werken voorlopig
30163
- // runSearch();
27979
+ var runSearch = function () {
27980
+ return __awaiter(void 0, void 0, void 0, function () {
27981
+ var params,
27982
+ from,
27983
+ to,
27984
+ rooms,
27985
+ country,
27986
+ region,
27987
+ oord,
27988
+ city,
27989
+ destinationId,
27990
+ destinationIsCountry,
27991
+ destinationIsRegion,
27992
+ destinationIsOord,
27993
+ destinationIsLocation,
27994
+ searchRequest,
27995
+ config,
27996
+ packageSearchResults,
27997
+ enrichedFilters,
27998
+ err_1;
27999
+ var _a, _b, _c, _d;
28000
+ return __generator(this, function (_e) {
28001
+ switch (_e.label) {
28002
+ case 0:
28003
+ dispatch(setIsLoading(true));
28004
+ _e.label = 1;
28005
+ case 1:
28006
+ _e.trys.push([1, 3, , 4]);
28007
+ if (!context) {
28008
+ return [2 /*return*/];
28009
+ }
28010
+ params = new URLSearchParams(location.search);
28011
+ from = getDateFromParams(params, 'from');
28012
+ to = getDateFromParams(params, 'to');
28013
+ rooms = getRoomsFromParams(params, 'rooms');
28014
+ country = getNumberFromParams(params, 'country');
28015
+ region = getNumberFromParams(params, 'region');
28016
+ oord = getNumberFromParams(params, 'oord');
28017
+ city = getNumberFromParams(params, 'location');
28018
+ // temp hardcoded params
28019
+ if (!from || !to) {
28020
+ from = '2026-04-07';
28021
+ to = '2026-04-13';
28022
+ }
28023
+ if (!country && !region && !oord && !city) {
28024
+ region = 1;
28025
+ }
28026
+ if (typeof window !== 'undefined') {
28027
+ window.scrollTo(0, 0);
28028
+ }
28029
+ destinationId = null;
28030
+ destinationIsCountry = false;
28031
+ destinationIsRegion = false;
28032
+ destinationIsOord = false;
28033
+ destinationIsLocation = false;
28034
+ if (country) {
28035
+ destinationId = country;
28036
+ destinationIsCountry = true;
28037
+ } else if (region) {
28038
+ destinationId = region;
28039
+ destinationIsRegion = true;
28040
+ } else if (oord) {
28041
+ destinationId = oord;
28042
+ destinationIsOord = true;
28043
+ } else if (city) {
28044
+ destinationId = city;
28045
+ destinationIsLocation = true;
28046
+ }
28047
+ searchRequest = {
28048
+ officeId: 1,
28049
+ payload: {
28050
+ catalogueIds: context.tideConnection.catalogueIds,
28051
+ serviceType:
28052
+ (context === null || context === void 0 ? void 0 : context.type) === 'hotel' ||
28053
+ (context === null || context === void 0 ? void 0 : context.type) === 'hotel-flight'
28054
+ ? 3
28055
+ : (context === null || context === void 0 ? void 0 : context.type) === 'flight'
28056
+ ? 7
28057
+ : (context === null || context === void 0 ? void 0 : context.type) === 'roundTrip'
28058
+ ? 1
28059
+ : 0,
28060
+ searchType: 0,
28061
+ destination: {
28062
+ id: Number(destinationId),
28063
+ isCountry: destinationIsCountry,
28064
+ isRegion: destinationIsRegion,
28065
+ isOord: destinationIsOord,
28066
+ isLocation: destinationIsLocation
28067
+ },
28068
+ rooms: getRequestRooms(rooms),
28069
+ fromDate: from,
28070
+ toDate: to,
28071
+ earliestFromOffset: 0,
28072
+ latestToOffset: 0,
28073
+ includeFlights: true,
28074
+ regimeCodes:
28075
+ ((_b =
28076
+ (_a = filters.find(function (f) {
28077
+ return f.property === 'regime';
28078
+ })) === null || _a === void 0
28079
+ ? void 0
28080
+ : _a.options) === null || _b === void 0
28081
+ ? void 0
28082
+ : _b
28083
+ .filter(function (o) {
28084
+ return o.isChecked;
28085
+ })
28086
+ .flatMap(function (o) {
28087
+ return o.value;
28088
+ })) || [],
28089
+ minPrice:
28090
+ (_c = filters.find(function (f) {
28091
+ return f.property === 'price';
28092
+ })) === null || _c === void 0
28093
+ ? void 0
28094
+ : _c.selectedMin,
28095
+ maxPrice:
28096
+ (_d = filters.find(function (f) {
28097
+ return f.property === 'price';
28098
+ })) === null || _d === void 0
28099
+ ? void 0
28100
+ : _d.selectedMax,
28101
+ useExactDates: true,
28102
+ onlyCachedResults: false,
28103
+ includeAllAllotments: true
28104
+ }
28105
+ };
28106
+ config = {
28107
+ host: context.tideConnection.host,
28108
+ apiKey: context.tideConnection.apiKey
28109
+ };
28110
+ return [4 /*yield*/, build.search(config, searchRequest)];
28111
+ case 2:
28112
+ packageSearchResults = _e.sent();
28113
+ console.log('Search results', packageSearchResults);
28114
+ enrichedFilters = enrichFiltersWithResults(packageSearchResults, context.filters);
28115
+ if (!initialFiltersSet) {
28116
+ dispatch(resetFilters(enrichedFilters));
28117
+ setInitialFilters(enrichedFilters);
28118
+ setInitialFiltersSet(true);
28119
+ }
28120
+ dispatch(setResults({ results: packageSearchResults }));
28121
+ dispatch(setIsLoading(false));
28122
+ return [3 /*break*/, 4];
28123
+ case 3:
28124
+ err_1 = _e.sent();
28125
+ console.error('Search failed', err_1);
28126
+ dispatch(setIsLoading(false));
28127
+ return [3 /*break*/, 4];
28128
+ case 4:
28129
+ return [2 /*return*/];
28130
+ }
28131
+ });
28132
+ });
28133
+ };
28134
+ runSearch();
30164
28135
  },
30165
- [location.search, searchTrigger, sortKey]
28136
+ [location.search, searchTrigger]
30166
28137
  );
30167
- var _j = useState(false),
30168
- isMobileFiltersOpen = _j[0],
30169
- setIsMobileFiltersOpen = _j[1];
28138
+ var getRequestRooms = function (rooms) {
28139
+ if (!rooms) {
28140
+ // Fall back to 2 adults
28141
+ var room = { index: 0, pax: [] };
28142
+ range(0, 2).forEach(function () {
28143
+ room.pax.push({
28144
+ age: 30
28145
+ });
28146
+ });
28147
+ return [room];
28148
+ }
28149
+ var requestRooms =
28150
+ rooms === null || rooms === void 0
28151
+ ? void 0
28152
+ : rooms.map(function (x, i) {
28153
+ var room = { index: i, pax: [] };
28154
+ range(0, x.adults).forEach(function () {
28155
+ room.pax.push({
28156
+ age: 30
28157
+ });
28158
+ });
28159
+ x.childAges.forEach(function (x) {
28160
+ room.pax.push({
28161
+ age: x
28162
+ });
28163
+ });
28164
+ return room;
28165
+ });
28166
+ return requestRooms;
28167
+ };
28168
+ var _h = useState(false),
28169
+ isMobileFiltersOpen = _h[0],
28170
+ setIsMobileFiltersOpen = _h[1];
28171
+ var handleSortChange = function (newSortKey) {
28172
+ console.log('Sort changed to:', newSortKey);
28173
+ dispatch(setSortKey(newSortKey));
28174
+ };
30170
28175
  var handleSetIsMobileFiltersOpen = function () {
30171
28176
  setIsMobileFiltersOpen(!isMobileFiltersOpen);
30172
28177
  };
@@ -30178,30 +28183,27 @@ var SearchResultsContainer = function () {
30178
28183
  },
30179
28184
  [isMobileFiltersOpen]
30180
28185
  );
30181
- var getFilteredResults = function () {
30182
- var filteredResults = results.filter(function (result) {
30183
- // Apply frontend filters here
30184
- var _a;
30185
- var ratingFilter = filters.find(function (f) {
30186
- return f.property === 'rating' && f.selectedRating != null;
30187
- });
30188
- if (ratingFilter) {
30189
- var minRating = ratingFilter.selectedRating;
30190
- var hotelStars = (_a = result.stars) !== null && _a !== void 0 ? _a : 0;
30191
- if (hotelStars < minRating) {
30192
- return false;
30193
- }
30194
- }
30195
- // Add more frontend filters if needed
30196
- return true;
30197
- });
30198
- return filteredResults;
30199
- };
30200
- var Sorts = [{ label: 'Price: low to high' }, { label: 'Price: high to low' }, { label: 'Top rated' }];
30201
- var _k = useState(undefined),
30202
- selectedTravelClass = _k[0],
30203
- setSelectedTravelClass = _k[1];
30204
- console.log('SearchResultsContainer render', context);
28186
+ // const getFilteredResults = () => {
28187
+ // const filteredResults = results.filter((result) => {
28188
+ // // Apply frontend filters here
28189
+ // const ratingFilter = filters.find((f) => f.property === 'rating' && f.selectedRating != null);
28190
+ // if (ratingFilter) {
28191
+ // const minRating = ratingFilter.selectedRating!;
28192
+ // const hotelStars = result.stars ?? 0;
28193
+ // if (hotelStars < minRating) {
28194
+ // return false;
28195
+ // }
28196
+ // }
28197
+ // // Add more frontend filters if needed
28198
+ // return true;
28199
+ // });
28200
+ // return filteredResults;
28201
+ // };
28202
+ var sortingOptions = [
28203
+ { key: 'price-asc', label: 'Price: Low to High' },
28204
+ { key: 'price-desc', label: 'Price: High to Low' },
28205
+ { key: 'departure-date', label: 'Departure Date' }
28206
+ ];
30205
28207
  return React.createElement(
30206
28208
  'div',
30207
28209
  { id: 'tide-booking', className: 'search__bg' },
@@ -30248,22 +28250,15 @@ var SearchResultsContainer = function () {
30248
28250
  React.createElement(Icon, { name: 'ui-filter', className: 'mobile-filters-button__icon', height: 16 }),
30249
28251
  (_a = context.translations) === null || _a === void 0 ? void 0 : _a.filters
30250
28252
  ),
30251
- context.sortingOptions &&
30252
- context.sortingOptions.length > 0 &&
30253
- // <select className="search__result-row-button" value={sortKey ?? ''} onChange={(e) => handleSortChange(e.target.value)}>
30254
- // {context.sortingOptions.map((opt) => (
30255
- // <option key={opt.key} value={opt.key}>
30256
- // {opt.label}
30257
- // </option>
30258
- // ))}
30259
- // </select>
28253
+ sortingOptions &&
28254
+ sortingOptions.length > 0 &&
30260
28255
  React.createElement(ItemPicker, {
30261
- items: Sorts,
30262
- selection: selectedTravelClass,
30263
- label: 'Sorteren op',
30264
- placeholder: 'Sorteer',
28256
+ items: sortingOptions,
28257
+ selection: sortKey || undefined,
28258
+ label: 'Sort by',
28259
+ placeholder: 'Sort by',
30265
28260
  classModifier: 'travel-class-picker__items',
30266
- onPick: setSelectedTravelClass
28261
+ onPick: handleSortChange
30267
28262
  })
30268
28263
  ),
30269
28264
  React.createElement(
@@ -30276,24 +28271,24 @@ var SearchResultsContainer = function () {
30276
28271
  React.createElement(
30277
28272
  React.Fragment,
30278
28273
  null,
30279
- (_c = (_b = getFilteredResults()) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 4,
28274
+ (_b = results === null || results === void 0 ? void 0 : results.length) !== null && _b !== void 0 ? _b : 4,
30280
28275
  ' ',
30281
- (_d = context.translations) === null || _d === void 0 ? void 0 : _d.totalResultsLabel
28276
+ (_c = context.translations) === null || _c === void 0 ? void 0 : _c.totalResultsLabel
30282
28277
  )
30283
28278
  ),
30284
28279
  !isMobile &&
30285
- context.sortingOptions &&
30286
- context.sortingOptions.length > 0 &&
28280
+ sortingOptions &&
28281
+ sortingOptions.length > 0 &&
30287
28282
  React.createElement(
30288
28283
  'div',
30289
28284
  { className: 'search__result-row-filter' },
30290
28285
  React.createElement(ItemPicker, {
30291
- items: Sorts,
30292
- selection: selectedTravelClass,
30293
- label: 'Sorteren op',
30294
- placeholder: 'Sorteer',
28286
+ items: sortingOptions,
28287
+ selection: sortKey || undefined,
28288
+ label: 'Sort by',
28289
+ placeholder: 'Sort by',
30295
28290
  classModifier: 'travel-class-picker__items',
30296
- onPick: setSelectedTravelClass
28291
+ onPick: handleSortChange
30297
28292
  })
30298
28293
  )
30299
28294
  ),
@@ -30302,10 +28297,7 @@ var SearchResultsContainer = function () {
30302
28297
  { className: 'search__results__wrapper' },
30303
28298
  context.showTabViews && React.createElement(TabViews, null),
30304
28299
  context.showRoundTripResults && React.createElement(RoundTripResults, null),
30305
- context.showFlightResults && React.createElement(FlightResults, { isDeparture: true }),
30306
- context.showHotelAccommodationResults && React.createElement(HotelAccommodationResults, { isLoading: isLoading, context: context }),
30307
- context.showFlightAccommodationResults && React.createElement(FlightAccommodationResults, null),
30308
- context.showFlightResults && React.createElement(FlightResults, { isDeparture: false })
28300
+ context.showHotelAccommodationResults && React.createElement(HotelAccommodationResults, { isLoading: isLoading, context: context })
30309
28301
  )
30310
28302
  )
30311
28303
  )