@qite/tide-booking-component 1.4.100 → 1.4.102

package/build/build-esm/index.js

@@ -13449,11 +13449,12 @@ PERFORMANCE OF THIS SOFTWARE.
   var ENDPOINT = '/api/web/packaging';
   var ENDPOINT_START_TRANSACTION = ENDPOINT + '/start';
   var ENDPOINT_ACCOMMODATIONS = ENDPOINT + '/accommodations';
+  var ENDPOINT_FLIGHTS = ENDPOINT + '/flights';
   var ENDPOINT_PRICE_DETAILS = ENDPOINT + '/price-details';
+  var ENDPOINT_ITINERARY = ENDPOINT + '/itinerary';
   var ENDPOINT_ENTRY = function (magicLinkCode) {
     return ENDPOINT + '/entry/' + magicLinkCode;
   };
-  // MANUAL PACKAGING SEARCH
   var startTransaction = function (config, signal) {
     var apiKey = config.apiKey;
     var url = '' + config.host + ENDPOINT_START_TRANSACTION;
@@ -13465,6 +13466,12 @@ PERFORMANCE OF THIS SOFTWARE.
     var body = JSON.stringify(request);
     return post(url, apiKey, body, config.token, signal, true);
   };
+  var searchPackagingFlights = function (config, request, signal) {
+    var url = '' + config.host + ENDPOINT_FLIGHTS;
+    var apiKey = config.apiKey;
+    var body = JSON.stringify(request);
+    return post(url, apiKey, body, config.token, signal, true);
+  };
   var getEntry = function (config, magicLinkCode, signal) {
     var apiKey = config.apiKey;
     var url = '' + config.host + ENDPOINT_ENTRY(magicLinkCode);
@@ -13476,6 +13483,12 @@ PERFORMANCE OF THIS SOFTWARE.
     var body = JSON.stringify(request);
     return post(url, apiKey, body, config.token, signal, true);
   };
+  var getItinerary = function (config, request, signal) {
+    var url = '' + config.host + ENDPOINT_ITINERARY;
+    var apiKey = config.apiKey;
+    var body = JSON.stringify(request);
+    return post(url, apiKey, body, config.token, signal, true);
+  };
 
   exports.AllotmentType = AllotmentType;
   exports.ContactForm = ContactForm;
@@ -13528,6 +13541,7 @@ PERFORMANCE OF THIS SOFTWARE.
   exports.getEntryStatus = getEntryStatus;
   exports.getEntryTotals = getEntryTotals;
   exports.getInvoiceList = getInvoiceList;
+  exports.getItinerary = getItinerary;
   exports.getLocations = getLocations;
   exports.getMolliePayment = getMolliePayment;
   exports.getPortal = getPortal;
@@ -13549,6 +13563,7 @@ PERFORMANCE OF THIS SOFTWARE.
   exports.searchLocations = searchLocations;
   exports.searchOords = searchOords;
   exports.searchPackagingAccommodations = searchPackagingAccommodations;
+  exports.searchPackagingFlights = searchPackagingFlights;
   exports.searchRegions = searchRegions;
   exports.searchWithErrorMapping = searchWithErrorMapping;
   exports.setCustomEntryStatus = setCustomEntryStatus;
@@ -20487,7 +20502,7 @@ var getFlightDetails = function (flight) {
     arrivalDate: lastLine.arrivalDate,
     arrivalTime: lastLine.arrivalTime,
     arrivalAirport: lastLine.arrivalAirportDescription,
-    travelDuration: formatDuration$1(flight.flightMetaData.durationInTicks),
+    travelDuration: formatDuration(flight.flightMetaData.durationInTicks),
     travelDurationMinutes: minutesFromTicks(flight.flightMetaData.durationInTicks),
     changeDurationMinutes: getTotalChangeDuration(flight),
     numberOfStops: flight.flightMetaData.flightLines.length - 1,
@@ -20503,7 +20518,7 @@ var getFlightDetails = function (flight) {
         arrivalTime: x.arrivalTime,
         arrivalAirport: x.arrivalAirportDescription,
         number: ''.concat(x.airlineCode, ' ').concat(x.number),
-        travelDuration: formatDuration$1(x.durationInTicks),
+        travelDuration: formatDuration(x.durationInTicks),
         waitDuration: waitDurations.length - 1 <= i ? waitDurations[i] : undefined
       };
     })
@@ -20579,7 +20594,7 @@ var minutesFromTicks = function (ticks) {
   var totalSeconds = ticks / 10000000;
   return Math.floor(totalSeconds / 60);
 };
-var formatDuration$1 = function (ticks) {
+var formatDuration = function (ticks) {
   if (!ticks) return '';
   var totalSeconds = ticks / 10000000;
   var hh = Math.floor(totalSeconds / 3600);
@@ -33668,10 +33683,13 @@ var initialState$1 = {
   filteredPackagingAccoResults: [],
   packagingAccoSearchDetails: [],
   selectedPackagingAccoResultCode: null,
+  packagingFlightResults: [],
+  selectedPackagingFlight: null,
   selectedFlight: null,
   selectedFlightDetails: null,
   bookingPackageDetails: null,
   isLoading: false,
+  flightsLoading: false,
   filters: [],
   selectedSortType: null,
   activeTab: 'compact',
@@ -33680,7 +33698,8 @@ var initialState$1 = {
   editablePackagingEntry: null,
   transactionId: null,
   accommodationFlyInStep: 'details',
-  priceDetails: null
+  priceDetails: null,
+  itinerary: null
 };
 var searchResultsSlice = createSlice({
   name: 'searchResults',
@@ -33707,6 +33726,12 @@ var searchResultsSlice = createSlice({
     setSelectedPackagingAccoResult: function (state, action) {
       state.selectedPackagingAccoResultCode = action.payload;
     },
+    setPackagingFlightResults: function (state, action) {
+      state.packagingFlightResults = action.payload;
+    },
+    setSelectedPackagingFlight: function (state, action) {
+      state.selectedPackagingFlight = action.payload;
+    },
     setSelectedFlight: function (state, action) {
       state.selectedFlight = action.payload;
     },
@@ -33729,6 +33754,9 @@ var searchResultsSlice = createSlice({
     setIsLoading: function (state, action) {
       state.isLoading = action.payload;
     },
+    setFlightsLoading: function (state, action) {
+      state.flightsLoading = action.payload;
+    },
     setFilters: function (state, action) {
       var updatedFilters = action.payload;
       updatedFilters.forEach(function (updatedFilter) {
@@ -33776,6 +33804,9 @@ var searchResultsSlice = createSlice({
     },
     setPriceDetails: function (state, action) {
       state.priceDetails = action.payload;
+    },
+    setItinerary: function (state, action) {
+      state.itinerary = action.payload;
     }
   }
 });
@@ -33786,11 +33817,14 @@ var setResults = ((_a = searchResultsSlice.actions), _a.setResults),
   setFilteredPackagingAccoResults = _a.setFilteredPackagingAccoResults,
   setPackagingAccoSearchDetails = _a.setPackagingAccoSearchDetails,
   setSelectedPackagingAccoResult = _a.setSelectedPackagingAccoResult,
+  setPackagingFlightResults = _a.setPackagingFlightResults,
+  setSelectedPackagingFlight = _a.setSelectedPackagingFlight,
   setSelectedFlight = _a.setSelectedFlight,
   setSelectedFlightDetails = _a.setSelectedFlightDetails,
-  setBookingPackageDetails = _a.setBookingPackageDetails,
-  selectFlight = _a.selectFlight,
-  setIsLoading = _a.setIsLoading,
+  setBookingPackageDetails = _a.setBookingPackageDetails;
+_a.selectFlight;
+var setIsLoading = _a.setIsLoading,
+  setFlightsLoading = _a.setFlightsLoading,
   setFilters = _a.setFilters,
   resetFilters = _a.resetFilters,
   setSortType = _a.setSortType,
@@ -33801,7 +33835,8 @@ var setFlyInIsOpen = _a.setFlyInIsOpen,
   setEditablePackagingEntry = _a.setEditablePackagingEntry,
   setTransactionId = _a.setTransactionId,
   setAccommodationFlyInStep = _a.setAccommodationFlyInStep,
-  setPriceDetails = _a.setPriceDetails;
+  setPriceDetails = _a.setPriceDetails,
+  setItinerary = _a.setItinerary;
 var searchResultsReducer = searchResultsSlice.reducer;
 
 var ItemPicker = function (_a) {
@@ -35159,8 +35194,6 @@ var Itinerary = function (_a) {
       segments: segments
     };
   });
-  console.log('otherSegments', otherSegments);
-  console.log('groupedOtherSegments', groupedOtherSegments);
   var numberOfPax = ((_p = packagingEntry.pax) === null || _p === void 0 ? void 0 : _p.length) || 1;
   var totalPrice = (priceDetails === null || priceDetails === void 0 ? void 0 : priceDetails.total) || packagingEntry.price || 0;
   var pricePerPerson = totalPrice / numberOfPax;
@@ -36738,6 +36771,14 @@ var Icon = function (_a) {
   }
 };
 
+var getFlightKey = function (segments) {
+  if (!segments || segments.length === 0) return '';
+  return segments
+    .map(function (s) {
+      return ''.concat(s.marketingAirlineCode).concat(s.flightNumber, '_').concat(s.departureDateTime);
+    })
+    .join('_');
+};
 // export const getAirportName = (airport: TideAirport | undefined, language: string): string => {
 //   if (!airport || !airport.name) {
 //     return "";
@@ -38276,13 +38317,11 @@ var FlightsFlyIn = function (_a) {
 };
 
 var formatPrice$1 = function (price, currencyCode) {
-  if (currencyCode === void 0) {
-    currencyCode = 'EUR';
-  }
   if (typeof price !== 'number') return '';
+  var safeCurrency = currencyCode !== null && currencyCode !== void 0 ? currencyCode : 'EUR';
   return new Intl.NumberFormat('nl-BE', {
     style: 'currency',
-    currency: currencyCode
+    currency: safeCurrency
   }).format(price);
 };
 var AccommodationFlyIn = function (_a) {
@@ -43933,259 +43972,6 @@ var RoundTripResults = function () {
   );
 };
 
-var ticksToMinutes = function (ticks) {
-  return Math.floor(ticks / 600000000);
-};
-var formatDuration = function (ticks) {
-  var minutes = ticksToMinutes(ticks);
-  var h = Math.floor(minutes / 60);
-  var m = minutes % 60;
-  return ''.concat(h, 'h ').concat(m, 'm');
-};
-var FlightResults = function (_a) {
-  var _b;
-  var flights = _a.flights,
-    isDeparture = _a.isDeparture;
-  var context = useContext(SearchResultsConfigurationContext);
-  var translations = getTranslations((_b = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _b !== void 0 ? _b : 'en-GB');
-  var dispatch = useDispatch();
-  var _c = useState(null),
-    activeDetailId = _c[0],
-    setActiveDetailId = _c[1];
-  var handleDetailClick = function (flightOptionId) {
-    setActiveDetailId(function (prev) {
-      return prev === flightOptionId ? null : flightOptionId;
-    });
-  };
-  var firstResult = flights === null || flights === void 0 ? void 0 : flights[0];
-  var firstResultDate = (firstResult === null || firstResult === void 0 ? void 0 : firstResult.startDateTime) ? parseISO(firstResult.startDateTime) : null;
-  return React__default.createElement(
-    React__default.Fragment,
-    null,
-    React__default.createElement(
-      'div',
-      { className: 'search__results__label' },
-      React__default.createElement(
-        'div',
-        { className: 'search__results__label__date' },
-        firstResultDate &&
-          React__default.createElement(
-            React__default.Fragment,
-            null,
-            React__default.createElement('p', { className: 'search__results__label__date-date' }, format$1(firstResultDate, 'd')),
-            React__default.createElement('p', null, format$1(firstResultDate, 'MMM'))
-          )
-      ),
-      React__default.createElement(
-        'div',
-        { className: 'search__results__label__text' },
-        React__default.createElement(
-          'h3',
-          null,
-          translations.SRP.SELECT,
-          ' ',
-          React__default.createElement('strong', null, isDeparture ? translations.SRP.DEPARTURE : translations.SRP.RETURN)
-        )
-      )
-    ),
-    flights &&
-      flights.length > 0 &&
-      React__default.createElement(
-        'div',
-        { className: 'search__results__cards search__results__cards--extended' },
-        flights.map(function (flight, index) {
-          var lines = flight.flightMetaData.flightLines;
-          var firstLine = lines[0];
-          var lastLine = lines[lines.length - 1];
-          var stops = lines.length - 1;
-          return React__default.createElement(
-            'div',
-            { className: 'flight', key: 'flight-'.concat(flight.flightId, '-').concat(index) },
-            React__default.createElement(
-              'div',
-              { className: 'flight__option' },
-              React__default.createElement(
-                'div',
-                { className: 'flight__content' },
-                React__default.createElement(
-                  'div',
-                  { className: 'flight__flights' },
-                  React__default.createElement(
-                    'div',
-                    { className: 'flight__flight' },
-                    React__default.createElement(
-                      'div',
-                      { className: 'flight__flight__header' },
-                      React__default.createElement('div', { className: 'flight__status__container' }),
-                      React__default.createElement(
-                        'div',
-                        { className: 'flight__price' },
-                        React__default.createElement('span', { className: 'price' }, '\u20AC ', flight.price.toFixed(2)),
-                        React__default.createElement(
-                          'button',
-                          {
-                            type: 'button',
-                            className: 'cta '.concat(flight.isSelected ? 'cta--selected' : 'cta--select'),
-                            onClick: function () {
-                              return dispatch(selectFlight({ flightOptionId: flight.flightOptionId, isDeparture: !!isDeparture }));
-                            }
-                          },
-                          flight.isSelected ? 'Selected' : 'Select'
-                        )
-                      )
-                    )
-                  ),
-                  React__default.createElement(
-                    'div',
-                    { className: 'flight__flight' },
-                    React__default.createElement(
-                      'div',
-                      { className: 'flight__flight__container' },
-                      React__default.createElement(
-                        'div',
-                        { className: 'flight__flight__wrapper' },
-                        React__default.createElement(
-                          'div',
-                          { className: 'flight__logo__wrapper' },
-                          React__default.createElement('img', {
-                            src: 'https://media.tidesoftware.be/media/shared/Airlines/'.concat(firstLine.airlineCode, '.png?height=256'),
-                            alt: flight.airlineDescription,
-                            className: 'flight__logo'
-                          }),
-                          React__default.createElement('span', null, flight.airlineDescription)
-                        ),
-                        React__default.createElement(
-                          'div',
-                          { className: 'flight__info' },
-                          React__default.createElement(
-                            'div',
-                            { className: 'flight__info__times' },
-                            React__default.createElement('strong', null, firstLine.departureTime, ' ', firstLine.departureAirport),
-                            React__default.createElement('p', null, format$1(parseISO(firstLine.departureDate), 'EEE dd MMM yyyy'))
-                          ),
-                          React__default.createElement(
-                            'div',
-                            { className: 'flight__info__duration' },
-                            React__default.createElement('p', null, formatDuration(flight.flightMetaData.durationInTicks)),
-                            React__default.createElement(
-                              'div',
-                              { className: 'flight__info__duration__stops' },
-                              stops > 0 && React__default.createElement('div', { className: 'flight__info__duration__stop' })
-                            ),
-                            React__default.createElement(
-                              'span',
-                              null,
-                              stops === 0
-                                ? translations.SRP.DIRECT
-                                : ''
-                                    .concat(stops, ' ')
-                                    .concat(translations.SRP.STOP)
-                                    .concat(stops > 1 ? 's' : '')
-                            )
-                          ),
-                          React__default.createElement(
-                            'div',
-                            { className: 'flight__info__times flight__info__times--arrival' },
-                            React__default.createElement('strong', null, lastLine.arrivalTime, ' ', lastLine.arrivalAirport),
-                            React__default.createElement('p', null, format$1(parseISO(lastLine.arrivalDate), 'EEE dd MMM yyyy'))
-                          )
-                        )
-                      ),
-                      React__default.createElement(
-                        'div',
-                        { className: 'flight__detail__btn__wrapper' },
-                        React__default.createElement(
-                          'div',
-                          {
-                            className: 'flight__detail__btn '.concat(activeDetailId === flight.flightOptionId ? 'flight__detail__btn--active' : ''),
-                            onClick: function () {
-                              return handleDetailClick(flight.flightOptionId);
-                            }
-                          },
-                          React__default.createElement(Icon$1, { name: 'ui-chevron', className: 'flight__detail__btn__arrow', width: 16, height: 16 })
-                        )
-                      )
-                    ),
-                    React__default.createElement(
-                      'div',
-                      { className: 'flight__detail '.concat(activeDetailId === flight.flightOptionId ? 'flight__detail--active' : '') },
-                      lines.map(function (line, index) {
-                        var nextLine = lines[index + 1];
-                        return React__default.createElement(
-                          React__default.Fragment,
-                          { key: index },
-                          React__default.createElement(
-                            'div',
-                            { className: 'flight__info' },
-                            React__default.createElement(
-                              'div',
-                              { className: 'flight__info__times__wrapper' },
-                              React__default.createElement(
-                                'div',
-                                { className: 'flight__info__times' },
-                                React__default.createElement('p', null, line.departureTime),
-                                React__default.createElement('strong', null, line.departureAirport),
-                                React__default.createElement('p', null, format$1(parseISO(line.departureDate), 'EEE dd MMM yyyy'))
-                              ),
-                              React__default.createElement(Icon$1, { name: 'ui-plane-depart', width: 30, height: 20 })
-                            ),
-                            React__default.createElement(
-                              'div',
-                              { className: 'flight__info__duration' },
-                              React__default.createElement('p', null, formatDuration(line.durationInTicks)),
-                              React__default.createElement('span', null, line.airline, ' ', line.number)
-                            ),
-                            React__default.createElement(
-                              'div',
-                              { className: 'flight__info__times__wrapper flight__info__times__wrapper--arrival' },
-                              React__default.createElement(Icon$1, { name: 'ui-plane-arrive', width: 30, height: 20 }),
-                              React__default.createElement(
-                                'div',
-                                { className: 'flight__info__times flight__info__times--arrival' },
-                                React__default.createElement('p', null, line.arrivalTime),
-                                React__default.createElement('strong', null, line.arrivalAirport),
-                                React__default.createElement('p', null, format$1(parseISO(line.arrivalDate), 'EEE dd MMM yyyy'))
-                              )
-                            )
-                          ),
-                          nextLine &&
-                            React__default.createElement(
-                              'div',
-                              { className: 'flight__info' },
-                              React__default.createElement(
-                                'div',
-                                { className: 'flight__info__duration flight__info__duration--waittime' },
-                                React__default.createElement(
-                                  'div',
-                                  { className: 'flight__info__duration__stops flight__info__duration__stops--stoptime' },
-                                  React__default.createElement(Icon$1, { name: 'ui-clock', width: 24, height: 24 })
-                                ),
-                                React__default.createElement(
-                                  'div',
-                                  { className: 'flight__info__duration__stoptime' },
-                                  React__default.createElement('span', null, translations.SRP.STOP_TIME),
-                                  React__default.createElement(
-                                    'strong',
-                                    null,
-                                    formatDuration(parseISO(nextLine.departureDate).getTime() - parseISO(line.arrivalDate).getTime())
-                                  )
-                                )
-                              )
-                            )
-                        );
-                      })
-                    )
-                  )
-                ),
-                React__default.createElement('div', { className: 'flight__rate' })
-              )
-            )
-          );
-        })
-      )
-  );
-};
-
 var PairedFlightOption = function (_a) {
   var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
   var item = _a.item;
@@ -44634,7 +44420,6 @@ var IndependentFlightOption = function (_a) {
     guid = _a.guid,
     selectedGuid = _a.selectedGuid;
   _a.isOutward;
-  useDispatch();
   var context = useContext(SearchResultsConfigurationContext);
   var language = (_b = context === null || context === void 0 ? void 0 : context.languageCode) !== null && _b !== void 0 ? _b : 'en-GB';
   var translations = getTranslations(language);
@@ -44849,14 +44634,6 @@ var IndependentFlightOption = function (_a) {
   );
 };
 
-var getFlightKey = function (segments) {
-  if (!segments || segments.length === 0) return '';
-  return segments
-    .map(function (s) {
-      return ''.concat(s.marketingAirlineCode).concat(s.flightNumber, '_').concat(s.departureDateTime);
-    })
-    .join('_');
-};
 var IndependentFlightSelection = function (_a) {
   var _b;
   var searchResults = _a.searchResults;
@@ -47076,6 +46853,118 @@ var getRequestRoomsFromPackagingSegments = function (entry, segments) {
   });
 };
 
+var formatNodeDate = function (date) {
+  if (!date) return '';
+  try {
+    return new Intl.DateTimeFormat('nl-BE', {
+      weekday: 'long',
+      day: '2-digit',
+      month: '2-digit',
+      year: 'numeric'
+    }).format(date);
+  } catch (_a) {
+    return '';
+  }
+};
+var escapeHtml = function (value) {
+  if (!value) return '';
+  return value.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;');
+};
+var buildItineraryHtml = function (itinerary) {
+  var _a;
+  if (!itinerary) {
+    return '\n      <div class="itinerary-shell">\n        <div class="itinerary-empty">Geen reisroute beschikbaar.</div>\n      </div>\n    ';
+  }
+  var nodesHtml = ((_a = itinerary.nodes) !== null && _a !== void 0 ? _a : [])
+    .map(function (node) {
+      var hasItems = Array.isArray(node.items) && node.items.length > 0;
+      var itemsHtml = hasItems
+        ? node.items
+            .map(function (item) {
+              var _a;
+              return '\n                <article class="itinerary-item" data-template="'
+                .concat(escapeHtml(item.templateName), '">\n                  ')
+                .concat((_a = item.contents) !== null && _a !== void 0 ? _a : '', '\n                </article>\n              ');
+            })
+            .join('')
+        : '<div class="itinerary-node__empty">Geen items voor deze dag.</div>';
+      return '\n        <section class="itinerary-node">\n          <header class="itinerary-node__header">\n            <div class="itinerary-node__day">Dag '
+        .concat(node.startDay)
+        .concat(
+          node.endDay > node.startDay ? ' - '.concat(node.endDay) : '',
+          '</div>\n            <div class="itinerary-node__meta">\n              <h2 class="itinerary-node__title">'
+        )
+        .concat(escapeHtml(node.title), '</h2>\n              <div class="itinerary-node__date">')
+        .concat(
+          escapeHtml(formatNodeDate(node.startDate)),
+          '</div>\n            </div>\n          </header>\n\n          <div class="itinerary-node__content">\n            '
+        )
+        .concat(itemsHtml, '\n          </div>\n        </section>\n      ');
+    })
+    .join('');
+  var defaultItemsHtml =
+    itinerary.defaultItems && itinerary.defaultItems.length > 0
+      ? '\n        <section class="itinerary-default-items">\n          <h2 class="itinerary-default-items__title">Algemene info</h2>\n          '.concat(
+          itinerary.defaultItems
+            .map(function (item) {
+              var _a;
+              return '\n                <article class="itinerary-item" data-template="'
+                .concat(escapeHtml(item.templateName), '">\n                  ')
+                .concat((_a = item.contents) !== null && _a !== void 0 ? _a : '', '\n                </article>\n              ');
+            })
+            .join(''),
+          '\n        </section>\n      '
+        )
+      : '';
+  return '\n    <div class="itinerary-shell">\n      '
+    .concat(
+      itinerary.title
+        ? '<header class="itinerary-shell__header"><h1 class="itinerary-shell__title">'.concat(escapeHtml(itinerary.title), '</h1></header>')
+        : '',
+      '\n\n      <div class="itinerary-shell__content">\n        '
+    )
+    .concat(nodesHtml, '\n        ')
+    .concat(defaultItemsHtml, '\n      </div>\n    </div>\n  ');
+};
+var FullItinerary = function (_a) {
+  var isLoading = _a.isLoading;
+  if (isLoading) {
+    return React__default.createElement(Spinner, null);
+  }
+  var itinerary = useSelector(function (state) {
+    return state.searchResults;
+  }).itinerary;
+  var hostRef = useRef(null);
+  var shadowRootRef = useRef(null);
+  var html = useMemo(
+    function () {
+      return buildItineraryHtml(itinerary);
+    },
+    [itinerary]
+  );
+  useEffect(
+    function () {
+      var _a;
+      if (!hostRef.current) {
+        return;
+      }
+      if (!shadowRootRef.current) {
+        shadowRootRef.current = hostRef.current.attachShadow({ mode: 'open' });
+      }
+      var shadowRoot = shadowRootRef.current;
+      shadowRoot.innerHTML =
+        "\n      <style>\n        :host {\n          all: initial;\n        }\n\n        *,\n        *::before,\n        *::after {\n          box-sizing: border-box;\n        }\n\n        .itinerary-shell {\n          width: 100%;\n          margin: 0 auto;\n          font-family: 'Outfit', sans-serif;\n          color: #222;\n        }\n\n        .itinerary-shell__header {\n          margin-bottom: 24px;\n        }\n\n        .itinerary-shell__title {\n          margin: 0;\n          font-size: 32px;\n          line-height: 1.2;\n        }\n\n        .itinerary-shell__content {\n          display: grid;\n          gap: 24px;\n        }\n\n        .itinerary-node {\n          border: 1px solid #e5e7eb;\n          border-radius: 16px;\n          overflow: hidden;\n          background: #fff;\n          box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);\n        }\n\n        .itinerary-node__header {\n          display: flex;\n          gap: 16px;\n          align-items: flex-start;\n          padding: 20px 20px 16px;\n          border-bottom: 1px solid #eef0f2;\n          background: #fafafa;\n        }\n\n        .itinerary-node__day {\n          flex: 0 0 auto;\n          min-width: 72px;\n          padding: 8px 12px;\n          border-radius: 999px;\n          font-size: 14px;\n          font-weight: 700;\n          line-height: 1;\n          background: #111827;\n          color: #fff;\n          text-align: center;\n        }\n\n        .itinerary-node__meta {\n          min-width: 0;\n        }\n\n        .itinerary-node__title {\n          margin: 0;\n          font-size: 22px;\n          line-height: 1.25;\n        }\n\n        .itinerary-node__date {\n          margin-top: 6px;\n          font-size: 14px;\n          color: #6b7280;\n        }\n\n        .itinerary-node__content {\n          display: grid;\n          gap: 20px;\n          padding: 20px;\n        }\n\n        .itinerary-item {\n          display: block;\n          border-radius: 12px;\n          overflow: hidden;\n          background: #fff;\n        }\n\n        .itinerary-node__empty,\n        .itinerary-empty {\n          padding: 20px;\n          border: 1px dashed #d1d5db;\n          border-radius: 12px;\n          color: #6b7280;\n          background: #fafafa;\n        }\n\n        .itinerary-default-items {\n          border: 1px solid #e5e7eb;\n          border-radius: 16px;\n          padding: 20px;\n          background: #fff;\n          box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);\n        }\n\n        .itinerary-default-items__title {\n          margin: 0 0 16px;\n          font-size: 22px;\n        }\n\n        @media (max-width: 768px) {\n          .itinerary-shell {\n            padding: 16px;\n          }\n\n          .itinerary-node__header {\n            flex-direction: column;\n          }\n\n          .itinerary-node__day {\n            min-width: auto;\n          }\n        }\n\n        "
+          .concat(
+            (_a = itinerary === null || itinerary === void 0 ? void 0 : itinerary.styleSheetBody) !== null && _a !== void 0 ? _a : '',
+            '\n      </style>\n\n      '
+          )
+          .concat(html, '\n    ');
+    },
+    [html, itinerary === null || itinerary === void 0 ? void 0 : itinerary.styleSheetBody]
+  );
+  return React__default.createElement('div', { ref: hostRef });
+};
+
 var SearchResultsContainer = function () {
   var _a, _b;
   var currentSearch = typeof window !== 'undefined' ? window.location.search : '';
@@ -47088,9 +46977,9 @@ var SearchResultsContainer = function () {
     results = _c.results,
     filteredResults = _c.filteredResults,
     packagingAccoResults = _c.packagingAccoResults,
-    filteredPackagingAccoResults = _c.filteredPackagingAccoResults,
-    bookingPackageDetails = _c.bookingPackageDetails,
-    isLoading = _c.isLoading,
+    filteredPackagingAccoResults = _c.filteredPackagingAccoResults;
+  _c.bookingPackageDetails;
+  var isLoading = _c.isLoading,
     filters = _c.filters,
     selectedSortType = _c.selectedSortType,
     selectedSearchResult = _c.selectedSearchResult,
@@ -47099,7 +46988,9 @@ var SearchResultsContainer = function () {
     packagingAccoSearchDetails = _c.packagingAccoSearchDetails,
     editablePackagingEntry = _c.editablePackagingEntry,
     transactionId = _c.transactionId,
-    accommodationFlyInStep = _c.accommodationFlyInStep;
+    accommodationFlyInStep = _c.accommodationFlyInStep,
+    itinerary = _c.itinerary,
+    packagingFlightResults = _c.packagingFlightResults;
   var isMobile = useMediaQuery('(max-width: 1200px)');
   var _d = useState(false),
     initialFiltersSet = _d[0],
@@ -47117,11 +47008,15 @@ var SearchResultsContainer = function () {
     pricesAreLoading = _h[0],
     setPricesAreLoading = _h[1];
   var _j = useState(false),
-    itineraryOpen = _j[0],
-    setItineraryOpen = _j[1];
-  var _k = useState(null),
-    selectedAccommodationSeed = _k[0],
-    setSelectedAccommodationSeed = _k[1];
+    itineraryIsLoading = _j[0],
+    setItineraryIsLoading = _j[1];
+  var _k = useState(false),
+    itineraryOpen = _k[0],
+    setItineraryOpen = _k[1];
+  var _l = useState(null),
+    selectedAccommodationSeed = _l[0],
+    setSelectedAccommodationSeed = _l[1];
+  var skipInitialPackagingAccoDetailsRef = useRef(false);
   var panelRef = useRef(null);
   var sortByTypes = [
     { direction: 'asc', label: 'default' },
@@ -47233,7 +47128,7 @@ var SearchResultsContainer = function () {
     };
   };
   var buildPackagingAccommodationRequestFromSeed = function (seed, currentTransactionId) {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _e, _f;
     var country = seed.country;
     var region = seed.region;
     var oord = seed.oord;
@@ -47269,11 +47164,15 @@ var SearchResultsContainer = function () {
     }
     return {
       transactionId: currentTransactionId,
-      officeId: 1,
-      agentId: (_b = context === null || context === void 0 ? void 0 : context.agentId) !== null && _b !== void 0 ? _b : null,
-      catalogueId: (_c = context.searchConfiguration.defaultCatalogueId) !== null && _c !== void 0 ? _c : 0,
+      officeId:
+        (_c = (_b = context === null || context === void 0 ? void 0 : context.tideConnection) === null || _b === void 0 ? void 0 : _b.officeId) !== null &&
+        _c !== void 0
+          ? _c
+          : 1,
+      agentId: (_d = context === null || context === void 0 ? void 0 : context.agentId) !== null && _d !== void 0 ? _d : null,
+      catalogueId: (_e = context.searchConfiguration.defaultCatalogueId) !== null && _e !== void 0 ? _e : 0,
       searchConfigurationId: context.searchConfiguration.id,
-      language: (_d = context.languageCode) !== null && _d !== void 0 ? _d : 'en-GB',
+      language: (_f = context.languageCode) !== null && _f !== void 0 ? _f : 'en-GB',
       serviceType: ACCOMMODATION_SERVICE_TYPE,
       fromDate: seed.fromDate,
       toDate: seed.toDate,
@@ -47291,6 +47190,74 @@ var SearchResultsContainer = function () {
       tagIds: tagId ? [tagId] : []
     };
   };
+  var buildPackagingFlightRequestFromSeed = function (seed, currentTransactionId) {
+    var _a, _b, _c, _d;
+    if (typeof window !== 'undefined') {
+      window.scrollTo(0, 0);
+    }
+    var adults = seed.rooms
+      .flatMap(function (x) {
+        return x.pax;
+      })
+      .filter(function (x) {
+        return x.age >= 18;
+      }).length;
+    var kids = seed.rooms
+      .flatMap(function (x) {
+        return x.pax;
+      })
+      .filter(function (x) {
+        return x.age >= 2 && x.age < 18;
+      }).length;
+    var babies = seed.rooms
+      .flatMap(function (x) {
+        return x.pax;
+      })
+      .filter(function (x) {
+        return x.age < 2;
+      }).length;
+    return {
+      transactionId: currentTransactionId,
+      officeId:
+        (_b = (_a = context === null || context === void 0 ? void 0 : context.tideConnection) === null || _a === void 0 ? void 0 : _a.officeId) !== null &&
+        _b !== void 0
+          ? _b
+          : 1,
+      catalogueId:
+        (_d = first((_c = context === null || context === void 0 ? void 0 : context.tideConnection) === null || _c === void 0 ? void 0 : _c.catalogueIds)) !==
+          null && _d !== void 0
+          ? _d
+          : 0,
+      departureAirportCode: seed.departureAirport,
+      arrivalAirportCode: seed.destinationAirport,
+      returnAirportCode: seed.returnAirport,
+      luggageIncluded: null,
+      maxStops: null,
+      travelClass: seed.travelClass,
+      pax: concat(
+        Array.from({ length: adults !== null && adults !== void 0 ? adults : 0 }, function (_, index) {
+          return {
+            id: index,
+            age: 31
+          };
+        }),
+        Array.from({ length: kids !== null && kids !== void 0 ? kids : 0 }, function (_, index) {
+          return {
+            id: index + (adults !== null && adults !== void 0 ? adults : 0),
+            age: 8
+          };
+        }),
+        Array.from({ length: babies !== null && babies !== void 0 ? babies : 0 }, function (_, index) {
+          return {
+            id: index + (adults !== null && adults !== void 0 ? adults : 0) + (kids !== null && kids !== void 0 ? kids : 0),
+            age: 1
+          };
+        })
+      ),
+      outward: seed.fromDate ? { date: dateToDateStruct(new Date(seed.fromDate)) } : null,
+      return: seed.toDate ? { date: dateToDateStruct(new Date(seed.toDate)) } : null
+    };
+  };
   var buildSearchSeedFromQueryParams = function (params) {
     var from = getDateFromParams(params, 'fromDate');
     var to = getDateFromParams(params, 'toDate');
@@ -47303,6 +47270,8 @@ var SearchResultsContainer = function () {
     var tagId = getNumberFromParams(params, 'tagId');
     var destinationAirport = getStringFromParams(params, 'destinationAirport');
     var departureAirport = getStringFromParams(params, 'departureAirport');
+    var travelClass = getStringFromParams(params, 'travelClass');
+    var nationality = getStringFromParams(params, 'nationality');
     if (!from || !to) {
       return null;
     }
@@ -47318,12 +47287,68 @@ var SearchResultsContainer = function () {
       tagId: tagId,
       destinationAirport: destinationAirport,
       departureAirport: departureAirport,
+      travelClass: travelClass,
+      nationality: nationality,
       rooms: getRequestRooms(rooms)
     };
   };
+  var buildSearchSeedFromAccommodationSegments = function (entry, segments) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+    if (!(segments === null || segments === void 0 ? void 0 : segments.length)) return null;
+    var sortedSegments = __spreadArray([], segments, true).sort(function (a, b) {
+      return new Date(a.from).getTime() - new Date(b.from).getTime();
+    });
+    var firstSegment = first(sortedSegments);
+    var lastSegment = last(sortedSegments);
+    if (!firstSegment || !lastSegment) return null;
+    return {
+      fromDate: toDateOnlyString(firstSegment.from),
+      toDate: toDateOnlyString(lastSegment.to),
+      country: (_b = (_a = firstSegment.country) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : null,
+      region: (_d = (_c = firstSegment.region) === null || _c === void 0 ? void 0 : _c.id) !== null && _d !== void 0 ? _d : null,
+      oord: (_f = (_e = firstSegment.oord) === null || _e === void 0 ? void 0 : _e.id) !== null && _f !== void 0 ? _f : null,
+      location: (_h = (_g = firstSegment.location) === null || _g === void 0 ? void 0 : _g.id) !== null && _h !== void 0 ? _h : null,
+      hotel: parseHotelId(firstSegment),
+      hotelCode: (_j = firstSegment.productCode) !== null && _j !== void 0 ? _j : null,
+      tagId: null,
+      destinationAirport: getDestinationAirportFromEntry((_k = entry.lines) !== null && _k !== void 0 ? _k : []),
+      departureAirport: getDepartureAirportFromEntry((_l = entry.lines) !== null && _l !== void 0 ? _l : []),
+      rooms: getRequestRoomsFromPackagingSegments(entry, sortedSegments)
+    };
+  };
+  var handleEditAccommodation = function (segments) {
+    return __awaiter(void 0, void 0, void 0, function () {
+      var sourceEntry, seed, currentTransactionId;
+      return __generator(this, function (_a) {
+        switch (_a.label) {
+          case 0:
+            sourceEntry =
+              editablePackagingEntry !== null && editablePackagingEntry !== void 0
+                ? editablePackagingEntry
+                : context === null || context === void 0
+                ? void 0
+                : context.packagingEntry;
+            if (!sourceEntry) return [2 /*return*/];
+            seed = buildSearchSeedFromAccommodationSegments(sourceEntry, segments);
+            if (!seed) return [2 /*return*/];
+            setDetailsIsLoading(true);
+            setSelectedAccommodationSeed(seed);
+            dispatch(setAccommodationFlyInStep('results'));
+            handleFlyInToggle(true);
+            return [4 /*yield*/, getOrCreateTransactionId()];
+          case 1:
+            currentTransactionId = _a.sent();
+            return [4 /*yield*/, runAccommodationFlow(seed, currentTransactionId !== null && currentTransactionId !== void 0 ? currentTransactionId : '')];
+          case 2:
+            _a.sent();
+            setDetailsIsLoading(false);
+            return [2 /*return*/];
+        }
+      });
+    });
+  };
   var handleConfirmHotelSwap = function () {
     var updatedEntry = swapHotelInPackagingEntry();
-    console.log('Updated entry after hotel swap', updatedEntry);
     if (!updatedEntry) return;
     dispatch(setEditablePackagingEntry(updatedEntry));
     handleFlyInToggle(false);
@@ -47338,7 +47363,6 @@ var SearchResultsContainer = function () {
     var details = packagingAccoSearchDetails;
     if (!sourceEntry || !(details === null || details === void 0 ? void 0 : details.length)) return null;
     var selectedOptionsPerRoom = getSelectedOptionsPerRoom(details);
-    console.log('Selected options per room', selectedOptionsPerRoom);
     if (!selectedOptionsPerRoom.length) return null;
     var selectedHotel = details[0];
     var roomIndex = 0;
@@ -47351,7 +47375,6 @@ var SearchResultsContainer = function () {
         return x.roomIndex === roomIndex;
       });
       var selectedOption = selectedRoom === null || selectedRoom === void 0 ? void 0 : selectedRoom.option;
-      console.log('selectedRoom and selectedOption for line', line, selectedRoom, selectedOption);
       roomIndex++;
       if (!selectedOption) {
         return line;
@@ -47424,6 +47447,25 @@ var SearchResultsContainer = function () {
     },
     [filtersOpen]
   );
+  var getOrCreateTransactionId = function () {
+    return __awaiter(void 0, void 0, void 0, function () {
+      var _a;
+      return __generator(this, function (_b) {
+        switch (_b.label) {
+          case 0:
+            if ((_a = context === null || context === void 0 ? void 0 : context.packagingEntry) === null || _a === void 0 ? void 0 : _a.transactionId) {
+              return [2 /*return*/, context.packagingEntry.transactionId];
+            }
+            if (transactionId) {
+              return [2 /*return*/, transactionId];
+            }
+            return [4 /*yield*/, runStartTransaction()];
+          case 1:
+            return [2 /*return*/, _b.sent()];
+        }
+      });
+    });
+  };
   var runSearch = function () {
     return __awaiter(void 0, void 0, void 0, function () {
       var config, seed, searchRequest, packageSearchResults, enrichedFilters, initialFilteredResults, err_1;
@@ -47446,7 +47488,6 @@ var SearchResultsContainer = function () {
             return [4 /*yield*/, build.search(config, searchRequest)];
           case 1:
             packageSearchResults = _b.sent();
-            console.log('Search results', packageSearchResults);
             enrichedFilters = enrichFiltersWithResults(packageSearchResults, context.filters, (_a = context.tags) !== null && _a !== void 0 ? _a : []);
             if (!initialFiltersSet) {
               dispatch(resetFilters(enrichedFilters));
@@ -47506,11 +47547,11 @@ var SearchResultsContainer = function () {
   var runHotelSearch = function (currentTransactionId, seed) {
     return __awaiter(void 0, void 0, void 0, function () {
       var config, searchRequest, packageAccoSearchResults, enrichedFilters, initialFilteredResults, err_3;
-      var _a;
-      return __generator(this, function (_b) {
-        switch (_b.label) {
+      var _a, _b, _c;
+      return __generator(this, function (_d) {
+        switch (_d.label) {
           case 0:
-            _b.trys.push([0, 2, , 3]);
+            _d.trys.push([0, 2, , 3]);
             if (!context) return [2 /*return*/];
             dispatch(setIsLoading(true));
             config = {
@@ -47520,10 +47561,9 @@ var SearchResultsContainer = function () {
             searchRequest = buildPackagingAccommodationRequestFromSeed(seed, currentTransactionId);
             searchRequest.portalId = context.portalId;
             searchRequest.agentId = context.agentId;
-            console.log('Packaging accommodation search request', searchRequest);
             return [4 /*yield*/, build.searchPackagingAccommodations(config, searchRequest)];
           case 1:
-            packageAccoSearchResults = _b.sent();
+            packageAccoSearchResults = _d.sent();
             enrichedFilters = enrichFiltersWithPackageAccoResults(
               packageAccoSearchResults,
               context.filters,
@@ -47537,11 +47577,19 @@ var SearchResultsContainer = function () {
             dispatch(setPackagingAccoResults(packageAccoSearchResults));
             initialFilteredResults = applyFiltersToPackageAccoResults(packageAccoSearchResults, filters, null);
             dispatch(setFilteredPackagingAccoResults(initialFilteredResults));
+            if (initialFilteredResults.length > 0) {
+              skipInitialPackagingAccoDetailsRef.current = true;
+              dispatch(
+                setSelectedPackagingAccoResult(
+                  (_c = (_b = first(initialFilteredResults)) === null || _b === void 0 ? void 0 : _b.code) !== null && _c !== void 0 ? _c : null
+                )
+              );
+            }
             dispatch(setIsLoading(false));
             return [3 /*break*/, 3];
           case 2:
-            err_3 = _b.sent();
-            console.error('Search failed', err_3);
+            err_3 = _d.sent();
+            console.error('HotelSearch failed', err_3);
             dispatch(setIsLoading(false));
             return [3 /*break*/, 3];
           case 3:
@@ -47550,32 +47598,61 @@ var SearchResultsContainer = function () {
       });
     });
   };
-  var runAccommodationFlow = function (seed) {
+  var runAccommodationFlow = function (seed, currentTransactionId) {
     return __awaiter(void 0, void 0, void 0, function () {
-      var currentTransactionId;
-      var _a;
-      return __generator(this, function (_b) {
-        switch (_b.label) {
+      return __generator(this, function (_a) {
+        switch (_a.label) {
           case 0:
             if (!context || context.showMockup) return [2 /*return*/];
-            currentTransactionId =
-              ((_a = context === null || context === void 0 ? void 0 : context.packagingEntry) === null || _a === void 0 ? void 0 : _a.transactionId) ||
-              transactionId;
-            console.log('Current transaction ID', currentTransactionId);
-            if (!!currentTransactionId) return [3 /*break*/, 2];
-            dispatch(setIsLoading(true));
-            return [4 /*yield*/, runStartTransaction()];
+            return [4 /*yield*/, runHotelSearch(currentTransactionId, seed)];
           case 1:
-            currentTransactionId = _b.sent();
-            _b.label = 2;
+            _a.sent();
+            return [2 /*return*/];
+        }
+      });
+    });
+  };
+  var runFlightSearch = function (currentTransactionId, seed) {
+    return __awaiter(void 0, void 0, void 0, function () {
+      var config, searchRequest, packageFlightSearchResults, err_4;
+      return __generator(this, function (_a) {
+        switch (_a.label) {
+          case 0:
+            _a.trys.push([0, 2, , 3]);
+            if (!context) return [2 /*return*/];
+            dispatch(setFlightsLoading(true));
+            config = {
+              host: context.tideConnection.host,
+              apiKey: context.tideConnection.apiKey
+            };
+            searchRequest = buildPackagingFlightRequestFromSeed(seed, currentTransactionId);
+            searchRequest.agentId = context.agentId;
+            return [4 /*yield*/, build.searchPackagingFlights(config, searchRequest)];
+          case 1:
+            packageFlightSearchResults = _a.sent();
+            dispatch(setPackagingFlightResults(packageFlightSearchResults));
+            dispatch(setFlightsLoading(false));
+            return [3 /*break*/, 3];
           case 2:
-            if (!currentTransactionId) {
-              dispatch(setIsLoading(false));
-              return [2 /*return*/];
-            }
-            return [4 /*yield*/, runHotelSearch(currentTransactionId, seed)];
+            err_4 = _a.sent();
+            console.error('FlightSearch failed', err_4);
+            dispatch(setFlightsLoading(false));
+            return [3 /*break*/, 3];
           case 3:
-            _b.sent();
+            return [2 /*return*/];
+        }
+      });
+    });
+  };
+  var runFlightFlow = function (seed, currentTransactionId) {
+    return __awaiter(void 0, void 0, void 0, function () {
+      return __generator(this, function (_a) {
+        switch (_a.label) {
+          case 0:
+            if (!context || context.showMockup) return [2 /*return*/];
+            return [4 /*yield*/, runFlightSearch(currentTransactionId, seed)];
+          case 1:
+            _a.sent();
             return [2 /*return*/];
         }
       });
@@ -47592,20 +47669,60 @@ var SearchResultsContainer = function () {
         runSearch();
       }
       if ((context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.Accommodation) {
-        var seed = activeSearchSeed;
-        if (seed) {
-          runAccommodationFlow(seed);
+        var seed_1 = activeSearchSeed;
+        if (seed_1) {
+          (function () {
+            return __awaiter(void 0, void 0, void 0, function () {
+              var transactionId;
+              return __generator(this, function (_a) {
+                switch (_a.label) {
+                  case 0:
+                    return [4 /*yield*/, getOrCreateTransactionId()];
+                  case 1:
+                    transactionId = _a.sent();
+                    if (!transactionId) return [2 /*return*/];
+                    return [4 /*yield*/, runAccommodationFlow(seed_1, transactionId)];
+                  case 2:
+                    _a.sent();
+                    return [2 /*return*/];
+                }
+              });
+            });
+          })();
         }
       }
       if (
         (context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.AccommodationAndFlight &&
         context.searchConfiguration.enableManualPackaging &&
-        context.searchConfiguration.allowAccommodations &&
         !(context === null || context === void 0 ? void 0 : context.packagingEntry)
       ) {
-        var seed = activeSearchSeed;
-        if (seed) {
-          runAccommodationFlow(seed);
+        var seed_2 = activeSearchSeed;
+        if (seed_2) {
+          (function () {
+            return __awaiter(void 0, void 0, void 0, function () {
+              var sharedTransactionId, tasks;
+              return __generator(this, function (_a) {
+                switch (_a.label) {
+                  case 0:
+                    return [4 /*yield*/, getOrCreateTransactionId()];
+                  case 1:
+                    sharedTransactionId = _a.sent();
+                    if (!sharedTransactionId) return [2 /*return*/];
+                    tasks = [];
+                    if (context.searchConfiguration.allowAccommodations) {
+                      tasks.push(runAccommodationFlow(seed_2, sharedTransactionId));
+                    }
+                    if (context.searchConfiguration.allowFlights) {
+                      tasks.push(runFlightFlow(seed_2, sharedTransactionId));
+                    }
+                    return [4 /*yield*/, Promise.all(tasks)];
+                  case 2:
+                    _a.sent();
+                    return [2 /*return*/];
+                }
+              });
+            });
+          })();
         }
       }
     },
@@ -47621,6 +47738,7 @@ var SearchResultsContainer = function () {
   );
   useEffect(
     function () {
+      console.log('packaging entry from context', context === null || context === void 0 ? void 0 : context.packagingEntry);
       if (context === null || context === void 0 ? void 0 : context.packagingEntry) {
         console.log('original packaging entry from context', context.packagingEntry);
         dispatch(setEditablePackagingEntry(structuredClone(context.packagingEntry)));
@@ -47634,7 +47752,7 @@ var SearchResultsContainer = function () {
     function () {
       var fetchDetails = function () {
         return __awaiter(void 0, void 0, void 0, function () {
-          var config, selectedItem, requestRooms, seed, detailsRequest, detailsResponse, err_4;
+          var config, selectedItem, requestRooms, seed, detailsRequest, detailsResponse, err_5;
           var _a;
           return __generator(this, function (_b) {
             switch (_b.label) {
@@ -47697,8 +47815,8 @@ var SearchResultsContainer = function () {
                 setDetailsIsLoading(false);
                 return [3 /*break*/, 4];
               case 3:
-                err_4 = _b.sent();
-                console.error('Failed to fetch package details', err_4);
+                err_5 = _b.sent();
+                console.error('Failed to fetch package details', err_5);
                 setDetailsIsLoading(false);
                 return [3 /*break*/, 4];
               case 4:
@@ -47723,12 +47841,16 @@ var SearchResultsContainer = function () {
             destinationIsAirport,
             detailSearchRequest,
             packageAccoSearchDetails,
-            err_5;
+            err_6;
           var _a, _b, _c, _d, _e;
           return __generator(this, function (_f) {
             switch (_f.label) {
               case 0:
                 if (!selectedPackagingAccoResultCode || !context) return [2 /*return*/];
+                if (skipInitialPackagingAccoDetailsRef.current) {
+                  skipInitialPackagingAccoDetailsRef.current = false;
+                  return [2 /*return*/];
+                }
                 setDetailsIsLoading(true);
                 if (
                   (context === null || context === void 0 ? void 0 : context.searchConfiguration.qsmType) === build.PortalQsmType.Accommodation ||
@@ -47807,13 +47929,12 @@ var SearchResultsContainer = function () {
                 return [4 /*yield*/, build.searchPackagingAccommodations(config, detailSearchRequest)];
               case 2:
                 packageAccoSearchDetails = _f.sent();
-                console.log('Packaging Acco Search details', packageAccoSearchDetails);
                 dispatch(setPackagingAccoSearchDetails(packageAccoSearchDetails));
                 setDetailsIsLoading(false);
                 return [3 /*break*/, 4];
               case 3:
-                err_5 = _f.sent();
-                console.error('Failed to fetch package details', err_5);
+                err_6 = _f.sent();
+                console.error('Failed to fetch package details', err_6);
                 setDetailsIsLoading(false);
                 return [3 /*break*/, 4];
               case 4:
@@ -47850,75 +47971,15 @@ var SearchResultsContainer = function () {
     },
     [activeSearchSeed]
   );
-  var handleEditAccommodation = function (segments) {
-    return __awaiter(void 0, void 0, void 0, function () {
-      var sourceEntry, seed;
-      return __generator(this, function (_a) {
-        switch (_a.label) {
-          case 0:
-            sourceEntry =
-              editablePackagingEntry !== null && editablePackagingEntry !== void 0
-                ? editablePackagingEntry
-                : context === null || context === void 0
-                ? void 0
-                : context.packagingEntry;
-            if (!sourceEntry) return [2 /*return*/];
-            seed = buildSearchSeedFromAccommodationSegments(sourceEntry, segments);
-            if (!seed) return [2 /*return*/];
-            setDetailsIsLoading(true);
-            setSelectedAccommodationSeed(seed);
-            dispatch(setAccommodationFlyInStep('results'));
-            handleFlyInToggle(true);
-            return [4 /*yield*/, runAccommodationFlow(seed)];
-          case 1:
-            _a.sent();
-            setDetailsIsLoading(false);
-            return [2 /*return*/];
-        }
-      });
-    });
-  };
-  var buildSearchSeedFromAccommodationSegments = function (entry, segments) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
-    if (!(segments === null || segments === void 0 ? void 0 : segments.length)) return null;
-    var sortedSegments = __spreadArray([], segments, true).sort(function (a, b) {
-      return new Date(a.from).getTime() - new Date(b.from).getTime();
-    });
-    var firstSegment = first(sortedSegments);
-    var lastSegment = last(sortedSegments);
-    if (!firstSegment || !lastSegment) return null;
-    return {
-      fromDate: toDateOnlyString(firstSegment.from),
-      toDate: toDateOnlyString(lastSegment.to),
-      country: (_b = (_a = firstSegment.country) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : null,
-      region: (_d = (_c = firstSegment.region) === null || _c === void 0 ? void 0 : _c.id) !== null && _d !== void 0 ? _d : null,
-      oord: (_f = (_e = firstSegment.oord) === null || _e === void 0 ? void 0 : _e.id) !== null && _f !== void 0 ? _f : null,
-      location: (_h = (_g = firstSegment.location) === null || _g === void 0 ? void 0 : _g.id) !== null && _h !== void 0 ? _h : null,
-      hotel: parseHotelId(firstSegment),
-      hotelCode: (_j = firstSegment.productCode) !== null && _j !== void 0 ? _j : null,
-      tagId: null,
-      destinationAirport: getDestinationAirportFromEntry((_k = entry.lines) !== null && _k !== void 0 ? _k : []),
-      departureAirport: getDepartureAirportFromEntry((_l = entry.lines) !== null && _l !== void 0 ? _l : []),
-      rooms: getRequestRoomsFromPackagingSegments(entry, sortedSegments)
-    };
-  };
   useEffect(
     function () {
       var fetchPriceDetails = function () {
         return __awaiter(void 0, void 0, void 0, function () {
-          var config, priceDetails, err_6;
+          var config, priceDetails, err_7;
           return __generator(this, function (_a) {
             switch (_a.label) {
               case 0:
-                console.log(
-                  'Fetching price details for entry',
-                  editablePackagingEntry !== null && editablePackagingEntry !== void 0
-                    ? editablePackagingEntry
-                    : context === null || context === void 0
-                    ? void 0
-                    : context.packagingEntry
-                );
-                if (!context || !editablePackagingEntry) return [2 /*return*/];
+                if (!context || !editablePackagingEntry || isEmpty(editablePackagingEntry.lines)) return [2 /*return*/];
                 setPricesAreLoading(true);
                 _a.label = 1;
               case 1:
@@ -47934,8 +47995,8 @@ var SearchResultsContainer = function () {
                 setPricesAreLoading(false);
                 return [3 /*break*/, 4];
               case 3:
-                err_6 = _a.sent();
-                console.error('Error fetching price details', err_6);
+                err_7 = _a.sent();
+                console.error('Error fetching price details', err_7);
                 setPricesAreLoading(false);
                 return [3 /*break*/, 4];
               case 4:
@@ -47944,10 +48005,431 @@ var SearchResultsContainer = function () {
           });
         });
       };
+      var fetchItinerary = function () {
+        return __awaiter(void 0, void 0, void 0, function () {
+          var config, itinerary_1, err_8;
+          return __generator(this, function (_a) {
+            switch (_a.label) {
+              case 0:
+                console.log('Fetching itinerary for entry', editablePackagingEntry);
+                if (!context || !editablePackagingEntry || isEmpty(editablePackagingEntry.lines)) return [2 /*return*/];
+                setItineraryIsLoading(true);
+                _a.label = 1;
+              case 1:
+                _a.trys.push([1, 3, , 4]);
+                config = {
+                  host: context.tideConnection.host,
+                  apiKey: context.tideConnection.apiKey
+                };
+                return [4 /*yield*/, build.getItinerary(config, editablePackagingEntry)];
+              case 2:
+                itinerary_1 = _a.sent();
+                console.log('Fetched itinerary', itinerary_1);
+                dispatch(setItinerary(itinerary_1));
+                setItineraryIsLoading(false);
+                return [3 /*break*/, 4];
+              case 3:
+                err_8 = _a.sent();
+                console.error('Error fetching itinerary', err_8);
+                setItineraryIsLoading(false);
+                return [3 /*break*/, 4];
+              case 4:
+                return [2 /*return*/];
+            }
+          });
+        });
+      };
       fetchPriceDetails();
+      fetchItinerary();
     },
     [editablePackagingEntry]
   );
+  // Flight selection
+  var _m = useState(null),
+    selectedOutwardKey = _m[0],
+    setSelectedOutwardKey = _m[1];
+  var _o = useState(null),
+    selectedReturnKey = _o[0],
+    setSelectedReturnKey = _o[1];
+  var uniqueOutwardFlights = React__default.useMemo(
+    function () {
+      var map = new Map();
+      packagingFlightResults.forEach(function (flight) {
+        var key = getFlightKey(flight.outward.segments);
+        if (!map.has(key)) {
+          map.set(key, flight);
+        }
+      });
+      return Array.from(map.values());
+    },
+    [packagingFlightResults]
+  );
+  var _p = useState([]),
+    uniqueReturnFlights = _p[0],
+    setUniqueReturnFlights = _p[1];
+  useEffect(
+    function () {
+      if (!selectedOutwardKey) {
+        setUniqueReturnFlights([]);
+        setSelectedReturnKey(null);
+        return;
+      }
+      // Filter combinations that match selected outward fare
+      var matchingCombinations = packagingFlightResults.filter(function (flight) {
+        return getFlightKey(flight.outward.segments) === selectedOutwardKey;
+      });
+      var returnMap = new Map();
+      matchingCombinations.forEach(function (flight) {
+        var key = getFlightKey(flight.return.segments);
+        if (!returnMap.has(key)) {
+          returnMap.set(key, flight);
+        }
+      });
+      var returns = Array.from(returnMap.values());
+      setUniqueReturnFlights(returns);
+    },
+    [selectedOutwardKey, packagingFlightResults]
+  );
+  var selectedOutward = React__default.useMemo(
+    function () {
+      if (!selectedOutwardKey) return null;
+      return (
+        packagingFlightResults.find(function (flight) {
+          return getFlightKey(flight.outward.segments) === selectedOutwardKey;
+        }) || null
+      );
+    },
+    [packagingFlightResults, selectedOutwardKey]
+  );
+  var selectedReturn = React__default.useMemo(
+    function () {
+      if (!selectedReturnKey) return null;
+      return (
+        packagingFlightResults.find(function (flight) {
+          return getFlightKey(flight.return.segments) === selectedReturnKey;
+        }) || null
+      );
+    },
+    [packagingFlightResults, selectedReturnKey]
+  );
+  var selectedCombinationFlight = React__default.useMemo(
+    function () {
+      if (!selectedOutwardKey || !selectedReturnKey) return undefined;
+      return packagingFlightResults.find(function (flight) {
+        return getFlightKey(flight.outward.segments) === selectedOutwardKey && getFlightKey(flight.return.segments) === selectedReturnKey;
+      });
+    },
+    [packagingFlightResults, selectedOutwardKey, selectedReturnKey]
+  );
+  // TODO: get details for selected combination flight and show in fly-in
+  // useEffect(() => {
+  //   if (!selectedCombinationFlight) return;
+  //   dispatch(setSelectedPackagingFlight(selectedCombinationFlight));
+  //   // onFlightSearch(selectedCombinationFlight); // Trigger search to update accommodation options based on selected flight
+  //   dispatch(setFlyInIsOpen(true));
+  // }, [selectedCombinationFlight, dispatch]);
+  useEffect(
+    function () {
+      var _a, _b, _c, _d;
+      if (!context) return;
+      var seed = activeSearchSeed;
+      if (!seed) return;
+      var nextEntry = buildOrUpdatePackagingEntryPartial({
+        sourceEntry:
+          (_a = editablePackagingEntry !== null && editablePackagingEntry !== void 0 ? editablePackagingEntry : context.packagingEntry) !== null &&
+          _a !== void 0
+            ? _a
+            : null,
+        selectedHotelCode: selectedPackagingAccoResultCode,
+        accommodationResults: packagingAccoResults,
+        selectedFlight: selectedCombinationFlight !== null && selectedCombinationFlight !== void 0 ? selectedCombinationFlight : null,
+        seed: seed,
+        transactionId:
+          (_c =
+            transactionId !== null && transactionId !== void 0
+              ? transactionId
+              : (_b = context.packagingEntry) === null || _b === void 0
+              ? void 0
+              : _b.transactionId) !== null && _c !== void 0
+            ? _c
+            : '',
+        language: (_d = context.languageCode) !== null && _d !== void 0 ? _d : 'en-GB'
+      });
+      console.log('Built next packaging entry', nextEntry);
+      if (!nextEntry) return;
+      dispatch(setEditablePackagingEntry(nextEntry));
+      if (selectedCombinationFlight) {
+        dispatch(setSelectedPackagingFlight(selectedCombinationFlight));
+      }
+    },
+    [
+      context,
+      activeSearchSeed,
+      selectedPackagingAccoResultCode,
+      packagingAccoResults,
+      packagingAccoSearchDetails,
+      selectedCombinationFlight,
+      transactionId,
+      dispatch
+    ]
+  );
+  var removeAccommodationLines = function (lines) {
+    return lines.filter(function (line) {
+      return line.serviceType !== ACCOMMODATION_SERVICE_TYPE;
+    });
+  };
+  var removeFlightLines = function (lines) {
+    return lines.filter(function (line) {
+      return line.serviceType !== FLIGHT_SERVICE_TYPE;
+    });
+  };
+  var buildAccommodationLinesFromSelection = function (selectedHotel, seed) {
+    if (!selectedHotel) return [];
+    var parentGuid = crypto.randomUUID();
+    return selectedHotel.rooms
+      .filter(function (room) {
+        return room.options.some(function (o) {
+          return o.isSelected;
+        });
+      })
+      .map(function (room, index) {
+        var _a, _b, _c, _d, _e;
+        var option = room.options.find(function (o) {
+          return o.isSelected;
+        });
+        var pax =
+          (_b =
+            (_a = seed.rooms) === null || _a === void 0
+              ? void 0
+              : _a.flatMap(function (room, roomIndex) {
+                  return room.pax.map(function (p, paxIndex) {
+                    return {
+                      paxId: p.id,
+                      room: roomIndex,
+                      order: paxIndex
+                    };
+                  });
+                })) !== null && _b !== void 0
+            ? _b
+            : [];
+        return {
+          guid: (_c = option.guid) !== null && _c !== void 0 ? _c : crypto.randomUUID(),
+          moment: '',
+          parentGuid: index === 0 ? null : parentGuid,
+          order: index,
+          isChanged: true,
+          from: selectedHotel.fromDate,
+          to: selectedHotel.toDate,
+          serviceType: ACCOMMODATION_SERVICE_TYPE,
+          productName: selectedHotel.name,
+          productCode: selectedHotel.code,
+          accommodationName: option.accommodationName,
+          accommodationCode: option.accommodationCode,
+          regimeName: option.regimeName,
+          regimeCode: option.regimeCode,
+          country: selectedHotel.countryId ? { id: selectedHotel.countryId, name: selectedHotel.countryName, localizations: [] } : null,
+          region: selectedHotel.regionId ? { id: selectedHotel.regionId, name: selectedHotel.regionName, localizations: [] } : null,
+          oord: selectedHotel.oordId ? { id: selectedHotel.oordId, name: selectedHotel.oordName, localizations: [] } : null,
+          location: selectedHotel.locationId ? { id: selectedHotel.locationId, name: selectedHotel.locationName, localizations: [] } : null,
+          longitude: (_d = selectedHotel.longitude) !== null && _d !== void 0 ? _d : null,
+          latitude: (_e = selectedHotel.latitude) !== null && _e !== void 0 ? _e : null,
+          pax: pax,
+          flightInformation: null
+        };
+      });
+  };
+  var toDateOnlyUtcString = function (value) {
+    var date = new Date(value);
+    return new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate())).toISOString();
+  };
+  var toTimeOnlyString = function (value) {
+    var date = new Date(value);
+    var hh = String(date.getUTCHours()).padStart(2, '0');
+    var mm = String(date.getUTCMinutes()).padStart(2, '0');
+    var ss = String(date.getUTCSeconds()).padStart(2, '0');
+    return ''.concat(hh, ':').concat(mm, ':').concat(ss);
+  };
+  var mapFlightSegmentsToFlightLines = function (segments) {
+    return segments.map(function (segment) {
+      var _a;
+      return {
+        airlineCode: segment.marketingAirlineCode,
+        airlineDescription: segment.marketingAirlineName,
+        operatingAirlineCode: segment.operatingAirlineCode,
+        operatingAirlineDescription: segment.operatingAirlineName,
+        flightNumber: segment.flightNumber,
+        operatingFlightNumber: (_a = segment.operatingFlightNumber) !== null && _a !== void 0 ? _a : null,
+        departureDate: toDateOnlyUtcString(segment.departureDateTime),
+        departureTime: toTimeOnlyString(segment.departureDateTime),
+        departureAirportCode: segment.departureAirportCode,
+        departureAirportDescription: segment.departureAirportName,
+        arrivalDate: toDateOnlyUtcString(segment.arrivalDateTime),
+        arrivalTime: toTimeOnlyString(segment.arrivalDateTime),
+        arrivalAirportCode: segment.arrivalAirportCode,
+        arrivalAirportDescription: segment.arrivalAirportName,
+        durationInTicks: segment.durationInTicks
+      };
+    });
+  };
+  var buildFlightLabel = function (segments) {
+    var firstSegment = first(segments);
+    var lastSegment = last(segments);
+    if (!firstSegment || !lastSegment) {
+      return { productName: 'Flight', productCode: 'FLIGHT' };
+    }
+    return {
+      productName: ''
+        .concat(firstSegment.departureAirportName, ' - ')
+        .concat(lastSegment.arrivalAirportName, ' (')
+        .concat(firstSegment.marketingAirlineName, ')'),
+      productCode: ''.concat(firstSegment.departureAirportCode, ' ').concat(lastSegment.arrivalAirportCode, '/').concat(firstSegment.marketingAirlineCode)
+    };
+  };
+  var buildFlightLinesFromSelection = function (selectedFlight) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+    if (!selectedFlight) return [];
+    var outwardSegments = (_b = (_a = selectedFlight.outward) === null || _a === void 0 ? void 0 : _a.segments) !== null && _b !== void 0 ? _b : [];
+    var returnSegments = (_d = (_c = selectedFlight.return) === null || _c === void 0 ? void 0 : _c.segments) !== null && _d !== void 0 ? _d : [];
+    if (!outwardSegments.length || !returnSegments.length) return [];
+    var outwardLabel = buildFlightLabel(outwardSegments);
+    var returnLabel = buildFlightLabel(returnSegments);
+    var outwardFirst = first(outwardSegments);
+    var outwardLast = last(outwardSegments);
+    var returnFirst = first(returnSegments);
+    var returnLast = last(returnSegments);
+    var outwardLine = {
+      guid: selectedFlight.outwardGuid,
+      parentGuid: null,
+      order: 0,
+      isChanged: true,
+      from: (_e = outwardFirst === null || outwardFirst === void 0 ? void 0 : outwardFirst.departureDateTime.toString()) !== null && _e !== void 0 ? _e : '',
+      to: (_f = outwardLast === null || outwardLast === void 0 ? void 0 : outwardLast.arrivalDateTime.toString()) !== null && _f !== void 0 ? _f : '',
+      serviceType: FLIGHT_SERVICE_TYPE,
+      productName: outwardLabel.productName,
+      productCode: outwardLabel.productCode,
+      accommodationName:
+        (_g = outwardFirst === null || outwardFirst === void 0 ? void 0 : outwardFirst.metaData) === null || _g === void 0 ? void 0 : _g.farePriceClassName,
+      accommodationCode:
+        (_h = outwardFirst === null || outwardFirst === void 0 ? void 0 : outwardFirst.metaData) === null || _h === void 0 ? void 0 : _h.fareCode,
+      regimeName: null,
+      regimeCode: null,
+      country: null,
+      region: null,
+      oord: null,
+      location: null,
+      longitude: null,
+      latitude: null,
+      // pax: allPaxAssignments,
+      flightInformation: {
+        pnr: '',
+        flightLines: mapFlightSegmentsToFlightLines(outwardSegments)
+      }
+    };
+    var returnLine = {
+      guid: selectedFlight.returnGuid,
+      parentGuid: selectedFlight.outwardGuid,
+      order: 1,
+      isChanged: true,
+      from: (_j = returnFirst === null || returnFirst === void 0 ? void 0 : returnFirst.departureDateTime.toString()) !== null && _j !== void 0 ? _j : '',
+      to: (_k = returnLast === null || returnLast === void 0 ? void 0 : returnLast.departureDateTime.toString()) !== null && _k !== void 0 ? _k : '',
+      serviceType: FLIGHT_SERVICE_TYPE,
+      productName: returnLabel.productName,
+      productCode: returnLabel.productCode,
+      accommodationName:
+        (_l = returnFirst === null || returnFirst === void 0 ? void 0 : returnFirst.metaData) === null || _l === void 0 ? void 0 : _l.farePriceClassName,
+      accommodationCode: (_m = returnFirst === null || returnFirst === void 0 ? void 0 : returnFirst.metaData) === null || _m === void 0 ? void 0 : _m.fareCode,
+      regimeName: null,
+      regimeCode: null,
+      country: null,
+      region: null,
+      oord: null,
+      location: null,
+      longitude: null,
+      latitude: null,
+      // pax: allPaxAssignments,
+      flightInformation: {
+        pnr: '',
+        flightLines: mapFlightSegmentsToFlightLines(returnSegments)
+      }
+    };
+    return [outwardLine, returnLine];
+  };
+  var buildOrUpdatePackagingEntryPartial = function (_a) {
+    var _b, _c;
+    var sourceEntry = _a.sourceEntry,
+      selectedHotelCode = _a.selectedHotelCode,
+      accommodationResults = _a.accommodationResults,
+      selectedFlight = _a.selectedFlight,
+      seed = _a.seed,
+      transactionId = _a.transactionId,
+      language = _a.language;
+    if (!((_b = seed === null || seed === void 0 ? void 0 : seed.rooms) === null || _b === void 0 ? void 0 : _b.length)) return null;
+    var entry = buildBasePackagingEntry(sourceEntry, seed, transactionId, language);
+    var nextLines = __spreadArray([], (_c = entry.lines) !== null && _c !== void 0 ? _c : [], true);
+    var selectedHotel = selectedHotelCode
+      ? accommodationResults.find(function (r) {
+          return r.code === selectedHotelCode;
+        })
+      : null;
+    console.log('Selected hotel for packaging entry', selectedHotel);
+    // Update accommodation only when enough data exists
+    if (selectedHotel) {
+      var accommodationLines = buildAccommodationLinesFromSelection(selectedHotel, seed);
+      if (accommodationLines.length) {
+        nextLines = removeAccommodationLines(nextLines);
+        nextLines = __spreadArray(__spreadArray([], nextLines, true), accommodationLines, true);
+      }
+    }
+    // Update flights only when full selected combination exists
+    if (selectedFlight) {
+      var flightLines = buildFlightLinesFromSelection(selectedFlight);
+      console.log('selectedFlight', selectedFlight);
+      console.log('Built flight lines from selection', flightLines);
+      if (flightLines.length) {
+        nextLines = removeFlightLines(nextLines);
+        nextLines = __spreadArray(__spreadArray([], nextLines, true), flightLines, true);
+      }
+    }
+    nextLines = nextLines.map(function (line, index) {
+      return __assign(__assign({}, line), { order: index });
+    });
+    return __assign(__assign({}, entry), { language: language, transactionId: transactionId, pax: entry.pax, lines: nextLines });
+  };
+  var buildBasePackagingEntry = function (sourceEntry, seed, transactionId, language) {
+    var _a, _b;
+    if (sourceEntry) {
+      return structuredClone(sourceEntry);
+    }
+    var paxId = 1;
+    var pax =
+      (_b =
+        (_a = seed.rooms) === null || _a === void 0
+          ? void 0
+          : _a.flatMap(function (room, roomIndex) {
+              return room.pax.map(function (_, paxIndex) {
+                return {
+                  id: paxId++,
+                  firstName: '',
+                  lastName: '',
+                  dateOfBirth: null,
+                  isMainBooker: roomIndex === 0 && paxIndex === 0
+                };
+              });
+            })) !== null && _b !== void 0
+        ? _b
+        : [];
+    return {
+      language: language,
+      transactionId: transactionId,
+      dossierNumber: '',
+      status: 0,
+      bookingDate: null,
+      price: 0,
+      depositAmount: 0,
+      pax: pax,
+      lines: []
+    };
+  };
   return React__default.createElement(
     'div',
     { id: 'tide-booking', className: 'search__bg' },
@@ -48065,13 +48547,11 @@ var SearchResultsContainer = function () {
                     'span',
                     { className: 'search__result-row-text' },
                     !isLoading &&
-                      !context.packagingEntry &&
+                      context.searchConfiguration.qsmType !== build.PortalQsmType.AccommodationAndFlight &&
                       React__default.createElement(
                         React__default.Fragment,
                         null,
-                        ((context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight &&
-                          context.searchConfiguration.enableManualPackaging) ||
-                          context.searchConfiguration.qsmType === build.PortalQsmType.Accommodation) &&
+                        context.searchConfiguration.qsmType === build.PortalQsmType.Accommodation &&
                           (filteredPackagingAccoResults === null || filteredPackagingAccoResults === void 0 ? void 0 : filteredPackagingAccoResults.length) &&
                           (filteredPackagingAccoResults === null || filteredPackagingAccoResults === void 0 ? void 0 : filteredPackagingAccoResults.length),
                         context.searchConfiguration.qsmType !== build.PortalQsmType.Accommodation &&
@@ -48120,25 +48600,117 @@ var SearchResultsContainer = function () {
                   context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight &&
                     !context.packagingEntry &&
                     context.showFlightResults &&
-                    (bookingPackageDetails === null || bookingPackageDetails === void 0 ? void 0 : bookingPackageDetails.outwardFlights) &&
-                    React__default.createElement(FlightResults, {
-                      flights: bookingPackageDetails === null || bookingPackageDetails === void 0 ? void 0 : bookingPackageDetails.outwardFlights,
-                      isDeparture: true
-                    }),
+                    // bookingPackageDetails?.outwardFlights &&
+                    // <FlightResults flights={bookingPackageDetails?.outwardFlights} isDeparture={true} />
+                    React__default.createElement(
+                      React__default.Fragment,
+                      null,
+                      React__default.createElement(
+                        'div',
+                        { className: 'search__results__label search__results__label--secondary' },
+                        React__default.createElement(
+                          'div',
+                          { className: 'search__results__label__date' },
+                          React__default.createElement(Icon$1, { name: 'ui-flight', height: 16, fill: 'white' })
+                        ),
+                        React__default.createElement(
+                          'div',
+                          { className: 'search__results__label__text' },
+                          React__default.createElement(
+                            'h3',
+                            null,
+                            translations.SRP.SELECT,
+                            ' ',
+                            React__default.createElement('strong', null, ' ', translations.SRP.DEPARTURE)
+                          )
+                        )
+                      ),
+                      React__default.createElement(
+                        'div',
+                        { className: 'search__results__cards search__results__cards--extended' },
+                        selectedOutwardKey && selectedOutward
+                          ? React__default.createElement(IndependentFlightOption, {
+                              key: 'flight-'.concat(selectedOutwardKey),
+                              item: selectedOutward.outward,
+                              guid: selectedOutward.outwardGuid,
+                              onSelect: function () {
+                                return setSelectedOutwardKey(null);
+                              },
+                              selectedGuid: selectedOutward.outwardGuid,
+                              isOutward: true
+                            })
+                          : uniqueOutwardFlights.map(function (result) {
+                              return React__default.createElement(IndependentFlightOption, {
+                                key: 'flight-'.concat(result.outwardGuid),
+                                item: result.outward,
+                                onSelect: function () {
+                                  return setSelectedOutwardKey(getFlightKey(result.outward.segments));
+                                },
+                                guid: result.outwardGuid,
+                                isOutward: true
+                              });
+                            })
+                      )
+                    ),
                   context.showHotelAccommodationResults &&
                     !context.packagingEntry &&
                     React__default.createElement(HotelAccommodationResults, { isLoading: isLoading }),
                   context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight &&
                     !context.packagingEntry &&
                     context.showFlightResults &&
-                    (bookingPackageDetails === null || bookingPackageDetails === void 0 ? void 0 : bookingPackageDetails.returnFlights) &&
-                    React__default.createElement(FlightResults, {
-                      flights: bookingPackageDetails === null || bookingPackageDetails === void 0 ? void 0 : bookingPackageDetails.returnFlights,
-                      isDeparture: false
-                    }),
+                    // bookingPackageDetails?.returnFlights &&
+                    // <FlightResults flights={bookingPackageDetails?.returnFlights} isDeparture={false} />
+                    React__default.createElement(
+                      React__default.Fragment,
+                      null,
+                      React__default.createElement(
+                        'div',
+                        { className: 'search__results__label search__results__label--secondary' },
+                        React__default.createElement(
+                          'div',
+                          { className: 'search__results__label__date' },
+                          React__default.createElement(Icon$1, { name: 'ui-flight', height: 16, fill: 'white' })
+                        ),
+                        React__default.createElement(
+                          'div',
+                          { className: 'search__results__label__text' },
+                          React__default.createElement(
+                            'h3',
+                            null,
+                            translations.SRP.SELECT,
+                            ' ',
+                            React__default.createElement('strong', null, ' ', translations.SRP.RETURN)
+                          )
+                        )
+                      ),
+                      React__default.createElement(
+                        'div',
+                        { className: 'search__results__cards search__results__cards--extended' },
+                        selectedReturnKey && selectedReturn
+                          ? React__default.createElement(IndependentFlightOption, {
+                              key: 'flight-'.concat(selectedReturnKey),
+                              item: selectedReturn.return,
+                              guid: selectedReturn.outwardGuid,
+                              selectedGuid: selectedReturn.outwardGuid,
+                              isOutward: false
+                            })
+                          : uniqueReturnFlights.map(function (result) {
+                              return React__default.createElement(IndependentFlightOption, {
+                                key: 'flight-'.concat(result.outwardGuid),
+                                item: result.return,
+                                onSelect: function () {
+                                  return setSelectedReturnKey(getFlightKey(result.return.segments));
+                                },
+                                guid: result.outwardGuid,
+                                isOutward: false
+                              });
+                            })
+                      )
+                    ),
                   context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight &&
                     context.packagingEntry &&
-                    React__default.createElement('span', null, 'TODO: Show Full Itinerary here')
+                    itinerary &&
+                    React__default.createElement(FullItinerary, { isLoading: itineraryIsLoading })
                 )
               ),
               React__default.createElement(FlyIn, {
@@ -55585,5 +56157,6 @@ export {
   PhotoGallery,
   QSM,
   SearchResults,
-  Slider
+  Slider,
+  Spinner
 };