@qite/tide-booking-component 1.4.2 → 1.4.5

package/build/build-cjs/index.js

@@ -266,8 +266,11 @@ var TRAVELERS_FORM$2 = {
 	CHOOSE_AGENT_PLACEHOLDER: "Choisissez votre agent de voyage",
 	VALIDATION: {
 		TRAVELER_X_FIELD: "Chambre {0} - Voyageur {1} : {2}",
+		SINGLE_ROOM_TRAVELER_X_FIELD: "Voyageur {0} : {1}",
 		TRAVELER_X_IS_NO_ADULT: "Chambre {0} - Voyageur {1} : n'est pas un adulte",
+		SINGLE_ROOM_TRAVELER_X_IS_NO_ADULT: "Voyageur {0} : n'est pas un adulte",
 		TRAVELER_X_IS_NO_CHILD: "Chambre {0} - Voyageur {1} : n'est pas un enfant",
+		SINGLE_ROOM_TRAVELER_X_IS_NO_CHILD: "Voyageur {0} : n'est pas un enfant",
 		NO_MAIN_BOOKER_SELECTED: "Aucun réservant principal n'a été sélectionné",
 		MAIN_BOOKER_FIELD: "Principal réservant : {0}",
 		MAIN_BOOKER_EMAIL_IS_INVALID: "Principal réservant : e-mail invalide",
@@ -525,8 +528,11 @@ var TRAVELERS_FORM$1 = {
 	CHOOSE_AGENT_PLACEHOLDER: "Kies uw reisagent",
 	VALIDATION: {
 		TRAVELER_X_FIELD: "Kamer {0} - Reiziger {1}: {2}",
+		SINGLE_ROOM_TRAVELER_X_FIELD: "Reiziger {0}: {1}",
 		TRAVELER_X_IS_NO_ADULT: "Kamer {0} - Reiziger {1}: is geen volwassene",
+		SINGLE_ROOM_TRAVELER_X_IS_NO_ADULT: "Reiziger {0}: is geen volwassene",
 		TRAVELER_X_IS_NO_CHILD: "Kamer {0} - Reiziger {1}: is geen kind",
+		SINGLE_ROOM_TRAVELER_X_IS_NO_CHILD: "Reiziger {0}: is geen kind",
 		NO_MAIN_BOOKER_SELECTED: "Er werd geen hoofdboeker geselecteerd",
 		MAIN_BOOKER_FIELD: "Hoofdboeker: {0}",
 		MAIN_BOOKER_EMAIL_IS_INVALID: "Hoofdboeker: e-mail is ongeldig",
@@ -784,8 +790,11 @@ var TRAVELERS_FORM = {
 	CHOOSE_AGENT_PLACEHOLDER: "Choose your travel agent",
 	VALIDATION: {
 		TRAVELER_X_FIELD: "Room {0} - Traveler {1}: {2}",
+		SINGLE_ROOM_TRAVELER_X_FIELD: "Traveler {0}: {1}",
 		TRAVELER_X_IS_NO_ADULT: "Room {0} - Traveler {1}: is not an adult",
+		SINGLE_ROOM_TRAVELER_X_IS_NO_ADULT: "Traveler {0}: is not an adult",
 		TRAVELER_X_IS_NO_CHILD: "Room {0} - Traveler {1}: is not a child",
+		SINGLE_ROOM_TRAVELER_X_IS_NO_CHILD: "Traveler {0}: is not a child",
 		NO_MAIN_BOOKER_SELECTED: "No main booker has been selected",
 		MAIN_BOOKER_FIELD: "Main booker: {0}",
 		MAIN_BOOKER_EMAIL_IS_INVALID: "Main booker: email is invalid",
@@ -10012,18 +10021,27 @@ var selectLanguageCode = function (state) {
     return state.booking.languageCode;
 };
 var selectCurrencyCode = function (state) { var _a, _b; return (_b = (_a = state.booking.package) === null || _a === void 0 ? void 0 : _a.currencyCode) !== null && _b !== void 0 ? _b : "EUR"; };
-var selectTranslations = function (state) {
+var selectDefaultStaticTranslations = function (state) {
+    return getTranslations(state.booking.languageCode);
+};
+var selectLanguage = function (state) {
+    return state.booking.languageCode;
+};
+var selectAllDynamicTranslations = function (state) {
+    return state.booking.translations;
+};
+var selectDynamicTranslations = toolkit.createSelector([selectAllDynamicTranslations, selectLanguage], function (allDynamicTranslations, language) {
     var _a, _b;
-    var defaultStaticTranslations = getTranslations(state.booking.languageCode);
-    var dynamicTranslations = (_b = (state.booking.translations &&
-        ((_a = state.booking.translations.find(function (x) { return x.language == state.booking.languageCode; })) === null || _a === void 0 ? void 0 : _a.value))) !== null && _b !== void 0 ? _b : {};
+    return ((_b = (_a = allDynamicTranslations === null || allDynamicTranslations === void 0 ? void 0 : allDynamicTranslations.find(function (x) { return x.language == language; })) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : {});
+});
+var selectTranslations = toolkit.createSelector([selectDefaultStaticTranslations, selectDynamicTranslations], function (defaultStaticTranslations, dynamicTranslations) {
     var merged = {};
-    for (var _i = 0, _c = Array.from(new Set(__spreadArray(__spreadArray([], Object.keys(defaultStaticTranslations), true), Object.keys(dynamicTranslations), true))); _i < _c.length; _i++) {
-        var key = _c[_i];
+    for (var _i = 0, _a = Array.from(new Set(__spreadArray(__spreadArray([], Object.keys(defaultStaticTranslations), true), Object.keys(dynamicTranslations), true))); _i < _a.length; _i++) {
+        var key = _a[_i];
         merged[key] = __assign(__assign({}, (defaultStaticTranslations[key] || {})), (dynamicTranslations[key] || {}));
     }
     return merged;
-};
+});
 var selectBookingOptions = function (state) {
     return state.booking.bookingOptions;
 };
@@ -10367,12 +10385,14 @@ var fetchPackageDetails = toolkit.createAsyncThunk("booking/details", function (
                             flightCode: bookingAttributes.flight.outwardCode,
                             startDateTime: bookingAttributes.flight.outwardDepartureDate,
                             endDateTime: bookingAttributes.flight.outwardArrivalDate,
+                            flightNumbers: bookingAttributes.flight.outwardNumbers,
                         };
                         if (bookingAttributes.flight.returnCode) {
                             returnFlight = {
                                 flightCode: bookingAttributes.flight.returnCode,
                                 startDateTime: bookingAttributes.flight.returnDepartureDate,
                                 endDateTime: bookingAttributes.flight.returnArrivalDate,
+                                flightNumbers: bookingAttributes.flight.returnNumbers
                             };
                         }
                     }
@@ -11837,6 +11857,8 @@ var parseFlightLines = function (metaDatas) {
             airlineDescription: parsedFlightLine.operatingAirlineDescription,
             airlineNumber: parsedFlightLine.number,
             travelClass: parsedFlightLine.travelClass,
+            number: parsedFlightLine.number,
+            airlineCode: parsedFlightLine.operatingAirlineCode || parsedFlightLine.airlineCode,
         };
     });
     return lodash.orderBy(parsedFlightLines, "departureDate", "asc");
@@ -13619,7 +13641,10 @@ var SidebarFlight = function (_a) {
                 React__default["default"].createElement("br", null),
                 getDateText(firstFlight === null || firstFlight === void 0 ? void 0 : firstFlight.departureDate),
                 " ", firstFlight === null || firstFlight === void 0 ? void 0 :
-                firstFlight.departureTime)),
+                firstFlight.departureTime,
+                React__default["default"].createElement("br", null), firstFlight === null || firstFlight === void 0 ? void 0 :
+                firstFlight.airlineCode, firstFlight === null || firstFlight === void 0 ? void 0 :
+                firstFlight.number)),
         React__default["default"].createElement("div", { className: "pricing-summary__row" },
             React__default["default"].createElement("div", { className: "pricing-summary__property" }, translations.SIDEBAR.FLIGHT_ARRIVAL),
             React__default["default"].createElement("div", { className: "pricing-summary__value pricing-summary__value--flight" }, lastFlight === null || lastFlight === void 0 ? void 0 :
@@ -13630,7 +13655,10 @@ var SidebarFlight = function (_a) {
                 React__default["default"].createElement("br", null),
                 getDateText(lastFlight === null || lastFlight === void 0 ? void 0 : lastFlight.arrivalDate),
                 " ", lastFlight === null || lastFlight === void 0 ? void 0 :
-                lastFlight.arrivalTime)),
+                lastFlight.arrivalTime,
+                React__default["default"].createElement("br", null), lastFlight === null || lastFlight === void 0 ? void 0 :
+                lastFlight.airlineCode, lastFlight === null || lastFlight === void 0 ? void 0 :
+                lastFlight.number)),
         React__default["default"].createElement("div", { className: "pricing-summary__row" },
             React__default["default"].createElement("div", { className: "pricing-summary__property" }, flightMetaData.flightLines.length > 1 && (React__default["default"].createElement("i", null,
                 flightMetaData.flightLines.length - 1,
@@ -13873,10 +13901,10 @@ var SummaryBookingOptionUnit = function (_a) {
 
 var SummaryFlight = function (_a) {
     var _b;
-    var flight = _a.flight, header = _a.header;
+    var flightMetaData = _a.flightMetaData, header = _a.header;
     var translations = reactRedux.useSelector(selectTranslations);
     return (React__default["default"].createElement("li", null,
-        React__default["default"].createElement("h6", null, header), (_b = parseFlightLines(flight.flightMetaData)) === null || _b === void 0 ? void 0 :
+        React__default["default"].createElement("h6", null, header), (_b = parseFlightLines(flightMetaData)) === null || _b === void 0 ? void 0 :
         _b.map(function (flightLine) { return (React__default["default"].createElement("p", { key: flightLine.departureAirportIata },
             flightLine.departureAirportDescription,
             " (",
@@ -13889,6 +13917,10 @@ var SummaryFlight = function (_a) {
             ") ",
             " - ",
             flightLine.travelClass,
+            " ",
+            " - ",
+            flightLine.airlineCode,
+            flightLine.number,
             React__default["default"].createElement("br", null),
             getDateText(flightLine.departureDate),
             " ",
@@ -13900,7 +13932,7 @@ var SummaryFlight = function (_a) {
             flightLine.arrivalTime,
             React__default["default"].createElement("br", null),
             flightLine.airlineDescription)); }),
-        flight.flightMetaData.luggageIncluded && (React__default["default"].createElement("p", null, translations.SIDEBAR.LUGGAGE_INCLUDED))));
+        flightMetaData.luggageIncluded && (React__default["default"].createElement("p", null, translations.SIDEBAR.LUGGAGE_INCLUDED))));
 };
 
 var SummaryPerBookingOptionGroup = function (_a) {
@@ -13937,13 +13969,13 @@ var SummaryPerBookingOptionGroup = function (_a) {
 };
 
 var Summary = function () {
-    var _a, _b;
+    var _a, _b, _c, _d, _e, _f;
     var dispatch = useAppDispatch();
     var settings = React.useContext(SettingsContext);
-    var _c = React.useState(false), isSubmitting = _c[0], setIsSubmitting = _c[1];
-    var _d = React.useState((_a = settings.summary) === null || _a === void 0 ? void 0 : _a.checkboxes), checkboxes = _d[0], setCheckboxes = _d[1];
-    var _e = React.useState(""), remarks = _e[0], setRemarks = _e[1];
-    var _f = React.useState({}), voucher = _f[0], setVoucher = _f[1];
+    var _g = React.useState(false), isSubmitting = _g[0], setIsSubmitting = _g[1];
+    var _h = React.useState((_a = settings.summary) === null || _a === void 0 ? void 0 : _a.checkboxes), checkboxes = _h[0], setCheckboxes = _h[1];
+    var _j = React.useState(""), remarks = _j[0], setRemarks = _j[1];
+    var _k = React.useState({}), voucher = _k[0], setVoucher = _k[1];
     var bookingQueryString = reactRedux.useSelector(selectBookingQueryString);
     var travelerFormValues = reactRedux.useSelector(selectTravelersFormValues);
     var packageDetails = reactRedux.useSelector(selectPackageDetails);
@@ -13952,6 +13984,10 @@ var Summary = function () {
     var languageCode = reactRedux.useSelector(selectLanguageCode);
     var officeId = reactRedux.useSelector(selectOfficeId);
     var agentId = reactRedux.useSelector(selectAgentAdressId);
+    var departureFlight = reactRedux.useSelector(selectDepartureFlight);
+    var departureFlightMetaData = (_b = departureFlight === null || departureFlight === void 0 ? void 0 : departureFlight.flightMetaData) !== null && _b !== void 0 ? _b : (_c = reactRedux.useSelector(selectRoomOptionDepartureFlightsMetaData)) === null || _c === void 0 ? void 0 : _c[0];
+    var returnFlight = reactRedux.useSelector(selectReturnFlight);
+    var returnFlightMetaData = (_d = returnFlight === null || returnFlight === void 0 ? void 0 : returnFlight.flightMetaData) !== null && _d !== void 0 ? _d : (_e = reactRedux.useSelector(selectRoomOptionReturnFlightsMetaData)) === null || _e === void 0 ? void 0 : _e[0];
     if (!travelerFormValues) {
         if (settings.skipRouter) {
             dispatch(setCurrentStep(TRAVELERS_FORM_STEP));
@@ -14152,13 +14188,14 @@ var Summary = function () {
                                             translations.SUMMARY.MAIN_BOOKER,
                                             ")"))),
                                     React__default["default"].createElement("li", { className: "list__item" }, traveler.birthDate.split("-").reverse().join("/")),
-                                    isMainBooker && (travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.street) && (React__default["default"].createElement(React__default["default"].Fragment, null,
-                                        React__default["default"].createElement("li", { className: "list__item" }, "".concat(travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.street, " ").concat(lodash.compact([
-                                            travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.houseNumber,
-                                            travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.box,
-                                        ]).join(" "), ", ").concat(travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.zipCode, " ").concat(travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.place)),
-                                        React__default["default"].createElement("li", { className: "list__item" }, travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.phone),
-                                        React__default["default"].createElement("li", { className: "list__item" }, travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.email))))));
+                                    isMainBooker && (React__default["default"].createElement(React__default["default"].Fragment, null,
+                                        (travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.street) && (React__default["default"].createElement(React__default["default"].Fragment, null,
+                                            React__default["default"].createElement("li", { className: "list__item" }, "".concat(travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.street, " ").concat(lodash.compact([
+                                                travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.houseNumber,
+                                                travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.box,
+                                            ]).join(" "), ", ").concat(travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.zipCode, " ").concat(travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.place)))),
+                                        (travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.phone) && (React__default["default"].createElement("li", { className: "list__item" }, travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.phone)),
+                                        (travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.email) && (React__default["default"].createElement("li", { className: "list__item" }, travelerFormValues === null || travelerFormValues === void 0 ? void 0 : travelerFormValues.email)))))));
                         }))); })),
                 React__default["default"].createElement("div", { className: "form__region" },
                     React__default["default"].createElement("div", { className: "form__row" },
@@ -14167,41 +14204,45 @@ var Summary = function () {
                                 React__default["default"].createElement("h5", { className: "form__region-heading" }, translations.SUMMARY.OPTIONS)))),
                     React__default["default"].createElement("div", { className: "form__row" },
                         React__default["default"].createElement("div", { className: "form__group" },
-                            React__default["default"].createElement("ul", { className: "list list--booking-summary" }, activeOption === null || activeOption === void 0 ? void 0 : activeOption.rooms.flatMap(function (r) { return r.options; }).filter(function (x) { return x.isSelected; }).map(function (roomOption, roomOptionIndex) { return (React__default["default"].createElement(React__default["default"].Fragment, null,
-                                React__default["default"].createElement("li", { key: roomOptionIndex },
-                                    React__default["default"].createElement("h6", null, roomOption === null || roomOption === void 0 ? void 0 : roomOption.productName),
-                                    React__default["default"].createElement("ul", null,
-                                        React__default["default"].createElement("li", { className: "list__item" }, roomOption === null || roomOption === void 0 ? void 0 :
-                                            roomOption.accommodationName,
-                                            !lodash.isNil(roomOption === null || roomOption === void 0 ? void 0 : roomOption.regimeName) && ", ", roomOption === null || roomOption === void 0 ? void 0 :
-                                            roomOption.regimeName)),
-                                    React__default["default"].createElement("p", null,
-                                        "(",
-                                        (roomOption === null || roomOption === void 0 ? void 0 : roomOption.from) === (roomOption === null || roomOption === void 0 ? void 0 : roomOption.to)
-                                            ? getDateText(roomOption === null || roomOption === void 0 ? void 0 : roomOption.from)
-                                            : React__default["default"].createElement(React__default["default"].Fragment, null,
-                                                getDateText(roomOption === null || roomOption === void 0 ? void 0 : roomOption.from),
-                                                " > ",
-                                                getDateText(roomOption === null || roomOption === void 0 ? void 0 : roomOption.to)),
-                                        ")")),
-                                !lodash.isEmpty(activeOption === null || activeOption === void 0 ? void 0 : activeOption.groups) &&
-                                    (activeOption === null || activeOption === void 0 ? void 0 : activeOption.groups.map(function (x, i) {
-                                        if (!x.options.some(function (y) { return y.isSelected; }))
-                                            return;
-                                        return React__default["default"].createElement(SummaryPerBookingOptionGroup, { key: i, group: x });
-                                    })),
-                                !lodash.isEmpty(activeOption === null || activeOption === void 0 ? void 0 : activeOption.optionUnits) &&
-                                    (activeOption === null || activeOption === void 0 ? void 0 : activeOption.optionUnits.map(function (x, i) { return (React__default["default"].createElement(SummaryBookingOptionUnit, { key: i, unit: x })); })),
-                                !lodash.isEmpty(activeOption === null || activeOption === void 0 ? void 0 : activeOption.optionPax) &&
-                                    (activeOption === null || activeOption === void 0 ? void 0 : activeOption.optionPax.map(function (x, i) { return (React__default["default"].createElement(SummaryBookingOptionPax, { key: i, pax: x })); })),
-                                (packageDetails === null || packageDetails === void 0 ? void 0 : packageDetails.outwardFlights) &&
-                                    packageDetails.outwardFlights
-                                        .filter(function (x) { return x.isSelected; })
-                                        .map(function (flight, i) { return (React__default["default"].createElement(SummaryFlight, { key: i, flight: flight, header: translations.SIDEBAR.DEPARTURE_FLIGHT })); }),
-                                (packageDetails === null || packageDetails === void 0 ? void 0 : packageDetails.returnFlights) &&
-                                    packageDetails.returnFlights
-                                        .filter(function (x) { return x.isSelected; })
-                                        .map(function (flight, i) { return (React__default["default"].createElement(SummaryFlight, { key: i, flight: flight, header: translations.SIDEBAR.ARRIVAL_FLIGHT })); }))); }))))),
+                            React__default["default"].createElement("ul", { className: "list list--booking-summary" }, (activeOption === null || activeOption === void 0 ? void 0 : activeOption.serviceType) == build.ServiceType.flight && departureFlightMetaData && returnFlightMetaData
+                                ? React__default["default"].createElement(React__default["default"].Fragment, null,
+                                    React__default["default"].createElement(SummaryFlight, { flightMetaData: departureFlightMetaData, header: translations.SIDEBAR.DEPARTURE_FLIGHT }),
+                                    React__default["default"].createElement(SummaryFlight, { flightMetaData: returnFlightMetaData, header: translations.SIDEBAR.ARRIVAL_FLIGHT }))
+                                : React__default["default"].createElement(React__default["default"].Fragment, null, activeOption === null || activeOption === void 0 ? void 0 : activeOption.rooms.flatMap(function (r) { return r.options; }).filter(function (x) { return x.isSelected; }).map(function (roomOption, roomOptionIndex) { return (React__default["default"].createElement(React__default["default"].Fragment, { key: roomOptionIndex },
+                                    React__default["default"].createElement("li", null,
+                                        React__default["default"].createElement("h6", null, roomOption === null || roomOption === void 0 ? void 0 : roomOption.productName),
+                                        React__default["default"].createElement("ul", null,
+                                            React__default["default"].createElement("li", { className: "list__item" }, roomOption === null || roomOption === void 0 ? void 0 :
+                                                roomOption.accommodationName,
+                                                !lodash.isNil(roomOption === null || roomOption === void 0 ? void 0 : roomOption.regimeName) && ", ", roomOption === null || roomOption === void 0 ? void 0 :
+                                                roomOption.regimeName)),
+                                        React__default["default"].createElement("p", null,
+                                            "(",
+                                            (roomOption === null || roomOption === void 0 ? void 0 : roomOption.from) === (roomOption === null || roomOption === void 0 ? void 0 : roomOption.to)
+                                                ? getDateText(roomOption === null || roomOption === void 0 ? void 0 : roomOption.from)
+                                                : React__default["default"].createElement(React__default["default"].Fragment, null,
+                                                    getDateText(roomOption === null || roomOption === void 0 ? void 0 : roomOption.from),
+                                                    " > ",
+                                                    getDateText(roomOption === null || roomOption === void 0 ? void 0 : roomOption.to)),
+                                            ")")),
+                                    !lodash.isEmpty(activeOption === null || activeOption === void 0 ? void 0 : activeOption.groups) &&
+                                        (activeOption === null || activeOption === void 0 ? void 0 : activeOption.groups.map(function (x, i) {
+                                            if (!x.options.some(function (y) { return y.isSelected; }))
+                                                return;
+                                            return React__default["default"].createElement(SummaryPerBookingOptionGroup, { key: i, group: x });
+                                        })),
+                                    !lodash.isEmpty(activeOption === null || activeOption === void 0 ? void 0 : activeOption.optionUnits) &&
+                                        (activeOption === null || activeOption === void 0 ? void 0 : activeOption.optionUnits.map(function (x, i) { return (React__default["default"].createElement(SummaryBookingOptionUnit, { key: i, unit: x })); })),
+                                    !lodash.isEmpty(activeOption === null || activeOption === void 0 ? void 0 : activeOption.optionPax) &&
+                                        (activeOption === null || activeOption === void 0 ? void 0 : activeOption.optionPax.map(function (x, i) { return (React__default["default"].createElement(SummaryBookingOptionPax, { key: i, pax: x })); })),
+                                    (packageDetails === null || packageDetails === void 0 ? void 0 : packageDetails.outwardFlights) &&
+                                        packageDetails.outwardFlights
+                                            .filter(function (x) { return x.isSelected; })
+                                            .map(function (flight, i) { return (React__default["default"].createElement(SummaryFlight, { key: i, flightMetaData: flight.flightMetaData, header: translations.SIDEBAR.DEPARTURE_FLIGHT })); }),
+                                    (packageDetails === null || packageDetails === void 0 ? void 0 : packageDetails.returnFlights) &&
+                                        packageDetails.returnFlights
+                                            .filter(function (x) { return x.isSelected; })
+                                            .map(function (flight, i) { return (React__default["default"].createElement(SummaryFlight, { key: i, flightMetaData: flight.flightMetaData, header: translations.SIDEBAR.ARRIVAL_FLIGHT })); }))); })))))),
                 settings.enableVoucher && (React__default["default"].createElement("div", { className: "form__region" },
                     React__default["default"].createElement("div", { className: "form__row" },
                         React__default["default"].createElement("div", { className: "form__group" },
@@ -14222,7 +14263,7 @@ var Summary = function () {
                             !voucher.isValid && voucher.isValidated && (React__default["default"].createElement("div", { className: "info-message--error" }, translations.SUMMARY.VOUCHER_INVALID)))),
                     React__default["default"].createElement("div", { className: "form__row" },
                         React__default["default"].createElement("ul", { className: "info-message__voucher" }, !lodash.isEmpty(bookRequest === null || bookRequest === void 0 ? void 0 : bookRequest.payload.voucherCodes) &&
-                            ((_b = bookRequest === null || bookRequest === void 0 ? void 0 : bookRequest.payload.voucherCodes) === null || _b === void 0 ? void 0 : _b.map(function (y, i) { return (React__default["default"].createElement("li", { key: i },
+                            ((_f = bookRequest === null || bookRequest === void 0 ? void 0 : bookRequest.payload.voucherCodes) === null || _f === void 0 ? void 0 : _f.map(function (y, i) { return (React__default["default"].createElement("li", { key: i },
                                 React__default["default"].createElement("div", { className: "info-message__voucher__list" },
                                     y,
                                     " ",
@@ -14375,80 +14416,69 @@ function getAge(birthDateText, startDateText) {
     }
     return age;
 }
-var validateForm = function (values, agentRequired, bookingType, translations) {
+var validateForm = function (values, agentRequired, bookingType, translations, formFields, mainBookerFormFields) {
     var errors = {};
+    var isFormFieldPresent = function (type) {
+        var _a;
+        return (_a = formFields === null || formFields === void 0 ? void 0 : formFields.some(function (f) { return f.type === type; })) !== null && _a !== void 0 ? _a : true;
+    };
+    var isMainBookerFormFieldPresent = function (type) {
+        var _a;
+        return (_a = mainBookerFormFields === null || mainBookerFormFields === void 0 ? void 0 : mainBookerFormFields.some(function (f) { return f.type === type; })) !== null && _a !== void 0 ? _a : true;
+    };
+    var formatTravelerField = function (room, pax, field) {
+        return values.rooms.length > 1 ? format(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_FIELD, [room, pax, field]) : format(translations.TRAVELERS_FORM.VALIDATION.SINGLE_ROOM_TRAVELER_X_FIELD, [pax, field]);
+    };
+    var formatTravelerIsNoAdult = function (room, pax) {
+        return values.rooms.length > 1 ? format(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_IS_NO_ADULT, [room, pax]) : format(translations.TRAVELERS_FORM.VALIDATION.SINGLE_ROOM_TRAVELER_X_IS_NO_ADULT, [pax]);
+    };
+    var formatTravelerIsNoChild = function (room, pax) {
+        return values.rooms.length > 1 ? format(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_IS_NO_CHILD, [room, pax]) : format(translations.TRAVELERS_FORM.VALIDATION.SINGLE_ROOM_TRAVELER_X_IS_NO_CHILD, [pax]);
+    };
     values.rooms.forEach(function (r, rIndex) {
         return r.adults.forEach(function (adult, index) {
-            if (lodash.isEmpty(adult.gender)) {
-                lodash.set(errors, "rooms[".concat(rIndex, "].adults[").concat(index, "].gender"), format(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_FIELD, [
-                    rIndex + 1,
-                    index + 1,
-                    translations.TRAVELERS_FORM.GENDER,
-                ]));
-            }
-            if (lodash.isEmpty(adult.firstName)) {
-                lodash.set(errors, "rooms[".concat(rIndex, "].adults[").concat(index, "].firstName"), format(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_FIELD, [
-                    rIndex + 1,
-                    index + 1,
-                    translations.TRAVELERS_FORM.FIRST_NAME,
-                ]));
+            if (lodash.isEmpty(adult.gender) && isFormFieldPresent("gender")) {
+                lodash.set(errors, "rooms[".concat(rIndex, "].adults[").concat(index, "].gender"), formatTravelerField(rIndex + 1, index + 1, translations.TRAVELERS_FORM.GENDER));
             }
-            if (lodash.isEmpty(adult.lastName)) {
-                lodash.set(errors, "rooms[".concat(rIndex, "].adults[").concat(index, "].lastName"), format(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_FIELD, [
-                    rIndex + 1,
-                    index + 1,
-                    translations.TRAVELERS_FORM.LAST_NAME,
-                ]));
+            if (lodash.isEmpty(adult.firstName) && isFormFieldPresent("firstName")) {
+                lodash.set(errors, "rooms[".concat(rIndex, "].adults[").concat(index, "].firstName"), formatTravelerField(rIndex + 1, index + 1, translations.TRAVELERS_FORM.FIRST_NAME));
             }
-            if (lodash.isEmpty(adult.birthDate)) {
-                lodash.set(errors, "rooms[".concat(rIndex, "].adults[").concat(index, "].birthDate"), format(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_FIELD, [
-                    rIndex + 1,
-                    index + 1,
-                    translations.TRAVELERS_FORM.BIRTHDATE,
-                ]));
+            if (lodash.isEmpty(adult.lastName) && isFormFieldPresent("lastName")) {
+                lodash.set(errors, "rooms[".concat(rIndex, "].adults[").concat(index, "].lastName"), formatTravelerField(rIndex + 1, index + 1, translations.TRAVELERS_FORM.LAST_NAME));
             }
-            else if (values.startDate) {
-                var age = getAge(adult.birthDate, values.startDate);
-                if (age <= CHILD_MAX_AGE) {
-                    lodash.set(errors, "rooms[".concat(rIndex, "].adults[").concat(index, "].birthDate"), format(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_IS_NO_ADULT, [rIndex + 1, index + 1]));
+            if (isFormFieldPresent("birthDate")) {
+                if (lodash.isEmpty(adult.birthDate)) {
+                    lodash.set(errors, "rooms[".concat(rIndex, "].adults[").concat(index, "].birthDate"), formatTravelerField(rIndex + 1, index + 1, translations.TRAVELERS_FORM.BIRTHDATE));
+                }
+                else if (values.startDate) {
+                    var age = getAge(adult.birthDate, values.startDate);
+                    if (age <= CHILD_MAX_AGE) {
+                        lodash.set(errors, "rooms[".concat(rIndex, "].adults[").concat(index, "].birthDate"), formatTravelerIsNoAdult(rIndex + 1, index + 1));
+                    }
                 }
             }
         });
     });
     values.rooms.forEach(function (r, rIndex) {
         return r.children.forEach(function (child, index) {
-            if (lodash.isEmpty(child.gender)) {
-                lodash.set(errors, "rooms[".concat(rIndex, "].children[").concat(index, "].gender"), format(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_FIELD, [
-                    rIndex + 1,
-                    r.adults.length + index + 1,
-                    translations.TRAVELERS_FORM.GENDER,
-                ]));
-            }
-            if (lodash.isEmpty(child.firstName)) {
-                lodash.set(errors, "children[".concat(index, "].firstName"), format(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_FIELD, [
-                    rIndex + 1,
-                    r.adults.length + index + 1,
-                    translations.TRAVELERS_FORM.FIRST_NAME,
-                ]));
+            if (lodash.isEmpty(child.gender) && isFormFieldPresent("gender")) {
+                lodash.set(errors, "rooms[".concat(rIndex, "].children[").concat(index, "].gender"), formatTravelerField(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.GENDER));
             }
-            if (lodash.isEmpty(child.lastName)) {
-                lodash.set(errors, "rooms[".concat(rIndex, "].children[").concat(index, "].lastName"), format(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_FIELD, [
-                    rIndex + 1,
-                    r.adults.length + index + 1,
-                    translations.TRAVELERS_FORM.LAST_NAME,
-                ]));
+            if (lodash.isEmpty(child.firstName) && isFormFieldPresent("firstName")) {
+                lodash.set(errors, "children[".concat(index, "].firstName"), formatTravelerField(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.FIRST_NAME));
             }
-            if (lodash.isEmpty(child.birthDate)) {
-                lodash.set(errors, "rooms[".concat(rIndex, "].children[").concat(index, "].birthDate"), format(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_FIELD, [
-                    rIndex + 1,
-                    r.adults.length + index + 1,
-                    translations.TRAVELERS_FORM.BIRTHDATE,
-                ]));
+            if (lodash.isEmpty(child.lastName) && isFormFieldPresent("lastName")) {
+                lodash.set(errors, "rooms[".concat(rIndex, "].children[").concat(index, "].lastName"), formatTravelerField(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.LAST_NAME));
             }
-            else if (values.startDate) {
-                var age = getAge(child.birthDate, values.startDate);
-                if (age > CHILD_MAX_AGE) {
-                    lodash.set(errors, "rooms[".concat(rIndex, "].children[").concat(index, "].birthDate"), format(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_IS_NO_CHILD, [rIndex + 1, r.adults.length + index + 1]));
+            if (isFormFieldPresent("birthDate")) {
+                if (lodash.isEmpty(child.birthDate)) {
+                    lodash.set(errors, "rooms[".concat(rIndex, "].children[").concat(index, "].birthDate"), formatTravelerField(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.BIRTHDATE));
+                }
+                else if (values.startDate) {
+                    var age = getAge(child.birthDate, values.startDate);
+                    if (age > CHILD_MAX_AGE) {
+                        lodash.set(errors, "rooms[".concat(rIndex, "].children[").concat(index, "].birthDate"), formatTravelerIsNoChild(rIndex + 1, r.adults.length + index + 1));
+                    }
                 }
             }
         });
@@ -14457,37 +14487,39 @@ var validateForm = function (values, agentRequired, bookingType, translations) {
         errors.mainBookerId =
             translations.TRAVELERS_FORM.VALIDATION.NO_MAIN_BOOKER_SELECTED;
     }
-    if (bookingType != "b2b") {
-        if (lodash.isEmpty(values.street)) {
+    if (bookingType != "b2b" || (mainBookerFormFields === null || mainBookerFormFields === void 0 ? void 0 : mainBookerFormFields.length)) {
+        if (lodash.isEmpty(values.street) && isMainBookerFormFieldPresent("street")) {
             errors.street = format(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.STREET]);
         }
-        if (lodash.isEmpty(values.houseNumber)) {
+        if (lodash.isEmpty(values.houseNumber) && isMainBookerFormFieldPresent("houseNumber")) {
             errors.houseNumber = format(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.HOUSE_NUMBER]);
         }
-        if (lodash.isEmpty(values.zipCode)) {
+        if (lodash.isEmpty(values.zipCode) && isMainBookerFormFieldPresent("zipCode")) {
             errors.zipCode = format(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.ZIPCODE]);
         }
-        if (lodash.isEmpty(values.place)) {
+        if (lodash.isEmpty(values.place) && isMainBookerFormFieldPresent("place")) {
             errors.place = format(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.CITY]);
         }
-        if (lodash.isEmpty(values.email)) {
-            errors.email = format(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.EMAIL]);
-        }
-        else if (isValidEmail(values.email)) {
-            errors.email =
-                translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_EMAIL_IS_INVALID;
-        }
-        if (lodash.isEmpty(values.emailConfirmation)) {
-            errors.emailConfirmation = format(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.REPEAT_EMAIL]);
-        }
-        else if (values.emailConfirmation !== values.email) {
-            errors.emailConfirmation =
-                translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_EMAIL_DOES_NOT_MATCH;
+        if (isMainBookerFormFieldPresent("email")) {
+            if (lodash.isEmpty(values.email)) {
+                errors.email = format(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.EMAIL]);
+            }
+            else if (isValidEmail(values.email)) {
+                errors.email =
+                    translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_EMAIL_IS_INVALID;
+            }
+            if (lodash.isEmpty(values.emailConfirmation)) {
+                errors.emailConfirmation = format(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.REPEAT_EMAIL]);
+            }
+            else if (values.emailConfirmation !== values.email) {
+                errors.emailConfirmation =
+                    translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_EMAIL_DOES_NOT_MATCH;
+            }
         }
-        if (lodash.isEmpty(values.country)) {
+        if (lodash.isEmpty(values.country) && isMainBookerFormFieldPresent("country")) {
             errors.country = format(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.COUNTRY]);
         }
-        if (lodash.isEmpty(values.phone)) {
+        if (lodash.isEmpty(values.phone) && isMainBookerFormFieldPresent("phone")) {
             errors.phone = format(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.PHONE]);
         }
     }
@@ -14503,6 +14535,116 @@ var validateForm = function (values, agentRequired, bookingType, translations) {
     return errors;
 };
 
+var hasVisibleError = function (formik, key) {
+    return lodash.get(formik.errors, key) && lodash.get(formik.touched, key);
+};
+
+var GenderControl = function (_a) {
+    var translations = _a.translations, value = _a.value, formik = _a.formik, name = _a.name;
+    return (React__default["default"].createElement("div", { className: buildClassName([
+            "form__group",
+            hasVisibleError(formik, name) && "form__group--error",
+        ]) },
+        React__default["default"].createElement("label", { className: "form__label" },
+            translations.TRAVELERS_FORM.GENDER,
+            " *"),
+        React__default["default"].createElement("div", { className: "radiobutton-group" },
+            React__default["default"].createElement("div", { className: "radiobutton" },
+                React__default["default"].createElement("label", { className: "radiobutton__label" },
+                    React__default["default"].createElement("input", { type: "radio", className: "radiobutton__input", name: name, onChange: formik.handleChange, onBlur: formik.handleBlur, value: "m", checked: value.gender === "m" }),
+                    translations.TRAVELERS_FORM.MALE)),
+            React__default["default"].createElement("div", { className: "radiobutton" },
+                React__default["default"].createElement("label", { className: "radiobutton__label" },
+                    React__default["default"].createElement("input", { type: "radio", className: "radiobutton__input", name: name, onChange: formik.handleChange, onBlur: formik.handleBlur, value: "f", checked: value.gender === "f" }),
+                    translations.TRAVELERS_FORM.FEMALE)),
+            React__default["default"].createElement("div", { className: "radiobutton" },
+                React__default["default"].createElement("label", { className: "radiobutton__label" },
+                    React__default["default"].createElement("input", { type: "radio", className: "radiobutton__input", name: name, onChange: formik.handleChange, onBlur: formik.handleBlur, value: "x", checked: value.gender === "x" }),
+                    translations.TRAVELERS_FORM.OTHER)))));
+};
+
+var normalize = function (v) { return (v == null ? "" : String(v)); };
+var parseCombined = function (raw, countries) {
+    var value = normalize(raw).trim();
+    if (!value)
+        return { prefix: "", number: "" };
+    // Try to match a known prefix at the start. Prefer longest match.
+    var sorted = __spreadArray([], countries, true).sort(function (a, b) { return b.phonePrefix.length - a.phonePrefix.length; });
+    var hit = sorted.find(function (c) { return value.startsWith(c.phonePrefix); });
+    if (hit) {
+        var rest = value
+            .slice(hit.phonePrefix.length)
+            .trim()
+            .replace(/^[-\s]+/, "");
+        return { prefix: hit.phonePrefix, number: rest };
+    }
+    // Fallback: split on first space if it looks like a +prefix number
+    var m = value.match(/^(\+\d{1,4})[\s-]*(.*)$/);
+    if (m)
+        return { prefix: m[1], number: m[2] };
+    return { prefix: "", number: value };
+};
+var PhoneInput = function (_a) {
+    var name = _a.name, required = _a.required, value = _a.value, label = _a.label, placeholder = _a.placeholder, extraClassName = _a.extraClassName, hasError = _a.hasError, countries = _a.countries, countryIso2 = _a.countryIso2, onChange = _a.onChange, onBlur = _a.onBlur;
+    // Derive initial state from `value`
+    var initialCountry = countries.find(function (c) { return c.iso2 === countryIso2; });
+    var initial = React.useMemo(function () { return parseCombined(normalize(value), countries); }, [value, countries]);
+    var _b = React.useState(initial.prefix), prefix = _b[0], setPrefix = _b[1];
+    var _c = React.useState(initial.number), number = _c[0], setNumber = _c[1];
+    // Keep state in sync if the parent changes `value`
+    React.useEffect(function () {
+        var parsed = !prefix && !number && initialCountry
+            ? { prefix: initialCountry.phonePrefix, number: "" }
+            : parseCombined(normalize(value), countries);
+        if (parsed.prefix)
+            setPrefix(parsed.prefix);
+        if (parsed.number)
+            setNumber(parsed.number);
+    }, [value, countries, countryIso2]);
+    var emitCombinedChange = function (e, nextPrefix, nextNumber) {
+        // Combine with a space, unless the number already starts with a dash or space
+        var combined = nextPrefix && nextNumber
+            ? lodash.compact([nextPrefix, nextNumber]).join(" ")
+            : null;
+        onChange === null || onChange === void 0 ? void 0 : onChange(__assign(__assign({}, e), { type: "change", target: { name: name, value: combined }, currentTarget: { name: name, value: combined } }));
+    };
+    var handleCountryBlur = function (e) {
+        onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
+    };
+    var onCountryChange = function (e) {
+        var next = e.target.value;
+        setPrefix(next);
+        emitCombinedChange(e, next, number);
+    };
+    var onPhoneChange = function (e) {
+        var cleaned = e.target.value.replace(/[^\d\s-]/g, "");
+        setNumber(cleaned);
+        emitCombinedChange(e, prefix, cleaned);
+    };
+    var handleNumberBlur = function (e) {
+        onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
+    };
+    // Ensure the select shows a reasonable default when prefix is empty
+    var selectValue = prefix || "";
+    return (React__default["default"].createElement("label", { className: buildClassName([
+            "form__group",
+            extraClassName,
+            hasError && "form__group--error",
+        ]) },
+        label && (React__default["default"].createElement("span", { className: "form__label" }, lodash.compact([label, required && "*"]).join(" "))),
+        React__default["default"].createElement("div", { className: "phone-input" },
+            React__default["default"].createElement("div", { className: "dropdown" },
+                React__default["default"].createElement("select", { "aria-label": label ? "".concat(label, " \u2013 country code") : "Country calling code", name: "".concat(name, "__country"), value: selectValue, onBlur: handleCountryBlur, onChange: onCountryChange },
+                    React__default["default"].createElement("option", { value: "", disabled: true }), countries === null || countries === void 0 ? void 0 :
+                    countries.map(function (option) { return (React__default["default"].createElement("option", { key: option.iso2, value: option.phonePrefix },
+                        option.name,
+                        " (",
+                        option.phonePrefix,
+                        ")")); }))),
+            React__default["default"].createElement("input", { "aria-label": label ? "".concat(label, " \u2013 number") : "Phone number", name: "".concat(name, "__number"), type: "tel", inputMode: "tel", required: required, className: "form__input", placeholder: placeholder, onChange: onPhoneChange, onBlur: handleNumberBlur, value: number }),
+            React__default["default"].createElement("input", { type: "hidden", name: name, value: lodash.compact([prefix, number]).join(" ") }))));
+};
+
 function createTraveler(traveler, followNumber, personTranslation, isCompact) {
     if (isCompact) {
         return { id: traveler.id, firstName: personTranslation, lastName: "".concat(followNumber.number++), birthDate: "", gender: "", age: traveler.age || 30 };
@@ -14541,7 +14683,7 @@ function createInitialValues(formRooms, startDate, agentAdressId, personTranslat
     return initialValues;
 }
 var TravelersForm = function () {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     var dispatch = useAppDispatch();
     var settings = React.useContext(SettingsContext);
     var bookingQueryString = reactRedux.useSelector(selectBookingQueryString);
@@ -14553,14 +14695,14 @@ var TravelersForm = function () {
     var translations = reactRedux.useSelector(selectTranslations);
     var useCompactForm = !!settings.travellers.compactForm && !!settings.agentAdressId;
     var initialValues = (_a = reactRedux.useSelector(selectTravelersFormValues)) !== null && _a !== void 0 ? _a : createInitialValues(formRooms, startDate, agentAdressId, translations.TRAVELERS_FORM.PERSON, useCompactForm);
-    var _e = React.useState((_b = settings.agentRequired) !== null && _b !== void 0 ? _b : false), showAgents = _e[0], setShowAgents = _e[1];
-    var _f = React.useState(!settings.agentAdressId && !settings.hideAgentSelection), showAgentSelection = _f[0], setShowAgentSelection = _f[1];
+    var _j = React.useState((_b = settings.agentRequired) !== null && _b !== void 0 ? _b : false), showAgents = _j[0], setShowAgents = _j[1];
+    var _k = React.useState(!settings.agentAdressId && !settings.hideAgentSelection), showAgentSelection = _k[0], setShowAgentSelection = _k[1];
     var typeaheadAgents = (_c = lodash.sortBy(agents === null || agents === void 0 ? void 0 : agents.map(function (x) { return ({
         key: "".concat(x.id),
         value: "".concat(x.name, " (").concat(x.postalCode, " ").concat(x.location, ")"),
         text: "".concat(x.name, " (").concat(x.postalCode, " ").concat(x.location, ")"),
     }); }), "value")) !== null && _c !== void 0 ? _c : [];
-    var _g = React.useState(typeaheadAgents), filteredAgents = _g[0], setFilteredAgents = _g[1];
+    var _l = React.useState(typeaheadAgents), filteredAgents = _l[0], setFilteredAgents = _l[1];
     var formik$1 = useCompactForm
         ? formik.useFormik({
             initialValues: initialValues,
@@ -14579,7 +14721,7 @@ var TravelersForm = function () {
         : formik.useFormik({
             initialValues: initialValues,
             validate: function (values) {
-                return validateForm(values, settings.agentRequired, bookingType, translations);
+                return validateForm(values, settings.agentRequired, bookingType, translations, settings.travellers.formFields, settings.travellers.mainBookerFormFields);
             },
             onSubmit: function (values) {
                 dispatch(setFormValues(values));
@@ -14651,6 +14793,34 @@ var TravelersForm = function () {
     var hasVisibleError = function (key) {
         return lodash.get(formik$1.errors, key) && lodash.get(formik$1.touched, key);
     };
+    var getControl = function (type, value, name) {
+        var _a, _b, _c, _d, _e;
+        switch (type) {
+            case "gender": {
+                return React__default["default"].createElement(GenderControl, { translations: translations, value: value, formik: formik$1, name: name });
+            }
+            case "firstName": {
+                return (React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError(name), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.FIRST_NAME, required: true, name: name, onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: value.firstName }));
+            }
+            case "lastName": {
+                return (React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError(name), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.LAST_NAME, required: true, name: name, onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: value.lastName }));
+            }
+            case "birthDate": {
+                return (React__default["default"].createElement(LabeledInput, { type: "date", hasError: hasVisibleError(name), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.BIRTHDATE, required: true, name: name, onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: value.birthDate }));
+            }
+            case "country": {
+                return (React__default["default"].createElement(LabeledSelect, { hasError: hasVisibleError("country"), label: translations.TRAVELERS_FORM.COUNTRY, required: true, name: "country", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.country, options: __spreadArray([{ key: "empty", value: undefined, label: translations.TRAVELERS_FORM.SELECT_COUNTRY }], (_c = (_b = (_a = settings.travellers) === null || _a === void 0 ? void 0 : _a.countries) === null || _b === void 0 ? void 0 : _b.map(function (country) { return ({ key: country.iso2, value: country.iso2, label: country.name }); })) !== null && _c !== void 0 ? _c : [], true) }));
+            }
+            case "phone": {
+                return (React__default["default"].createElement(PhoneInput, { countries: (_e = (_d = settings.travellers) === null || _d === void 0 ? void 0 : _d.countries) !== null && _e !== void 0 ? _e : [], countryIso2: formik$1.values.country, hasError: hasVisibleError("phone"), label: translations.TRAVELERS_FORM.PHONE, required: true, name: "phone", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.phone }));
+            }
+            case "email": {
+                return (React__default["default"].createElement(React__default["default"].Fragment, null,
+                    React__default["default"].createElement(LabeledInput, { type: "email", hasError: hasVisibleError("email"), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.EMAIL, required: true, name: "email", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.email }),
+                    React__default["default"].createElement(LabeledInput, { type: "email", hasError: hasVisibleError("emailConfirmation"), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.REPEAT_EMAIL, required: true, name: "emailConfirmation", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.emailConfirmation })));
+            }
+        }
+    };
     return (React__default["default"].createElement("form", { className: "form form__travelers", name: "booking--travellers", id: "booking--travellers", noValidate: true, onSubmit: formik$1.handleSubmit, onReset: formik$1.handleReset },
         useCompactForm
             ? (React__default["default"].createElement("div", { className: "form__travelers__wrapper" }, formik$1.values.rooms.map(function (room, rIndex) { return (React__default["default"].createElement("div", { key: rIndex },
@@ -14725,75 +14895,89 @@ var TravelersForm = function () {
                                     room.children.length > 1 &&
                                         " ".concat(translations.TRAVELERS_FORM.CHILDREN),
                                 ]).join("")))),
-                        room.adults.map(function (travelerValues, index) { return (React__default["default"].createElement("div", { className: "form__region", key: travelerValues.id },
-                            React__default["default"].createElement("div", { className: "form__region-header" },
-                                React__default["default"].createElement("h5", { className: "form__region-heading" },
-                                    translations.TRAVELERS_FORM.TRAVELER,
-                                    " ",
-                                    index + 1),
-                                React__default["default"].createElement("p", { className: "form__region-label" }, translations.TRAVELERS_FORM.ADULT),
-                                React__default["default"].createElement("div", { className: "radiobutton" },
-                                    React__default["default"].createElement("label", { className: "radiobutton__label" },
-                                        React__default["default"].createElement("input", { type: "radio", name: "mainBookerId", onChange: handleMainBookerChange, onBlur: formik$1.handleBlur, value: travelerValues.id, checked: formik$1.values.mainBookerId === travelerValues.id, className: "radiobutton__input" }),
-                                        translations.TRAVELERS_FORM.MAIN_BOOKER))),
-                            React__default["default"].createElement("div", { className: "form__row" },
-                                React__default["default"].createElement("div", { className: buildClassName([
-                                        "form__group",
-                                        hasVisibleError("rooms[".concat(rIndex, "].adults[").concat(index, "].gender")) && "form__group--error",
-                                    ]) },
-                                    React__default["default"].createElement("label", { className: "form__label" },
-                                        translations.TRAVELERS_FORM.GENDER,
-                                        " *"),
-                                    React__default["default"].createElement("div", { className: "radiobutton-group" },
-                                        React__default["default"].createElement("div", { className: "radiobutton" },
-                                            React__default["default"].createElement("label", { className: "radiobutton__label" },
-                                                React__default["default"].createElement("input", { type: "radio", className: "radiobutton__input", name: "rooms[".concat(rIndex, "].adults[").concat(index, "].gender"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: "m", checked: travelerValues.gender === "m" }),
-                                                translations.TRAVELERS_FORM.MALE)),
-                                        React__default["default"].createElement("div", { className: "radiobutton" },
-                                            React__default["default"].createElement("label", { className: "radiobutton__label" },
-                                                React__default["default"].createElement("input", { type: "radio", className: "radiobutton__input", name: "rooms[".concat(rIndex, "].adults[").concat(index, "].gender"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: "f", checked: travelerValues.gender === "f" }),
-                                                translations.TRAVELERS_FORM.FEMALE)),
-                                        React__default["default"].createElement("div", { className: "radiobutton" },
-                                            React__default["default"].createElement("label", { className: "radiobutton__label" },
-                                                React__default["default"].createElement("input", { type: "radio", className: "radiobutton__input", name: "rooms[".concat(rIndex, "].adults[").concat(index, "].gender"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: "x", checked: travelerValues.gender === "x" }),
-                                                translations.TRAVELERS_FORM.OTHER))))),
-                            React__default["default"].createElement("div", { className: "form__row" },
-                                React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("rooms[".concat(rIndex, "].adults[").concat(index, "].firstName")), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.FIRST_NAME, required: true, name: "rooms[".concat(rIndex, "].adults[").concat(index, "].firstName"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: travelerValues.firstName }),
-                                React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("rooms[".concat(rIndex, "].adults[").concat(index, "].lastName")), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.LAST_NAME, required: true, name: "rooms[".concat(rIndex, "].adults[").concat(index, "].lastName"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: travelerValues.lastName }),
-                                React__default["default"].createElement(LabeledInput, { type: "date", hasError: hasVisibleError("rooms[".concat(rIndex, "].adults[").concat(index, "].birthDate")), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.BIRTHDATE, required: true, name: "rooms[".concat(rIndex, "].adults[").concat(index, "].birthDate"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: travelerValues.birthDate })))); }),
-                        room.children.map(function (travelerValues, index) { return (React__default["default"].createElement("div", { className: "form__region", key: travelerValues.id },
-                            React__default["default"].createElement("div", { className: "form__region-header" },
-                                React__default["default"].createElement("h5", { className: "form__region-heading" },
-                                    translations.TRAVELERS_FORM.TRAVELER,
-                                    " ",
-                                    room.adults.length + index + 1),
-                                React__default["default"].createElement("p", { className: "form__region-label" }, translations.TRAVELERS_FORM.CHILD)),
-                            React__default["default"].createElement("div", { className: "form__row" },
-                                React__default["default"].createElement("div", { className: buildClassName([
-                                        "form__group",
-                                        hasVisibleError("rooms[".concat(rIndex, "].children[").concat(index, "].gender")) && "form__group--error",
-                                    ]) },
-                                    React__default["default"].createElement("label", { className: "form__label" },
-                                        translations.TRAVELERS_FORM.GENDER,
-                                        " *"),
-                                    React__default["default"].createElement("div", { className: "radiobutton-group" },
-                                        React__default["default"].createElement("div", { className: "radiobutton" },
-                                            React__default["default"].createElement("label", { className: "radiobutton__label" },
-                                                React__default["default"].createElement("input", { type: "radio", className: "radiobutton__input", name: "rooms[".concat(rIndex, "].children[").concat(index, "].gender"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: "m", checked: travelerValues.gender === "m" }),
-                                                translations.TRAVELERS_FORM.MALE)),
-                                        React__default["default"].createElement("div", { className: "radiobutton" },
-                                            React__default["default"].createElement("label", { className: "radiobutton__label" },
-                                                React__default["default"].createElement("input", { type: "radio", className: "radiobutton__input", name: "rooms[".concat(rIndex, "].children[").concat(index, "].gender"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: "f", checked: travelerValues.gender === "f" }),
-                                                translations.TRAVELERS_FORM.FEMALE)),
-                                        React__default["default"].createElement("div", { className: "radiobutton" },
-                                            React__default["default"].createElement("label", { className: "radiobutton__label" },
-                                                React__default["default"].createElement("input", { type: "radio", className: "radiobutton__input", name: "rooms[".concat(rIndex, "].children[").concat(index, "].gender"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: "x", checked: travelerValues.gender === "x" }),
-                                                translations.TRAVELERS_FORM.OTHER))))),
-                            React__default["default"].createElement("div", { className: "form__row" },
-                                React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("rooms[".concat(rIndex, "].children[").concat(index, "].firstName")), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.FIRST_NAME, required: true, name: "rooms[".concat(rIndex, "].children[").concat(index, "].firstName"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: travelerValues.firstName }),
-                                React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("rooms[".concat(rIndex, "].children[").concat(index, "].lastName")), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.LAST_NAME, required: true, name: "rooms[".concat(rIndex, "].children[").concat(index, "].lastName"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: travelerValues.lastName }),
-                                React__default["default"].createElement(LabeledInput, { type: "date", hasError: hasVisibleError("rooms[".concat(rIndex, "].children[").concat(index, "].birthDate")), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.BIRTHDATE, required: true, name: "rooms[".concat(rIndex, "].children[").concat(index, "].birthDate"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: travelerValues.birthDate })))); }))); }),
-                    bookingType != "b2b" ? (React__default["default"].createElement("div", { className: "form__region" },
+                        room.adults.map(function (travelerValues, index) {
+                            var _a;
+                            return (React__default["default"].createElement("div", { className: "form__region", key: travelerValues.id },
+                                React__default["default"].createElement("div", { className: "form__region-header" },
+                                    React__default["default"].createElement("h5", { className: "form__region-heading" },
+                                        translations.TRAVELERS_FORM.TRAVELER,
+                                        " ",
+                                        index + 1),
+                                    React__default["default"].createElement("p", { className: "form__region-label" }, translations.TRAVELERS_FORM.ADULT),
+                                    React__default["default"].createElement("div", { className: "radiobutton" },
+                                        React__default["default"].createElement("label", { className: "radiobutton__label" },
+                                            React__default["default"].createElement("input", { type: "radio", name: "mainBookerId", onChange: handleMainBookerChange, onBlur: formik$1.handleBlur, value: travelerValues.id, checked: formik$1.values.mainBookerId === travelerValues.id, className: "radiobutton__input" }),
+                                            translations.TRAVELERS_FORM.MAIN_BOOKER))),
+                                ((_a = settings.travellers.formFields) === null || _a === void 0 ? void 0 : _a.length)
+                                    ? React__default["default"].createElement(React__default["default"].Fragment, null,
+                                        React__default["default"].createElement("div", { className: "travelers-form__grid" }, settings.travellers.formFields.map(function (field, fIndex) { return React__default["default"].createElement("div", { key: fIndex, className: "control control--".concat(field.type) }, getControl(field.type, travelerValues, "rooms[".concat(rIndex, "].adults[").concat(index, "].").concat(field.type))); })))
+                                    : React__default["default"].createElement(React__default["default"].Fragment, null,
+                                        React__default["default"].createElement("div", { className: "form__row" },
+                                            React__default["default"].createElement("div", { className: buildClassName([
+                                                    "form__group",
+                                                    hasVisibleError("rooms[".concat(rIndex, "].adults[").concat(index, "].gender")) && "form__group--error",
+                                                ]) },
+                                                React__default["default"].createElement("label", { className: "form__label" },
+                                                    translations.TRAVELERS_FORM.GENDER,
+                                                    " *"),
+                                                React__default["default"].createElement("div", { className: "radiobutton-group" },
+                                                    React__default["default"].createElement("div", { className: "radiobutton" },
+                                                        React__default["default"].createElement("label", { className: "radiobutton__label" },
+                                                            React__default["default"].createElement("input", { type: "radio", className: "radiobutton__input", name: "rooms[".concat(rIndex, "].adults[").concat(index, "].gender"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: "m", checked: travelerValues.gender === "m" }),
+                                                            translations.TRAVELERS_FORM.MALE)),
+                                                    React__default["default"].createElement("div", { className: "radiobutton" },
+                                                        React__default["default"].createElement("label", { className: "radiobutton__label" },
+                                                            React__default["default"].createElement("input", { type: "radio", className: "radiobutton__input", name: "rooms[".concat(rIndex, "].adults[").concat(index, "].gender"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: "f", checked: travelerValues.gender === "f" }),
+                                                            translations.TRAVELERS_FORM.FEMALE)),
+                                                    React__default["default"].createElement("div", { className: "radiobutton" },
+                                                        React__default["default"].createElement("label", { className: "radiobutton__label" },
+                                                            React__default["default"].createElement("input", { type: "radio", className: "radiobutton__input", name: "rooms[".concat(rIndex, "].adults[").concat(index, "].gender"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: "x", checked: travelerValues.gender === "x" }),
+                                                            translations.TRAVELERS_FORM.OTHER))))),
+                                        React__default["default"].createElement("div", { className: "form__row" },
+                                            React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("rooms[".concat(rIndex, "].adults[").concat(index, "].firstName")), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.FIRST_NAME, required: true, name: "rooms[".concat(rIndex, "].adults[").concat(index, "].firstName"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: travelerValues.firstName }),
+                                            React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("rooms[".concat(rIndex, "].adults[").concat(index, "].lastName")), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.LAST_NAME, required: true, name: "rooms[".concat(rIndex, "].adults[").concat(index, "].lastName"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: travelerValues.lastName }),
+                                            React__default["default"].createElement(LabeledInput, { type: "date", hasError: hasVisibleError("rooms[".concat(rIndex, "].adults[").concat(index, "].birthDate")), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.BIRTHDATE, required: true, name: "rooms[".concat(rIndex, "].adults[").concat(index, "].birthDate"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: travelerValues.birthDate })))));
+                        }),
+                        room.children.map(function (travelerValues, index) {
+                            var _a;
+                            return (React__default["default"].createElement("div", { className: "form__region", key: travelerValues.id },
+                                React__default["default"].createElement("div", { className: "form__region-header" },
+                                    React__default["default"].createElement("h5", { className: "form__region-heading" },
+                                        translations.TRAVELERS_FORM.TRAVELER,
+                                        " ",
+                                        room.adults.length + index + 1),
+                                    React__default["default"].createElement("p", { className: "form__region-label" }, translations.TRAVELERS_FORM.CHILD)),
+                                ((_a = settings.travellers.formFields) === null || _a === void 0 ? void 0 : _a.length)
+                                    ? React__default["default"].createElement(React__default["default"].Fragment, null,
+                                        React__default["default"].createElement("div", { className: "travelers-form__grid" }, settings.travellers.formFields.map(function (field, fIndex) { return React__default["default"].createElement("div", { key: fIndex, className: "control control--".concat(field.type) }, getControl(field.type, travelerValues, "rooms[".concat(rIndex, "].children[").concat(index, "].").concat(field.type))); })))
+                                    : React__default["default"].createElement(React__default["default"].Fragment, null,
+                                        React__default["default"].createElement("div", { className: "form__row" },
+                                            React__default["default"].createElement("div", { className: buildClassName([
+                                                    "form__group",
+                                                    hasVisibleError("rooms[".concat(rIndex, "].children[").concat(index, "].gender")) && "form__group--error",
+                                                ]) },
+                                                React__default["default"].createElement("label", { className: "form__label" },
+                                                    translations.TRAVELERS_FORM.GENDER,
+                                                    " *"),
+                                                React__default["default"].createElement("div", { className: "radiobutton-group" },
+                                                    React__default["default"].createElement("div", { className: "radiobutton" },
+                                                        React__default["default"].createElement("label", { className: "radiobutton__label" },
+                                                            React__default["default"].createElement("input", { type: "radio", className: "radiobutton__input", name: "rooms[".concat(rIndex, "].children[").concat(index, "].gender"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: "m", checked: travelerValues.gender === "m" }),
+                                                            translations.TRAVELERS_FORM.MALE)),
+                                                    React__default["default"].createElement("div", { className: "radiobutton" },
+                                                        React__default["default"].createElement("label", { className: "radiobutton__label" },
+                                                            React__default["default"].createElement("input", { type: "radio", className: "radiobutton__input", name: "rooms[".concat(rIndex, "].children[").concat(index, "].gender"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: "f", checked: travelerValues.gender === "f" }),
+                                                            translations.TRAVELERS_FORM.FEMALE)),
+                                                    React__default["default"].createElement("div", { className: "radiobutton" },
+                                                        React__default["default"].createElement("label", { className: "radiobutton__label" },
+                                                            React__default["default"].createElement("input", { type: "radio", className: "radiobutton__input", name: "rooms[".concat(rIndex, "].children[").concat(index, "].gender"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: "x", checked: travelerValues.gender === "x" }),
+                                                            translations.TRAVELERS_FORM.OTHER))))),
+                                        React__default["default"].createElement("div", { className: "form__row" },
+                                            React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("rooms[".concat(rIndex, "].children[").concat(index, "].firstName")), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.FIRST_NAME, required: true, name: "rooms[".concat(rIndex, "].children[").concat(index, "].firstName"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: travelerValues.firstName }),
+                                            React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("rooms[".concat(rIndex, "].children[").concat(index, "].lastName")), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.LAST_NAME, required: true, name: "rooms[".concat(rIndex, "].children[").concat(index, "].lastName"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: travelerValues.lastName }),
+                                            React__default["default"].createElement(LabeledInput, { type: "date", hasError: hasVisibleError("rooms[".concat(rIndex, "].children[").concat(index, "].birthDate")), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.BIRTHDATE, required: true, name: "rooms[".concat(rIndex, "].children[").concat(index, "].birthDate"), onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: travelerValues.birthDate })))));
+                        }))); }),
+                    bookingType != "b2b" || ((_f = (_e = settings.travellers) === null || _e === void 0 ? void 0 : _e.mainBookerFormFields) === null || _f === void 0 ? void 0 : _f.length) ? (React__default["default"].createElement("div", { className: "form__region" },
                         React__default["default"].createElement("div", { className: "form__region-header" },
                             React__default["default"].createElement("h5", { className: "form__region-heading" }, translations.TRAVELERS_FORM.MAIN_BOOKER),
                             React__default["default"].createElement("p", { className: "form__region-label" }, lodash.compact([
@@ -14801,43 +14985,46 @@ var TravelersForm = function () {
                                 (mainBooker === null || mainBooker === void 0 ? void 0 : mainBooker.birthDate) &&
                                     dateFns.format(dateFns.parse(mainBooker.birthDate, "yyyy-MM-dd", new Date()), "dd-MM-yyyy"),
                             ]).join(", "))),
-                        React__default["default"].createElement(React__default["default"].Fragment, null,
-                            React__default["default"].createElement("div", { className: "form__twocolumn" },
-                                React__default["default"].createElement("div", { className: "form__twocolumn-column" },
-                                    React__default["default"].createElement("div", { className: "form__row" },
-                                        React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("street"), extraClassName: "form__group--50 form__group--sm-60", label: translations.TRAVELERS_FORM.STREET, required: true, name: "street", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.street }),
-                                        React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("houseNumber"), extraClassName: "form__group--30 form__group--sm-20", label: translations.TRAVELERS_FORM.HOUSE_NUMBER, required: true, name: "houseNumber", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.houseNumber }),
-                                        React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("box"), extraClassName: "form__group--20", label: translations.TRAVELERS_FORM.POST_BOX, name: "box", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.box }))),
-                                React__default["default"].createElement("div", { className: "form__twocolumn-column" },
-                                    React__default["default"].createElement("div", { className: "form__row" },
-                                        React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("zipCode"), extraClassName: "form__group--40 form__group--sm-20", label: translations.TRAVELERS_FORM.ZIPCODE, required: true, name: "zipCode", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.zipCode }),
-                                        React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("place"), extraClassName: "form__group--60 form__group--sm-40", label: translations.TRAVELERS_FORM.CITY, required: true, name: "place", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.place }),
-                                        React__default["default"].createElement(LabeledSelect, { hasError: hasVisibleError("country"), extraClassName: "form__group--sm-40", label: translations.TRAVELERS_FORM.COUNTRY, required: true, name: "country", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.country, options: [
-                                                {
-                                                    key: "empty",
-                                                    label: translations.TRAVELERS_FORM.SELECT_COUNTRY,
-                                                    value: undefined,
-                                                },
-                                                {
-                                                    key: "be",
-                                                    value: "be",
-                                                    label: translations.TRAVELERS_FORM.COUNTRIES.BELGIUM,
-                                                },
-                                                {
-                                                    key: "nl",
-                                                    value: "nl",
-                                                    label: translations.TRAVELERS_FORM.COUNTRIES.NETHERLANDS,
-                                                },
-                                                {
-                                                    key: "fr",
-                                                    value: "fr",
-                                                    label: translations.TRAVELERS_FORM.COUNTRIES.FRANCE,
-                                                },
-                                            ] })))),
-                            React__default["default"].createElement("div", { className: "form__row" },
-                                React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("phone"), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.PHONE, required: true, name: "phone", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.phone }),
-                                React__default["default"].createElement(LabeledInput, { type: "email", hasError: hasVisibleError("email"), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.EMAIL, required: true, name: "email", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.email }),
-                                React__default["default"].createElement(LabeledInput, { type: "email", hasError: hasVisibleError("emailConfirmation"), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.REPEAT_EMAIL, required: true, name: "emailConfirmation", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.emailConfirmation }))))) : (React__default["default"].createElement("div", { className: "form__region" },
+                        React__default["default"].createElement(React__default["default"].Fragment, null, ((_h = (_g = settings.travellers) === null || _g === void 0 ? void 0 : _g.mainBookerFormFields) === null || _h === void 0 ? void 0 : _h.length)
+                            ? React__default["default"].createElement(React__default["default"].Fragment, null,
+                                React__default["default"].createElement("div", { className: "main-booker-form__grid" }, settings.travellers.mainBookerFormFields.map(function (field, fIndex) { return React__default["default"].createElement("div", { key: fIndex, className: "control control--".concat(field.type) }, getControl(field.type, {}, field.type)); })))
+                            : React__default["default"].createElement(React__default["default"].Fragment, null,
+                                React__default["default"].createElement("div", { className: "form__twocolumn" },
+                                    React__default["default"].createElement("div", { className: "form__twocolumn-column" },
+                                        React__default["default"].createElement("div", { className: "form__row" },
+                                            React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("street"), extraClassName: "form__group--50 form__group--sm-60", label: translations.TRAVELERS_FORM.STREET, required: true, name: "street", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.street }),
+                                            React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("houseNumber"), extraClassName: "form__group--30 form__group--sm-20", label: translations.TRAVELERS_FORM.HOUSE_NUMBER, required: true, name: "houseNumber", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.houseNumber }),
+                                            React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("box"), extraClassName: "form__group--20", label: translations.TRAVELERS_FORM.POST_BOX, name: "box", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.box }))),
+                                    React__default["default"].createElement("div", { className: "form__twocolumn-column" },
+                                        React__default["default"].createElement("div", { className: "form__row" },
+                                            React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("zipCode"), extraClassName: "form__group--40 form__group--sm-20", label: translations.TRAVELERS_FORM.ZIPCODE, required: true, name: "zipCode", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.zipCode }),
+                                            React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("place"), extraClassName: "form__group--60 form__group--sm-40", label: translations.TRAVELERS_FORM.CITY, required: true, name: "place", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.place }),
+                                            React__default["default"].createElement(LabeledSelect, { hasError: hasVisibleError("country"), extraClassName: "form__group--sm-40", label: translations.TRAVELERS_FORM.COUNTRY, required: true, name: "country", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.country, options: [
+                                                    {
+                                                        key: "empty",
+                                                        label: translations.TRAVELERS_FORM.SELECT_COUNTRY,
+                                                        value: undefined,
+                                                    },
+                                                    {
+                                                        key: "be",
+                                                        value: "be",
+                                                        label: translations.TRAVELERS_FORM.COUNTRIES.BELGIUM,
+                                                    },
+                                                    {
+                                                        key: "nl",
+                                                        value: "nl",
+                                                        label: translations.TRAVELERS_FORM.COUNTRIES.NETHERLANDS,
+                                                    },
+                                                    {
+                                                        key: "fr",
+                                                        value: "fr",
+                                                        label: translations.TRAVELERS_FORM.COUNTRIES.FRANCE,
+                                                    },
+                                                ] })))),
+                                React__default["default"].createElement("div", { className: "form__row" },
+                                    React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("phone"), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.PHONE, required: true, name: "phone", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.phone }),
+                                    React__default["default"].createElement(LabeledInput, { type: "email", hasError: hasVisibleError("email"), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.EMAIL, required: true, name: "email", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.email }),
+                                    React__default["default"].createElement(LabeledInput, { type: "email", hasError: hasVisibleError("emailConfirmation"), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.REPEAT_EMAIL, required: true, name: "emailConfirmation", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.emailConfirmation })))))) : (React__default["default"].createElement("div", { className: "form__region" },
                         React__default["default"].createElement("div", { className: "form__row" },
                             React__default["default"].createElement(LabeledInput, { hasError: hasVisibleError("phone"), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.PHONE, required: true, name: "phone", onChange: formik$1.handleChange, onBlur: formik$1.handleBlur, value: formik$1.values.phone })))),
                     showAgentSelection && (React__default["default"].createElement("div", { className: "form__region" },
@@ -14904,23 +15091,26 @@ var Booking = function (_a) {
             dispatch(setBookingNumber(bookingNumber));
             router.navigate("".concat(basePath).concat(confirmation.pathSuffix, "?bookingNr=").concat(bookingNumber));
         }
+        var nextBookingAttrs = {
+            startDate: startDate,
+            endDate: endDate,
+            catalogueId: catalogueId,
+            rooms: rooms,
+            flight: flight,
+            includeFlights: includeFlights,
+            allotmentName: allotmentName,
+            allotmentIds: allotmentIds,
+            tourCode: tourCode,
+            flightRouteId: flightRouteId,
+            vendorConfigurationId: vendorConfigurationId,
+        };
         if (!lodash.isNil(startDate) &&
             !lodash.isNil(endDate) &&
             !lodash.isNil(catalogueId) &&
             !lodash.isNil(rooms)) {
-            dispatch(setBookingAttributes({
-                startDate: startDate,
-                endDate: endDate,
-                catalogueId: catalogueId,
-                rooms: rooms,
-                flight: flight,
-                includeFlights: includeFlights,
-                allotmentName: allotmentName,
-                allotmentIds: allotmentIds,
-                tourCode: tourCode,
-                flightRouteId: flightRouteId,
-                vendorConfigurationId: vendorConfigurationId,
-            }));
+            if (!lodash.isEqual(bookingAttributes, nextBookingAttrs)) {
+                dispatch(setBookingAttributes(nextBookingAttrs));
+            }
         }
         else {
             console.error("Failure when setting booking attributes", startDate, endDate, catalogueId, rooms);
@@ -14942,11 +15132,11 @@ var Booking = function (_a) {
         };
     }, [isRetry]);
     React.useEffect(function () {
+        var next = { productCode: productCode, productName: productName };
         if (!lodash.isNil(productCode) && !lodash.isNil(productName)) {
-            dispatch(setProductAttributes({
-                productCode: productCode,
-                productName: productName,
-            }));
+            if (!lodash.isEqual(productAttributes, next)) {
+                dispatch(setProductAttributes(next));
+            }
         }
         else {
             console.error("Failure when setting product attributes", productCode, productName);
@@ -15015,9 +15205,7 @@ var Booking = function (_a) {
     React.useEffect(function () {
         if (!productAttributes ||
             !bookingAttributes ||
-            !(rooms === null || rooms === void 0 ? void 0 : rooms.length) ||
-            !lodash.isNil(bookingNumber) ||
-            !lodash.isNil(packageDetails)) {
+            !(rooms === null || rooms === void 0 ? void 0 : rooms.length)) {
             return;
         }
         // Fetch data
@@ -15028,9 +15216,6 @@ var Booking = function (_a) {
     }, [
         productAttributes,
         bookingAttributes,
-        rooms,
-        bookingNumber,
-        packageDetails,
     ]);
     var numberIndex = 1;
     return (React__default["default"].createElement(React__default["default"].Fragment, null,