@qite/tide-components 1.0.10 → 1.0.13-preview.0

package/build/build-esm/index.js

@@ -1,18 +1,18 @@
 /* eslint-disable */
 import * as React from 'react';
-import React__default, { useLayoutEffect as useLayoutEffect$1, useEffect, useContext, useState, useRef, useCallback, useMemo } from 'react';
+import React__default, { useLayoutEffect as useLayoutEffect$1, useEffect, useContext, useState, useRef, useMemo, useCallback } from 'react';
 import JsonURL from '@jsonurl/jsonurl';
-import { format as format$2, isToday, getDate, startOfWeek, startOfMonth, endOfWeek, addWeeks, endOfMonth, eachDayOfInterval, getYear, getMonth, getISOWeek, getISODay, isSameMonth, startOfDay, isAfter, isSameDay, isEqual, isWithinInterval, endOfDay, isBefore, differenceInCalendarDays, addMonths, addDays, formatISO, addYears, differenceInYears, parseISO, differenceInMinutes, isValid, parse, startOfToday } from 'date-fns';
-import { merge, cloneDeep, isNil, isArray as isArray$1, compact, isEmpty as isEmpty$1, range, chunk, isFunction as isFunction$1, clamp, now, omit, isPlainObject as isPlainObject$1, mapValues, pickBy, first, orderBy, uniq, uniqBy, sortBy, sum, last, findIndex as findIndex$1, set, get, isEqual as isEqual$1, groupBy, minBy, concat, flatMap } from 'lodash';
+import { format as format$2, isToday, getDate, startOfWeek, startOfMonth, endOfWeek, addWeeks, endOfMonth, eachDayOfInterval, getYear, getMonth, getISOWeek, getISODay, isSameMonth, startOfDay, isAfter, isSameDay, isEqual, isWithinInterval, endOfDay, isBefore, differenceInCalendarDays, addMonths, addDays, formatISO, addYears, differenceInYears, parse, isValid, parseISO, differenceInMinutes, startOfToday } from 'date-fns';
+import { merge, cloneDeep, isNil, isArray as isArray$1, compact, isEmpty as isEmpty$1, range, chunk, isFunction as isFunction$1, clamp, now, omit, get, last, first, sortBy, isPlainObject as isPlainObject$1, mapValues, pickBy, orderBy, uniq, uniqBy, sum, findIndex as findIndex$1, set, isEqual as isEqual$1, groupBy, minBy, concat, flatMap } from 'lodash';
 import { arSA, da, de, enGB, es, fr, is, it, nl, nb, pl, pt, sv, ja, enUS } from 'date-fns/locale';
 import { usePopper } from 'react-popper';
 import { useSelector, useDispatch, Provider } from 'react-redux';
 import { createSlice, createSelector, createAsyncThunk, configureStore } from '@reduxjs/toolkit';
+import flat from 'flat';
 import { UNSAFE_NavigationContext, useHref, useNavigate, useLocation, useResolvedPath, createPath, UNSAFE_DataRouterStateContext, UNSAFE_useRouteId, UNSAFE_RouteContext, UNSAFE_DataRouterContext, Routes, Route } from 'react-router';
 import 'react-dom';
 import produce from 'immer';
 import { useFormik } from 'formik';
-import flat from 'flat';
 import { v4 } from 'uuid';
 
 function _mergeNamespaces(n, m) {
@@ -124,7 +124,9 @@ var SHARED$f = {
 	ADULTS: "بالغون",
 	CHILDREN: "أطفال",
 	SELECT: "اختر",
-	SELECTED: "تم الاختيار"
+	SELECTED: "تم الاختيار",
+	BOOKED: "محجوز",
+	SAVE: "حفظ"
 };
 var SIDEBAR$f = {
 	OVERVIEW: "الملخص",
@@ -182,6 +184,27 @@ var TRAVELERS_FORM$f = {
 	FIRST_NAME: "الاسم الأول",
 	LAST_NAME: "اسم العائلة",
 	BIRTHDATE: "تاريخ الميلاد",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "الوزن",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "الطول",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "الشارع",
 	STREET_PLACEHOLDER: "اسم الشارع",
 	HOUSE_NUMBER: "رقم المنزل",
@@ -571,7 +594,9 @@ var SHARED$e = {
 	ADULTS: "Voksne",
 	CHILDREN: "Børn",
 	SELECT: "Vælg",
-	SELECTED: "Valgt"
+	SELECTED: "Valgt",
+	BOOKED: "Booket",
+	SAVE: "Gem"
 };
 var SIDEBAR$e = {
 	OVERVIEW: "Oversigt",
@@ -629,6 +654,27 @@ var TRAVELERS_FORM$e = {
 	FIRST_NAME: "Fornavn",
 	LAST_NAME: "Efternavn",
 	BIRTHDATE: "Fødselsdato",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "Vægt",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "Højde",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "Gade",
 	STREET_PLACEHOLDER: "Din gade",
 	HOUSE_NUMBER: "Husnummer",
@@ -1018,7 +1064,9 @@ var SHARED$d = {
 	ADULTS: "Erwachsene",
 	CHILDREN: "Kinder",
 	SELECT: "Auswählen",
-	SELECTED: "Ausgewählt"
+	SELECTED: "Ausgewählt",
+	BOOKED: "Gebucht",
+	SAVE: "Speichern"
 };
 var SIDEBAR$d = {
 	OVERVIEW: "Übersicht",
@@ -1076,6 +1124,27 @@ var TRAVELERS_FORM$d = {
 	FIRST_NAME: "Vorname",
 	LAST_NAME: "Nachname",
 	BIRTHDATE: "Geburtsdatum",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "Gewicht",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "Größe",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "Straße",
 	STREET_PLACEHOLDER: "Ihre Straße",
 	HOUSE_NUMBER: "Hausnummer",
@@ -1465,7 +1534,9 @@ var SHARED$c = {
 	ADULTS: "Adults",
 	CHILDREN: "Children",
 	SELECT: "Select",
-	SELECTED: "Selected"
+	SELECTED: "Selected",
+	BOOKED: "Booked",
+	SAVE: "Save"
 };
 var SIDEBAR$c = {
 	OVERVIEW: "Summary",
@@ -1524,6 +1595,27 @@ var TRAVELERS_FORM$c = {
 	FIRST_NAME: "First name",
 	LAST_NAME: "Last name",
 	BIRTHDATE: "Date of birth",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "Weight",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "Height",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "Street",
 	STREET_PLACEHOLDER: "Your street",
 	HOUSE_NUMBER: "House number",
@@ -1916,7 +2008,9 @@ var SHARED$b = {
 	ADULTS: "Adultos",
 	CHILDREN: "Niños",
 	SELECT: "Seleccionar",
-	SELECTED: "Seleccionado"
+	SELECTED: "Seleccionado",
+	BOOKED: "Reservado",
+	SAVE: "Guardar"
 };
 var SIDEBAR$b = {
 	OVERVIEW: "Resumen",
@@ -1974,6 +2068,27 @@ var TRAVELERS_FORM$b = {
 	FIRST_NAME: "Nombre",
 	LAST_NAME: "Apellido",
 	BIRTHDATE: "Fecha de nacimiento",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "Peso",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "Estatura",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "Calle",
 	STREET_PLACEHOLDER: "Su calle",
 	HOUSE_NUMBER: "Número",
@@ -2363,7 +2478,9 @@ var SHARED$a = {
 	ADULTS: "Adultes",
 	CHILDREN: "Enfants",
 	SELECT: "Sélectionner",
-	SELECTED: "Sélectionné"
+	SELECTED: "Sélectionné",
+	BOOKED: "Réservé",
+	SAVE: "Enregistrer"
 };
 var SIDEBAR$a = {
 	OVERVIEW: "Aperçu",
@@ -2422,6 +2539,27 @@ var TRAVELERS_FORM$a = {
 	FIRST_NAME: "Prénom",
 	LAST_NAME: "Nom",
 	BIRTHDATE: "Date de naissance",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "Poids",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "Taille",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "Rue",
 	STREET_PLACEHOLDER: "Votre rue",
 	HOUSE_NUMBER: "N°",
@@ -2814,7 +2952,9 @@ var SHARED$9 = {
 	ADULTS: "Adultes",
 	CHILDREN: "Enfants",
 	SELECT: "Sélectionner",
-	SELECTED: "Sélectionné"
+	SELECTED: "Sélectionné",
+	BOOKED: "Réservé",
+	SAVE: "Enregistrer"
 };
 var SIDEBAR$9 = {
 	OVERVIEW: "Résumé",
@@ -2872,6 +3012,27 @@ var TRAVELERS_FORM$9 = {
 	FIRST_NAME: "Prénom",
 	LAST_NAME: "Nom",
 	BIRTHDATE: "Date de naissance",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "Poids",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "Taille",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "Rue",
 	STREET_PLACEHOLDER: "Votre rue",
 	HOUSE_NUMBER: "Numéro",
@@ -3261,7 +3422,9 @@ var SHARED$8 = {
 	ADULTS: "Fullorðnir",
 	CHILDREN: "Börn",
 	SELECT: "Velja",
-	SELECTED: "Valið"
+	SELECTED: "Valið",
+	BOOKED: "Bókað",
+	SAVE: "Vista"
 };
 var SIDEBAR$8 = {
 	OVERVIEW: "Yfirlit",
@@ -3319,6 +3482,27 @@ var TRAVELERS_FORM$8 = {
 	FIRST_NAME: "Fornafn",
 	LAST_NAME: "Eftirnafn",
 	BIRTHDATE: "Fæðingardagur",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "Þyngd",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "Hæð",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "Gata",
 	STREET_PLACEHOLDER: "Gatan þín",
 	HOUSE_NUMBER: "Húsnúmer",
@@ -3708,7 +3892,9 @@ var SHARED$7 = {
 	ADULTS: "Adulti",
 	CHILDREN: "Bambini",
 	SELECT: "Seleziona",
-	SELECTED: "Selezionato"
+	SELECTED: "Selezionato",
+	BOOKED: "Prenotato",
+	SAVE: "Salva"
 };
 var SIDEBAR$7 = {
 	OVERVIEW: "Riepilogo",
@@ -3766,6 +3952,27 @@ var TRAVELERS_FORM$7 = {
 	FIRST_NAME: "Nome",
 	LAST_NAME: "Cognome",
 	BIRTHDATE: "Data di nascita",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "Peso",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "Altezza",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "Via",
 	STREET_PLACEHOLDER: "La tua via",
 	HOUSE_NUMBER: "Numero civico",
@@ -4155,7 +4362,9 @@ var SHARED$6 = {
 	ADULTS: "Volwassenen",
 	CHILDREN: "Kinderen",
 	SELECT: "Selecteer",
-	SELECTED: "Geselecteerd"
+	SELECTED: "Geselecteerd",
+	BOOKED: "Geboekt",
+	SAVE: "Opslaan"
 };
 var SIDEBAR$6 = {
 	OVERVIEW: "Overzicht",
@@ -4214,6 +4423,27 @@ var TRAVELERS_FORM$6 = {
 	FIRST_NAME: "Voornaam",
 	LAST_NAME: "Naam",
 	BIRTHDATE: "Geboortedatum",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "Gewicht",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "Lengte",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "Straat",
 	STREET_PLACEHOLDER: "Jouw straat",
 	HOUSE_NUMBER: "Huisnr",
@@ -4606,7 +4836,9 @@ var SHARED$5 = {
 	ADULTS: "Volwassenen",
 	CHILDREN: "Kinderen",
 	SELECT: "Selecteren",
-	SELECTED: "Geselecteerd"
+	SELECTED: "Geselecteerd",
+	BOOKED: "Geboekt",
+	SAVE: "Opslaan"
 };
 var SIDEBAR$5 = {
 	OVERVIEW: "Overzicht",
@@ -4664,6 +4896,27 @@ var TRAVELERS_FORM$5 = {
 	FIRST_NAME: "Voornaam",
 	LAST_NAME: "Achternaam",
 	BIRTHDATE: "Geboortedatum",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "Gewicht",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "Lengte",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "Straat",
 	STREET_PLACEHOLDER: "Uw straat",
 	HOUSE_NUMBER: "Huisnummer",
@@ -5053,7 +5306,9 @@ var SHARED$4 = {
 	ADULTS: "Voksne",
 	CHILDREN: "Barn",
 	SELECT: "Velg",
-	SELECTED: "Valgt"
+	SELECTED: "Valgt",
+	BOOKED: "Booket",
+	SAVE: "Lagre"
 };
 var SIDEBAR$4 = {
 	OVERVIEW: "Oversikt",
@@ -5111,6 +5366,27 @@ var TRAVELERS_FORM$4 = {
 	FIRST_NAME: "Fornavn",
 	LAST_NAME: "Etternavn",
 	BIRTHDATE: "Fødselsdato",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "Vekt",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "Høyde",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "Gate",
 	STREET_PLACEHOLDER: "Din gate",
 	HOUSE_NUMBER: "Husnummer",
@@ -5500,7 +5776,9 @@ var SHARED$3 = {
 	ADULTS: "Dorośli",
 	CHILDREN: "Dzieci",
 	SELECT: "Wybierz",
-	SELECTED: "Wybrane"
+	SELECTED: "Wybrane",
+	BOOKED: "Zarezerwowane",
+	SAVE: "Zapisz"
 };
 var SIDEBAR$3 = {
 	OVERVIEW: "Podsumowanie",
@@ -5558,6 +5836,27 @@ var TRAVELERS_FORM$3 = {
 	FIRST_NAME: "Imię",
 	LAST_NAME: "Nazwisko",
 	BIRTHDATE: "Data urodzenia",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "Waga",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "Wzrost",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "Ulica",
 	STREET_PLACEHOLDER: "Twoja ulica",
 	HOUSE_NUMBER: "Numer domu",
@@ -5947,7 +6246,9 @@ var SHARED$2 = {
 	ADULTS: "Adultos",
 	CHILDREN: "Crianças",
 	SELECT: "Selecionar",
-	SELECTED: "Selecionado"
+	SELECTED: "Selecionado",
+	BOOKED: "Reservado",
+	SAVE: "Guardar"
 };
 var SIDEBAR$2 = {
 	OVERVIEW: "Resumo",
@@ -6005,6 +6306,27 @@ var TRAVELERS_FORM$2 = {
 	FIRST_NAME: "Nome",
 	LAST_NAME: "Apelido",
 	BIRTHDATE: "Data de nascimento",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "Peso",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "Altura",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "Rua",
 	STREET_PLACEHOLDER: "A sua rua",
 	HOUSE_NUMBER: "Número de porta",
@@ -6394,7 +6716,9 @@ var SHARED$1 = {
 	ADULTS: "Vuxna",
 	CHILDREN: "Barn",
 	SELECT: "Välj",
-	SELECTED: "Vald"
+	SELECTED: "Vald",
+	BOOKED: "Bokad",
+	SAVE: "Spara"
 };
 var SIDEBAR$1 = {
 	OVERVIEW: "Översikt",
@@ -6452,6 +6776,27 @@ var TRAVELERS_FORM$1 = {
 	FIRST_NAME: "Förnamn",
 	LAST_NAME: "Efternamn",
 	BIRTHDATE: "Födelsedatum",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "Vikt",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "Längd",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "Gata",
 	STREET_PLACEHOLDER: "Din gata",
 	HOUSE_NUMBER: "Husnummer",
@@ -6841,7 +7186,9 @@ var SHARED = {
 	ADULTS: "大人",
 	CHILDREN: "子供",
 	SELECT: "選択",
-	SELECTED: "選択済み"
+	SELECTED: "選択済み",
+	BOOKED: "予約済み",
+	SAVE: "保存"
 };
 var SIDEBAR = {
 	OVERVIEW: "概要",
@@ -6899,6 +7246,27 @@ var TRAVELERS_FORM = {
 	FIRST_NAME: "名",
 	LAST_NAME: "姓",
 	BIRTHDATE: "生年月日",
+	NICKNAME: "Nickname",
+	BIRTHPLACE: "Birthplace",
+	NATIONALITY: "Nationality",
+	PREFERRED_LANGUAGE: "Preferred language",
+	TRAVELER_EMAIL: "Email",
+	TRAVELER_PHONE: "Phone",
+	TRAVELER_MOBILE: "Mobile phone",
+	PASSPORT_NUMBER: "Passport number",
+	PASSPORT_ISSUE_DATE: "Passport issue date",
+	PASSPORT_ISSUED_LOCATION: "Passport issued location",
+	PASSPORT_EXPIRY_DATE: "Passport expiry date",
+	EMERGENCY_NUMBER: "Emergency number",
+	HAS_INSURANCE: "Has insurance",
+	INSURANCE_NAME: "Insurance name",
+	INFO: "Additional information",
+	WEIGHT: "体重",
+	WEIGHT_UNIT_KG: "kg",
+	WEIGHT_UNIT_LB: "lb",
+	HEIGHT: "身長",
+	HEIGHT_UNIT_CM: "cm",
+	HEIGHT_UNIT_FT_IN: "ft/in",
 	STREET: "住所",
 	STREET_PLACEHOLDER: "住所を入力",
 	HOUSE_NUMBER: "番地",
@@ -7552,6 +7920,14 @@ exports.AvailabilitySearchType = void 0;
   AvailabilitySearchType[(AvailabilitySearchType["flight"] = 3)] = "flight";
 })(exports.AvailabilitySearchType || (exports.AvailabilitySearchType = {}));
 
+var CustomFieldDataType = {
+  bool: 0,
+  date: 1,
+  time: 2,
+  string: 3,
+  numeric: 4,
+};
+
 var DataType = {
   text: "text",
   numeric: "number",
@@ -7567,6 +7943,12 @@ var DataType = {
   template: "template",
 };
 
+exports.DateAmountType = void 0;
+(function (DateAmountType) {
+  DateAmountType[(DateAmountType["days"] = 0)] = "days";
+  DateAmountType[(DateAmountType["months"] = 1)] = "months";
+})(exports.DateAmountType || (exports.DateAmountType = {}));
+
 var DossierType = {
   hotelOnly: 0,
   transportOnly: 1,
@@ -7574,6 +7956,13 @@ var DossierType = {
   package: 3,
 };
 
+var DurationType = {
+  hours: 0,
+  days: 1,
+  nights: 2,
+  minutes: 3,
+};
+
 var EntryLineFlag = {
   none: 0,
   allotmentNoPlace: 1,
@@ -7651,6 +8040,11 @@ var Gender = {
   other: 2,
 };
 
+var HeightType = {
+  centimeters: 0,
+  feetInches: 1,
+};
+
 exports.MetaDataItemPropertyType = void 0;
 (function (MetaDataItemPropertyType) {
   MetaDataItemPropertyType[(MetaDataItemPropertyType["Height"] = 0)] = "Height";
@@ -7687,6 +8081,22 @@ var PaymentType = {
   cash: 3,
 };
 
+exports.PortalQsmType = void 0;
+(function (PortalQsmType) {
+  PortalQsmType[(PortalQsmType["Multidestination"] = 0)] = "Multidestination";
+  PortalQsmType[(PortalQsmType["Accommodation"] = 1)] = "Accommodation";
+  PortalQsmType[(PortalQsmType["AccommodationAndFlight"] = 2)] =
+    "AccommodationAndFlight";
+  PortalQsmType[(PortalQsmType["Flight"] = 3)] = "Flight";
+  PortalQsmType[(PortalQsmType["RoundTrip"] = 4)] = "RoundTrip";
+  PortalQsmType[(PortalQsmType["GroupTour"] = 5)] = "GroupTour";
+  PortalQsmType[(PortalQsmType["Package"] = 6)] = "Package";
+  PortalQsmType[(PortalQsmType["Ticket"] = 7)] = "Ticket";
+  PortalQsmType[(PortalQsmType["Car"] = 8)] = "Car";
+  PortalQsmType[(PortalQsmType["Transfer"] = 9)] = "Transfer";
+  PortalQsmType[(PortalQsmType["Cruise"] = 10)] = "Cruise";
+})(exports.PortalQsmType || (exports.PortalQsmType = {}));
+
 var PriceChartType = {
   purchasePrices: 0,
   sellingPrices: 1,
@@ -7720,6 +8130,26 @@ var RoomType = {
   pk6: 5,
 };
 
+var RouteTransportType = {
+  none: 0,
+  privateTransport: 1,
+  publicTransport: 2,
+  rentalCar: 3,
+  bus: 4,
+  camper: 5,
+  car: 6,
+  charter: 7,
+  cruise: 8,
+  ferry: 9,
+  flight: 10,
+  taxi: 11,
+  train: 12,
+  transfer: 13,
+  rocket: 14,
+  walking: 15,
+  cycling: 16,
+};
+
 var SaleType = {
   ownOrganization: 0,
   resale: 1,
@@ -7759,6 +8189,13 @@ var ServiceType = {
   camp: 30,
 };
 
+var TrajectNodeType = {
+  regular: 0,
+  connectingNode: 1,
+  poi: 2,
+  subroute: 3,
+};
+
 exports.UnitOfMeasure = void 0;
 (function (UnitOfMeasure) {
   UnitOfMeasure[(UnitOfMeasure["cm"] = 0)] = "cm";
@@ -7791,60 +8228,9 @@ var VendorType = {
   sunnyCars: 20,
 };
 
-exports.DateAmountType = void 0;
-(function (DateAmountType) {
-  DateAmountType[(DateAmountType["days"] = 0)] = "days";
-  DateAmountType[(DateAmountType["months"] = 1)] = "months";
-})(exports.DateAmountType || (exports.DateAmountType = {}));
-
-exports.PortalQsmType = void 0;
-(function (PortalQsmType) {
-  PortalQsmType[(PortalQsmType["Multidestination"] = 0)] = "Multidestination";
-  PortalQsmType[(PortalQsmType["Accommodation"] = 1)] = "Accommodation";
-  PortalQsmType[(PortalQsmType["AccommodationAndFlight"] = 2)] =
-    "AccommodationAndFlight";
-  PortalQsmType[(PortalQsmType["Flight"] = 3)] = "Flight";
-  PortalQsmType[(PortalQsmType["RoundTrip"] = 4)] = "RoundTrip";
-  PortalQsmType[(PortalQsmType["GroupTour"] = 5)] = "GroupTour";
-  PortalQsmType[(PortalQsmType["Package"] = 6)] = "Package";
-  PortalQsmType[(PortalQsmType["Ticket"] = 7)] = "Ticket";
-  PortalQsmType[(PortalQsmType["Car"] = 8)] = "Car";
-  PortalQsmType[(PortalQsmType["Transfer"] = 9)] = "Transfer";
-  PortalQsmType[(PortalQsmType["Cruise"] = 10)] = "Cruise";
-})(exports.PortalQsmType || (exports.PortalQsmType = {}));
-
-var TrajectNodeType = {
-  regular: 0,
-  connectingNode: 1,
-  poi: 2,
-  subroute: 3,
-};
-
-var DurationType = {
-  hours: 0,
-  days: 1,
-  nights: 2,
-  minutes: 3,
-};
-
-var RouteTransportType = {
-  none: 0,
-  privateTransport: 1,
-  publicTransport: 2,
-  rentalCar: 3,
-  bus: 4,
-  camper: 5,
-  car: 6,
-  charter: 7,
-  cruise: 8,
-  ferry: 9,
-  flight: 10,
-  taxi: 11,
-  train: 12,
-  transfer: 13,
-  rocket: 14,
-  walking: 15,
-  cycling: 16,
+var WeightType = {
+  kilograms: 0,
+  pounds: 1,
 };
 
 /******************************************************************************
@@ -14978,6 +15364,34 @@ var getContentDraft = function (config, signal) {
   var apiKey = config.apiKey;
   return get(url, apiKey, config.token, signal, true);
 };
+/**
+ * api/web/content/live/filtered
+ * Gets filtered Live content
+ * @param config
+ * @param request
+ * @param signal
+ * @returns OK if succeeded.
+ */
+var getFilteredContentLive = function (config, request, signal) {
+  var url = "" + config.host + ENDPOINT_LIVE + "/filtered";
+  var apiKey = config.apiKey;
+  var body = JSON.stringify(request);
+  return post(url, apiKey, body, config.token, signal, true);
+};
+/**
+ * api/web/content/draft/filtered
+ * Gets filtered Draft (Internal) content
+ * @param config
+ * @param request
+ * @param signal
+ * @returns OK if succeeded.
+ */
+var getFilteredContentDraft = function (config, request, signal) {
+  var url = "" + config.host + ENDPOINT_DRAFT + "/filtered";
+  var apiKey = config.apiKey;
+  var body = JSON.stringify(request);
+  return post(url, apiKey, body, config.token, signal, true);
+};
 /**
  * api/web/content/live/by-property
  * Gets Live content matching a property value (or values).
@@ -15105,6 +15519,7 @@ var ENDPOINT_TRAJECT = ENDPOINT$1 + "/traject";
 var ENDPOINT_ENTRY = function (magicLinkCode) {
   return ENDPOINT$1 + "/entry/" + magicLinkCode;
 };
+var ENDPOINT_SAVE_ENTRY = ENDPOINT$1 + "/entry/save";
 var startTransaction = function (config, signal) {
   var apiKey = config.apiKey;
   var url = "" + config.host + ENDPOINT_START_TRANSACTION;
@@ -15133,6 +15548,12 @@ var getEntry = function (config, magicLinkCode, signal) {
   var url = "" + config.host + ENDPOINT_ENTRY(magicLinkCode);
   return get(url, apiKey, config.token, signal, true);
 };
+var savePackagingEntry = function (config, request, signal) {
+  var url = "" + config.host + ENDPOINT_SAVE_ENTRY;
+  var apiKey = config.apiKey;
+  var body = JSON.stringify(request);
+  return post(url, apiKey, body, config.token, signal, true);
+};
 var getTrajectEntry = function (config, request, signal) {
   var url = "" + config.host + ENDPOINT_TRAJECT;
   var apiKey = config.apiKey;
@@ -15196,6 +15617,7 @@ var submitForm = function (config, id, request, signal) {
 };
 
 exports.AllotmentType = AllotmentType;
+exports.CustomFieldDataType = CustomFieldDataType;
 exports.DataType = DataType;
 exports.DossierType = DossierType;
 exports.DurationType = DurationType;
@@ -15206,6 +15628,7 @@ exports.FormFieldType = FormFieldType;
 exports.FormFieldWidth = FormFieldWidth;
 exports.FormType = FormType;
 exports.Gender = Gender;
+exports.HeightType = HeightType;
 exports.MetaDataType = MetaDataType;
 exports.PaymentType = PaymentType;
 exports.PriceChartType = PriceChartType;
@@ -15217,6 +15640,7 @@ exports.ServiceTokenError = ServiceTokenError;
 exports.ServiceType = ServiceType;
 exports.TrajectNodeType = TrajectNodeType;
 exports.VendorType = VendorType;
+exports.WeightType = WeightType;
 exports.agents = agents;
 exports.alternateFlights = alternateFlights;
 exports.alternateHotels = alternateHotels;
@@ -15264,6 +15688,8 @@ exports.getEntryList = getEntryList;
 exports.getEntryListv2 = getEntryListv2;
 exports.getEntryStatus = getEntryStatus;
 exports.getEntryTotals = getEntryTotals;
+exports.getFilteredContentDraft = getFilteredContentDraft;
+exports.getFilteredContentLive = getFilteredContentLive;
 exports.getInvoiceList = getInvoiceList;
 exports.getItinerary = getItinerary;
 exports.getLocations = getLocations;
@@ -15284,6 +15710,7 @@ exports.print = print;
 exports.readForm = readForm;
 exports.repriceAndIssueTicket = repriceAndIssueTicket;
 exports.resetPassword = resetPassword;
+exports.savePackagingEntry = savePackagingEntry;
 exports.search = search;
 exports.searchCountries = searchCountries;
 exports.searchElastic = searchElastic;
@@ -17475,7 +17902,7 @@ const Product = ({ productCode, productName, duration, rating }) => {
     const [hasFlight, setHasFlight] = useState(false);
     const [hasTransfer, setHasTransfer] = useState(false);
     const [rooms, setRooms] = useState([{ adults: 2, children: 0, childAges: [] }]);
-    const [searchResponse, setSearchResponse] = useState([]);
+    const [searchResponse, setSearchResponse] = useState();
     const [detailResponse, setDetailResponse] = useState();
     const [dateRange, setDateRange] = useState();
     const [urlDateRange, setUrlDateRange] = useState({ from: null, to: null });
@@ -17613,6 +18040,9 @@ const Product = ({ productCode, productName, duration, rating }) => {
         setPackageProductName(selectedItem.name);
     };
     useEffect(() => {
+        if (searchResponse === undefined) {
+            return;
+        }
         if (searchResponse && !isEmpty$1(searchResponse)) {
             setSearchResults(searchResponse);
             const selectedItem = searchResponse.find((item) => new Date(item.fromDate).getTime() === dateRange?.fromDate?.getTime() && new Date(item.toDate).getTime() === dateRange?.toDate?.getTime());
@@ -18611,276 +19041,1102 @@ const SUMMARY_STEP = 5;
 const CONFIRMATION_STEP = 6;
 const ERROR_STEP = 7;
 
-const fetchPriceDetails$1 = async (apiSettings, request, signal, languageCode) => {
-    const tideClientConfig = buildTideClientConfig(apiSettings);
-    return await build.priceDetails(tideClientConfig, request, signal, languageCode);
-};
-const priceDetailsApi = {
-    fetchPriceDetails: fetchPriceDetails$1
+const LabeledInput = ({ name, type, required, value, defaultValue, min, max, label, placeholder, extraClassName, hasError, onChange, onBlur }) => {
+    return (React__default.createElement("label", { className: buildClassName(['form__group', extraClassName, hasError && 'form__group--error']) },
+        React__default.createElement("span", { className: "form__label" }, compact([label, required && '*']).join(' ')),
+        React__default.createElement("input", { name: name, type: type ?? 'text', required: required, className: "form__input", min: min, max: max, placeholder: placeholder, onChange: onChange, onBlur: onBlur, value: value, defaultValue: defaultValue })));
 };
 
-const updatePackageDetails = (packageDetails, changedLines) => {
-    return {
-        ...packageDetails,
-        options: packageDetails.options.map((opt) => {
-            return {
-                ...opt,
-                rooms: opt.isSelected ? updateRooms(opt.rooms, changedLines) : opt.rooms,
-                groups: opt.isSelected ? updateBookingGroups(opt.groups, changedLines) : opt.groups,
-                optionUnits: opt.isSelected ? updateOptionUnits(opt.optionUnits, changedLines) : opt.optionUnits,
-                optionPax: opt.isSelected ? updateOptionPax(opt.optionPax, changedLines) : opt.optionPax
-            };
-        })
-    };
-};
-// ROOMS
-const updateRooms = (rooms, changedLines) => {
-    return rooms.map((room) => ({
-        ...room,
-        options: room.options.map((option) => ({
-            ...option,
-            price: changedLines.find((x) => x.entryLineGuid == option.entryLineGuid)?.price ?? option.price
-        }))
-    }));
-};
-// PAX
-const updateOptionPax = (pax, changedLines) => {
-    return pax.map((p) => ({
-        ...p,
-        groups: updatePaxGroups(p.groups, changedLines)
-    }));
-};
-const updatePaxGroups = (groups, changedLines) => {
-    return groups.map((g) => ({
-        ...g,
-        options: g.options.map((o) => ({
-            ...o,
-            groups: updatePaxGroups(o.groups, changedLines),
-            line: {
-                ...o.line,
-                price: changedLines.find((cl) => cl.entryLineGuid === o.line.entryLineGuid)?.price ?? o.line.price
-            },
-            alternatives: o.alternatives.map((a) => ({
-                ...a,
-                price: changedLines.find((cl) => cl.entryLineGuid === a.entryLineGuid)?.price ?? a.price
-            }))
-        }))
-    }));
-};
-// UNITS
-const updateOptionUnits = (units, changedLines) => {
-    return units.map((u) => ({
-        ...u,
-        groups: updateUnitGroups(u.groups, changedLines)
-    }));
-};
-const updateUnitGroups = (groups, changedLines) => {
-    return groups.map((g) => ({
-        ...g,
-        options: g.options.map((o) => ({
-            ...o,
-            groups: updateUnitGroups(o.groups, changedLines),
-            pax: updateOptionPax(o.pax, changedLines),
-            line: {
-                ...o.line,
-                price: changedLines.find((cl) => cl.entryLineGuid === o.line.entryLineGuid)?.price ?? o.line.price
-            },
-            alternatives: o.alternatives.map((a) => ({
-                ...a,
-                price: changedLines.find((cl) => cl.entryLineGuid === a.entryLineGuid)?.price ?? a.price
-            }))
-        }))
-    }));
-};
-// BOOKING
-const updateBookingGroups = (groups, changedLines) => {
-    return groups.map((g) => ({
-        ...g,
-        options: g.options.map((o) => ({
-            ...o,
-            groups: updateBookingGroups(o.groups, changedLines),
-            units: updateOptionUnits(o.units, changedLines),
-            pax: updateOptionPax(o.pax, changedLines),
-            line: {
-                ...o.line,
-                price: changedLines.find((cl) => cl.entryLineGuid === o.line.entryLineGuid)?.price ?? o.line.price
-            },
-            alternatives: o.alternatives.map((a) => ({
-                ...a,
-                price: changedLines.find((cl) => cl.entryLineGuid === a.entryLineGuid)?.price ?? a.price
-            }))
-        }))
-    }));
+const LabeledSelect = ({ name, id, required, value, defaultValue, label, extraClassName, extraDropdownClassName, hasError, options, onChange, onBlur }) => {
+    return (React__default.createElement("label", { className: buildClassName(['form__group', extraClassName, hasError && 'form__group--error']) },
+        React__default.createElement("span", { className: "form__label" }, compact([label, required && '*']).join(' ')),
+        React__default.createElement("div", { className: buildClassName(['dropdown', extraDropdownClassName]) },
+            React__default.createElement("select", { name: name, id: id, defaultValue: defaultValue, value: value, onBlur: onBlur, onChange: onChange }, options?.map((option) => (React__default.createElement("option", { key: option.key, value: option.value }, option.label)))))));
 };
 
-const fetchPriceDetails = createAsyncThunk('priceDetails/fetchPriceDetails', async (_, { dispatch, getState, signal }) => {
-    const state = getState();
-    const languageCode = selectLanguageCode(state);
-    const request = selectBookingPackageBookRequest(state);
-    if (!request) {
-        throw Error('Product not available.');
-    }
-    dispatch(setFetchingPriceDetails(true));
-    dispatch(resetPriceDetails());
-    const priceDetails = await priceDetailsApi.fetchPriceDetails(state.apiSettings, request, signal, languageCode);
-    dispatch(setFetchingPriceDetails(false));
-    const packageDetails = selectPackageDetails(state);
-    if (packageDetails) {
-        const updatedPackageDetails = updatePackageDetails(packageDetails, priceDetails.changedLines);
-        dispatch(setPackage(updatedPackageDetails));
+const normalize = (v) => (v == null ? '' : String(v));
+const parseCombined = (raw, countries) => {
+    const value = normalize(raw).trim();
+    if (!value)
+        return { prefix: '', number: '' };
+    // Try to match a known prefix at the start. Prefer longest match.
+    const sorted = [...countries].sort((a, b) => b.phonePrefix.length - a.phonePrefix.length);
+    const hit = sorted.find((c) => value.startsWith(c.phonePrefix));
+    if (hit) {
+        const rest = value
+            .slice(hit.phonePrefix.length)
+            .trim()
+            .replace(/^[-\s]+/, '');
+        return { prefix: hit.phonePrefix, number: rest };
     }
-    return priceDetails;
-});
-const priceDetailsSlice = createSlice({
-    name: 'priceDetails',
-    initialState: {
-        priceDetails: [],
-        notifications: [],
-        isBusy: false
-    },
-    reducers: {
-        setFetchingPriceDetails(state, action) {
-            state.isBusy = action.payload;
-        },
-        setNotifications(state, action) {
-            state.notifications = action.payload;
-        },
-        resetPriceDetails(state, _) {
-            state.priceDetails = [];
-        }
-    },
-    extraReducers: (builder) => {
-        builder.addCase(fetchPriceDetails.fulfilled, (state, action) => {
-            if (action.payload) {
-                state.deposit = action.payload.deposit;
-                state.commission = action.payload.commission;
-                state.priceDetails = action.payload.details;
-                state.notifications = action.payload.notifications;
-            }
-        });
-        builder.addCase(fetchPriceDetails.rejected, (state) => {
-            state.isBusy = false;
+    // Fallback: split on first space if it looks like a +prefix number
+    const m = value.match(/^(\+\d{1,4})[\s-]*(.*)$/);
+    if (m)
+        return { prefix: m[1], number: m[2] };
+    return { prefix: '', number: value };
+};
+const PhoneInput = ({ name, required, value, label, placeholder, extraClassName, hasError, countries, countryIso2, onChange, onBlur }) => {
+    // Derive initial state from `value`
+    const initialCountry = countries.find((c) => c.iso2 === countryIso2);
+    const initial = useMemo(() => parseCombined(normalize(value), countries), [value, countries]);
+    const [prefix, setPrefix] = useState(initial.prefix);
+    const [number, setNumber] = useState(initial.number);
+    // Keep state in sync if the parent changes `value`
+    useEffect(() => {
+        const 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]);
+    const emitCombinedChange = (e, nextPrefix, nextNumber) => {
+        // Combine with a space, unless the number already starts with a dash or space
+        const combined = nextPrefix && nextNumber ? compact([nextPrefix, nextNumber]).join(' ') : null;
+        onChange?.({
+            ...e,
+            type: 'change',
+            target: { name, value: combined },
+            currentTarget: { name, value: combined }
         });
-    }
-});
-const { setFetchingPriceDetails } = priceDetailsSlice.actions;
-const { resetPriceDetails, setNotifications } = priceDetailsSlice.actions;
-const selectNotifications = (state) => state.priceDetails.notifications;
-var priceDetailsReducer = priceDetailsSlice.reducer;
+    };
+    const handleCountryBlur = (e) => {
+        onBlur?.(e);
+    };
+    const onCountryChange = (e) => {
+        const next = e.target.value;
+        setPrefix(next);
+        emitCombinedChange(e, next, number);
+    };
+    const onPhoneChange = (e) => {
+        const cleaned = e.target.value.replace(/[^\d\s-]/g, '');
+        setNumber(cleaned);
+        emitCombinedChange(e, prefix, cleaned);
+    };
+    const handleNumberBlur = (e) => {
+        onBlur?.(e);
+    };
+    // Ensure the select shows a reasonable default when prefix is empty
+    const selectValue = prefix || '';
+    return (React__default.createElement("label", { className: buildClassName(['form__group', extraClassName, hasError && 'form__group--error']) },
+        label && React__default.createElement("span", { className: "form__label" }, compact([label, required && '*']).join(' ')),
+        React__default.createElement("div", { className: "phone-input" },
+            React__default.createElement("div", { className: "dropdown" },
+                React__default.createElement("select", { "aria-label": label ? `${label} – country code` : 'Country calling code', name: `${name}__country`, value: selectValue, onBlur: handleCountryBlur, onChange: onCountryChange },
+                    React__default.createElement("option", { value: "", disabled: true }),
+                    countries?.map((option) => (React__default.createElement("option", { key: option.iso2, value: option.phonePrefix },
+                        option.name,
+                        " (",
+                        option.phonePrefix,
+                        ")"))))),
+            React__default.createElement("input", { "aria-label": label ? `${label} – number` : 'Phone number', name: `${name}__number`, type: "tel", inputMode: "tel", required: required, className: "form__input", placeholder: placeholder, onChange: onPhoneChange, onBlur: handleNumberBlur, value: number }),
+            React__default.createElement("input", { type: "hidden", name: name, value: compact([prefix, number]).join(' ') }))));
+};
 
-const selectHasMounted = (state) => state.booking.hasMounted;
-const selectGeneratePaymentUrl = (state) => state.booking.generatePaymentUrl;
-const selectSkipPaymentWithAgent = (state) => state.booking.skipPaymentWithAgent;
-const selectIsFetchingProductOptions = (state) => state.booking.isBusy;
-const selectDepartureFlight = (state) => state.booking.package?.outwardFlights?.find((x) => x.isSelected);
-const selectReturnFlight = (state) => state.booking.package?.returnFlights?.find((x) => x.isSelected);
-const selectPackageRooms = (state) => state.booking.package?.options.find((x) => x.isSelected)?.rooms;
-const selectIncludedServiceTypes = (state) => selectActiveOption(state)?.includedServiceTypes;
-const selectAvailabilities = (state) => state.booking.package?.options.find((x) => x.isSelected)?.availabilities;
-const selectPackageTags = (state) => state.booking.package?.tags;
-const selectIsOnRequest = (state) => state.booking.package?.options.find((x) => x.isSelected)?.isOnRequest;
-const selectPackageOptionUnits = (state) => state.booking.package?.options.find((x) => x.isSelected)?.optionUnits;
-const selectPackageOptionPax = (state) => state.booking.package?.options.find((x) => x.isSelected)?.optionPax;
-const selectPackageGroups = (state) => state.booking.package?.options.find((x) => x.isSelected)?.groups;
-const selectPackageDetails = (state) => state.booking.package;
-const selectPackageFlights = (state) => ({
-    outward: state.booking.package?.outwardFlights,
-    return: state.booking.package?.returnFlights
-});
-const selectFlightMetaData = (state) => state.booking.package?.flightInfo.metaData;
-const selectActiveOption = (state) => state.booking.package?.options.find((x) => x.isSelected);
-const selectPackageAirlineGroups = createSelector(selectActiveOption, selectDepartureFlight, selectReturnFlight, (option, departureFlight, returnFlight) => option?.airlineGroups.filter((x) => x.flightIds.includes(departureFlight?.entryLineGuid ?? '') || x.flightIds.includes(returnFlight?.entryLineGuid ?? '')));
-const selectPackageAirportGroups = createSelector(selectActiveOption, selectDepartureFlight, selectReturnFlight, (option, departureFlight, returnFlight) => option?.airportGroups.filter((x) => x.flightIds.includes(departureFlight?.entryLineGuid ?? '') || x.flightIds.includes(returnFlight?.entryLineGuid ?? '')));
-const selectRoomOptionDepartureFlightsMetaData = createSelector(selectActiveOption, selectFlightMetaData, (ativeOption, flightMetaData) => {
-    const roomOptions = ativeOption?.rooms.map((r) => r.options.filter((o) => o.isSelected).shift());
-    return roomOptions?.map((ro) => flightMetaData?.find((f) => f.entryLineGuid === ro?.entryLineGuid)?.flightMetaData).filter((f) => f !== undefined) ?? [];
-});
-const selectRoomOptionReturnFlightsMetaData = createSelector(selectActiveOption, selectFlightMetaData, (ativeOption, flightMetaData) => {
-    const selectedRoomOptions = ativeOption?.rooms.map((r) => r.options.filter((o) => o.isSelected));
-    // check if there are return flights selected
-    if (selectedRoomOptions?.some((ro) => ro.length > 1)) {
-        const roomOptions = ativeOption?.rooms.map((r) => r.options
-            .filter((o) => o.isSelected)
-            .reverse()
-            .shift());
-        return roomOptions?.map((ro) => flightMetaData?.find((f) => f.entryLineGuid === ro?.entryLineGuid)?.flightMetaData).filter((f) => f !== undefined) ?? [];
-    }
-    return undefined;
-});
-const selectApiSettings = (state) => state.apiSettings;
-const selectIsUnavailable = (state) => state.booking.isUnavailable;
-const selectRequestRooms = (state) => state.booking.package?.options.find((x) => x.isSelected)?.requestRooms;
-const selectOfficeId = (state) => state.booking.officeId;
-const selectLanguageCode = (state) => state.booking.languageCode;
-const selectCurrencyCode = (state) => state.booking.package?.currencyCode ?? 'EUR';
-const selectLanguage = (state) => state.booking.languageCode;
-const selectAllDynamicTranslations = (state) => state.booking.translations;
-const selectDynamicTranslations = createSelector([selectAllDynamicTranslations, selectLanguage], (allDynamicTranslations, language) => {
-    return allDynamicTranslations?.find((x) => x.language == language)?.value ?? {};
-});
-// Host override files are hand-maintained, and a null only ever blanks a key the component
-// then reads, so treat it like a missing key (lodash merge already skips undefined).
-const withoutNulls = (value) => isPlainObject$1(value)
-    ? mapValues(pickBy(value, (x) => x !== null), withoutNulls)
-    : value;
-// getTranslations deep-merges the overrides over a clone of the built-in translations, so a
-// host override of a nested group (TRAVELERS_FORM.VALIDATION, TRAVELERS_FORM.COUNTRIES)
-// only replaces the keys it actually contains. Merging per section one level deep dropped
-// every other built-in key of such a group, which made those keys resolve to undefined and
-// crash format() in the consuming component.
-const selectTranslations = createSelector([selectLanguage, selectDynamicTranslations], (language, dynamicTranslations) => getTranslations(language, isEmpty$1(dynamicTranslations) ? undefined : withoutNulls(dynamicTranslations)));
-const selectBookingOptions = (state) => state.booking.bookingOptions;
-const selectBookingType = (state) => state.booking.bookingType;
-const selectTagIds = (state) => state.booking.tagIds;
-const selectAgentAdressId = (state) => state.booking.agentAdressId;
-const selectProductAttributes = (state) => state.booking.productAttributes;
-const selectBookingAttributes = (state) => state.booking.bookingAttributes;
-const selectBookingNumber = (state) => state.booking.bookingNumber;
-const selectIsOption = (state) => state.booking.isOption;
-const selectBookingRooms = (state) => state.booking.bookingAttributes?.rooms;
-const selectBookingRemarks = (state) => state.booking.remarks;
-const selectVoucherCodes = (state) => state.booking.voucherCodes;
-const selectCalculateDeposit = (state) => state.booking.calculateDeposit;
-const selectShowCommission = (state) => state.booking.showCommission;
-const selectIsRetry = (state) => state.booking.isRetry;
-const selectStartDate = (state) => state.booking.package?.options.find((x) => x.isSelected)?.fromDate;
-const selectEndDate = (state) => state.booking.package?.options.find((x) => x.isSelected)?.toDate;
-const selectAgents = (state) => state.booking.agents;
-const selectCountries = (state) => state.booking.countries;
-const selectProductCode = (state) => state.booking.productAttributes?.productCode;
-const selectAccommodationCodes = (state) => {
-    const accommodationCodes = [];
-    state.booking.package?.options.forEach((o) => {
-        o.rooms.forEach((r) => r.options.forEach((ro) => {
-            if (!accommodationCodes.some((y) => y === ro.accommodationCode)) {
-                accommodationCodes.push(ro.accommodationCode);
-            }
-        }));
-    });
-    return accommodationCodes;
+const hasVisibleError = (formik, key) => get(formik.errors, key) && get(formik.touched, key);
+
+const GenderControl = ({ translations, value, formik, name }) => {
+    return (React__default.createElement("div", { className: buildClassName(['form__group', hasVisibleError(formik, name) && 'form__group--error']) },
+        React__default.createElement("label", { className: "form__label" },
+            translations.TRAVELERS_FORM.GENDER_ID,
+            " *"),
+        React__default.createElement("div", { className: "radiobutton-group" },
+            React__default.createElement("div", { className: "radiobutton" },
+                React__default.createElement("label", { className: "radiobutton__label" },
+                    React__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_GENDER)),
+            React__default.createElement("div", { className: "radiobutton" },
+                React__default.createElement("label", { className: "radiobutton__label" },
+                    React__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_GENDER)))));
 };
-const selectAccommodationViews = (state) => state.booking.accommodationViews;
-const selectMappingInfo = (state) => state.booking.package?.options.find((x) => x.isSelected)?.mappingInfo;
-const selectBookingQuery = (state) => {
-    const bookingAttributes = state.booking.bookingAttributes;
-    if (!bookingAttributes) {
-        return undefined;
-    }
-    const params = {};
-    Object.entries(bookingAttributes).forEach(([key, value]) => {
-        if (key === 'startDate' || key === 'endDate') {
-            value = format$2(parseISO(value), 'yyyy-MM-dd');
-        }
-        if (key === 'rooms') {
-            value = JsonURL.stringify(value.map((room) => omit(room, ['children'])), {
-                AQF: true
-            });
+
+const TypeAheadInput = ({ name, value, placeholder, options, onChange, onSelect, onClear }) => {
+    const [showItems, setShowItems] = useState(false);
+    const handleChange = (e) => {
+        if (onChange) {
+            onChange(e.target.value);
         }
-        if (key === 'allotmentIds' && !value.length) {
-            value = undefined;
+    };
+    const handleClearClick = (e) => {
+        if (onClear) {
+            onClear();
         }
-        if (key === 'flight' && value) {
-            var flightInfo = value;
+        setShowItems(false);
+    };
+    return (React__default.createElement("div", { className: "typeahead" },
+        React__default.createElement("div", { className: "typeahead__trigger typeahead__trigger--icon" },
+            React__default.createElement(Icon, { name: "ui-qsm-location" }),
+            React__default.createElement("input", { type: "text", className: "form__input", name: name, value: value, onChange: handleChange, placeholder: placeholder, required: true, autoComplete: "off", onKeyDown: (e) => {
+                    if (e.key === 'Tab' && options && onSelect) {
+                        onSelect(options[0].key);
+                        setShowItems(false);
+                    }
+                }, onFocus: () => setShowItems(true) }),
+            React__default.createElement("button", { type: "button", className: "button button--clear", onClick: handleClearClick })),
+        options && options.length > 0 && showItems && (React__default.createElement("div", { className: "typeahead__options" }, (options ?? []).map((option) => {
+            const matchIndex = typeof value !== 'undefined' ? option.text.indexOf(value) : 0;
+            const prefix = option.text.slice(0, matchIndex);
+            const highlight = option.text.slice(matchIndex, value?.length ?? 0);
+            const suffix = option.text.slice(matchIndex);
+            return (React__default.createElement("div", { className: "typeahead__option", key: option.key },
+                React__default.createElement("div", { className: "typeahead__option-header" },
+                    React__default.createElement("button", { onClick: () => {
+                            if (onSelect)
+                                onSelect(option.key);
+                            setShowItems(false);
+                        }, type: "button", className: "button button--plain" },
+                        prefix,
+                        React__default.createElement("span", { className: "typeahead__option-highlight" }, highlight),
+                        suffix))));
+        })))));
+};
+
+// A traveler is a baby when the age they were booked with is at or below the baby
+// boundary. Babies get their own label and birth date validation (TIDE-3269). Only
+// meaningful for the regular form: the compact form asks for an age instead of a birth
+// date, so it has nothing to validate and its own age input already states the age.
+function isBabyAge(age, maxBabyAge = BABY_MAX_AGE) {
+    return typeof age === 'number' && age <= maxBabyAge;
+}
+// The native date input can hold values format() throws on (e.g. a 5+ digit year while typing), so never format an unvalidated birthDate
+function formatBirthDate$1(birthDate) {
+    if (!birthDate)
+        return '';
+    const parsed = parse(birthDate, 'yyyy-MM-dd', new Date());
+    return isValid(parsed) ? format$2(parsed, 'dd-MM-yyyy') : '';
+}
+// A field can have separate "main-booker"/other-pax variants sharing the same identity
+// (customFieldConfigurationId for custom fields, fieldName for built-in fields).
+const MAIN_BOOKER_GROUP = 'main-booker';
+const isCustomPaxField = (field) => field.customFieldConfigurationId != null;
+function resolveApplicablePaxFields(fields, isMainBooker) {
+    const variantsByKey = new Map();
+    fields.forEach((field) => {
+        const key = field.customFieldConfigurationId ?? field.fieldName;
+        const variants = variantsByKey.get(key) ?? [];
+        variants.push(field);
+        variantsByKey.set(key, variants);
+    });
+    const applicableFields = [];
+    variantsByKey.forEach((variants) => {
+        const hasRoleSplit = variants.some((v) => v.group === MAIN_BOOKER_GROUP);
+        if (!hasRoleSplit) {
+            applicableFields.push(variants[0]);
+            return;
+        }
+        const roleMatch = variants.find((v) => (v.group === MAIN_BOOKER_GROUP) === isMainBooker);
+        if (roleMatch)
+            applicableFields.push(roleMatch);
+    });
+    return applicableFields;
+}
+function buildEmptyCustomFields(paxFields = []) {
+    const uniqueIds = Array.from(new Set(paxFields.filter(isCustomPaxField).map((field) => field.customFieldConfigurationId)));
+    return uniqueIds.map((customFieldConfigurationId) => ({ customFieldConfigurationId, value: '' }));
+}
+function getApplicablePaxCustomFields(paxFields = [], isMainBooker) {
+    return resolveApplicablePaxFields(paxFields.filter(isCustomPaxField), isMainBooker);
+}
+function getApplicableBuiltInPaxFields(paxFields = [], isMainBooker) {
+    return resolveApplicablePaxFields(paxFields.filter((f) => !isCustomPaxField(f)), isMainBooker);
+}
+function getBuiltInPaxField(paxFields = [], fieldName, isMainBooker) {
+    return getApplicableBuiltInPaxFields(paxFields, isMainBooker).find((f) => f.fieldName === fieldName);
+}
+// fieldName -> path on `Traveler`, shared with validate-form.ts.
+const BUILT_IN_FIELD_PATHS = {
+    gender: 'gender',
+    firstName: 'firstName',
+    lastName: 'lastName',
+    dateOfBirth: 'birthDate',
+    nickname: 'nickname',
+    birthplace: 'birthplace',
+    nationality: 'nationality',
+    preferredLanguageId: 'preferredLanguageId',
+    email: 'email',
+    phone: 'phone',
+    mobile: 'mobile',
+    passportIssueDate: 'passportIssueDate',
+    passportIssuedLocation: 'passportIssuedLocation',
+    passportExpiryDate: 'passportExpiryDate',
+    passportNumber: 'passportNumber',
+    emergencyNumber: 'emergencyNumber',
+    hasInsurance: 'hasInsurance',
+    insuranceName: 'insuranceName',
+    info: 'info',
+    street: 'address.street',
+    location: 'address.location',
+    countryId: 'address.country',
+    postalCode: 'address.postalCode',
+    number: 'address.number'
+};
+// The 4 fields that always render/validate regardless of paxFields config (fallback behavior).
+const CORE_FIELD_NAMES = new Set(['gender', 'firstName', 'lastName', 'dateOfBirth']);
+const ADDRESS_FIELD_NAMES = ['street', 'location', 'countryId', 'postalCode', 'number'];
+// Shared by buildPax (new-booking) and applyTravelersFormValuesToEditablePackagingEntry
+// (edit-booking), now that PackagingEntryPax and BookingPackagePax have the same shape.
+function applyTravelerToPax(pax, traveler, mainBookerId) {
+    return {
+        ...pax,
+        firstName: traveler.firstName ?? '',
+        lastName: traveler.lastName ?? '',
+        dateOfBirth: traveler.birthDate || null,
+        isMainBooker: mainBookerId != null ? traveler.id === mainBookerId : pax.isMainBooker,
+        weight: traveler.weight ?? null,
+        weightType: traveler.weightType ?? build.WeightType.kilograms,
+        height: traveler.height ?? null,
+        heightType: traveler.heightType ?? build.HeightType.centimeters,
+        nickname: traveler.nickname,
+        birthplace: traveler.birthplace,
+        nationality: traveler.nationality,
+        preferredLanguageId: traveler.preferredLanguageId,
+        email: traveler.email,
+        phone: traveler.phone,
+        mobilePhone: traveler.mobile,
+        emergencyNumber: traveler.emergencyNumber,
+        passportNumber: traveler.passportNumber,
+        passportIssueDate: traveler.passportIssueDate,
+        passportIssuedLocation: traveler.passportIssuedLocation,
+        passportExpiryDate: traveler.passportExpiryDate,
+        hasInsurance: traveler.hasInsurance,
+        insuranceName: traveler.insuranceName,
+        info: traveler.info,
+        address: buildTravelerAddress(traveler),
+        customFields: traveler.customFields ?? []
+    };
+}
+// name/email are required on the wire but aren't part of the per-traveler address sub-form -
+// derive them from the traveler's own name/email instead of asking twice.
+function buildTravelerAddress(traveler) {
+    if (!traveler.address || !Object.values(traveler.address).some((v) => !!v))
+        return undefined;
+    return {
+        name: `${traveler.firstName} ${traveler.lastName}`.trim(),
+        street: traveler.address.street ?? '',
+        number: traveler.address.number ?? '',
+        postalCode: traveler.address.postalCode ?? '',
+        location: traveler.address.location ?? '',
+        country: traveler.address.country ?? '',
+        email: traveler.email ?? ''
+    };
+}
+// Always initialized (even when not shown) to keep Formik inputs controlled, matching weight/height.
+const EMPTY_BUILT_IN_FIELDS = {
+    nickname: '',
+    birthplace: '',
+    nationality: '',
+    preferredLanguageId: undefined,
+    email: '',
+    phone: '',
+    mobile: '',
+    passportNumber: '',
+    passportIssueDate: '',
+    passportIssuedLocation: '',
+    passportExpiryDate: '',
+    emergencyNumber: '',
+    hasInsurance: false,
+    insuranceName: '',
+    info: '',
+    address: { street: '', number: '', postalCode: '', location: '', country: '' }
+};
+function createTraveler(traveler, followNumber, personTranslation, isCompact, maxBabyAge, paxFields) {
+    if (isCompact) {
+        return {
+            id: traveler.id,
+            firstName: personTranslation,
+            lastName: `${followNumber.number++}`,
+            birthDate: '',
+            gender: '',
+            // Keep a booked age of 0 instead of submitting and pricing the traveler as a 30 year
+            // old, while still falling back for a missing or unusable age. `??` alone would let a
+            // NaN (unparseable date of birth upstream) reach the age input and the booked pax.
+            // See TIDE-3269.
+            age: Number.isFinite(traveler.age) ? traveler.age : 30,
+            // No isBaby here on purpose: the age below is editable and nothing revalidates it
+            // in compact mode, so a stored flag would end up contradicting the entered age.
+            weight: null,
+            weightType: build.WeightType.kilograms,
+            height: null,
+            heightType: build.HeightType.centimeters,
+            ...EMPTY_BUILT_IN_FIELDS,
+            customFields: buildEmptyCustomFields(paxFields)
+        };
+    }
+    return {
+        id: traveler.id,
+        firstName: '',
+        lastName: '',
+        birthDate: '',
+        gender: '',
+        isBaby: isBabyAge(traveler.age, maxBabyAge),
+        weight: null,
+        weightType: build.WeightType.kilograms,
+        height: null,
+        heightType: build.HeightType.centimeters,
+        ...EMPTY_BUILT_IN_FIELDS,
+        customFields: buildEmptyCustomFields(paxFields)
+    };
+}
+function createInitialValuesFromRooms(formRooms, startDate, endDate, agentAdressId, personTranslation, isCompact, maxBabyAge, paxFields) {
+    const followNumber = { number: 1 };
+    const initialValues = {
+        startDate,
+        endDate,
+        rooms: formRooms.map((room) => ({
+            adults: room.adults.map((traveler) => createTraveler(traveler, followNumber, personTranslation, isCompact, maxBabyAge, paxFields)),
+            children: room.children.map((traveler) => createTraveler(traveler, followNumber, personTranslation, isCompact, maxBabyAge, paxFields))
+        })),
+        mainBookerId: -1,
+        street: '',
+        houseNumber: '',
+        box: '',
+        zipCode: '',
+        place: '',
+        country: '',
+        phone: '',
+        email: '',
+        emailConfirmation: '',
+        travelAgentId: agentAdressId ?? 0,
+        travelAgentName: ''
+    };
+    if (initialValues.rooms?.[0]?.adults?.[0]) {
+        initialValues.mainBookerId = initialValues.rooms[0].adults[0].id;
+    }
+    return initialValues;
+}
+function mapPackagingEntryPaxToTraveler(roomTraveler) {
+    return {
+        weight: roomTraveler.weight ?? null,
+        weightType: roomTraveler.weightType ?? build.WeightType.kilograms,
+        height: roomTraveler.height ?? null,
+        heightType: roomTraveler.heightType ?? build.HeightType.centimeters,
+        nickname: roomTraveler.nickname ?? '',
+        birthplace: roomTraveler.birthplace ?? '',
+        nationality: roomTraveler.nationality ?? '',
+        preferredLanguageId: roomTraveler.preferredLanguageId,
+        email: roomTraveler.email ?? '',
+        phone: roomTraveler.phone ?? '',
+        mobile: roomTraveler.mobilePhone ?? '',
+        passportNumber: roomTraveler.passportNumber ?? '',
+        passportIssueDate: roomTraveler.passportIssueDate ?? '',
+        passportIssuedLocation: roomTraveler.passportIssuedLocation ?? '',
+        passportExpiryDate: roomTraveler.passportExpiryDate ?? '',
+        emergencyNumber: roomTraveler.emergencyNumber ?? '',
+        hasInsurance: roomTraveler.hasInsurance ?? false,
+        insuranceName: roomTraveler.insuranceName ?? '',
+        info: roomTraveler.info ?? '',
+        address: roomTraveler.address
+            ? {
+                street: roomTraveler.address.street ?? '',
+                number: roomTraveler.address.number ?? '',
+                postalCode: roomTraveler.address.postalCode ?? '',
+                location: roomTraveler.address.location ?? '',
+                country: roomTraveler.address.country ?? ''
+            }
+            : undefined,
+        customFields: roomTraveler.customFields ?? []
+    };
+}
+function createInitialValuesFromEditablePackagingEntry(editablePackagingEntry, agentAdressId) {
+    const pax = editablePackagingEntry?.pax ?? [];
+    const rooms = editablePackagingEntry.rooms.map((room) => {
+        const roomPax = pax.filter((x) => room.paxIds.includes(x.id));
+        const adults = roomPax.filter((x) => x.age >= 18);
+        const children = roomPax.filter((x) => x.age < 18);
+        return {
+            adults: adults.map((roomTraveler) => {
+                return {
+                    id: roomTraveler.id,
+                    firstName: roomTraveler.firstName ?? '',
+                    lastName: roomTraveler.lastName ?? '',
+                    birthDate: roomTraveler.dateOfBirth ? format$2(new Date(roomTraveler.dateOfBirth), 'yyyy-MM-dd') : '',
+                    gender: '',
+                    ...mapPackagingEntryPaxToTraveler(roomTraveler)
+                };
+            }),
+            children: children.map((roomTraveler) => {
+                return {
+                    id: roomTraveler.id,
+                    firstName: roomTraveler.firstName ?? '',
+                    lastName: roomTraveler.lastName ?? '',
+                    birthDate: roomTraveler.dateOfBirth ? format$2(new Date(roomTraveler.dateOfBirth), 'yyyy-MM-dd') : '',
+                    gender: '',
+                    isBaby: isBabyAge(roomTraveler.age),
+                    ...mapPackagingEntryPaxToTraveler(roomTraveler)
+                };
+            })
+        };
+    });
+    const values = createInitialValuesFromRooms(rooms.map((room) => ({ adults: room.adults, children: room.children })), first(editablePackagingEntry?.lines)?.from, last(editablePackagingEntry?.lines)?.to, agentAdressId);
+    values.rooms = rooms;
+    values.mainBookerId = pax.find((x) => x.isMainBooker)?.id ?? rooms[0]?.adults?.[0]?.id ?? -1;
+    const address = editablePackagingEntry?.address;
+    values.street = address?.street ?? '';
+    values.houseNumber = address?.houseNumber ?? '';
+    values.box = address?.box ?? '';
+    values.zipCode = address?.zipCode ?? '';
+    values.place = address?.place ?? '';
+    values.country = address?.country ?? '';
+    values.phone = address?.phone ?? '';
+    values.email = address?.email ?? '';
+    values.emailConfirmation = address?.email ?? '';
+    values.travelAgentId = address?.travelAgentId ?? agentAdressId ?? 0;
+    return values;
+}
+function applyTravelersFormValuesToEditablePackagingEntry(editablePackagingEntry, values) {
+    const travelers = values.rooms.flatMap((room) => [...room.adults, ...room.children]);
+    // The backend treats the main booker's per-pax address as authoritative, so keep the
+    // booking-level address in sync with it rather than sending two independent values.
+    const mainBookerAddress = travelers.find((x) => x.id === values.mainBookerId)?.address;
+    return {
+        ...editablePackagingEntry,
+        pax: (editablePackagingEntry.pax ?? []).map((pax) => {
+            const traveler = travelers.find((x) => x.id === pax.id);
+            return traveler ? applyTravelerToPax(pax, traveler, values.mainBookerId) : pax;
+        }),
+        address: {
+            ...editablePackagingEntry.address,
+            street: mainBookerAddress?.street || values.street,
+            houseNumber: mainBookerAddress?.number || values.houseNumber,
+            box: values.box,
+            zipCode: mainBookerAddress?.postalCode || values.zipCode,
+            place: mainBookerAddress?.location || values.place,
+            country: mainBookerAddress?.country || values.country,
+            travelAgentId: values.travelAgentId,
+            phone: values.phone,
+            email: values.email
+        }
+    };
+}
+const SharedTravelersForm = ({ formik, translations, travellersSettings, countries, agents, bookingType, agentAdressId, travelersFirstStep = false, isUnavailable = false, useCompactForm = false, showAllCountries = false, paxFields, showAgentSelection = false, initialShowAgents = false, renderPreviousButton, onBookingTypeChange }) => {
+    const [showAgents, setShowAgents] = useState(initialShowAgents);
+    const typeaheadAgents = useMemo(() => sortBy(agents?.map((agent) => ({
+        key: `${agent.id}`,
+        value: `${agent.name}${agent.postalCode || agent.location ? ` (${compact([agent.postalCode, agent.location]).join(' ')})` : ''}`,
+        text: `${agent.name}${agent.postalCode || agent.location ? ` (${compact([agent.postalCode, agent.location]).join(' ')})` : ''}`
+    })), 'value') ?? [], [agents]);
+    const [filteredAgents, setFilteredAgents] = useState(typeaheadAgents);
+    const flatErrors = flat(formik.errors);
+    const errorKeys = Object.keys(flatErrors).filter((key) => get(formik.touched, key));
+    const hasVisibleError = (key) => get(formik.errors, key) && get(formik.touched, key);
+    const mainBooker = formik.values.rooms
+        .find((room) => room.adults.find((traveler) => traveler.id === formik.values.mainBookerId))
+        ?.adults.find((traveler) => traveler.id === formik.values.mainBookerId);
+    const countryOptions = [
+        { key: 'empty', value: undefined, label: translations.TRAVELERS_FORM.SELECT_COUNTRY },
+        ...(showAllCountries
+            ? countries?.map((country) => ({ key: country.iso2, value: country.iso2, label: country.name })) ?? []
+            : travellersSettings?.countries?.map((country) => ({ key: country.iso2, value: country.iso2, label: country.name })) ?? [
+                { 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 }
+            ])
+    ];
+    const handleMainBookerChange = (event) => {
+        formik.setFieldValue('mainBookerId', parseInt(event.currentTarget.value, 10));
+    };
+    const handleAgentChange = (value) => {
+        setFilteredAgents(typeaheadAgents.filter((x) => x.value.toLocaleLowerCase().indexOf(value.toLocaleLowerCase()) > -1));
+        formik.setFieldValue('travelAgentName', value);
+    };
+    const handleAgentSelect = (key) => {
+        const agent = typeaheadAgents.find((x) => x.key === key);
+        formik.setValues({
+            ...formik.values,
+            travelAgentId: Number(agent?.key),
+            travelAgentName: agent?.value ?? ''
+        });
+        onBookingTypeChange?.(agentAdressId && agentAdressId !== 0 ? 'b2b' : 'b2b2c');
+    };
+    const handleAgentClear = () => {
+        formik.setValues({ ...formik.values, travelAgentId: 0, travelAgentName: '' });
+        onBookingTypeChange?.('b2c');
+    };
+    const toggleAgent = (value) => {
+        setShowAgents(value);
+        if (!value) {
+            handleAgentClear();
+            setFilteredAgents([]);
+        }
+    };
+    const handleAddTraveler = (roomIndex) => {
+        const rooms = [...formik.values.rooms];
+        const newAdult = {
+            id: Date.now(),
+            firstName: '',
+            lastName: '',
+            birthDate: '',
+            gender: '',
+            weight: null,
+            weightType: build.WeightType.kilograms,
+            height: null,
+            heightType: build.HeightType.centimeters,
+            ...EMPTY_BUILT_IN_FIELDS,
+            customFields: buildEmptyCustomFields(paxFields)
+        };
+        rooms[roomIndex] = { ...rooms[roomIndex], adults: [...rooms[roomIndex].adults, newAdult] };
+        formik.setFieldValue('rooms', rooms);
+    };
+    const handleRemoveTraveler = (roomIndex, travelerIndex) => {
+        const rooms = [...formik.values.rooms];
+        const adults = [...rooms[roomIndex].adults];
+        if (adults.length <= 1)
+            return;
+        adults.splice(travelerIndex, 1);
+        rooms[roomIndex] = { ...rooms[roomIndex], adults };
+        formik.setFieldValue('rooms', rooms);
+    };
+    const handleAddRoom = () => {
+        const rooms = [...formik.values.rooms];
+        rooms.push({
+            adults: [
+                {
+                    id: Date.now(),
+                    firstName: '',
+                    lastName: '',
+                    birthDate: '',
+                    gender: '',
+                    weight: null,
+                    weightType: build.WeightType.kilograms,
+                    height: null,
+                    heightType: build.HeightType.centimeters,
+                    ...EMPTY_BUILT_IN_FIELDS,
+                    customFields: buildEmptyCustomFields(paxFields)
+                }
+            ],
+            children: []
+        });
+        formik.setFieldValue('rooms', rooms);
+    };
+    const handleRemoveRoom = (roomIndex) => {
+        const rooms = [...formik.values.rooms];
+        rooms.splice(roomIndex, 1);
+        formik.setFieldValue('rooms', rooms);
+    };
+    const renderWeightControl = (namePrefix, value, isRequired) => (React__default.createElement("div", { className: "form__row" },
+        React__default.createElement(LabeledInput, { type: "number", min: 0, hasError: hasVisibleError(`${namePrefix}.weight`), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.WEIGHT, required: isRequired, name: `${namePrefix}.weight`, onChange: formik.handleChange, onBlur: formik.handleBlur, value: value.weight ?? '' }),
+        React__default.createElement(LabeledSelect, { extraClassName: "form__group--md-33", name: `${namePrefix}.weightType`, onChange: formik.handleChange, onBlur: formik.handleBlur, value: value.weightType, options: [
+                { key: 'kg', value: build.WeightType.kilograms, label: translations.TRAVELERS_FORM.WEIGHT_UNIT_KG },
+                { key: 'lb', value: build.WeightType.pounds, label: translations.TRAVELERS_FORM.WEIGHT_UNIT_LB }
+            ] })));
+    const renderHeightControl = (namePrefix, value, isRequired) => (React__default.createElement("div", { className: "form__row" },
+        React__default.createElement(LabeledInput, { type: "number", min: 0, hasError: hasVisibleError(`${namePrefix}.height`), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.HEIGHT, required: isRequired, name: `${namePrefix}.height`, onChange: formik.handleChange, onBlur: formik.handleBlur, value: value.height ?? '' }),
+        React__default.createElement(LabeledSelect, { extraClassName: "form__group--md-33", name: `${namePrefix}.heightType`, onChange: formik.handleChange, onBlur: formik.handleBlur, value: value.heightType, options: [
+                { key: 'cm', value: build.HeightType.centimeters, label: translations.TRAVELERS_FORM.HEIGHT_UNIT_CM },
+                { key: 'ftIn', value: build.HeightType.feetInches, label: translations.TRAVELERS_FORM.HEIGHT_UNIT_FT_IN }
+            ] })));
+    const getCustomFieldControl = (field, value, name) => {
+        const label = compact([field.fieldName, field.isRequired && '*']).join(' ');
+        switch (field.dataType) {
+            case build.CustomFieldDataType.bool:
+                return (React__default.createElement("div", { className: buildClassName(['form__group', hasVisibleError(name) && 'form__group--error']) },
+                    React__default.createElement("div", { className: "checkbox" },
+                        React__default.createElement("label", { className: "checkbox__label" },
+                            React__default.createElement("input", { type: "checkbox", className: "checkbox__input", checked: value === 'true', onChange: (e) => formik.setFieldValue(name, e.target.checked ? 'true' : 'false'), onBlur: formik.handleBlur, name: name }),
+                            label))));
+            case build.CustomFieldDataType.date:
+                return (React__default.createElement(LabeledInput, { type: "date", hasError: hasVisibleError(name), label: label, name: name, onChange: (e) => formik.setFieldValue(name, e.target.value), onBlur: formik.handleBlur, value: value }));
+            case build.CustomFieldDataType.time:
+                return (React__default.createElement(LabeledInput, { type: "time", hasError: hasVisibleError(name), label: label, name: name, onChange: (e) => formik.setFieldValue(name, e.target.value), onBlur: formik.handleBlur, value: value }));
+            case build.CustomFieldDataType.numeric:
+                return (React__default.createElement(LabeledInput, { type: "number", hasError: hasVisibleError(name), label: label, name: name, onChange: (e) => formik.setFieldValue(name, e.target.value), onBlur: formik.handleBlur, value: value }));
+            case build.CustomFieldDataType.string:
+            default:
+                return (React__default.createElement(LabeledInput, { hasError: hasVisibleError(name), label: label, name: name, onChange: (e) => formik.setFieldValue(name, e.target.value), onBlur: formik.handleBlur, value: value }));
+        }
+    };
+    const renderCustomFields = (travelerValues, namePrefix) => {
+        if (!paxFields?.length)
+            return null;
+        const isMainBooker = travelerValues.id === formik.values.mainBookerId;
+        const applicableFields = getApplicablePaxCustomFields(paxFields, isMainBooker);
+        if (!applicableFields.length)
+            return null;
+        return (React__default.createElement("div", { className: "travelers-form__custom-fields-grid" }, applicableFields.map((field) => {
+            const fieldIndex = travelerValues.customFields?.findIndex((c) => c.customFieldConfigurationId === field.customFieldConfigurationId) ?? -1;
+            if (fieldIndex < 0)
+                return null;
+            const name = `${namePrefix}.customFields[${fieldIndex}].value`;
+            const value = travelerValues.customFields[fieldIndex].value;
+            return (React__default.createElement("div", { key: field.customFieldConfigurationId, style: { gridColumn: `span ${field.col || 12}` } }, getCustomFieldControl(field, value, name)));
+        })));
+    };
+    // Fields with a dedicated control (gender, hasInsurance, countryId) aren't listed here.
+    const BUILT_IN_FIELD_CONTROL_META = {
+        firstName: { label: translations.TRAVELERS_FORM.FIRST_NAME },
+        lastName: { label: translations.TRAVELERS_FORM.LAST_NAME },
+        dateOfBirth: { type: 'date', label: translations.TRAVELERS_FORM.BIRTHDATE },
+        nickname: { label: translations.TRAVELERS_FORM.NICKNAME },
+        birthplace: { label: translations.TRAVELERS_FORM.BIRTHPLACE },
+        nationality: { label: translations.TRAVELERS_FORM.NATIONALITY },
+        preferredLanguageId: { type: 'number', label: translations.TRAVELERS_FORM.PREFERRED_LANGUAGE },
+        email: { type: 'email', label: translations.TRAVELERS_FORM.TRAVELER_EMAIL },
+        phone: { label: translations.TRAVELERS_FORM.TRAVELER_PHONE },
+        mobile: { label: translations.TRAVELERS_FORM.TRAVELER_MOBILE },
+        passportNumber: { label: translations.TRAVELERS_FORM.PASSPORT_NUMBER },
+        passportIssueDate: { type: 'date', label: translations.TRAVELERS_FORM.PASSPORT_ISSUE_DATE },
+        passportIssuedLocation: { label: translations.TRAVELERS_FORM.PASSPORT_ISSUED_LOCATION },
+        passportExpiryDate: { type: 'date', label: translations.TRAVELERS_FORM.PASSPORT_EXPIRY_DATE },
+        emergencyNumber: { label: translations.TRAVELERS_FORM.EMERGENCY_NUMBER },
+        insuranceName: { label: translations.TRAVELERS_FORM.INSURANCE_NAME },
+        info: { label: translations.TRAVELERS_FORM.INFO },
+        street: { label: translations.TRAVELERS_FORM.STREET },
+        location: { label: translations.TRAVELERS_FORM.CITY },
+        postalCode: { label: translations.TRAVELERS_FORM.ZIPCODE },
+        number: { label: translations.TRAVELERS_FORM.HOUSE_NUMBER }
+    };
+    const renderBuiltInFieldControl = (fieldName, isRequired, travelerValues, namePrefix) => {
+        const path = BUILT_IN_FIELD_PATHS[fieldName] ?? fieldName;
+        const name = `${namePrefix}.${path}`;
+        const value = get(travelerValues, path);
+        switch (fieldName) {
+            case 'gender':
+                return React__default.createElement(GenderControl, { translations: translations, value: travelerValues, formik: formik, name: name });
+            case 'hasInsurance':
+                return (React__default.createElement("div", { className: buildClassName(['form__group', hasVisibleError(name) && 'form__group--error']) },
+                    React__default.createElement("div", { className: "checkbox" },
+                        React__default.createElement("label", { className: "checkbox__label" },
+                            React__default.createElement("input", { type: "checkbox", className: "checkbox__input", checked: !!value, onChange: (e) => formik.setFieldValue(name, e.target.checked), onBlur: formik.handleBlur, name: name }),
+                            compact([translations.TRAVELERS_FORM.HAS_INSURANCE, isRequired && '*']).join(' ')))));
+            case 'countryId':
+                return (React__default.createElement(LabeledSelect, { hasError: hasVisibleError(name), label: translations.TRAVELERS_FORM.COUNTRY, required: isRequired, name: name, onChange: formik.handleChange, onBlur: formik.handleBlur, value: value, options: countryOptions }));
+            case 'weight':
+                return renderWeightControl(namePrefix, travelerValues, isRequired);
+            case 'height':
+                return renderHeightControl(namePrefix, travelerValues, isRequired);
+            default: {
+                const meta = BUILT_IN_FIELD_CONTROL_META[fieldName] ?? { label: fieldName };
+                return (React__default.createElement(LabeledInput, { type: meta.type, hasError: hasVisibleError(name), label: meta.label, required: isRequired, name: name, onChange: formik.handleChange, onBlur: formik.handleBlur, value: value ?? '' }));
+            }
+        }
+    };
+    const CORE_FIELD_DEFAULTS = {
+        gender: { isRequired: true, col: 4 },
+        firstName: { isRequired: true, col: 4 },
+        lastName: { isRequired: true, col: 4 },
+        dateOfBirth: { isRequired: true, col: 4 }
+    };
+    const resolveBuiltInField = (fieldName, travelerValues) => {
+        const isMainBooker = travelerValues.id === formik.values.mainBookerId;
+        const configured = getBuiltInPaxField(paxFields, fieldName, isMainBooker);
+        const fallback = CORE_FIELD_DEFAULTS[fieldName];
+        if (!configured && !fallback)
+            return undefined;
+        return { isRequired: configured?.isRequired ?? fallback.isRequired, col: configured?.col ?? fallback.col };
+    };
+    const renderBuiltInField = (fieldName, travelerValues, namePrefix) => {
+        const resolved = resolveBuiltInField(fieldName, travelerValues);
+        if (!resolved)
+            return null;
+        return (React__default.createElement("div", { key: fieldName, style: { gridColumn: `span ${resolved.col || 12}` } }, renderBuiltInFieldControl(fieldName, resolved.isRequired, travelerValues, namePrefix)));
+    };
+    const renderTravelerAddressFields = (travelerValues, namePrefix) => {
+        const fields = ADDRESS_FIELD_NAMES.map((fieldName) => renderBuiltInField(fieldName, travelerValues, namePrefix)).filter(Boolean);
+        if (!fields.length)
+            return null;
+        return React__default.createElement("div", { className: "travelers-form__custom-fields-grid" }, fields);
+    };
+    const getControl = (type, value, name) => {
+        switch (type) {
+            case 'country':
+                return (React__default.createElement(LabeledSelect, { hasError: hasVisibleError('country'), label: translations.TRAVELERS_FORM.COUNTRY, required: true, name: "country", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.country, options: countryOptions }));
+            case 'phone':
+                return (React__default.createElement(PhoneInput, { countries: travellersSettings?.countries ?? [], countryIso2: formik.values.country, hasError: hasVisibleError('phone'), label: translations.TRAVELERS_FORM.PHONE, required: true, name: "phone", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.phone }));
+            case 'email':
+                return (React__default.createElement(React__default.Fragment, null,
+                    React__default.createElement(LabeledInput, { type: "email", hasError: hasVisibleError('email'), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.EMAIL, required: true, name: "email", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.email }),
+                    React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.emailConfirmation })));
+            case 'street':
+                return (React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.street }));
+            case 'houseNumber':
+                return (React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.houseNumber }));
+            case 'box':
+                return (React__default.createElement(LabeledInput, { hasError: hasVisibleError('box'), extraClassName: "form__group--20", label: translations.TRAVELERS_FORM.POST_BOX, name: "box", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.box }));
+            case 'zipCode':
+                return (React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.zipCode }));
+            case 'place':
+                return (React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.place }));
+            default:
+                return null;
+        }
+    };
+    const renderRoomLabel = (room) => compact([
+        room.adults.length,
+        room.adults.length === 1 && ` ${translations.TRAVELERS_FORM.ADULT}`,
+        room.adults.length > 1 && ` ${translations.TRAVELERS_FORM.ADULTS}`,
+        room.adults?.length && room.children?.length && ', ',
+        room.children.length,
+        room.children.length === 1 && ` ${translations.TRAVELERS_FORM.CHILD}`,
+        room.children.length > 1 && ` ${translations.TRAVELERS_FORM.CHILDREN}`
+    ]).join('');
+    const renderTravelerFields = (travelerValues, namePrefix, isAdult, roomIndex, travelerIndex) => {
+        if (useCompactForm) {
+            return (React__default.createElement("div", { className: "form__row" },
+                React__default.createElement(LabeledInput, { hasError: hasVisibleError(`${namePrefix}.age`), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.AGE, required: true, name: `${namePrefix}.age`, onChange: formik.handleChange, onBlur: formik.handleBlur, value: travelerValues.age })));
+        }
+        // 'birthDate' (the legacy formFields type string) is normalized to the paxFields catalog's
+        // 'dateOfBirth' fieldName for config lookups.
+        const baseFieldNames = (travellersSettings?.formFields?.length ? travellersSettings.formFields.map((field) => field.type) : ['gender', 'firstName', 'lastName', 'dateOfBirth']).map((fieldName) => (fieldName === 'birthDate' ? 'dateOfBirth' : fieldName));
+        const isMainBooker = travelerValues.id === formik.values.mainBookerId;
+        const extraFieldNames = getApplicableBuiltInPaxFields(paxFields, isMainBooker)
+            .map((field) => field.fieldName)
+            .filter((fieldName) => !baseFieldNames.includes(fieldName) && !ADDRESS_FIELD_NAMES.includes(fieldName));
+        return (React__default.createElement(React__default.Fragment, null,
+            React__default.createElement("div", { className: "travelers-form__custom-fields-grid" }, [...baseFieldNames, ...extraFieldNames].map((fieldName) => renderBuiltInField(fieldName, travelerValues, namePrefix))),
+            renderTravelerAddressFields(travelerValues, namePrefix),
+            renderCustomFields(travelerValues, namePrefix),
+            travelersFirstStep && isAdult && formik.values.rooms[roomIndex].adults.length > 1 && (React__default.createElement("button", { type: "button", className: "cta cta--secondary", onClick: () => handleRemoveTraveler(roomIndex, travelerIndex) }, translations.TRAVELERS_FORM.REMOVE_TRAVELER))));
+    };
+    return (React__default.createElement("form", { className: "form form__travelers", name: "booking--travellers", id: "booking--travellers", noValidate: true, onSubmit: formik.handleSubmit, onReset: formik.handleReset },
+        React__default.createElement("div", { className: "form__travelers__wrapper" },
+            formik.values.rooms.map((room, roomIndex) => (React__default.createElement("div", { key: roomIndex },
+                formik.values.rooms.length > 1 && (React__default.createElement("div", { className: "form__region" },
+                    React__default.createElement("div", { className: "form__region-header" },
+                        React__default.createElement("h5", { className: "form__region-heading" },
+                            translations.SHARED.ROOM,
+                            " ",
+                            roomIndex + 1),
+                        React__default.createElement("p", { className: "form__region-label" }, renderRoomLabel(room))),
+                    !useCompactForm && travelersFirstStep && formik.values.rooms.length > 1 && (React__default.createElement("button", { type: "button", className: "cta cta--secondary", onClick: () => handleRemoveRoom(roomIndex) }, "Verwijder reisgezelschap")))),
+                room.adults.map((travelerValues, index) => (React__default.createElement("div", { className: "form__region", key: travelerValues.id },
+                    React__default.createElement("div", { className: "form__region-header" },
+                        React__default.createElement("h5", { className: "form__region-heading" },
+                            translations.TRAVELERS_FORM.TRAVELER,
+                            " ",
+                            index + 1),
+                        React__default.createElement("p", { className: "form__region-label" }, translations.TRAVELERS_FORM.ADULT),
+                        React__default.createElement("div", { className: "radiobutton" },
+                            React__default.createElement("label", { className: "radiobutton__label" },
+                                React__default.createElement("input", { type: "radio", name: "mainBookerId", onChange: handleMainBookerChange, onBlur: formik.handleBlur, value: travelerValues.id, checked: formik.values.mainBookerId === travelerValues.id, className: "radiobutton__input" }),
+                                translations.TRAVELERS_FORM.MAIN_BOOKER))),
+                    renderTravelerFields(travelerValues, `rooms[${roomIndex}].adults[${index}]`, true, roomIndex, index)))),
+                room.children.map((travelerValues, index) => (React__default.createElement("div", { className: "form__region", key: travelerValues.id },
+                    React__default.createElement("div", { className: "form__region-header" },
+                        React__default.createElement("h5", { className: "form__region-heading" },
+                            translations.TRAVELERS_FORM.TRAVELER,
+                            " ",
+                            room.adults.length + index + 1),
+                        React__default.createElement("p", { className: "form__region-label" }, travelerValues.isBaby ? translations.TRAVELERS_FORM.BABY : translations.TRAVELERS_FORM.CHILD)),
+                    renderTravelerFields(travelerValues, `rooms[${roomIndex}].children[${index}]`, false, roomIndex, index)))),
+                !useCompactForm && travelersFirstStep && (React__default.createElement("div", { className: "form__region" },
+                    React__default.createElement("button", { type: "button", className: "cta cta--select", onClick: () => handleAddTraveler(roomIndex) }, translations.TRAVELERS_FORM.ADD_TRAVELER)))))),
+            !useCompactForm && (bookingType !== 'b2b' || travellersSettings?.mainBookerFormFields?.length) ? (React__default.createElement("div", { className: "form__region" },
+                React__default.createElement("div", { className: "form__region-header" },
+                    React__default.createElement("h5", { className: "form__region-heading" }, translations.TRAVELERS_FORM.MAIN_BOOKER),
+                    React__default.createElement("p", { className: "form__region-label" }, compact([compact([mainBooker?.firstName, mainBooker?.lastName]).join(' '), formatBirthDate$1(mainBooker?.birthDate)]).join(', '))),
+                travellersSettings?.mainBookerFormFields?.length ? (React__default.createElement("div", { className: "main-booker-form__grid" }, travellersSettings.mainBookerFormFields.map((field, index) => (React__default.createElement("div", { key: index, className: `control control--${field.type}` }, getControl(field.type, {}, field.type)))))) : (React__default.createElement(React__default.Fragment, null,
+                    React__default.createElement("div", { className: "form__twocolumn" },
+                        React__default.createElement("div", { className: "form__twocolumn-column" },
+                            React__default.createElement("div", { className: "form__row" },
+                                React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.street }),
+                                React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.houseNumber }),
+                                React__default.createElement(LabeledInput, { hasError: hasVisibleError('box'), extraClassName: "form__group--20", label: translations.TRAVELERS_FORM.POST_BOX, name: "box", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.box }))),
+                        React__default.createElement("div", { className: "form__twocolumn-column" },
+                            React__default.createElement("div", { className: "form__row" },
+                                React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.zipCode }),
+                                React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.place }),
+                                React__default.createElement(LabeledSelect, { hasError: hasVisibleError('country'), extraClassName: "form__group--sm-40", label: translations.TRAVELERS_FORM.COUNTRY, required: true, name: "country", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.country, options: countryOptions })))),
+                    React__default.createElement("div", { className: "form__row" },
+                        React__default.createElement(LabeledInput, { hasError: hasVisibleError('phone'), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.PHONE, required: true, name: "phone", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.phone }),
+                        React__default.createElement(LabeledInput, { type: "email", hasError: hasVisibleError('email'), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.EMAIL, required: true, name: "email", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.email }),
+                        React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.emailConfirmation })))))) : !useCompactForm ? (React__default.createElement("div", { className: "form__region" },
+                React__default.createElement("div", { className: "form__row" },
+                    React__default.createElement(LabeledInput, { hasError: hasVisibleError('phone'), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.PHONE, required: true, name: "phone", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.phone })))) : null,
+            !useCompactForm && showAgentSelection && (React__default.createElement("div", { className: "form__region" },
+                React__default.createElement("div", { className: "form__region-header" },
+                    React__default.createElement("h5", { className: "form__region-heading" }, translations.TRAVELERS_FORM.BOOK_WITH_AGENT),
+                    React__default.createElement("div", { className: "checkbox", id: "cbxChooseOffice" },
+                        React__default.createElement("label", { className: "checkbox__label" },
+                            React__default.createElement("input", { type: "checkbox", name: "booking--mainbooker", checked: showAgents, onChange: () => toggleAgent(!showAgents), className: "checkbox__input" }),
+                            translations.TRAVELERS_FORM.CHOOSE_OFFICE))),
+                showAgents && (React__default.createElement("div", { className: "form__row form__row--choose-office" },
+                    React__default.createElement("div", { className: buildClassName(['form__group', 'form__group--icon', hasVisibleError('travelAgentId') && 'form__group--error']) },
+                        React__default.createElement(TypeAheadInput, { value: formik.values.travelAgentName, options: filteredAgents, onChange: handleAgentChange, onSelect: handleAgentSelect, onClear: handleAgentClear, name: "travelAgentName", placeholder: translations.TRAVELERS_FORM.CHOOSE_AGENT_PLACEHOLDER }))))))),
+        !useCompactForm && errorKeys.length > 0 && (React__default.createElement("div", { className: "form__region form__region--errors" },
+            React__default.createElement("div", { className: "form__row" },
+                React__default.createElement("div", { className: "form__group" },
+                    React__default.createElement("p", { className: "form__error-heading" },
+                        translations.TRAVELERS_FORM.VALIDATION_MESSAGE,
+                        ":"),
+                    React__default.createElement("ul", { className: "list" }, errorKeys.map((key) => (React__default.createElement("li", { key: key }, get(flatErrors, key))))))))),
+        travelersFirstStep && (React__default.createElement("div", { className: "booking__navigator" },
+            React__default.createElement("button", { type: "button", className: "cta cta--select", onClick: handleAddRoom }, translations.TRAVELERS_FORM.ADD_ROOM))),
+        React__default.createElement("div", { className: "booking__navigator" },
+            renderPreviousButton?.(),
+            React__default.createElement("button", { type: "submit", title: translations.STEPS.NEXT, className: 'cta' + (isUnavailable ? ' cta--disabled' : '') }, translations.STEPS.NEXT))));
+};
+
+const fetchPriceDetails$1 = async (apiSettings, request, signal, languageCode) => {
+    const tideClientConfig = buildTideClientConfig(apiSettings);
+    return await build.priceDetails(tideClientConfig, request, signal, languageCode);
+};
+const priceDetailsApi = {
+    fetchPriceDetails: fetchPriceDetails$1
+};
+
+const updatePackageDetails = (packageDetails, changedLines) => {
+    return {
+        ...packageDetails,
+        options: packageDetails.options.map((opt) => {
+            return {
+                ...opt,
+                rooms: opt.isSelected ? updateRooms(opt.rooms, changedLines) : opt.rooms,
+                groups: opt.isSelected ? updateBookingGroups(opt.groups, changedLines) : opt.groups,
+                optionUnits: opt.isSelected ? updateOptionUnits(opt.optionUnits, changedLines) : opt.optionUnits,
+                optionPax: opt.isSelected ? updateOptionPax(opt.optionPax, changedLines) : opt.optionPax
+            };
+        })
+    };
+};
+// ROOMS
+const updateRooms = (rooms, changedLines) => {
+    return rooms.map((room) => ({
+        ...room,
+        options: room.options.map((option) => ({
+            ...option,
+            price: changedLines.find((x) => x.entryLineGuid == option.entryLineGuid)?.price ?? option.price
+        }))
+    }));
+};
+// PAX
+const updateOptionPax = (pax, changedLines) => {
+    return pax.map((p) => ({
+        ...p,
+        groups: updatePaxGroups(p.groups, changedLines)
+    }));
+};
+const updatePaxGroups = (groups, changedLines) => {
+    return groups.map((g) => ({
+        ...g,
+        options: g.options.map((o) => ({
+            ...o,
+            groups: updatePaxGroups(o.groups, changedLines),
+            line: {
+                ...o.line,
+                price: changedLines.find((cl) => cl.entryLineGuid === o.line.entryLineGuid)?.price ?? o.line.price
+            },
+            alternatives: o.alternatives.map((a) => ({
+                ...a,
+                price: changedLines.find((cl) => cl.entryLineGuid === a.entryLineGuid)?.price ?? a.price
+            }))
+        }))
+    }));
+};
+// UNITS
+const updateOptionUnits = (units, changedLines) => {
+    return units.map((u) => ({
+        ...u,
+        groups: updateUnitGroups(u.groups, changedLines)
+    }));
+};
+const updateUnitGroups = (groups, changedLines) => {
+    return groups.map((g) => ({
+        ...g,
+        options: g.options.map((o) => ({
+            ...o,
+            groups: updateUnitGroups(o.groups, changedLines),
+            pax: updateOptionPax(o.pax, changedLines),
+            line: {
+                ...o.line,
+                price: changedLines.find((cl) => cl.entryLineGuid === o.line.entryLineGuid)?.price ?? o.line.price
+            },
+            alternatives: o.alternatives.map((a) => ({
+                ...a,
+                price: changedLines.find((cl) => cl.entryLineGuid === a.entryLineGuid)?.price ?? a.price
+            }))
+        }))
+    }));
+};
+// BOOKING
+const updateBookingGroups = (groups, changedLines) => {
+    return groups.map((g) => ({
+        ...g,
+        options: g.options.map((o) => ({
+            ...o,
+            groups: updateBookingGroups(o.groups, changedLines),
+            units: updateOptionUnits(o.units, changedLines),
+            pax: updateOptionPax(o.pax, changedLines),
+            line: {
+                ...o.line,
+                price: changedLines.find((cl) => cl.entryLineGuid === o.line.entryLineGuid)?.price ?? o.line.price
+            },
+            alternatives: o.alternatives.map((a) => ({
+                ...a,
+                price: changedLines.find((cl) => cl.entryLineGuid === a.entryLineGuid)?.price ?? a.price
+            }))
+        }))
+    }));
+};
+
+const fetchPriceDetails = createAsyncThunk('priceDetails/fetchPriceDetails', async (_, { dispatch, getState, signal }) => {
+    const state = getState();
+    const languageCode = selectLanguageCode(state);
+    const request = selectBookingPackageBookRequest(state);
+    if (!request) {
+        throw Error('Product not available.');
+    }
+    dispatch(setFetchingPriceDetails(true));
+    dispatch(resetPriceDetails());
+    const priceDetails = await priceDetailsApi.fetchPriceDetails(state.apiSettings, request, signal, languageCode);
+    dispatch(setFetchingPriceDetails(false));
+    const packageDetails = selectPackageDetails(state);
+    if (packageDetails) {
+        const updatedPackageDetails = updatePackageDetails(packageDetails, priceDetails.changedLines);
+        dispatch(setPackage(updatedPackageDetails));
+    }
+    return priceDetails;
+});
+const priceDetailsSlice = createSlice({
+    name: 'priceDetails',
+    initialState: {
+        priceDetails: [],
+        notifications: [],
+        isBusy: false
+    },
+    reducers: {
+        setFetchingPriceDetails(state, action) {
+            state.isBusy = action.payload;
+        },
+        setNotifications(state, action) {
+            state.notifications = action.payload;
+        },
+        resetPriceDetails(state, _) {
+            state.priceDetails = [];
+        }
+    },
+    extraReducers: (builder) => {
+        builder.addCase(fetchPriceDetails.fulfilled, (state, action) => {
+            if (action.payload) {
+                state.deposit = action.payload.deposit;
+                state.commission = action.payload.commission;
+                state.priceDetails = action.payload.details;
+                state.notifications = action.payload.notifications;
+            }
+        });
+        builder.addCase(fetchPriceDetails.rejected, (state) => {
+            state.isBusy = false;
+        });
+    }
+});
+const { setFetchingPriceDetails } = priceDetailsSlice.actions;
+const { resetPriceDetails, setNotifications } = priceDetailsSlice.actions;
+const selectNotifications = (state) => state.priceDetails.notifications;
+var priceDetailsReducer = priceDetailsSlice.reducer;
+
+const selectHasMounted = (state) => state.booking.hasMounted;
+const selectGeneratePaymentUrl = (state) => state.booking.generatePaymentUrl;
+const selectSkipPaymentWithAgent = (state) => state.booking.skipPaymentWithAgent;
+const selectIsFetchingProductOptions = (state) => state.booking.isBusy;
+const selectDepartureFlight = (state) => state.booking.package?.outwardFlights?.find((x) => x.isSelected);
+const selectReturnFlight = (state) => state.booking.package?.returnFlights?.find((x) => x.isSelected);
+const selectPackageRooms = (state) => state.booking.package?.options.find((x) => x.isSelected)?.rooms;
+const selectIncludedServiceTypes = (state) => selectActiveOption(state)?.includedServiceTypes;
+const selectAvailabilities = (state) => state.booking.package?.options.find((x) => x.isSelected)?.availabilities;
+const selectPackageTags = (state) => state.booking.package?.tags;
+const selectIsOnRequest = (state) => state.booking.package?.options.find((x) => x.isSelected)?.isOnRequest;
+const selectPackageOptionUnits = (state) => state.booking.package?.options.find((x) => x.isSelected)?.optionUnits;
+const selectPackageOptionPax = (state) => state.booking.package?.options.find((x) => x.isSelected)?.optionPax;
+const selectPackageGroups = (state) => state.booking.package?.options.find((x) => x.isSelected)?.groups;
+const selectPackageDetails = (state) => state.booking.package;
+const selectPaxFields = (state) => state.booking.package?.paxFields ?? [];
+const selectPackageFlights = (state) => ({
+    outward: state.booking.package?.outwardFlights,
+    return: state.booking.package?.returnFlights
+});
+const selectFlightMetaData = (state) => state.booking.package?.flightInfo.metaData;
+const selectActiveOption = (state) => state.booking.package?.options.find((x) => x.isSelected);
+const selectPackageAirlineGroups = createSelector(selectActiveOption, selectDepartureFlight, selectReturnFlight, (option, departureFlight, returnFlight) => option?.airlineGroups.filter((x) => x.flightIds.includes(departureFlight?.entryLineGuid ?? '') || x.flightIds.includes(returnFlight?.entryLineGuid ?? '')));
+const selectPackageAirportGroups = createSelector(selectActiveOption, selectDepartureFlight, selectReturnFlight, (option, departureFlight, returnFlight) => option?.airportGroups.filter((x) => x.flightIds.includes(departureFlight?.entryLineGuid ?? '') || x.flightIds.includes(returnFlight?.entryLineGuid ?? '')));
+const selectRoomOptionDepartureFlightsMetaData = createSelector(selectActiveOption, selectFlightMetaData, (ativeOption, flightMetaData) => {
+    const roomOptions = ativeOption?.rooms.map((r) => r.options.filter((o) => o.isSelected).shift());
+    return roomOptions?.map((ro) => flightMetaData?.find((f) => f.entryLineGuid === ro?.entryLineGuid)?.flightMetaData).filter((f) => f !== undefined) ?? [];
+});
+const selectRoomOptionReturnFlightsMetaData = createSelector(selectActiveOption, selectFlightMetaData, (ativeOption, flightMetaData) => {
+    const selectedRoomOptions = ativeOption?.rooms.map((r) => r.options.filter((o) => o.isSelected));
+    // check if there are return flights selected
+    if (selectedRoomOptions?.some((ro) => ro.length > 1)) {
+        const roomOptions = ativeOption?.rooms.map((r) => r.options
+            .filter((o) => o.isSelected)
+            .reverse()
+            .shift());
+        return roomOptions?.map((ro) => flightMetaData?.find((f) => f.entryLineGuid === ro?.entryLineGuid)?.flightMetaData).filter((f) => f !== undefined) ?? [];
+    }
+    return undefined;
+});
+const selectApiSettings = (state) => state.apiSettings;
+const selectIsUnavailable = (state) => state.booking.isUnavailable;
+const selectRequestRooms = (state) => state.booking.package?.options.find((x) => x.isSelected)?.requestRooms;
+const selectOfficeId = (state) => state.booking.officeId;
+const selectLanguageCode = (state) => state.booking.languageCode;
+const selectCurrencyCode = (state) => state.booking.package?.currencyCode ?? 'EUR';
+const selectLanguage = (state) => state.booking.languageCode;
+const selectAllDynamicTranslations = (state) => state.booking.translations;
+const selectDynamicTranslations = createSelector([selectAllDynamicTranslations, selectLanguage], (allDynamicTranslations, language) => {
+    return allDynamicTranslations?.find((x) => x.language == language)?.value ?? {};
+});
+// Host override files are hand-maintained, and a null only ever blanks a key the component
+// then reads, so treat it like a missing key (lodash merge already skips undefined).
+const withoutNulls = (value) => isPlainObject$1(value)
+    ? mapValues(pickBy(value, (x) => x !== null), withoutNulls)
+    : value;
+// getTranslations deep-merges the overrides over a clone of the built-in translations, so a
+// host override of a nested group (TRAVELERS_FORM.VALIDATION, TRAVELERS_FORM.COUNTRIES)
+// only replaces the keys it actually contains. Merging per section one level deep dropped
+// every other built-in key of such a group, which made those keys resolve to undefined and
+// crash format() in the consuming component.
+const selectTranslations = createSelector([selectLanguage, selectDynamicTranslations], (language, dynamicTranslations) => getTranslations(language, isEmpty$1(dynamicTranslations) ? undefined : withoutNulls(dynamicTranslations)));
+const selectBookingOptions = (state) => state.booking.bookingOptions;
+const selectBookingType = (state) => state.booking.bookingType;
+const selectTagIds = (state) => state.booking.tagIds;
+const selectAgentAdressId = (state) => state.booking.agentAdressId;
+const selectProductAttributes = (state) => state.booking.productAttributes;
+const selectBookingAttributes = (state) => state.booking.bookingAttributes;
+const selectBookingNumber = (state) => state.booking.bookingNumber;
+const selectIsOption = (state) => state.booking.isOption;
+const selectBookingRooms = (state) => state.booking.bookingAttributes?.rooms;
+const selectBookingRemarks = (state) => state.booking.remarks;
+const selectVoucherCodes = (state) => state.booking.voucherCodes;
+const selectCalculateDeposit = (state) => state.booking.calculateDeposit;
+const selectShowCommission = (state) => state.booking.showCommission;
+const selectIsRetry = (state) => state.booking.isRetry;
+const selectStartDate = (state) => state.booking.package?.options.find((x) => x.isSelected)?.fromDate;
+const selectEndDate = (state) => state.booking.package?.options.find((x) => x.isSelected)?.toDate;
+const selectAgents = (state) => state.booking.agents;
+const selectCountries = (state) => state.booking.countries;
+const selectProductCode = (state) => state.booking.productAttributes?.productCode;
+const selectAccommodationCodes = (state) => {
+    const accommodationCodes = [];
+    state.booking.package?.options.forEach((o) => {
+        o.rooms.forEach((r) => r.options.forEach((ro) => {
+            if (!accommodationCodes.some((y) => y === ro.accommodationCode)) {
+                accommodationCodes.push(ro.accommodationCode);
+            }
+        }));
+    });
+    return accommodationCodes;
+};
+const selectAccommodationViews = (state) => state.booking.accommodationViews;
+const selectMappingInfo = (state) => state.booking.package?.options.find((x) => x.isSelected)?.mappingInfo;
+const selectBookingQuery = (state) => {
+    const bookingAttributes = state.booking.bookingAttributes;
+    if (!bookingAttributes) {
+        return undefined;
+    }
+    const params = {};
+    Object.entries(bookingAttributes).forEach(([key, value]) => {
+        if (key === 'startDate' || key === 'endDate') {
+            value = format$2(parseISO(value), 'yyyy-MM-dd');
+        }
+        if (key === 'rooms') {
+            value = JsonURL.stringify(value.map((room) => omit(room, ['children'])), {
+                AQF: true
+            });
+        }
+        if (key === 'allotmentIds' && !value.length) {
+            value = undefined;
+        }
+        if (key === 'flight' && value) {
+            var flightInfo = value;
             value = JsonURL.stringify(flightInfo, { AQF: true });
         }
         if (value) {
@@ -18918,14 +20174,17 @@ const selectBookingAddress = createSelector(selectTravelersFormValues, selectBoo
     const mainBooker = pax.find((x) => x.isMainBooker);
     if (!mainBooker || bookingType == 'b2b')
         return undefined;
+    // The backend treats the main booker's per-pax address as authoritative, so keep the
+    // booking-level address in sync with it rather than sending two independent values.
+    const mainBookerAddress = mainBooker.address;
     return {
         name: `${mainBooker.firstName} ${mainBooker.lastName}`,
-        street: formValues?.street,
-        number: formValues?.houseNumber,
+        street: mainBookerAddress?.street || formValues?.street,
+        number: mainBookerAddress?.number || formValues?.houseNumber,
         box: formValues?.box,
-        postalCode: formValues?.zipCode,
-        location: formValues?.place,
-        country: formValues?.country,
+        postalCode: mainBookerAddress?.postalCode || formValues?.zipCode,
+        location: mainBookerAddress?.location || formValues?.place,
+        country: mainBookerAddress?.country || formValues?.country,
         mobilePhone: formValues?.phone,
         email: formValues?.email
     };
@@ -19001,17 +20260,11 @@ const selectBookingPackageBookRequest = createSelector(selectBookingPackageReque
     return bookingPackageRequest;
 });
 const selectTravelersFirstStep = (state) => state.booking.travelersFirstStep;
-const buildPax = (traveler, mainBookerId) => {
-    return {
-        id: traveler.id,
-        gender: parseGender(traveler.gender),
-        firstName: traveler.firstName,
-        lastName: traveler.lastName,
-        dateOfBirth: traveler.birthDate,
-        age: traveler.birthDate ? null : traveler.age,
-        isMainBooker: traveler.id == mainBookerId
-    };
-};
+const buildPax = (traveler, mainBookerId) => applyTravelerToPax({
+    id: traveler.id,
+    gender: parseGender(traveler.gender),
+    age: traveler.birthDate ? null : traveler.age
+}, traveler, mainBookerId);
 const parseGender = (gender) => {
     switch (gender) {
         case 'm':
@@ -23011,718 +24264,233 @@ const Summary = () => {
                     React__default.createElement("div", { className: "form__row" },
                         React__default.createElement("div", { className: "form__group" },
                             React__default.createElement("div", { className: "info-message" },
-                                React__default.createElement(Icon, { name: "ui-tooltip", className: "icon--secondary-color" }),
-                                React__default.createElement("div", { className: "info-message__copy" },
-                                    React__default.createElement("h5", null, translations.SUMMARY.VALIDATE_TITLE),
-                                    settings.customValidateText ? (React__default.createElement("div", { dangerouslySetInnerHTML: {
-                                            __html: settings.customValidateText
-                                        } })) : (React__default.createElement(React__default.Fragment, null,
-                                        React__default.createElement("p", null, settings.isOffer ? translations.SUMMARY.VALIDATE_TEXT_OFFER : translations.SUMMARY.VALIDATE_TEXT_BOOKING),
-                                        settings.allowOption && React__default.createElement("p", null, translations.SUMMARY.VALIDATE_TEXT_OPTION))),
-                                    checkboxes &&
-                                        checkboxes.map((checkbox) => (React__default.createElement("div", { className: "checkbox", key: checkbox.id },
-                                            React__default.createElement("label", { className: "checkbox__label" },
-                                                React__default.createElement("input", { type: "checkbox", className: "checkbox__input", checked: checkbox.isSelected, onChange: (e) => handleCheckboxChange(checkbox.id, e.target.checked) }),
-                                                React__default.createElement("span", { className: "checkbox__label-text", dangerouslySetInnerHTML: {
-                                                        __html: checkbox.text
-                                                    } }))))))))))),
-            React__default.createElement("div", { className: "booking__navigator" },
-                settings.skipRouter ? (React__default.createElement("button", { type: "button", title: translations.STEPS.PREVIOUS, onClick: () => goPrevious(), className: "cta cta--secondary" }, translations.STEPS.PREVIOUS)) : (React__default.createElement(Link, { to: `${!settings.skipBasePathInRouting ? settings.basePath : ''}${travelersFirstStep ? settings.options.pathSuffix : settings.travellers.pathSuffix}?${bookingQueryString}`, title: translations.STEPS.PREVIOUS, className: "cta cta--secondary" }, translations.STEPS.PREVIOUS)),
-                settings.allowOption && (React__default.createElement("button", { title: translations.STEPS.SUBMIT_OPTION, className: buildClassName(['cta', !userValidated && 'cta--disabled']), disabled: !userValidated, name: "option" }, translations.STEPS.SUBMIT_OPTION)),
-                React__default.createElement("button", { title: settings.isOffer ? translations.STEPS.SUBMIT_OFFER : translations.STEPS.SUBMIT_BOOKING, className: buildClassName(['cta', !userValidated && 'cta--disabled']), disabled: !userValidated, name: "default" }, settings.isOffer ? translations.STEPS.SUBMIT_OFFER : translations.STEPS.SUBMIT_BOOKING))))));
-};
-
-function isValidEmail(email) {
-    return !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,24}$/i.test(email);
-}
-const NAME_CHARACTERS_REGEX = /^[\p{L}\s-]+$/u;
-function hasInvalidNameCharacters(name) {
-    return !NAME_CHARACTERS_REGEX.test(name);
-}
-// Rejects values like a 5-digit year, which the native date input allows while typing
-function isValidBirthDate(birthDateText) {
-    return isValid(parse(birthDateText, 'yyyy-MM-dd', new Date()));
-}
-function getAge(birthDateText, startDateText) {
-    var birthDate = new Date(birthDateText);
-    var startDate = new Date(startDateText);
-    var age = startDate.getFullYear() - birthDate.getFullYear();
-    var m = startDate.getMonth() - birthDate.getMonth();
-    if (m < 0 || (m === 0 && startDate.getDate() < birthDate.getDate())) {
-        age--;
-    }
-    return age;
-}
-const validateForm$1 = (values, agentRequired, bookingType, translations, formFields, mainBookerFormFields, maxChildAge = CHILD_MAX_AGE, maxBabyAge = BABY_MAX_AGE) => {
-    const errors = {};
-    const isFormFieldPresent = (type) => {
-        return formFields?.some((f) => f.type === type) ?? true;
-    };
-    const isMainBookerFormFieldPresent = (type) => {
-        return mainBookerFormFields?.some((f) => f.type === type) ?? true;
-    };
-    const formatTravelerField = (room, pax, field) => {
-        return values.rooms.length > 1
-            ? format$1(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_FIELD, [room, pax, field])
-            : format$1(translations.TRAVELERS_FORM.VALIDATION.SINGLE_ROOM_TRAVELER_X_FIELD, [pax, field]);
-    };
-    const formatTravelerIsNoAdult = (room, pax) => {
-        return values.rooms.length > 1
-            ? format$1(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_IS_NO_ADULT, [room, pax])
-            : format$1(translations.TRAVELERS_FORM.VALIDATION.SINGLE_ROOM_TRAVELER_X_IS_NO_ADULT, [pax]);
-    };
-    const formatTravelerIsNoChild = (room, pax) => {
-        return values.rooms.length > 1
-            ? format$1(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_IS_NO_CHILD, [room, pax])
-            : format$1(translations.TRAVELERS_FORM.VALIDATION.SINGLE_ROOM_TRAVELER_X_IS_NO_CHILD, [pax]);
-    };
-    const formatTravelerIsNoBaby = (room, pax) => {
-        // The message states the boundary the traveler has to stay under, so we pass
-        // the first age that is too old rather than the inclusive maxBabyAge.
-        const tooOldAge = maxBabyAge + 1;
-        return values.rooms.length > 1
-            ? format$1(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_IS_NO_BABY, [room, pax, tooOldAge])
-            : format$1(translations.TRAVELERS_FORM.VALIDATION.SINGLE_ROOM_TRAVELER_X_IS_NO_BABY, [pax, tooOldAge]);
-    };
-    const formatTravelerFieldInvalidCharacters = (room, pax, field) => {
-        return values.rooms.length > 1
-            ? format$1(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_FIELD_INVALID_CHARACTERS, [room, pax, field])
-            : format$1(translations.TRAVELERS_FORM.VALIDATION.SINGLE_ROOM_TRAVELER_X_FIELD_INVALID_CHARACTERS, [pax, field]);
-    };
-    values.rooms.forEach((r, rIndex) => r.adults.forEach((adult, index) => {
-        if (isEmpty$1(adult.gender) && isFormFieldPresent('gender')) {
-            set(errors, `rooms[${rIndex}].adults[${index}].gender`, formatTravelerField(rIndex + 1, index + 1, translations.TRAVELERS_FORM.GENDER));
-        }
-        if (isFormFieldPresent('firstName')) {
-            if (isEmpty$1(adult.firstName)) {
-                set(errors, `rooms[${rIndex}].adults[${index}].firstName`, formatTravelerField(rIndex + 1, index + 1, translations.TRAVELERS_FORM.FIRST_NAME));
-            }
-            else if (hasInvalidNameCharacters(adult.firstName)) {
-                set(errors, `rooms[${rIndex}].adults[${index}].firstName`, formatTravelerFieldInvalidCharacters(rIndex + 1, index + 1, translations.TRAVELERS_FORM.FIRST_NAME));
-            }
-        }
-        if (isFormFieldPresent('lastName')) {
-            if (isEmpty$1(adult.lastName)) {
-                set(errors, `rooms[${rIndex}].adults[${index}].lastName`, formatTravelerField(rIndex + 1, index + 1, translations.TRAVELERS_FORM.LAST_NAME));
-            }
-            else if (hasInvalidNameCharacters(adult.lastName)) {
-                set(errors, `rooms[${rIndex}].adults[${index}].lastName`, formatTravelerFieldInvalidCharacters(rIndex + 1, index + 1, translations.TRAVELERS_FORM.LAST_NAME));
-            }
-        }
-        if (isFormFieldPresent('birthDate')) {
-            if (isEmpty$1(adult.birthDate) || !isValidBirthDate(adult.birthDate)) {
-                set(errors, `rooms[${rIndex}].adults[${index}].birthDate`, formatTravelerField(rIndex + 1, index + 1, translations.TRAVELERS_FORM.BIRTHDATE));
-            }
-            else if (values.endDate) {
-                // If you are younger than the maxChildAge at the end of the trip, you are considered a child, so we check the endDate here instead of the startDate
-                const age = getAge(adult.birthDate, values.endDate);
-                if (age <= maxChildAge) {
-                    set(errors, `rooms[${rIndex}].adults[${index}].birthDate`, formatTravelerIsNoAdult(rIndex + 1, index + 1));
-                }
-            }
-        }
-    }));
-    values.rooms.forEach((r, rIndex) => r.children.forEach((child, index) => {
-        if (isEmpty$1(child.gender) && isFormFieldPresent('gender')) {
-            set(errors, `rooms[${rIndex}].children[${index}].gender`, formatTravelerField(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.GENDER));
-        }
-        if (isFormFieldPresent('firstName')) {
-            if (isEmpty$1(child.firstName)) {
-                set(errors, `rooms[${rIndex}].children[${index}].firstName`, formatTravelerField(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.FIRST_NAME));
-            }
-            else if (hasInvalidNameCharacters(child.firstName)) {
-                set(errors, `rooms[${rIndex}].children[${index}].firstName`, formatTravelerFieldInvalidCharacters(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.FIRST_NAME));
-            }
-        }
-        if (isFormFieldPresent('lastName')) {
-            if (isEmpty$1(child.lastName)) {
-                set(errors, `rooms[${rIndex}].children[${index}].lastName`, formatTravelerField(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.LAST_NAME));
-            }
-            else if (hasInvalidNameCharacters(child.lastName)) {
-                set(errors, `rooms[${rIndex}].children[${index}].lastName`, formatTravelerFieldInvalidCharacters(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.LAST_NAME));
-            }
-        }
-        if (isFormFieldPresent('birthDate')) {
-            if (isEmpty$1(child.birthDate) || !isValidBirthDate(child.birthDate)) {
-                set(errors, `rooms[${rIndex}].children[${index}].birthDate`, formatTravelerField(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.BIRTHDATE));
-            }
-            else if (child.isBaby && values.startDate) {
-                // A baby only has to be under the maxBabyAge on departure, so we check the startDate here instead of the endDate (TIDE-3269)
-                const age = getAge(child.birthDate, values.startDate);
-                if (age > maxBabyAge) {
-                    set(errors, `rooms[${rIndex}].children[${index}].birthDate`, formatTravelerIsNoBaby(rIndex + 1, r.adults.length + index + 1));
-                }
-            }
-            else if (values.endDate) {
-                // You need to be under the maxChildAge until the end of the trip, so we check the endDate here instead of the startDate.
-                // Babies land here too when there is no startDate to check them against, so they keep at least the child age check.
-                const age = getAge(child.birthDate, values.endDate);
-                if (age > maxChildAge) {
-                    set(errors, `rooms[${rIndex}].children[${index}].birthDate`, formatTravelerIsNoChild(rIndex + 1, r.adults.length + index + 1));
-                }
-            }
-        }
-    }));
-    if (values.mainBookerId < 0) {
-        errors.mainBookerId = translations.TRAVELERS_FORM.VALIDATION.NO_MAIN_BOOKER_SELECTED;
-    }
-    if (bookingType != 'b2b' || mainBookerFormFields?.length) {
-        if (isEmpty$1(values.street) && isMainBookerFormFieldPresent('street')) {
-            errors.street = format$1(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.STREET]);
-        }
-        if (isEmpty$1(values.houseNumber) && isMainBookerFormFieldPresent('houseNumber')) {
-            errors.houseNumber = format$1(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.HOUSE_NUMBER]);
-        }
-        if (isEmpty$1(values.zipCode) && isMainBookerFormFieldPresent('zipCode')) {
-            errors.zipCode = format$1(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.ZIPCODE]);
-        }
-        if (isEmpty$1(values.place) && isMainBookerFormFieldPresent('place')) {
-            errors.place = format$1(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.CITY]);
-        }
-        if (isMainBookerFormFieldPresent('email')) {
-            if (isEmpty$1(values.email)) {
-                errors.email = format$1(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 (isEmpty$1(values.emailConfirmation)) {
-                errors.emailConfirmation = format$1(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 (isEmpty$1(values.country) && isMainBookerFormFieldPresent('country')) {
-            errors.country = format$1(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.COUNTRY]);
-        }
-        if (isEmpty$1(values.phone) && isMainBookerFormFieldPresent('phone')) {
-            errors.phone = format$1(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.PHONE]);
-        }
-    }
-    else {
-        if (isEmpty$1(values.phone)) {
-            errors.phone = format$1(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.PHONE]);
-        }
-    }
-    if (agentRequired && !values.travelAgentId) {
-        errors.travelAgentId = translations.TRAVELERS_FORM.VALIDATION.AGENT_IS_REQUIRED;
-    }
-    return errors;
-};
-
-const LabeledInput = ({ name, type, required, value, defaultValue, min, max, label, placeholder, extraClassName, hasError, onChange, onBlur }) => {
-    return (React__default.createElement("label", { className: buildClassName(['form__group', extraClassName, hasError && 'form__group--error']) },
-        React__default.createElement("span", { className: "form__label" }, compact([label, required && '*']).join(' ')),
-        React__default.createElement("input", { name: name, type: type ?? 'text', required: required, className: "form__input", min: min, max: max, placeholder: placeholder, onChange: onChange, onBlur: onBlur, value: value, defaultValue: defaultValue })));
-};
-
-const LabeledSelect = ({ name, id, required, value, defaultValue, label, extraClassName, extraDropdownClassName, hasError, options, onChange, onBlur }) => {
-    return (React__default.createElement("label", { className: buildClassName(['form__group', extraClassName, hasError && 'form__group--error']) },
-        React__default.createElement("span", { className: "form__label" }, compact([label, required && '*']).join(' ')),
-        React__default.createElement("div", { className: buildClassName(['dropdown', extraDropdownClassName]) },
-            React__default.createElement("select", { name: name, id: id, defaultValue: defaultValue, value: value, onBlur: onBlur, onChange: onChange }, options?.map((option) => (React__default.createElement("option", { key: option.key, value: option.value }, option.label)))))));
-};
-
-const normalize = (v) => (v == null ? '' : String(v));
-const parseCombined = (raw, countries) => {
-    const value = normalize(raw).trim();
-    if (!value)
-        return { prefix: '', number: '' };
-    // Try to match a known prefix at the start. Prefer longest match.
-    const sorted = [...countries].sort((a, b) => b.phonePrefix.length - a.phonePrefix.length);
-    const hit = sorted.find((c) => value.startsWith(c.phonePrefix));
-    if (hit) {
-        const 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
-    const m = value.match(/^(\+\d{1,4})[\s-]*(.*)$/);
-    if (m)
-        return { prefix: m[1], number: m[2] };
-    return { prefix: '', number: value };
-};
-const PhoneInput = ({ name, required, value, label, placeholder, extraClassName, hasError, countries, countryIso2, onChange, onBlur }) => {
-    // Derive initial state from `value`
-    const initialCountry = countries.find((c) => c.iso2 === countryIso2);
-    const initial = useMemo(() => parseCombined(normalize(value), countries), [value, countries]);
-    const [prefix, setPrefix] = useState(initial.prefix);
-    const [number, setNumber] = useState(initial.number);
-    // Keep state in sync if the parent changes `value`
-    useEffect(() => {
-        const 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]);
-    const emitCombinedChange = (e, nextPrefix, nextNumber) => {
-        // Combine with a space, unless the number already starts with a dash or space
-        const combined = nextPrefix && nextNumber ? compact([nextPrefix, nextNumber]).join(' ') : null;
-        onChange?.({
-            ...e,
-            type: 'change',
-            target: { name, value: combined },
-            currentTarget: { name, value: combined }
-        });
-    };
-    const handleCountryBlur = (e) => {
-        onBlur?.(e);
-    };
-    const onCountryChange = (e) => {
-        const next = e.target.value;
-        setPrefix(next);
-        emitCombinedChange(e, next, number);
-    };
-    const onPhoneChange = (e) => {
-        const cleaned = e.target.value.replace(/[^\d\s-]/g, '');
-        setNumber(cleaned);
-        emitCombinedChange(e, prefix, cleaned);
-    };
-    const handleNumberBlur = (e) => {
-        onBlur?.(e);
-    };
-    // Ensure the select shows a reasonable default when prefix is empty
-    const selectValue = prefix || '';
-    return (React__default.createElement("label", { className: buildClassName(['form__group', extraClassName, hasError && 'form__group--error']) },
-        label && React__default.createElement("span", { className: "form__label" }, compact([label, required && '*']).join(' ')),
-        React__default.createElement("div", { className: "phone-input" },
-            React__default.createElement("div", { className: "dropdown" },
-                React__default.createElement("select", { "aria-label": label ? `${label} – country code` : 'Country calling code', name: `${name}__country`, value: selectValue, onBlur: handleCountryBlur, onChange: onCountryChange },
-                    React__default.createElement("option", { value: "", disabled: true }),
-                    countries?.map((option) => (React__default.createElement("option", { key: option.iso2, value: option.phonePrefix },
-                        option.name,
-                        " (",
-                        option.phonePrefix,
-                        ")"))))),
-            React__default.createElement("input", { "aria-label": label ? `${label} – number` : 'Phone number', name: `${name}__number`, type: "tel", inputMode: "tel", required: required, className: "form__input", placeholder: placeholder, onChange: onPhoneChange, onBlur: handleNumberBlur, value: number }),
-            React__default.createElement("input", { type: "hidden", name: name, value: compact([prefix, number]).join(' ') }))));
-};
-
-const hasVisibleError = (formik, key) => get(formik.errors, key) && get(formik.touched, key);
-
-const GenderControl = ({ translations, value, formik, name }) => {
-    return (React__default.createElement("div", { className: buildClassName(['form__group', hasVisibleError(formik, name) && 'form__group--error']) },
-        React__default.createElement("label", { className: "form__label" },
-            translations.TRAVELERS_FORM.GENDER_ID,
-            " *"),
-        React__default.createElement("div", { className: "radiobutton-group" },
-            React__default.createElement("div", { className: "radiobutton" },
-                React__default.createElement("label", { className: "radiobutton__label" },
-                    React__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_GENDER)),
-            React__default.createElement("div", { className: "radiobutton" },
-                React__default.createElement("label", { className: "radiobutton__label" },
-                    React__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_GENDER)))));
-};
-
-const TypeAheadInput = ({ name, value, placeholder, options, onChange, onSelect, onClear }) => {
-    const [showItems, setShowItems] = useState(false);
-    const handleChange = (e) => {
-        if (onChange) {
-            onChange(e.target.value);
-        }
-    };
-    const handleClearClick = (e) => {
-        if (onClear) {
-            onClear();
-        }
-        setShowItems(false);
-    };
-    return (React__default.createElement("div", { className: "typeahead" },
-        React__default.createElement("div", { className: "typeahead__trigger typeahead__trigger--icon" },
-            React__default.createElement(Icon, { name: "ui-qsm-location" }),
-            React__default.createElement("input", { type: "text", className: "form__input", name: name, value: value, onChange: handleChange, placeholder: placeholder, required: true, autoComplete: "off", onKeyDown: (e) => {
-                    if (e.key === 'Tab' && options && onSelect) {
-                        onSelect(options[0].key);
-                        setShowItems(false);
-                    }
-                }, onFocus: () => setShowItems(true) }),
-            React__default.createElement("button", { type: "button", className: "button button--clear", onClick: handleClearClick })),
-        options && options.length > 0 && showItems && (React__default.createElement("div", { className: "typeahead__options" }, (options ?? []).map((option) => {
-            const matchIndex = typeof value !== 'undefined' ? option.text.indexOf(value) : 0;
-            const prefix = option.text.slice(0, matchIndex);
-            const highlight = option.text.slice(matchIndex, value?.length ?? 0);
-            const suffix = option.text.slice(matchIndex);
-            return (React__default.createElement("div", { className: "typeahead__option", key: option.key },
-                React__default.createElement("div", { className: "typeahead__option-header" },
-                    React__default.createElement("button", { onClick: () => {
-                            if (onSelect)
-                                onSelect(option.key);
-                            setShowItems(false);
-                        }, type: "button", className: "button button--plain" },
-                        prefix,
-                        React__default.createElement("span", { className: "typeahead__option-highlight" }, highlight),
-                        suffix))));
-        })))));
-};
-
-// A traveler is a baby when the age they were booked with is at or below the baby
-// boundary. Babies get their own label and birth date validation (TIDE-3269). Only
-// meaningful for the regular form: the compact form asks for an age instead of a birth
-// date, so it has nothing to validate and its own age input already states the age.
-function isBabyAge(age, maxBabyAge = BABY_MAX_AGE) {
-    return typeof age === 'number' && age <= maxBabyAge;
-}
-// The native date input can hold values format() throws on (e.g. a 5+ digit year while typing), so never format an unvalidated birthDate
-function formatBirthDate$1(birthDate) {
-    if (!birthDate)
-        return '';
-    const parsed = parse(birthDate, 'yyyy-MM-dd', new Date());
-    return isValid(parsed) ? format$2(parsed, 'dd-MM-yyyy') : '';
-}
-function createTraveler(traveler, followNumber, personTranslation, isCompact, maxBabyAge) {
-    if (isCompact) {
-        return {
-            id: traveler.id,
-            firstName: personTranslation,
-            lastName: `${followNumber.number++}`,
-            birthDate: '',
-            gender: '',
-            // Keep a booked age of 0 instead of submitting and pricing the traveler as a 30 year
-            // old, while still falling back for a missing or unusable age. `??` alone would let a
-            // NaN (unparseable date of birth upstream) reach the age input and the booked pax.
-            // See TIDE-3269.
-            age: Number.isFinite(traveler.age) ? traveler.age : 30
-            // No isBaby here on purpose: the age below is editable and nothing revalidates it
-            // in compact mode, so a stored flag would end up contradicting the entered age.
-        };
-    }
-    return {
-        id: traveler.id,
-        firstName: '',
-        lastName: '',
-        birthDate: '',
-        gender: '',
-        isBaby: isBabyAge(traveler.age, maxBabyAge)
-    };
-}
-function createInitialValuesFromRooms(formRooms, startDate, endDate, agentAdressId, personTranslation, isCompact, maxBabyAge) {
-    const followNumber = { number: 1 };
-    const initialValues = {
-        startDate,
-        endDate,
-        rooms: formRooms.map((room) => ({
-            adults: room.adults.map((traveler) => createTraveler(traveler, followNumber, personTranslation, isCompact, maxBabyAge)),
-            children: room.children.map((traveler) => createTraveler(traveler, followNumber, personTranslation, isCompact, maxBabyAge))
-        })),
-        mainBookerId: -1,
-        street: '',
-        houseNumber: '',
-        box: '',
-        zipCode: '',
-        place: '',
-        country: '',
-        phone: '',
-        email: '',
-        emailConfirmation: '',
-        travelAgentId: agentAdressId ?? 0,
-        travelAgentName: ''
-    };
-    if (initialValues.rooms?.[0]?.adults?.[0]) {
-        initialValues.mainBookerId = initialValues.rooms[0].adults[0].id;
-    }
-    return initialValues;
-}
-function createInitialValuesFromEditablePackagingEntry(editablePackagingEntry, agentAdressId) {
-    const pax = editablePackagingEntry?.pax ?? [];
-    const rooms = editablePackagingEntry.rooms.map((room) => {
-        const roomPax = pax.filter((x) => room.paxIds.includes(x.id));
-        const adults = roomPax.filter((x) => x.age >= 18);
-        const children = roomPax.filter((x) => x.age < 18);
-        return {
-            adults: adults.map((roomTraveler) => {
-                return {
-                    id: roomTraveler.id,
-                    firstName: roomTraveler.firstName ?? '',
-                    lastName: roomTraveler.lastName ?? '',
-                    birthDate: roomTraveler.dateOfBirth ? format$2(new Date(roomTraveler.dateOfBirth), 'yyyy-MM-dd') : '',
-                    gender: ''
-                };
-            }),
-            children: children.map((roomTraveler) => {
-                return {
-                    id: roomTraveler.id,
-                    firstName: roomTraveler.firstName ?? '',
-                    lastName: roomTraveler.lastName ?? '',
-                    birthDate: roomTraveler.dateOfBirth ? format$2(new Date(roomTraveler.dateOfBirth), 'yyyy-MM-dd') : '',
-                    gender: '',
-                    isBaby: isBabyAge(roomTraveler.age)
-                };
-            })
-        };
-    });
-    const values = createInitialValuesFromRooms(rooms.map((room) => ({ adults: room.adults, children: room.children })), first(editablePackagingEntry?.lines)?.from, last(editablePackagingEntry?.lines)?.to, agentAdressId);
-    values.rooms = rooms;
-    values.mainBookerId = pax.find((x) => x.isMainBooker)?.id ?? rooms[0]?.adults?.[0]?.id ?? -1;
-    const address = editablePackagingEntry?.address;
-    values.street = address?.street ?? '';
-    values.houseNumber = address?.houseNumber ?? '';
-    values.box = address?.box ?? '';
-    values.zipCode = address?.zipCode ?? '';
-    values.place = address?.place ?? '';
-    values.country = address?.country ?? '';
-    values.phone = address?.phone ?? '';
-    values.email = address?.email ?? '';
-    values.emailConfirmation = address?.email ?? '';
-    values.travelAgentId = address?.travelAgentId ?? agentAdressId ?? 0;
-    return values;
+                                React__default.createElement(Icon, { name: "ui-tooltip", className: "icon--secondary-color" }),
+                                React__default.createElement("div", { className: "info-message__copy" },
+                                    React__default.createElement("h5", null, translations.SUMMARY.VALIDATE_TITLE),
+                                    settings.customValidateText ? (React__default.createElement("div", { dangerouslySetInnerHTML: {
+                                            __html: settings.customValidateText
+                                        } })) : (React__default.createElement(React__default.Fragment, null,
+                                        React__default.createElement("p", null, settings.isOffer ? translations.SUMMARY.VALIDATE_TEXT_OFFER : translations.SUMMARY.VALIDATE_TEXT_BOOKING),
+                                        settings.allowOption && React__default.createElement("p", null, translations.SUMMARY.VALIDATE_TEXT_OPTION))),
+                                    checkboxes &&
+                                        checkboxes.map((checkbox) => (React__default.createElement("div", { className: "checkbox", key: checkbox.id },
+                                            React__default.createElement("label", { className: "checkbox__label" },
+                                                React__default.createElement("input", { type: "checkbox", className: "checkbox__input", checked: checkbox.isSelected, onChange: (e) => handleCheckboxChange(checkbox.id, e.target.checked) }),
+                                                React__default.createElement("span", { className: "checkbox__label-text", dangerouslySetInnerHTML: {
+                                                        __html: checkbox.text
+                                                    } }))))))))))),
+            React__default.createElement("div", { className: "booking__navigator" },
+                settings.skipRouter ? (React__default.createElement("button", { type: "button", title: translations.STEPS.PREVIOUS, onClick: () => goPrevious(), className: "cta cta--secondary" }, translations.STEPS.PREVIOUS)) : (React__default.createElement(Link, { to: `${!settings.skipBasePathInRouting ? settings.basePath : ''}${travelersFirstStep ? settings.options.pathSuffix : settings.travellers.pathSuffix}?${bookingQueryString}`, title: translations.STEPS.PREVIOUS, className: "cta cta--secondary" }, translations.STEPS.PREVIOUS)),
+                settings.allowOption && (React__default.createElement("button", { title: translations.STEPS.SUBMIT_OPTION, className: buildClassName(['cta', !userValidated && 'cta--disabled']), disabled: !userValidated, name: "option" }, translations.STEPS.SUBMIT_OPTION)),
+                React__default.createElement("button", { title: settings.isOffer ? translations.STEPS.SUBMIT_OFFER : translations.STEPS.SUBMIT_BOOKING, className: buildClassName(['cta', !userValidated && 'cta--disabled']), disabled: !userValidated, name: "default" }, settings.isOffer ? translations.STEPS.SUBMIT_OFFER : translations.STEPS.SUBMIT_BOOKING))))));
+};
+
+function isValidEmail(email) {
+    return !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,24}$/i.test(email);
 }
-function applyTravelersFormValuesToEditablePackagingEntry(editablePackagingEntry, values) {
-    const travelers = values.rooms.flatMap((room) => [...room.adults, ...room.children]);
-    return {
-        ...editablePackagingEntry,
-        pax: (editablePackagingEntry.pax ?? []).map((pax) => {
-            const traveler = travelers.find((x) => x.id === pax.id);
-            if (!traveler)
-                return pax;
-            return {
-                ...pax,
-                firstName: traveler.firstName ?? '',
-                lastName: traveler.lastName ?? '',
-                dateOfBirth: traveler.birthDate || null,
-                isMainBooker: traveler.id === values.mainBookerId
-            };
-        }),
-        address: {
-            ...editablePackagingEntry.address,
-            street: values.street,
-            houseNumber: values.houseNumber,
-            box: values.box,
-            zipCode: values.zipCode,
-            place: values.place,
-            country: values.country,
-            travelAgentId: values.travelAgentId,
-            phone: values.phone,
-            email: values.email
-        }
-    };
+const NAME_CHARACTERS_REGEX = /^[\p{L}\s-]+$/u;
+function hasInvalidNameCharacters(name) {
+    return !NAME_CHARACTERS_REGEX.test(name);
 }
-const SharedTravelersForm = ({ formik, translations, travellersSettings, countries, agents, bookingType, agentAdressId, travelersFirstStep = false, isUnavailable = false, useCompactForm = false, showAllCountries = false, showAgentSelection = false, initialShowAgents = false, renderPreviousButton, onBookingTypeChange }) => {
-    const [showAgents, setShowAgents] = useState(initialShowAgents);
-    const typeaheadAgents = useMemo(() => sortBy(agents?.map((agent) => ({
-        key: `${agent.id}`,
-        value: `${agent.name}${agent.postalCode || agent.location ? ` (${compact([agent.postalCode, agent.location]).join(' ')})` : ''}`,
-        text: `${agent.name}${agent.postalCode || agent.location ? ` (${compact([agent.postalCode, agent.location]).join(' ')})` : ''}`
-    })), 'value') ?? [], [agents]);
-    const [filteredAgents, setFilteredAgents] = useState(typeaheadAgents);
-    const flatErrors = flat(formik.errors);
-    const errorKeys = Object.keys(flatErrors).filter((key) => get(formik.touched, key));
-    const hasVisibleError = (key) => get(formik.errors, key) && get(formik.touched, key);
-    const mainBooker = formik.values.rooms
-        .find((room) => room.adults.find((traveler) => traveler.id === formik.values.mainBookerId))
-        ?.adults.find((traveler) => traveler.id === formik.values.mainBookerId);
-    const countryOptions = [
-        { key: 'empty', value: undefined, label: translations.TRAVELERS_FORM.SELECT_COUNTRY },
-        ...(showAllCountries
-            ? countries?.map((country) => ({ key: country.iso2, value: country.iso2, label: country.name })) ?? []
-            : travellersSettings?.countries?.map((country) => ({ key: country.iso2, value: country.iso2, label: country.name })) ?? [
-                { 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 }
-            ])
-    ];
-    const handleMainBookerChange = (event) => {
-        formik.setFieldValue('mainBookerId', parseInt(event.currentTarget.value, 10));
+// Rejects values like a 5-digit year, which the native date input allows while typing
+function isValidBirthDate(birthDateText) {
+    return isValid(parse(birthDateText, 'yyyy-MM-dd', new Date()));
+}
+function getAge(birthDateText, startDateText) {
+    var birthDate = new Date(birthDateText);
+    var startDate = new Date(startDateText);
+    var age = startDate.getFullYear() - birthDate.getFullYear();
+    var m = startDate.getMonth() - birthDate.getMonth();
+    if (m < 0 || (m === 0 && startDate.getDate() < birthDate.getDate())) {
+        age--;
+    }
+    return age;
+}
+const validateForm$1 = (values, agentRequired, bookingType, translations, formFields, mainBookerFormFields, maxChildAge = CHILD_MAX_AGE, maxBabyAge = BABY_MAX_AGE, paxFields = []) => {
+    const errors = {};
+    const isFormFieldPresent = (type) => {
+        return formFields?.some((f) => f.type === type) ?? true;
     };
-    const handleAgentChange = (value) => {
-        setFilteredAgents(typeaheadAgents.filter((x) => x.value.toLocaleLowerCase().indexOf(value.toLocaleLowerCase()) > -1));
-        formik.setFieldValue('travelAgentName', value);
+    const isMainBookerFormFieldPresent = (type) => {
+        return mainBookerFormFields?.some((f) => f.type === type) ?? true;
     };
-    const handleAgentSelect = (key) => {
-        const agent = typeaheadAgents.find((x) => x.key === key);
-        formik.setValues({
-            ...formik.values,
-            travelAgentId: Number(agent?.key),
-            travelAgentName: agent?.value ?? ''
-        });
-        onBookingTypeChange?.(agentAdressId && agentAdressId !== 0 ? 'b2b' : 'b2b2c');
+    const formatTravelerField = (room, pax, field) => {
+        return values.rooms.length > 1
+            ? format$1(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_FIELD, [room, pax, field])
+            : format$1(translations.TRAVELERS_FORM.VALIDATION.SINGLE_ROOM_TRAVELER_X_FIELD, [pax, field]);
     };
-    const handleAgentClear = () => {
-        formik.setValues({ ...formik.values, travelAgentId: 0, travelAgentName: '' });
-        onBookingTypeChange?.('b2c');
+    const formatTravelerIsNoAdult = (room, pax) => {
+        return values.rooms.length > 1
+            ? format$1(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_IS_NO_ADULT, [room, pax])
+            : format$1(translations.TRAVELERS_FORM.VALIDATION.SINGLE_ROOM_TRAVELER_X_IS_NO_ADULT, [pax]);
     };
-    const toggleAgent = (value) => {
-        setShowAgents(value);
-        if (!value) {
-            handleAgentClear();
-            setFilteredAgents([]);
-        }
+    const formatTravelerIsNoChild = (room, pax) => {
+        return values.rooms.length > 1
+            ? format$1(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_IS_NO_CHILD, [room, pax])
+            : format$1(translations.TRAVELERS_FORM.VALIDATION.SINGLE_ROOM_TRAVELER_X_IS_NO_CHILD, [pax]);
     };
-    const handleAddTraveler = (roomIndex) => {
-        const rooms = [...formik.values.rooms];
-        const newAdult = { id: Date.now(), firstName: '', lastName: '', birthDate: '', gender: '' };
-        rooms[roomIndex] = { ...rooms[roomIndex], adults: [...rooms[roomIndex].adults, newAdult] };
-        formik.setFieldValue('rooms', rooms);
+    const formatTravelerIsNoBaby = (room, pax) => {
+        // The message states the boundary the traveler has to stay under, so we pass
+        // the first age that is too old rather than the inclusive maxBabyAge.
+        const tooOldAge = maxBabyAge + 1;
+        return values.rooms.length > 1
+            ? format$1(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_IS_NO_BABY, [room, pax, tooOldAge])
+            : format$1(translations.TRAVELERS_FORM.VALIDATION.SINGLE_ROOM_TRAVELER_X_IS_NO_BABY, [pax, tooOldAge]);
     };
-    const handleRemoveTraveler = (roomIndex, travelerIndex) => {
-        const rooms = [...formik.values.rooms];
-        const adults = [...rooms[roomIndex].adults];
-        if (adults.length <= 1)
-            return;
-        adults.splice(travelerIndex, 1);
-        rooms[roomIndex] = { ...rooms[roomIndex], adults };
-        formik.setFieldValue('rooms', rooms);
+    const formatTravelerFieldInvalidCharacters = (room, pax, field) => {
+        return values.rooms.length > 1
+            ? format$1(translations.TRAVELERS_FORM.VALIDATION.TRAVELER_X_FIELD_INVALID_CHARACTERS, [room, pax, field])
+            : format$1(translations.TRAVELERS_FORM.VALIDATION.SINGLE_ROOM_TRAVELER_X_FIELD_INVALID_CHARACTERS, [pax, field]);
     };
-    const handleAddRoom = () => {
-        const rooms = [...formik.values.rooms];
-        rooms.push({ adults: [{ id: Date.now(), firstName: '', lastName: '', birthDate: '', gender: '' }], children: [] });
-        formik.setFieldValue('rooms', rooms);
+    const validateRequiredCustomFields = (traveler, path, room, pax) => {
+        const isMainBooker = traveler.id === values.mainBookerId;
+        const requiredFields = getApplicablePaxCustomFields(paxFields, isMainBooker).filter((f) => f.isRequired);
+        requiredFields.forEach((field) => {
+            const fieldIndex = traveler.customFields?.findIndex((c) => c.customFieldConfigurationId === field.customFieldConfigurationId) ?? -1;
+            if (fieldIndex < 0)
+                return;
+            if (isEmpty$1(traveler.customFields[fieldIndex].value)) {
+                set(errors, `${path}.customFields[${fieldIndex}].value`, formatTravelerField(room, pax, field.fieldName));
+            }
+        });
     };
-    const handleRemoveRoom = (roomIndex) => {
-        const rooms = [...formik.values.rooms];
-        rooms.splice(roomIndex, 1);
-        formik.setFieldValue('rooms', rooms);
+    // Excludes the 4 core fields, which are already validated unconditionally below.
+    const validateRequiredBuiltInFields = (traveler, path, room, pax) => {
+        const isMainBooker = traveler.id === values.mainBookerId;
+        const requiredFields = getApplicableBuiltInPaxFields(paxFields, isMainBooker).filter((f) => f.isRequired && !CORE_FIELD_NAMES.has(f.fieldName));
+        requiredFields.forEach((field) => {
+            const fieldPath = BUILT_IN_FIELD_PATHS[field.fieldName];
+            if (!fieldPath)
+                return;
+            if (isEmpty$1(get(traveler, fieldPath))) {
+                set(errors, `${path}.${fieldPath}`, formatTravelerField(room, pax, field.fieldName));
+            }
+        });
     };
-    const renderGenderControl = (name, value) => (React__default.createElement("div", { className: buildClassName(['form__group', hasVisibleError(name) && 'form__group--error']) },
-        React__default.createElement("label", { className: "form__label" },
-            translations.TRAVELERS_FORM.GENDER_ID,
-            " *"),
-        React__default.createElement("div", { className: "radiobutton-group" }, [
-            ['m', translations.TRAVELERS_FORM.MALE_GENDER],
-            ['f', translations.TRAVELERS_FORM.FEMALE_GENDER]
-        ].map(([gender, label]) => (React__default.createElement("div", { className: "radiobutton", key: gender },
-            React__default.createElement("label", { className: "radiobutton__label" },
-                React__default.createElement("input", { type: "radio", className: "radiobutton__input", name: name, onChange: formik.handleChange, onBlur: formik.handleBlur, value: gender, checked: value.gender === gender }),
-                label)))))));
-    const getControl = (type, value, name) => {
-        switch (type) {
-            case 'gender':
-                return React__default.createElement(GenderControl, { translations: translations, value: value, formik: formik, name: name });
-            case 'firstName':
-                return (React__default.createElement(LabeledInput, { hasError: hasVisibleError(name), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.FIRST_NAME, required: true, name: name, onChange: formik.handleChange, onBlur: formik.handleBlur, value: value.firstName }));
-            case 'lastName':
-                return (React__default.createElement(LabeledInput, { hasError: hasVisibleError(name), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.LAST_NAME, required: true, name: name, onChange: formik.handleChange, onBlur: formik.handleBlur, value: value.lastName }));
-            case 'birthDate':
-                return (React__default.createElement(LabeledInput, { type: "date", hasError: hasVisibleError(name), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.BIRTHDATE, required: true, name: name, onChange: formik.handleChange, onBlur: formik.handleBlur, value: value.birthDate }));
-            case 'country':
-                return (React__default.createElement(LabeledSelect, { hasError: hasVisibleError('country'), label: translations.TRAVELERS_FORM.COUNTRY, required: true, name: "country", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.country, options: countryOptions }));
-            case 'phone':
-                return (React__default.createElement(PhoneInput, { countries: travellersSettings?.countries ?? [], countryIso2: formik.values.country, hasError: hasVisibleError('phone'), label: translations.TRAVELERS_FORM.PHONE, required: true, name: "phone", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.phone }));
-            case 'email':
-                return (React__default.createElement(React__default.Fragment, null,
-                    React__default.createElement(LabeledInput, { type: "email", hasError: hasVisibleError('email'), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.EMAIL, required: true, name: "email", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.email }),
-                    React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.emailConfirmation })));
-            case 'street':
-                return (React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.street }));
-            case 'houseNumber':
-                return (React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.houseNumber }));
-            case 'box':
-                return (React__default.createElement(LabeledInput, { hasError: hasVisibleError('box'), extraClassName: "form__group--20", label: translations.TRAVELERS_FORM.POST_BOX, name: "box", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.box }));
-            case 'zipCode':
-                return (React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.zipCode }));
-            case 'place':
-                return (React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.place }));
-            default:
-                return null;
+    values.rooms.forEach((r, rIndex) => r.adults.forEach((adult, index) => {
+        if (isEmpty$1(adult.gender) && isFormFieldPresent('gender')) {
+            set(errors, `rooms[${rIndex}].adults[${index}].gender`, formatTravelerField(rIndex + 1, index + 1, translations.TRAVELERS_FORM.GENDER));
         }
-    };
-    const renderRoomLabel = (room) => compact([
-        room.adults.length,
-        room.adults.length === 1 && ` ${translations.TRAVELERS_FORM.ADULT}`,
-        room.adults.length > 1 && ` ${translations.TRAVELERS_FORM.ADULTS}`,
-        room.adults?.length && room.children?.length && ', ',
-        room.children.length,
-        room.children.length === 1 && ` ${translations.TRAVELERS_FORM.CHILD}`,
-        room.children.length > 1 && ` ${translations.TRAVELERS_FORM.CHILDREN}`
-    ]).join('');
-    const renderTravelerFields = (travelerValues, namePrefix, isAdult, roomIndex, travelerIndex) => {
-        if (useCompactForm) {
-            return (React__default.createElement("div", { className: "form__row" },
-                React__default.createElement(LabeledInput, { hasError: hasVisibleError(`${namePrefix}.age`), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.AGE, required: true, name: `${namePrefix}.age`, onChange: formik.handleChange, onBlur: formik.handleBlur, value: travelerValues.age })));
+        if (isFormFieldPresent('firstName')) {
+            if (isEmpty$1(adult.firstName)) {
+                set(errors, `rooms[${rIndex}].adults[${index}].firstName`, formatTravelerField(rIndex + 1, index + 1, translations.TRAVELERS_FORM.FIRST_NAME));
+            }
+            else if (hasInvalidNameCharacters(adult.firstName)) {
+                set(errors, `rooms[${rIndex}].adults[${index}].firstName`, formatTravelerFieldInvalidCharacters(rIndex + 1, index + 1, translations.TRAVELERS_FORM.FIRST_NAME));
+            }
         }
-        if (travellersSettings?.formFields?.length) {
-            return (React__default.createElement("div", { className: "travelers-form__grid" }, travellersSettings.formFields.map((field, index) => (React__default.createElement("div", { key: index, className: `control control--${field.type}` }, getControl(field.type, travelerValues, `${namePrefix}.${field.type}`))))));
+        if (isFormFieldPresent('lastName')) {
+            if (isEmpty$1(adult.lastName)) {
+                set(errors, `rooms[${rIndex}].adults[${index}].lastName`, formatTravelerField(rIndex + 1, index + 1, translations.TRAVELERS_FORM.LAST_NAME));
+            }
+            else if (hasInvalidNameCharacters(adult.lastName)) {
+                set(errors, `rooms[${rIndex}].adults[${index}].lastName`, formatTravelerFieldInvalidCharacters(rIndex + 1, index + 1, translations.TRAVELERS_FORM.LAST_NAME));
+            }
         }
-        return (React__default.createElement(React__default.Fragment, null,
-            React__default.createElement("div", { className: "form__row" }, renderGenderControl(`${namePrefix}.gender`, travelerValues)),
-            React__default.createElement("div", { className: "form__row" },
-                React__default.createElement(LabeledInput, { hasError: hasVisibleError(`${namePrefix}.firstName`), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.FIRST_NAME, required: true, name: `${namePrefix}.firstName`, onChange: formik.handleChange, onBlur: formik.handleBlur, value: travelerValues.firstName }),
-                React__default.createElement(LabeledInput, { hasError: hasVisibleError(`${namePrefix}.lastName`), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.LAST_NAME, required: true, name: `${namePrefix}.lastName`, onChange: formik.handleChange, onBlur: formik.handleBlur, value: travelerValues.lastName }),
-                React__default.createElement(LabeledInput, { type: "date", hasError: hasVisibleError(`${namePrefix}.birthDate`), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.BIRTHDATE, required: true, name: `${namePrefix}.birthDate`, onChange: formik.handleChange, onBlur: formik.handleBlur, value: travelerValues.birthDate })),
-            travelersFirstStep && isAdult && formik.values.rooms[roomIndex].adults.length > 1 && (React__default.createElement("button", { type: "button", className: "cta cta--secondary", onClick: () => handleRemoveTraveler(roomIndex, travelerIndex) }, translations.TRAVELERS_FORM.REMOVE_TRAVELER))));
-    };
-    return (React__default.createElement("form", { className: "form form__travelers", name: "booking--travellers", id: "booking--travellers", noValidate: true, onSubmit: formik.handleSubmit, onReset: formik.handleReset },
-        React__default.createElement("div", { className: "form__travelers__wrapper" },
-            formik.values.rooms.map((room, roomIndex) => (React__default.createElement("div", { key: roomIndex },
-                formik.values.rooms.length > 1 && (React__default.createElement("div", { className: "form__region" },
-                    React__default.createElement("div", { className: "form__region-header" },
-                        React__default.createElement("h5", { className: "form__region-heading" },
-                            translations.SHARED.ROOM,
-                            " ",
-                            roomIndex + 1),
-                        React__default.createElement("p", { className: "form__region-label" }, renderRoomLabel(room))),
-                    !useCompactForm && travelersFirstStep && formik.values.rooms.length > 1 && (React__default.createElement("button", { type: "button", className: "cta cta--secondary", onClick: () => handleRemoveRoom(roomIndex) }, "Verwijder reisgezelschap")))),
-                room.adults.map((travelerValues, index) => (React__default.createElement("div", { className: "form__region", key: travelerValues.id },
-                    React__default.createElement("div", { className: "form__region-header" },
-                        React__default.createElement("h5", { className: "form__region-heading" },
-                            translations.TRAVELERS_FORM.TRAVELER,
-                            " ",
-                            index + 1),
-                        React__default.createElement("p", { className: "form__region-label" }, translations.TRAVELERS_FORM.ADULT),
-                        React__default.createElement("div", { className: "radiobutton" },
-                            React__default.createElement("label", { className: "radiobutton__label" },
-                                React__default.createElement("input", { type: "radio", name: "mainBookerId", onChange: handleMainBookerChange, onBlur: formik.handleBlur, value: travelerValues.id, checked: formik.values.mainBookerId === travelerValues.id, className: "radiobutton__input" }),
-                                translations.TRAVELERS_FORM.MAIN_BOOKER))),
-                    renderTravelerFields(travelerValues, `rooms[${roomIndex}].adults[${index}]`, true, roomIndex, index)))),
-                room.children.map((travelerValues, index) => (React__default.createElement("div", { className: "form__region", key: travelerValues.id },
-                    React__default.createElement("div", { className: "form__region-header" },
-                        React__default.createElement("h5", { className: "form__region-heading" },
-                            translations.TRAVELERS_FORM.TRAVELER,
-                            " ",
-                            room.adults.length + index + 1),
-                        React__default.createElement("p", { className: "form__region-label" }, travelerValues.isBaby ? translations.TRAVELERS_FORM.BABY : translations.TRAVELERS_FORM.CHILD)),
-                    renderTravelerFields(travelerValues, `rooms[${roomIndex}].children[${index}]`, false, roomIndex, index)))),
-                !useCompactForm && travelersFirstStep && (React__default.createElement("div", { className: "form__region" },
-                    React__default.createElement("button", { type: "button", className: "cta cta--select", onClick: () => handleAddTraveler(roomIndex) }, translations.TRAVELERS_FORM.ADD_TRAVELER)))))),
-            !useCompactForm && (bookingType !== 'b2b' || travellersSettings?.mainBookerFormFields?.length) ? (React__default.createElement("div", { className: "form__region" },
-                React__default.createElement("div", { className: "form__region-header" },
-                    React__default.createElement("h5", { className: "form__region-heading" }, translations.TRAVELERS_FORM.MAIN_BOOKER),
-                    React__default.createElement("p", { className: "form__region-label" }, compact([compact([mainBooker?.firstName, mainBooker?.lastName]).join(' '), formatBirthDate$1(mainBooker?.birthDate)]).join(', '))),
-                travellersSettings?.mainBookerFormFields?.length ? (React__default.createElement("div", { className: "main-booker-form__grid" }, travellersSettings.mainBookerFormFields.map((field, index) => (React__default.createElement("div", { key: index, className: `control control--${field.type}` }, getControl(field.type, {}, field.type)))))) : (React__default.createElement(React__default.Fragment, null,
-                    React__default.createElement("div", { className: "form__twocolumn" },
-                        React__default.createElement("div", { className: "form__twocolumn-column" },
-                            React__default.createElement("div", { className: "form__row" },
-                                React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.street }),
-                                React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.houseNumber }),
-                                React__default.createElement(LabeledInput, { hasError: hasVisibleError('box'), extraClassName: "form__group--20", label: translations.TRAVELERS_FORM.POST_BOX, name: "box", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.box }))),
-                        React__default.createElement("div", { className: "form__twocolumn-column" },
-                            React__default.createElement("div", { className: "form__row" },
-                                React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.zipCode }),
-                                React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.place }),
-                                React__default.createElement(LabeledSelect, { hasError: hasVisibleError('country'), extraClassName: "form__group--sm-40", label: translations.TRAVELERS_FORM.COUNTRY, required: true, name: "country", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.country, options: countryOptions })))),
-                    React__default.createElement("div", { className: "form__row" },
-                        React__default.createElement(LabeledInput, { hasError: hasVisibleError('phone'), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.PHONE, required: true, name: "phone", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.phone }),
-                        React__default.createElement(LabeledInput, { type: "email", hasError: hasVisibleError('email'), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.EMAIL, required: true, name: "email", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.email }),
-                        React__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.handleChange, onBlur: formik.handleBlur, value: formik.values.emailConfirmation })))))) : !useCompactForm ? (React__default.createElement("div", { className: "form__region" },
-                React__default.createElement("div", { className: "form__row" },
-                    React__default.createElement(LabeledInput, { hasError: hasVisibleError('phone'), extraClassName: "form__group--md-33", label: translations.TRAVELERS_FORM.PHONE, required: true, name: "phone", onChange: formik.handleChange, onBlur: formik.handleBlur, value: formik.values.phone })))) : null,
-            !useCompactForm && showAgentSelection && (React__default.createElement("div", { className: "form__region" },
-                React__default.createElement("div", { className: "form__region-header" },
-                    React__default.createElement("h5", { className: "form__region-heading" }, translations.TRAVELERS_FORM.BOOK_WITH_AGENT),
-                    React__default.createElement("div", { className: "checkbox", id: "cbxChooseOffice" },
-                        React__default.createElement("label", { className: "checkbox__label" },
-                            React__default.createElement("input", { type: "checkbox", name: "booking--mainbooker", checked: showAgents, onChange: () => toggleAgent(!showAgents), className: "checkbox__input" }),
-                            translations.TRAVELERS_FORM.CHOOSE_OFFICE))),
-                showAgents && (React__default.createElement("div", { className: "form__row form__row--choose-office" },
-                    React__default.createElement("div", { className: buildClassName(['form__group', 'form__group--icon', hasVisibleError('travelAgentId') && 'form__group--error']) },
-                        React__default.createElement(TypeAheadInput, { value: formik.values.travelAgentName, options: filteredAgents, onChange: handleAgentChange, onSelect: handleAgentSelect, onClear: handleAgentClear, name: "travelAgentName", placeholder: translations.TRAVELERS_FORM.CHOOSE_AGENT_PLACEHOLDER }))))))),
-        !useCompactForm && errorKeys.length > 0 && (React__default.createElement("div", { className: "form__region form__region--errors" },
-            React__default.createElement("div", { className: "form__row" },
-                React__default.createElement("div", { className: "form__group" },
-                    React__default.createElement("p", { className: "form__error-heading" },
-                        translations.TRAVELERS_FORM.VALIDATION_MESSAGE,
-                        ":"),
-                    React__default.createElement("ul", { className: "list" }, errorKeys.map((key) => (React__default.createElement("li", { key: key }, get(flatErrors, key))))))))),
-        travelersFirstStep && (React__default.createElement("div", { className: "booking__navigator" },
-            React__default.createElement("button", { type: "button", className: "cta cta--select", onClick: handleAddRoom }, translations.TRAVELERS_FORM.ADD_ROOM))),
-        React__default.createElement("div", { className: "booking__navigator" },
-            renderPreviousButton?.(),
-            React__default.createElement("button", { type: "submit", title: translations.STEPS.NEXT, className: 'cta' + (isUnavailable ? ' cta--disabled' : '') }, translations.STEPS.NEXT))));
+        if (isFormFieldPresent('birthDate')) {
+            if (isEmpty$1(adult.birthDate) || !isValidBirthDate(adult.birthDate)) {
+                set(errors, `rooms[${rIndex}].adults[${index}].birthDate`, formatTravelerField(rIndex + 1, index + 1, translations.TRAVELERS_FORM.BIRTHDATE));
+            }
+            else if (values.endDate) {
+                // If you are younger than the maxChildAge at the end of the trip, you are considered a child, so we check the endDate here instead of the startDate
+                const age = getAge(adult.birthDate, values.endDate);
+                if (age <= maxChildAge) {
+                    set(errors, `rooms[${rIndex}].adults[${index}].birthDate`, formatTravelerIsNoAdult(rIndex + 1, index + 1));
+                }
+            }
+        }
+        validateRequiredCustomFields(adult, `rooms[${rIndex}].adults[${index}]`, rIndex + 1, index + 1);
+        validateRequiredBuiltInFields(adult, `rooms[${rIndex}].adults[${index}]`, rIndex + 1, index + 1);
+    }));
+    values.rooms.forEach((r, rIndex) => r.children.forEach((child, index) => {
+        if (isEmpty$1(child.gender) && isFormFieldPresent('gender')) {
+            set(errors, `rooms[${rIndex}].children[${index}].gender`, formatTravelerField(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.GENDER));
+        }
+        if (isFormFieldPresent('firstName')) {
+            if (isEmpty$1(child.firstName)) {
+                set(errors, `rooms[${rIndex}].children[${index}].firstName`, formatTravelerField(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.FIRST_NAME));
+            }
+            else if (hasInvalidNameCharacters(child.firstName)) {
+                set(errors, `rooms[${rIndex}].children[${index}].firstName`, formatTravelerFieldInvalidCharacters(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.FIRST_NAME));
+            }
+        }
+        if (isFormFieldPresent('lastName')) {
+            if (isEmpty$1(child.lastName)) {
+                set(errors, `rooms[${rIndex}].children[${index}].lastName`, formatTravelerField(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.LAST_NAME));
+            }
+            else if (hasInvalidNameCharacters(child.lastName)) {
+                set(errors, `rooms[${rIndex}].children[${index}].lastName`, formatTravelerFieldInvalidCharacters(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.LAST_NAME));
+            }
+        }
+        if (isFormFieldPresent('birthDate')) {
+            if (isEmpty$1(child.birthDate) || !isValidBirthDate(child.birthDate)) {
+                set(errors, `rooms[${rIndex}].children[${index}].birthDate`, formatTravelerField(rIndex + 1, r.adults.length + index + 1, translations.TRAVELERS_FORM.BIRTHDATE));
+            }
+            else if (child.isBaby && values.startDate) {
+                // A baby only has to be under the maxBabyAge on departure, so we check the startDate here instead of the endDate (TIDE-3269)
+                const age = getAge(child.birthDate, values.startDate);
+                if (age > maxBabyAge) {
+                    set(errors, `rooms[${rIndex}].children[${index}].birthDate`, formatTravelerIsNoBaby(rIndex + 1, r.adults.length + index + 1));
+                }
+            }
+            else if (values.endDate) {
+                // You need to be under the maxChildAge until the end of the trip, so we check the endDate here instead of the startDate.
+                // Babies land here too when there is no startDate to check them against, so they keep at least the child age check.
+                const age = getAge(child.birthDate, values.endDate);
+                if (age > maxChildAge) {
+                    set(errors, `rooms[${rIndex}].children[${index}].birthDate`, formatTravelerIsNoChild(rIndex + 1, r.adults.length + index + 1));
+                }
+            }
+        }
+        validateRequiredCustomFields(child, `rooms[${rIndex}].children[${index}]`, rIndex + 1, r.adults.length + index + 1);
+        validateRequiredBuiltInFields(child, `rooms[${rIndex}].children[${index}]`, rIndex + 1, r.adults.length + index + 1);
+    }));
+    if (values.mainBookerId < 0) {
+        errors.mainBookerId = translations.TRAVELERS_FORM.VALIDATION.NO_MAIN_BOOKER_SELECTED;
+    }
+    if (bookingType != 'b2b' || mainBookerFormFields?.length) {
+        if (isEmpty$1(values.street) && isMainBookerFormFieldPresent('street')) {
+            errors.street = format$1(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.STREET]);
+        }
+        if (isEmpty$1(values.houseNumber) && isMainBookerFormFieldPresent('houseNumber')) {
+            errors.houseNumber = format$1(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.HOUSE_NUMBER]);
+        }
+        if (isEmpty$1(values.zipCode) && isMainBookerFormFieldPresent('zipCode')) {
+            errors.zipCode = format$1(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.ZIPCODE]);
+        }
+        if (isEmpty$1(values.place) && isMainBookerFormFieldPresent('place')) {
+            errors.place = format$1(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.CITY]);
+        }
+        if (isMainBookerFormFieldPresent('email')) {
+            if (isEmpty$1(values.email)) {
+                errors.email = format$1(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 (isEmpty$1(values.emailConfirmation)) {
+                errors.emailConfirmation = format$1(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 (isEmpty$1(values.country) && isMainBookerFormFieldPresent('country')) {
+            errors.country = format$1(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.COUNTRY]);
+        }
+        if (isEmpty$1(values.phone) && isMainBookerFormFieldPresent('phone')) {
+            errors.phone = format$1(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.PHONE]);
+        }
+    }
+    else {
+        if (isEmpty$1(values.phone)) {
+            errors.phone = format$1(translations.TRAVELERS_FORM.VALIDATION.MAIN_BOOKER_FIELD, [translations.TRAVELERS_FORM.PHONE]);
+        }
+    }
+    if (agentRequired && !values.travelAgentId) {
+        errors.travelAgentId = translations.TRAVELERS_FORM.VALIDATION.AGENT_IS_REQUIRED;
+    }
+    return errors;
 };
 
 const TravelersForm = () => {
@@ -23743,12 +24511,13 @@ const TravelersForm = () => {
     const bookingAttributes = useSelector(selectBookingAttributes);
     const hasMounted = useSelector(selectHasMounted);
     const countries = useSelector(selectCountries);
+    const paxFields = useSelector(selectPaxFields);
     const inFlight = useRef(false);
     const pendingRefetch = useRef(false);
     const useCompactForm = !!settings.travellers.compactForm && !!settings.agentAdressId;
     const showAllCountries = !!settings.travellers.showAllCountries;
     const initialValues = useSelector(selectTravelersFormValues) ??
-        createInitialValuesFromRooms(formRooms, startDate, endDate, agentAdressId, translations.TRAVELERS_FORM.PERSON, useCompactForm, settings.maxBabyAge);
+        createInitialValuesFromRooms(formRooms, startDate, endDate, agentAdressId, translations.TRAVELERS_FORM.PERSON, useCompactForm, settings.maxBabyAge, paxFields);
     const [showAgentSelection, setShowAgentSelection] = useState(!settings.agentAdressId && !settings.hideAgentSelection);
     const formik = useFormik({
         initialValues,
@@ -23758,7 +24527,7 @@ const TravelersForm = () => {
             // The travel dates are captured into initialValues once and then persisted in
             // redux, so validating against the values would use the dates of whichever
             // package option was selected first. Age checks need the current ones.
-            { ...values, startDate, endDate }, settings.agentRequired, bookingType, translations, settings.travellers.formFields, settings.travellers.mainBookerFormFields, settings.maxChildAge, settings.maxBabyAge),
+            { ...values, startDate, endDate }, settings.agentRequired, bookingType, translations, settings.travellers.formFields, settings.travellers.mainBookerFormFields, settings.maxChildAge, settings.maxBabyAge, paxFields),
         onSubmit: (values) => {
             dispatch(setFormValues(values));
             if (useCompactForm) {
@@ -23841,7 +24610,7 @@ const TravelersForm = () => {
         dispatch(setFormValues(formValues));
         setShowAgentSelection(false);
     }, [agents, settings.affiliateSlug]);
-    return (React__default.createElement(SharedTravelersForm, { formik: formik, translations: translations, travellersSettings: settings.travellers, countries: countries, agents: agents, bookingType: bookingType, agentAdressId: agentAdressId, travelersFirstStep: travelersFirstStep, isUnavailable: isUnavailable, useCompactForm: useCompactForm, showAllCountries: showAllCountries, showAgentSelection: showAgentSelection, initialShowAgents: settings.agentRequired ?? false, onBookingTypeChange: (nextBookingType) => dispatch(setBookingType(nextBookingType)), renderPreviousButton: () => !travelersFirstStep && settings.skipRouter ? (React__default.createElement("button", { type: "button", title: translations.STEPS.PREVIOUS, onClick: () => dispatch(setCurrentStep$1(OPTIONS_FORM_STEP)), className: "cta cta--secondary" }, translations.STEPS.PREVIOUS)) : !travelersFirstStep ? (React__default.createElement(Link, { to: `${!settings.skipBasePathInRouting ? settings.basePath : ''}${settings.options.pathSuffix}?${bookingQueryString}`, title: translations.STEPS.PREVIOUS, className: "cta cta--secondary" }, translations.STEPS.PREVIOUS)) : null }));
+    return (React__default.createElement(SharedTravelersForm, { formik: formik, translations: translations, travellersSettings: settings.travellers, countries: countries, agents: agents, bookingType: bookingType, agentAdressId: agentAdressId, travelersFirstStep: travelersFirstStep, isUnavailable: isUnavailable, useCompactForm: useCompactForm, showAllCountries: showAllCountries, paxFields: paxFields, showAgentSelection: showAgentSelection, initialShowAgents: settings.agentRequired ?? false, onBookingTypeChange: (nextBookingType) => dispatch(setBookingType(nextBookingType)), renderPreviousButton: () => !travelersFirstStep && settings.skipRouter ? (React__default.createElement("button", { type: "button", title: translations.STEPS.PREVIOUS, onClick: () => dispatch(setCurrentStep$1(OPTIONS_FORM_STEP)), className: "cta cta--secondary" }, translations.STEPS.PREVIOUS)) : !travelersFirstStep ? (React__default.createElement(Link, { to: `${!settings.skipBasePathInRouting ? settings.basePath : ''}${settings.options.pathSuffix}?${bookingQueryString}`, title: translations.STEPS.PREVIOUS, className: "cta cta--secondary" }, translations.STEPS.PREVIOUS)) : null }));
 };
 
 const Booking = ({ productCode, productName, thumbnailUrl }) => {
@@ -27913,7 +28682,12 @@ const mapPackagingPaxToBookingPax = (pax, fallbackId, referenceDate) => ({
     dateOfBirth: pax?.dateOfBirth ?? undefined,
     age: pax?.dateOfBirth ? getAgeAtReferenceDate(pax.dateOfBirth, referenceDate) : undefined,
     isMainBooker: pax?.isMainBooker,
-    email: ''
+    email: '',
+    weight: null,
+    weightType: build.WeightType.kilograms,
+    height: null,
+    heightType: build.HeightType.centimeters,
+    customFields: []
 });
 const getRequestRoomsFromPackagingEntry = (entry) => {
     const accommodationLines = (entry.lines ?? []).filter((line) => line.serviceType === ACCOMMODATION_SERVICE_TYPE && line.pax?.length > 0);
@@ -27983,6 +28757,22 @@ const getPackagingRequestRoomsFromBookingRooms = (rooms) => {
     });
 };
 
+// Administrative service lines (fees, insurances, reductions, ...) live on the entry but say
+// nothing about the journey itself, so the itinerary never draws them.
+const HIDDEN_ITINERARY_SERVICE_TYPES = new Set([
+    build.ServiceType.insurance,
+    build.ServiceType.extraService,
+    build.ServiceType.serviceFee,
+    build.ServiceType.gift,
+    build.ServiceType.reduction,
+    build.ServiceType.fee,
+    build.ServiceType.visum,
+    build.ServiceType.voucher,
+    build.ServiceType.specialServices
+]);
+const isMeaningfulItineraryLine = (line) => {
+    return !HIDDEN_ITINERARY_SERVICE_TYPES.has(line.serviceType ?? -1);
+};
 const getFlightLines = (flight) => {
     return flight?.flightInformation?.flightLines ?? [];
 };
@@ -28437,6 +29227,8 @@ const applyResultToLine = (line, result, roomIndex = 0) => {
         isChanged: true
     };
 };
+const buildNodeSelectionLines = (item, result, bookedMode) => bookedMode && matchesCode(result, item.node.code ?? '') ? item.lines : applyResultToLines(item.lines, result);
+const buildFlightSelectionLine = (item, flight, bookedMode) => bookedMode && flight.outwardGuid === item.line.guid ? item.line : applyFlightToLine(item.line, flight);
 const toDateOnlyUtcString = (value) => {
     const date = new Date(value);
     return new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate())).toISOString();
@@ -28494,11 +29286,21 @@ const buildTrajectFlightRequest = ({ node, line }, context, pax) => ({
  * mapper gave them. This swaps in the guid of whatever each line resolved onto, leaving the
  * lines the traveller added themselves alone — those were built from a search result and already
  * carry the right one.
+ *
+ * A booked entry (the traject was rebuilt from a magic-link entry) is the other way around: its
+ * lines live in the dossier under their own guids, and only a line the traveller actually swapped
+ * (isChanged) exists in the search cache. Swapping an untouched line's guid would orphan it —
+ * the backend drops the dossier line and finds nothing to add — so those keep theirs.
  */
 const withCachedEntryLineGuids = (entry, trajectEntry, nodeAvailability, flightAvailability) => {
     const cachedGuids = new Map();
+    const bookedMode = !!trajectEntry.entry.magicLink;
+    const editableByGuid = new Map((entry.lines ?? []).map((line) => [line.guid, line]));
+    const keepsOwnGuid = (guid) => bookedMode && !editableByGuid.get(guid)?.isChanged;
     getTrajectNodesWithLines(trajectEntry).forEach((item) => {
         if (isTrajectFlightNode(item.node)) {
+            if (keepsOwnGuid(item.line.guid))
+                return;
             // A flight search caches the outward line under the guid it reports as outwardGuid.
             const guid = flightAvailability[item.line.guid]?.selectedGuid;
             if (guid)
@@ -28511,6 +29313,8 @@ const withCachedEntryLineGuids = (entry, trajectEntry, nodeAvailability, flightA
             return;
         // Room i took option i when the result was stamped on, so it takes option i here too.
         item.lines.forEach((line, index) => {
+            if (keepsOwnGuid(line.guid))
+                return;
             const guid = getOptionForRoom(result, index)?.guid;
             if (guid)
                 cachedGuids.set(line.guid, guid);
@@ -28574,7 +29378,7 @@ const TrajectItinerary = ({ trajectEntry, packagingEntry, translations }) => {
             return { node, lines };
         });
         const claimed = new Set(nodes.flatMap((item) => item.lines.map((line) => line.guid)));
-        const extras = (packagingEntry.lines ?? []).filter((line) => !claimed.has(line.guid));
+        const extras = (packagingEntry.lines ?? []).filter((line) => !claimed.has(line.guid)).filter(isMeaningfulItineraryLine);
         if (!extras.length)
             return nodes;
         const dayOrderOf = (date) => trajectEntry.traject.days.find((day) => isSameDay(new Date(day.date), new Date(date)))?.order ??
@@ -28751,6 +29555,195 @@ const TrajectItinerary = ({ trajectEntry, packagingEntry, translations }) => {
     })));
 };
 
+/**
+ * A booked entry opened through its magic link knows nothing about the traject it may once have
+ * been composed from — the dossier only keeps the lines. To give it the same day-by-day services
+ * screen a traject gets, the traject structure is rebuilt from those lines: every booked service
+ * becomes a node whose one "alternative" is the booked product itself, and the days span the trip.
+ *
+ * The synthesized response keeps the entry untouched (magic link included), which is also how the
+ * rest of the component tells this mode apart from a real traject: see isBookedEntryTraject.
+ */
+const isBookedEntryTraject = (trajectEntry) => !!trajectEntry?.entry?.magicLink;
+const NODE_SERVICE_TYPES = new Set([ACCOMMODATION_SERVICE_TYPE, EXCURSION_SERVICE_TYPE, FLIGHT_SERVICE_TYPE]);
+/**
+ * A room or option line joins its parent's node; a flight line never does — an outward and its
+ * return are separate legs of the trip even though the return points at the outward as parent.
+ */
+const groupNodeLines = (lines) => {
+    const groups = [];
+    const groupByGuid = new Map();
+    lines.forEach((line) => {
+        const parentGroup = line.serviceType !== FLIGHT_SERVICE_TYPE && line.parentGuid ? groupByGuid.get(line.parentGuid) : undefined;
+        if (parentGroup) {
+            parentGroup.push(line);
+            return;
+        }
+        const group = [line];
+        groups.push(group);
+        groupByGuid.set(line.guid, group);
+    });
+    return groups;
+};
+const buildBookedTrajectEntry = (entry) => {
+    const lines = (entry.lines ?? []).filter((line) => NODE_SERVICE_TYPES.has(line.serviceType));
+    const froms = lines.map((line) => new Date(line.from).getTime());
+    const tos = lines.map((line) => new Date(line.to).getTime());
+    const start = froms.length ? new Date(Math.min(...froms)) : new Date();
+    const end = tos.length ? new Date(Math.max(...tos)) : start;
+    const dayCount = Math.max(differenceInCalendarDays(end, start), 0) + 1;
+    const days = Array.from({ length: dayCount }, (_, order) => ({
+        order,
+        name: '',
+        date: toDateOnlyString(addDays(start, order))
+    }));
+    const nodes = groupNodeLines(lines).map((groupLines, index) => {
+        const line = groupLines[0];
+        const flightLines = line.flightInformation?.flightLines ?? [];
+        return {
+            lineGuid: line.guid,
+            lineGuids: groupLines.map((x) => x.guid),
+            nodeId: index + 1,
+            dayOrder: Math.max(differenceInCalendarDays(new Date(line.from), start), 0),
+            order: line.order,
+            name: line.productName,
+            serviceType: line.serviceType,
+            trajectNodeType: REGULAR_TRAJECT_NODE_TYPE,
+            requirementType: 0,
+            contentSource: 0,
+            code: line.productCode,
+            preferredAccommodationCode: line.productCode,
+            preferredAccommodationName: line.productName,
+            alternatives: [],
+            departureAirportCode: first(flightLines)?.departureAirportCode ?? null,
+            arrivalAirportCode: last(flightLines)?.arrivalAirportCode ?? null,
+            duration: 0,
+            durationType: 0,
+            from: line.from,
+            to: line.to
+        };
+    });
+    return {
+        entry,
+        traject: {
+            id: 0,
+            name: entry.dossierNumber ?? '',
+            imageUrl: null,
+            startDate: days[0]?.date ?? toDateOnlyString(start),
+            endDate: last(days)?.date ?? toDateOnlyString(end),
+            durationInDays: days.length,
+            includeGroupHotelAlternatives: false,
+            days
+        },
+        nodes
+    };
+};
+/**
+ * The card for a booked service when no search result carries it any more (sold out, delisted).
+ * Rendered from the line, so the traveller still sees what they booked; price 0 makes the card
+ * leave its price out — the paid price lives in the price details, not on the line.
+ */
+const buildBookedNodeResult = (node, lines) => {
+    const line = lines[0];
+    return {
+        code: line.productCode,
+        name: line.productName,
+        serviceType: line.serviceType,
+        countryId: line.country?.id ?? null,
+        countryName: line.country?.name ?? '',
+        regionId: line.region?.id ?? null,
+        regionName: line.region?.name ?? '',
+        oordId: line.oord?.id ?? null,
+        oordName: line.oord?.name ?? '',
+        locationId: line.location?.id ?? null,
+        locationName: line.location?.name ?? '',
+        latitude: line.latitude ?? null,
+        longitude: line.longitude ?? null,
+        price: 0,
+        averagePricePerPerson: 0,
+        originalPrice: 0,
+        originalAveragePricePerPerson: 0,
+        currencyCode: 'EUR',
+        fromDate: line.from,
+        toDate: line.to,
+        contents: '',
+        rooms: lines.map((roomLine) => ({
+            options: [
+                {
+                    price: 0,
+                    originalPrice: 0,
+                    accommodationCode: roomLine.accommodationCode ?? '',
+                    accommodationName: roomLine.accommodationName ?? '',
+                    regimeCode: roomLine.regimeCode ?? '',
+                    regimeName: roomLine.regimeName ?? '',
+                    isSelected: true,
+                    guid: roomLine.guid,
+                    paxIds: (roomLine.pax ?? []).map((pax) => pax.paxId)
+                }
+            ]
+        }))
+    };
+};
+/**
+ * The flight search API serializes these as ISO strings, whatever the type declaration says, and
+ * the store must stay serializable — so the synthesized segments carry the same string form.
+ */
+const toDateTime = (date, time) => `${toDateOnlyString(date)}T${time || '00:00:00'}`;
+/** The booked flight as a flight result, so the card that shows it is the card the search results use. */
+const buildBookedFlightResult = (line) => {
+    const flightLines = line.flightInformation?.flightLines ?? [];
+    const segments = flightLines.map((flightLine, index) => ({
+        order: index,
+        flightNumber: flightLine.flightNumber,
+        operatingFlightNumber: flightLine.operatingFlightNumber ?? flightLine.flightNumber,
+        marketingAirlineCode: flightLine.airlineCode,
+        marketingAirlineName: flightLine.airlineDescription,
+        operatingAirlineCode: flightLine.operatingAirlineCode ?? flightLine.airlineCode,
+        operatingAirlineName: flightLine.operatingAirlineDescription ?? flightLine.airlineDescription,
+        departureAirportCode: flightLine.departureAirportCode,
+        departureAirportName: flightLine.departureAirportDescription,
+        arrivalAirportCode: flightLine.arrivalAirportCode,
+        arrivalAirportName: flightLine.arrivalAirportDescription,
+        departureDateTime: toDateTime(flightLine.departureDate, flightLine.departureTime),
+        arrivalDateTime: toDateTime(flightLine.arrivalDate, flightLine.arrivalTime),
+        bookingClassCode: '',
+        travelClass: 0,
+        durationInTicks: flightLine.durationInTicks ?? 0
+    }));
+    const firstSegment = first(segments);
+    const lastSegment = last(segments);
+    // .NET ticks are 100ns, so a millisecond is 10 000 of them.
+    const durationInTicks = firstSegment && lastSegment ? (new Date(lastSegment.arrivalDateTime).getTime() - new Date(firstSegment.departureDateTime).getTime()) * 10_000 : 0;
+    return {
+        code: line.productCode,
+        name: line.productName,
+        serviceType: line.serviceType,
+        countryName: '',
+        regionName: '',
+        oordName: '',
+        locationName: '',
+        price: 0,
+        averagePricePerPerson: 0,
+        originalPrice: 0,
+        originalAveragePricePerPerson: 0,
+        currencyCode: 'EUR',
+        fromDate: line.from,
+        toDate: line.to,
+        flightRouteId: line.guid,
+        airlineCode: firstSegment?.marketingAirlineCode ?? '',
+        airlineName: firstSegment?.marketingAirlineName ?? '',
+        isLuggageIncluded: false,
+        luggageInfo: '',
+        outwardGuid: line.guid,
+        outward: { code: line.productCode, fareType: 0, durationInTicks, segments },
+        returnGuid: '',
+        return: { code: '', fareType: 0, durationInTicks: 0, segments: [] },
+        source: 0,
+        provider: '',
+        paxes: []
+    };
+};
+
 const getSegmentIcon = (segment) => {
     switch (segment.serviceType) {
         case 3:
@@ -28790,14 +29783,14 @@ const SERVICE_TYPE_PRIORITY = {
 const getServiceTypePriority = (serviceType) => {
     return SERVICE_TYPE_PRIORITY[serviceType ?? -1] ?? 2;
 };
-const Itinerary = ({ isOpen, handleSetIsOpen, isLoading, onEditAccommodation }) => {
+const Itinerary = ({ isOpen, handleSetIsOpen, isLoading, onEditAccommodation, onSaveEntry }) => {
     const context = useContext(SearchResultsConfigurationContext);
     const translations = getTranslations(context?.languageCode ?? 'en-GB');
     const { editablePackagingEntry, priceDetails, trajectItineraryView } = useSelector((state) => state.searchResults);
     const dispatch = useDispatch();
     const packagingEntry = editablePackagingEntry ?? context?.packagingEntry;
     const sortedLines = useMemo(() => {
-        return [...(packagingEntry?.lines ?? [])].sort((a, b) => {
+        return (packagingEntry?.lines ?? []).filter(isMeaningfulItineraryLine).sort((a, b) => {
             const dateA = getDateOnlyTime(a.from);
             const dateB = getDateOnlyTime(b.from);
             if (dateA !== dateB) {
@@ -28868,7 +29861,7 @@ const Itinerary = ({ isOpen, handleSetIsOpen, isLoading, onEditAccommodation })
                                 " ",
                                 translations.SRP.TOTAL,
                                 ")"))),
-                    React__default.createElement("button", { className: "cta", onClick: handleConfirm }, translations.QSM.CONFIRM),
+                    isBookedEntryTraject(context?.trajectEntry) ? (React__default.createElement("button", { className: "cta", onClick: onSaveEntry, disabled: !(packagingEntry?.lines ?? []).some((line) => line.isChanged) }, translations.SHARED.SAVE)) : (React__default.createElement("button", { className: "cta", onClick: handleConfirm }, translations.QSM.CONFIRM)),
                     !!context?.trajectEntry && (React__default.createElement("button", { type: "button", className: "cta cta--secondary", onClick: () => handleTrajectView(!trajectItineraryView) }, trajectItineraryView ? translations.SRP.SHOW_SERVICES : translations.SRP.VIEW_FULL_ITINERARY))))),
                 React__default.createElement("div", { className: "search__filter__itinerary" },
                     React__default.createElement("p", null, translations.SRP.DAY_BY_DAY),
@@ -30925,7 +31918,7 @@ const selectSelectedCombinationFlight = createSelector([selectPackagingFlightRes
     return (packagingFlightResults.find((flight) => getFlightKey(flight.outward.segments) === selectedOutwardKey && getFlightKey(flight.return.segments) === selectedReturnKey) ?? null);
 });
 
-const IndependentFlightOption = ({ item, onSelect, guid, selectedGuid, isOutward, showSelectedState, currentSelectedPrice, price }) => {
+const IndependentFlightOption = ({ item, onSelect, guid, selectedGuid, isOutward, showSelectedState, currentSelectedPrice, price, selectLabel, selectedLabel }) => {
     const context = useContext(SearchResultsConfigurationContext);
     const language = context?.languageCode ?? 'en-GB';
     const translations = getTranslations(language);
@@ -30950,7 +31943,7 @@ const IndependentFlightOption = ({ item, onSelect, guid, selectedGuid, isOutward
                                             priceDifference > 0 ? '+' : '-',
                                             "\u00A0",
                                             formatPrice$3(Math.abs(priceDifference), 'EUR', context?.languageCode ?? 'en-GB'))))),
-                                    React__default.createElement("button", { type: "button", className: `cta ${selectedGuid === guid ? 'cta--selected' : 'cta--select'}`, onClick: () => onSelect?.() }, selectedGuid === guid ? 'Selected' : 'Select')))),
+                                    React__default.createElement("button", { type: "button", className: `cta ${selectedGuid === guid ? 'cta--selected' : 'cta--select'}`, onClick: () => onSelect?.() }, selectedGuid === guid ? selectedLabel ?? translations.SHARED.SELECTED : selectLabel ?? translations.SHARED.SELECT)))),
                         React__default.createElement("div", { className: "flight__flight" },
                             React__default.createElement("div", { className: "flight__flight__container" },
                                 React__default.createElement("div", { className: "flight__flight__wrapper" },
@@ -31584,7 +32577,7 @@ const TrajectNodeCard = ({ node, result, isSelected, languageCode, translations,
     const image = candidate?.imageUrl ?? null;
     const description = toPlainText(candidate?.description);
     const title = candidate?.name ?? result.name;
-    const priceBlock = (React__default.createElement("div", { className: "search__result-card__price__wrapper" },
+    const priceBlock = result.price > 0 && (React__default.createElement("div", { className: "search__result-card__price__wrapper" },
         React__default.createElement("span", { className: "search__result-card__price__label" }, translations?.SHARED.TOTAL_PRICE),
         React__default.createElement("span", { className: "search__result-card__price" }, price)));
     const canEditOptions = isSelected && !!onEditOptions && (result.rooms ?? []).some((room) => (room.options ?? []).length > 1);
@@ -31637,6 +32630,7 @@ const TrajectResultsFlyIn = ({ isLoading }) => {
     const translations = getTranslations(context?.languageCode ?? 'en-GB');
     const { trajectNodeAvailability, trajectEditLineGuid } = useSelector((state) => state.searchResults);
     const trajectEntry = context?.trajectEntry;
+    const bookedMode = isBookedEntryTraject(trajectEntry);
     const item = useMemo(() => {
         if (!trajectEntry || !trajectEditLineGuid)
             return null;
@@ -31656,7 +32650,7 @@ const TrajectResultsFlyIn = ({ isLoading }) => {
         if (!result)
             return;
         dispatch(setTrajectNodeSelection({ lineGuid: item.line.guid, code }));
-        applyResultToLines(item.lines, result).forEach((line) => dispatch(updateEditableEntryLine(line)));
+        buildNodeSelectionLines(item, result, bookedMode).forEach((line) => dispatch(updateEditableEntryLine(line)));
         dispatch(setTrajectEditLineGuid(null));
         dispatch(setFlyInIsOpen(false));
     };
@@ -31669,7 +32663,7 @@ const TrajectResultsFlyIn = ({ isLoading }) => {
                 ordered.length,
                 "\u00A0",
                 translations.SRP.TOTAL_RESULTS_LABEL)),
-        ordered.length === 0 ? (React__default.createElement("div", { className: "no-results" }, translations.SRP.NO_RESULTS)) : (React__default.createElement("div", { className: "search__results__cards" }, ordered.map((result) => (React__default.createElement(TrajectNodeCard, { key: result.code, node: item.node, result: result, isSelected: result.code === availability?.selectedCode, languageCode: context.languageCode, translations: translations, onSelect: () => handleSelect(result.code), showNights: item.node.serviceType === ACCOMMODATION_SERVICE_TYPE })))))));
+        ordered.length === 0 ? (React__default.createElement("div", { className: "no-results" }, translations.SRP.NO_RESULTS)) : (React__default.createElement("div", { className: "search__results__cards" }, ordered.map((result) => (React__default.createElement(TrajectNodeCard, { key: result.code, node: item.node, result: result, isSelected: result.code === availability?.selectedCode, languageCode: context.languageCode, translations: translations, onSelect: () => handleSelect(result.code), showNights: item.node.serviceType === ACCOMMODATION_SERVICE_TYPE, selectedLabel: bookedMode && matchesCode(result, item.node.code ?? '') ? translations.SHARED.BOOKED : undefined })))))));
 };
 
 /**
@@ -31731,6 +32725,7 @@ const TrajectDayActivitiesFlyIn = ({ isLoading }) => {
     const translations = getTranslations(context?.languageCode ?? 'en-GB');
     const { trajectNodeAvailability, trajectDaySuggestions, trajectActivitiesDayOrder, editablePackagingEntry } = useSelector((state) => state.searchResults);
     const trajectEntry = context?.trajectEntry;
+    const bookedMode = isBookedEntryTraject(trajectEntry);
     const items = useMemo(() => {
         if (!trajectEntry || trajectActivitiesDayOrder === null)
             return [];
@@ -31763,7 +32758,7 @@ const TrajectDayActivitiesFlyIn = ({ isLoading }) => {
         if (!item)
             return;
         dispatch(setTrajectNodeSelection({ lineGuid: item.line.guid, code: result.code }));
-        applyResultToLines(item.lines, result).forEach((line) => dispatch(updateEditableEntryLine(line)));
+        buildNodeSelectionLines(item, result, bookedMode).forEach((line) => dispatch(updateEditableEntryLine(line)));
         dispatch(setTrajectActivitiesDayOrder(null));
         dispatch(setFlyInIsOpen(false));
     };
@@ -31779,7 +32774,8 @@ const TrajectDayActivitiesFlyIn = ({ isLoading }) => {
         cards.length === 0 ? (React__default.createElement("div", { className: "no-results" }, translations.SRP.NO_RESULTS)) : (React__default.createElement("div", { className: "search__results__cards" }, cards.map((card) => {
             const { result, item } = card;
             const isSelected = item ? trajectNodeAvailability[item.line.guid]?.selectedCode === result.code : getAddedLines(result).length > 0;
-            return (React__default.createElement(TrajectNodeCard, { key: `activity-${result.code}`, node: item?.node, result: result, isSelected: isSelected, languageCode: context.languageCode, translations: translations, onSelect: () => (item ? handleSelect(card) : handleToggle(result)), selectLabel: item ? undefined : translations.SRP.ADD, selectedLabel: item ? undefined : translations.SRP.REMOVE }));
+            const isBookedCard = !!item && bookedMode && matchesCode(result, item.node.code ?? '');
+            return (React__default.createElement(TrajectNodeCard, { key: `activity-${result.code}`, node: item?.node, result: result, isSelected: isSelected, languageCode: context.languageCode, translations: translations, onSelect: () => (item ? handleSelect(card) : handleToggle(result)), selectLabel: item ? undefined : translations.SRP.ADD, selectedLabel: item ? (isBookedCard ? translations.SHARED.BOOKED : undefined) : translations.SRP.REMOVE }));
         })))));
 };
 
@@ -31855,7 +32851,7 @@ const FlyIn = ({ srpType, isOpen, setIsOpen, className = '', onPanelRef, details
             dispatch(setBookPackagingEntry(true));
         }
     };
-    return (React__default.createElement("div", { className: `flyin ${isOpen ? 'flyin--active' : ''} ${className} ${isPackageEditFlow || flyInType === 'acco-results' || flyInType === 'traject-day-activities' ? 'flyin--large' : ''} ${flyInType === 'excursion-results' || flyInType === 'excursion-details' ? 'flyin--medium' : ''}
+    return (React__default.createElement("div", { className: `flyin ${isOpen ? 'flyin--active' : ''} ${className} ${isPackageEditFlow || flyInType === 'acco-results' || flyInType === 'traject-day-activities' ? 'flyin--large' : ''} ${flyInType === 'excursion-results' || flyInType === 'excursion-details' ? 'flyin--medium' : ''}
       ${flyInType === 'flight-outward-results' || flyInType === 'flight-return-results' || flyInType === 'traject-flight-results' ? 'flyin--flight' : ''}` },
         React__default.createElement("div", { className: `flyin__panel ${isOpen ? 'flyin__panel--active' : ''}`, ref: panelRef },
             React__default.createElement("div", { className: "flyin__content" },
@@ -33304,7 +34300,12 @@ const getRequestRoomsFromPackagingSegments = (entry, segments) => {
                 dateOfBirth: paxSource?.dateOfBirth ?? undefined,
                 age: paxSource?.dateOfBirth ? undefined : 30,
                 isMainBooker: paxSource?.isMainBooker,
-                email: ''
+                email: '',
+                weight: null,
+                weightType: build.WeightType.kilograms,
+                height: null,
+                heightType: build.HeightType.centimeters,
+                customFields: []
             };
             if (!groupedByRoom.has(roomIndexWithinLine)) {
                 groupedByRoom.set(roomIndexWithinLine, []);
@@ -33384,6 +34385,10 @@ const getUniqueItems = (items = []) => {
         return true;
     });
 };
+const isMeaningfulItem = (item, lines) => {
+    const line = lines.find((l) => l.guid === item.itemGuid);
+    return !line || isMeaningfulItineraryLine(line);
+};
 const findAccommodationForDay = (nodes, currentDay) => {
     for (const node of nodes ?? []) {
         const { startDay } = getNodeDayRange(node);
@@ -33443,20 +34448,20 @@ const buildFlightHtml = (line) => {
  */
 const buildFallbackHtml = (item, line) => {
     const details = [line?.accommodationName, line?.regimeName].filter(Boolean).join(' — ');
-    return `
-    <div class="itinerary-item__fallback">
-      <h3 class="itinerary-item__fallback-title">${escapeHtml(item.title)}</h3>
-      ${line ? buildFlightHtml(line) : ''}
-      ${details ? `<p class="itinerary-item__fallback-details">${escapeHtml(details)}</p>` : ''}
-    </div>
+    return `
+    <div class="itinerary-item__fallback">
+      <h3 class="itinerary-item__fallback-title">${escapeHtml(item.title)}</h3>
+      ${line ? buildFlightHtml(line) : ''}
+      ${details ? `<p class="itinerary-item__fallback-details">${escapeHtml(details)}</p>` : ''}
+    </div>
   `;
 };
 const buildItineraryHtml = (itinerary, translations, lines) => {
     if (!itinerary) {
-        return `
-      <div class="itinerary-shell">
-        <div class="itinerary-empty">Geen reisroute beschikbaar.</div>
-      </div>
+        return `
+      <div class="itinerary-shell">
+        <div class="itinerary-empty">Geen reisroute beschikbaar.</div>
+      </div>
     `;
     }
     const allNodes = itinerary.nodes ?? [];
@@ -33465,75 +34470,76 @@ const buildItineraryHtml = (itinerary, translations, lines) => {
         const { startDay } = getNodeDayRange(node);
         const day = node.startDate ? format$2(node.startDate, 'd') : null;
         const month = node.startDate ? format$2(node.startDate, 'MMM') : null;
-        const uniqueItems = getUniqueItems(node.items ?? []);
+        const uniqueItems = getUniqueItems(node.items ?? []).filter((item) => isMeaningfulItem(item, lines));
         const hasItems = uniqueItems.length > 0;
         const hasAccommodationInCurrentNode = uniqueItems.some(isAccommodationItem);
         const activeAccommodation = findAccommodationForDay(allNodes, startDay);
         const accommodationBanner = !hasAccommodationInCurrentNode && activeAccommodation
-            ? `
-            <div class="itinerary-node__accommodation-banner">
-              Accommodatie voor deze dag: <strong>${escapeHtml(getAccommodationName(activeAccommodation))}</strong>
-            </div>
+            ? `
+            <div class="itinerary-node__accommodation-banner">
+              Accommodatie voor deze dag: <strong>${escapeHtml(getAccommodationName(activeAccommodation))}</strong>
+            </div>
           `
             : '';
         const itemsHtml = hasItems
             ? uniqueItems
-                .map((item) => `
-                <article class="itinerary-item" data-template="${escapeHtml(item.templateName)}">
+                .map((item) => `
+                <article class="itinerary-item" data-template="${escapeHtml(item.templateName)}">
                   ${hasVisibleContent(item.contents)
                 ? item.contents
-                : buildFallbackHtml(item, lines.find((line) => line.guid === item.itemGuid))}
-                </article>
+                : buildFallbackHtml(item, lines.find((line) => line.guid === item.itemGuid))}
+                </article>
               `)
                 .join('')
             : `<div class="itinerary-node__empty">${translations.ITINERARY.NO_ITEMS}</div>`;
-        return `
-        <section class="itinerary-node">
-          <header class="itinerary-node__header">
-            
-          <div class="itinerary-node__day">
-            <p class="itinerary-node__day-day">${day}</p>
-            <p class="itinerary-node__day-month">${month}</p>
-          </div>
-
-            <div>
-              <h2 class="itinerary-node__title">${escapeHtml(node.title)}</h2>
-            </div>
-          </header>
-
-          <div class="itinerary-node__content">
-            ${accommodationBanner}
-            ${itemsHtml}
-          </div>
-        </section>
+        return `
+        <section class="itinerary-node">
+          <header class="itinerary-node__header">
+            
+          <div class="itinerary-node__day">
+            <p class="itinerary-node__day-day">${day}</p>
+            <p class="itinerary-node__day-month">${month}</p>
+          </div>
+
+            <div>
+              <h2 class="itinerary-node__title">${escapeHtml(node.title)}</h2>
+            </div>
+          </header>
+
+          <div class="itinerary-node__content">
+            ${accommodationBanner}
+            ${itemsHtml}
+          </div>
+        </section>
       `;
     })
         .join('');
-    const defaultItemsHtml = itinerary.defaultItems && itinerary.defaultItems.length > 0
-        ? `
-        <section class="itinerary-default-items">
-          <h2 class="itinerary-default-items__title">Algemene info</h2>
-          ${getUniqueItems(itinerary.defaultItems)
-            .map((item) => `
-                <article class="itinerary-item" data-template="${escapeHtml(item.templateName)}">
+    const defaultItems = getUniqueItems(itinerary.defaultItems ?? []).filter((item) => isMeaningfulItem(item, lines));
+    const defaultItemsHtml = defaultItems.length > 0
+        ? `
+        <section class="itinerary-default-items">
+          <h2 class="itinerary-default-items__title">Algemene info</h2>
+          ${defaultItems
+            .map((item) => `
+                <article class="itinerary-item" data-template="${escapeHtml(item.templateName)}">
                   ${hasVisibleContent(item.contents)
             ? item.contents
-            : buildFallbackHtml(item, lines.find((line) => line.guid === item.itemGuid))}
-                </article>
+            : buildFallbackHtml(item, lines.find((line) => line.guid === item.itemGuid))}
+                </article>
               `)
-            .join('')}
-        </section>
+            .join('')}
+        </section>
       `
         : '';
-    return `
-    <div class="itinerary-shell">
-      ${itinerary.title ? `<header class="itinerary-shell__header"><h1 class="itinerary-shell__title">${escapeHtml(itinerary.title)}</h1></header>` : ''}
-
-      <div class="itinerary-shell__content">
-        ${nodesHtml}
-        ${defaultItemsHtml}
-      </div>
-    </div>
+    return `
+    <div class="itinerary-shell">
+      ${itinerary.title ? `<header class="itinerary-shell__header"><h1 class="itinerary-shell__title">${escapeHtml(itinerary.title)}</h1></header>` : ''}
+
+      <div class="itinerary-shell__content">
+        ${nodesHtml}
+        ${defaultItemsHtml}
+      </div>
+    </div>
   `;
 };
 const FullItinerary = ({ isLoading }) => {
@@ -33555,170 +34561,170 @@ const FullItinerary = ({ isLoading }) => {
         }
         const shadowRoot = host.shadowRoot ?? host.attachShadow({ mode: 'open' });
         shadowRootRef.current = shadowRoot;
-        shadowRoot.innerHTML = `
-      <style>
-        :host {
-          all: initial;
-          display: block;
-          width: 100%;
-        }
-
-        *,
-        *::before,
-        *::after {
-          box-sizing: border-box;
-        }
-
-        .itinerary-shell {
-          width: 100%;
-          margin: 0 auto;
-          font-family: 'Outfit', sans-serif;
-          color: #222;
-        }
-
-        .itinerary-shell__header {
-          margin-bottom: 24px;
-        }
-
-        .itinerary-shell__title {
-          margin: 0;
-          font-size: 32px;
-          line-height: 1.2;
-        }
-
-        .itinerary-shell__content {
-          display: grid;
-          gap: 24px;
-        }
-
-        .itinerary-node {
-          border: 1px solid #e5e7eb;
-          border-radius: 16px;
-          overflow: hidden;
-          background: #fff;
-          box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
-        }
-
-        .itinerary-node__header {
-          display: flex;
-          gap: 16px;
-          align-items: center;
-          border-bottom: 1px solid #eef0f2;
-          background: #fafafa;
-        }
-
-        .itinerary-node__day {
-          flex: 50px 0 0;
-          display: flex;
-          flex-flow: column;
-          align-items: center;
-          justify-content: center;
-          background: #1f9470;
-          color: white;
-          border: 1.5px solid var(--tide-booking-color-secondary);
-        }
-
-        .itinerary-node__day-month {
-          margin: 0px;
-        }
-
-        .itinerary-node__day-day {
-          margin: 0px;
-          font-weight: var(--tide-booking-search-results-label-date-month-font-weight);
-          color: var(--tide-booking-search-results-label-date-month-color);
-          font-size: 24px;
-        }
-
-        .itinerary-node__title {
-          margin: 0;
-          font-size: 22px;
-          line-height: 1.25;
-        }
-
-        .itinerary-node__content {
-          display: grid;
-          gap: 20px;
-          padding: 20px;
-        }
-
-        .itinerary-node__accommodation-banner {
-          padding: 12px 16px;
-          border: 1px solid #dbeafe;
-          border-radius: 12px;
-          background: #eff6ff;
-          color: #1e3a8a;
-          font-size: 14px;
-          line-height: 1.4;
-        }
-
-        .itinerary-item {
-          display: block;
-          border-radius: 12px;
-          overflow: hidden;
-          background: #fff;
-        }
-
-        /* An item whose template has no content view of its own still has to read as a service. */
-        .itinerary-item__fallback {
-          padding: 16px 20px;
-          border: 1px solid #e5e7eb;
-          border-radius: 12px;
-        }
-
-        .itinerary-item__fallback-title {
-          margin: 0;
-          font-size: 16px;
-          font-weight: 600;
-          color: #111827;
-        }
-
-        .itinerary-item__legs {
-          margin: 8px 0 0;
-          padding-left: 18px;
-          color: #374151;
-        }
-
-        .itinerary-item__legs li + li {
-          margin-top: 4px;
-        }
-
-        .itinerary-item__fallback-details {
-          margin: 8px 0 0;
-          color: #6b7280;
-        }
-
-        .itinerary-node__empty,
-        .itinerary-empty {
-          padding: 20px;
-          border: 1px dashed #d1d5db;
-          border-radius: 12px;
-          color: #6b7280;
-          background: #fafafa;
-        }
-
-        .itinerary-default-items {
-          border: 1px solid #e5e7eb;
-          border-radius: 16px;
-          padding: 20px;
-          background: #fff;
-          box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
-        }
-
-        .itinerary-default-items__title {
-          margin: 0 0 16px;
-          font-size: 22px;
-        }
-
-        @media (max-width: 768px) {
-          .itinerary-shell {
-            padding: 16px;
-          }
-        }
-
-        ${itinerary?.styleSheetBody ?? ''}
-      </style>
-
-      ${html}
+        shadowRoot.innerHTML = `
+      <style>
+        :host {
+          all: initial;
+          display: block;
+          width: 100%;
+        }
+
+        *,
+        *::before,
+        *::after {
+          box-sizing: border-box;
+        }
+
+        .itinerary-shell {
+          width: 100%;
+          margin: 0 auto;
+          font-family: 'Outfit', sans-serif;
+          color: #222;
+        }
+
+        .itinerary-shell__header {
+          margin-bottom: 24px;
+        }
+
+        .itinerary-shell__title {
+          margin: 0;
+          font-size: 32px;
+          line-height: 1.2;
+        }
+
+        .itinerary-shell__content {
+          display: grid;
+          gap: 24px;
+        }
+
+        .itinerary-node {
+          border: 1px solid #e5e7eb;
+          border-radius: 16px;
+          overflow: hidden;
+          background: #fff;
+          box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
+        }
+
+        .itinerary-node__header {
+          display: flex;
+          gap: 16px;
+          align-items: center;
+          border-bottom: 1px solid #eef0f2;
+          background: #fafafa;
+        }
+
+        .itinerary-node__day {
+          flex: 50px 0 0;
+          display: flex;
+          flex-flow: column;
+          align-items: center;
+          justify-content: center;
+          background: #1f9470;
+          color: white;
+          border: 1.5px solid var(--tide-booking-color-secondary);
+        }
+
+        .itinerary-node__day-month {
+          margin: 0px;
+        }
+
+        .itinerary-node__day-day {
+          margin: 0px;
+          font-weight: var(--tide-booking-search-results-label-date-month-font-weight);
+          color: var(--tide-booking-search-results-label-date-month-color);
+          font-size: 24px;
+        }
+
+        .itinerary-node__title {
+          margin: 0;
+          font-size: 22px;
+          line-height: 1.25;
+        }
+
+        .itinerary-node__content {
+          display: grid;
+          gap: 20px;
+          padding: 20px;
+        }
+
+        .itinerary-node__accommodation-banner {
+          padding: 12px 16px;
+          border: 1px solid #dbeafe;
+          border-radius: 12px;
+          background: #eff6ff;
+          color: #1e3a8a;
+          font-size: 14px;
+          line-height: 1.4;
+        }
+
+        .itinerary-item {
+          display: block;
+          border-radius: 12px;
+          overflow: hidden;
+          background: #fff;
+        }
+
+        /* An item whose template has no content view of its own still has to read as a service. */
+        .itinerary-item__fallback {
+          padding: 16px 20px;
+          border: 1px solid #e5e7eb;
+          border-radius: 12px;
+        }
+
+        .itinerary-item__fallback-title {
+          margin: 0;
+          font-size: 16px;
+          font-weight: 600;
+          color: #111827;
+        }
+
+        .itinerary-item__legs {
+          margin: 8px 0 0;
+          padding-left: 18px;
+          color: #374151;
+        }
+
+        .itinerary-item__legs li + li {
+          margin-top: 4px;
+        }
+
+        .itinerary-item__fallback-details {
+          margin: 8px 0 0;
+          color: #6b7280;
+        }
+
+        .itinerary-node__empty,
+        .itinerary-empty {
+          padding: 20px;
+          border: 1px dashed #d1d5db;
+          border-radius: 12px;
+          color: #6b7280;
+          background: #fafafa;
+        }
+
+        .itinerary-default-items {
+          border: 1px solid #e5e7eb;
+          border-radius: 16px;
+          padding: 20px;
+          background: #fff;
+          box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
+        }
+
+        .itinerary-default-items__title {
+          margin: 0 0 16px;
+          font-size: 22px;
+        }
+
+        @media (max-width: 768px) {
+          .itinerary-shell {
+            padding: 16px;
+          }
+        }
+
+        ${itinerary?.styleSheetBody ?? ''}
+      </style>
+
+      ${html}
     `;
     }, [html, itinerary?.styleSheetBody, isLoading]);
     return (React__default.createElement(React__default.Fragment, null,
@@ -34172,7 +35178,7 @@ const BookPackagingEntry = ({ activeSearchSeed, isLoading, isConfirmationPage })
     const formik = useFormik({
         initialValues,
         enableReinitialize: true,
-        validate: (values) => validateForm$1(values, false, 'b2c', translations, travellersSettings.formFields, travellersSettings.mainBookerFormFields),
+        validate: (values) => validateForm$1(values, false, 'b2c', translations, travellersSettings.formFields, travellersSettings.mainBookerFormFields, undefined, undefined, editablePackagingEntry?.paxFields ?? []),
         onSubmit: (values) => {
             if (!editablePackagingEntry)
                 return;
@@ -34257,7 +35263,7 @@ const BookPackagingEntry = ({ activeSearchSeed, isLoading, isConfirmationPage })
                         ".\u00A0",
                         stepLabels[step])) },
                     isConfirmationPage && isLoading && React__default.createElement(Spinner, { label: translations.SUMMARY.PROCESS_BOOKING }),
-                    currentStep === 0 && (React__default.createElement(SharedTravelersForm, { formik: formik, translations: translations, travellersSettings: travellersSettings, countries: countries, travelersFirstStep: false, isUnavailable: false, useCompactForm: false, showAgentSelection: false })),
+                    currentStep === 0 && (React__default.createElement(SharedTravelersForm, { formik: formik, translations: translations, travellersSettings: travellersSettings, countries: countries, travelersFirstStep: false, isUnavailable: false, useCompactForm: false, showAgentSelection: false, paxFields: editablePackagingEntry?.paxFields ?? [] })),
                     currentStep === 1 && (React__default.createElement(SharedSummary, { translations: translations, travelerFormValues: formik.values, isSubmitting: isSubmitting, skipPayment: !context.generatePaymentUrl, userValidated: userValidated, remarks: remarks, enableVoucher: false, allowOption: false, isOffer: false, onUserValidatedChange: setUserValidated, onRemarksChange: setRemarks, onSubmit: handleSummarySubmit, renderOptions: () => renderEditablePackagingEntrySummaryOptions(editablePackagingEntry, priceDetails, translations, selectedPackagingAccoResult?.currencyCode), renderPreviousButton: () => (React__default.createElement("button", { type: "button", title: translations.STEPS.PREVIOUS, onClick: () => dispatch(setCurrentStep(0)), className: "cta cta--secondary" }, translations.STEPS.PREVIOUS)) })),
                     currentStep === 2 && (React__default.createElement(SharedConfirmation, { bookingNumber: bookingNumber ?? editablePackagingEntry?.dossierNumber ?? '', isOption: false, isOffer: false, translations: translations.CONFIRMATION })),
                     currentStep === 3 && React__default.createElement("div", null))),
@@ -34321,6 +35327,7 @@ const TrajectResults = ({ isLoading }) => {
     const locale = getLocale(context?.languageCode ?? 'en-GB');
     const { trajectNodeAvailability, trajectFlightAvailability, trajectDaySuggestions, editablePackagingEntry } = useSelector((state) => state.searchResults);
     const trajectEntry = context?.trajectEntry;
+    const bookedMode = isBookedEntryTraject(trajectEntry);
     const hideShowMoreResults = !!context?.hideShowMoreResults;
     const loadDayActivitiesOnDemand = !!context?.loadDayActivitiesOnDemand;
     const showNonPreferredHotels = !!context?.showNonPreferredHotels;
@@ -34377,7 +35384,7 @@ const TrajectResults = ({ isLoading }) => {
         if (!result)
             return;
         dispatch(setTrajectNodeSelection({ lineGuid: item.line.guid, code }));
-        applyResultToLines(item.lines, result).forEach((line) => dispatch(updateEditableEntryLine(line)));
+        buildNodeSelectionLines(item, result, bookedMode).forEach((line) => dispatch(updateEditableEntryLine(line)));
     };
     /** The remaining legs for a flight node open in the fly-in, as the regular flight results do. */
     const handleShowMoreFlights = (item) => {
@@ -34465,7 +35472,7 @@ const TrajectResults = ({ isLoading }) => {
                         node.preferredAccommodationName,
                         " \u2014 ",
                         translations.SRP.NO_RESULTS))),
-                React__default.createElement("div", { className: "search__results__cards search__results__cards--scroll" }, [selected, ...configured, ...fill].map((result) => (React__default.createElement(TrajectNodeCard, { key: result.code, node: node, result: result, isSelected: result.code === selected.code, languageCode: context.languageCode, translations: translations, onSelect: () => handleSelect(item, result.code), onEditOptions: node.serviceType === ACCOMMODATION_SERVICE_TYPE ? () => handleEditOptions(item) : undefined, showNights: node.serviceType === ACCOMMODATION_SERVICE_TYPE })))),
+                React__default.createElement("div", { className: "search__results__cards search__results__cards--scroll" }, [selected, ...configured, ...fill].map((result) => (React__default.createElement(TrajectNodeCard, { key: result.code, node: node, result: result, isSelected: result.code === selected.code, languageCode: context.languageCode, translations: translations, onSelect: () => handleSelect(item, result.code), onEditOptions: node.serviceType === ACCOMMODATION_SERVICE_TYPE ? () => handleEditOptions(item) : undefined, showNights: node.serviceType === ACCOMMODATION_SERVICE_TYPE, selectedLabel: bookedMode && matchesCode(result, node.code ?? '') ? translations.SHARED.BOOKED : undefined })))),
                 remaining > 0 && !hideShowMoreResults && (React__default.createElement("div", { className: "search__results__cards__actions" },
                     React__default.createElement("button", { type: "button", className: "cta cta--secondary", onClick: () => handleShowMore(item) },
                         translations.SRP.SHOW_MORE,
@@ -34475,7 +35482,7 @@ const TrajectResults = ({ isLoading }) => {
     };
     const handleSelectFlight = (item, flight) => {
         dispatch(setTrajectFlightSelection({ lineGuid: item.line.guid, guid: flight.outwardGuid }));
-        dispatch(updateEditableEntryLine(applyFlightToLine(item.line, flight)));
+        dispatch(updateEditableEntryLine(buildFlightSelectionLine(item, flight, bookedMode)));
     };
     const renderFlightNode = (item) => {
         const { node, line } = item;
@@ -34501,7 +35508,7 @@ const TrajectResults = ({ isLoading }) => {
             status === 'unavailable' && React__default.createElement("div", { className: "no-results" }, translations.SRP.NO_RESULTS),
             status === 'resolved' && selected && (React__default.createElement(React__default.Fragment, null,
                 React__default.createElement("div", { className: "search__results__cards search__results__cards--extended" },
-                    React__default.createElement(IndependentFlightOption, { key: `flight-${selected.outwardGuid}`, item: selected.outward, guid: selected.outwardGuid, selectedGuid: selected.outwardGuid, isOutward: true, showSelectedState: true, price: selected.price }),
+                    React__default.createElement(IndependentFlightOption, { key: `flight-${selected.outwardGuid}`, item: selected.outward, guid: selected.outwardGuid, selectedGuid: selected.outwardGuid, isOutward: true, showSelectedState: true, price: selected.price, selectedLabel: bookedMode && selected.outwardGuid === line.guid ? translations.SHARED.BOOKED : undefined }),
                     visible.map((result) => (React__default.createElement(IndependentFlightOption, { key: `flight-${result.outwardGuid}`, item: result.outward, guid: result.outwardGuid, isOutward: true, price: result.price, currentSelectedPrice: selected.price, onSelect: () => handleSelectFlight(item, result) })))),
                 others.length > 2 && !hideShowMoreResults && (React__default.createElement("div", { className: "search__results__cards__actions" },
                     React__default.createElement("button", { type: "button", className: "cta cta--secondary", onClick: () => handleShowMoreFlights(item) },
@@ -34585,7 +35592,8 @@ const TrajectResults = ({ isLoading }) => {
      */
     const renderActivityCard = ({ result, item }) => {
         const isSelected = item ? trajectNodeAvailability[item.line.guid]?.selectedCode === result.code : getAddedExcursionLines(result).length > 0;
-        return (React__default.createElement(TrajectNodeCard, { key: `activity-${result.code}`, node: item?.node, result: result, isSelected: isSelected, languageCode: context.languageCode, translations: translations, onSelect: () => (item ? handleSelect(item, result.code) : handleToggleActivity(result)), selectLabel: item ? undefined : translations.SRP.ADD, selectedLabel: item ? undefined : translations.SRP.REMOVE }));
+        const isBookedCard = !!item && bookedMode && matchesCode(result, item.node.code ?? '');
+        return (React__default.createElement(TrajectNodeCard, { key: `activity-${result.code}`, node: item?.node, result: result, isSelected: isSelected, languageCode: context.languageCode, translations: translations, onSelect: () => (item ? handleSelect(item, result.code) : handleToggleActivity(result)), selectLabel: item ? undefined : translations.SRP.ADD, selectedLabel: item ? (isBookedCard ? translations.SHARED.BOOKED : undefined) : translations.SRP.REMOVE }));
     };
     if (isLoading)
         return React__default.createElement(Spinner, { label: translations.SRP.LOADING_ITINERARY });
@@ -34629,6 +35637,7 @@ const useTrajectAvailability = () => {
         const controller = new AbortController();
         dispatch(resetTrajectAvailability());
         dispatch(setTrajectResolving(true));
+        const bookedMode = isBookedEntryTraject(trajectEntry);
         const config = {
             host: context.tideConnection.host,
             apiKey: context.tideConnection.apiKey
@@ -34690,6 +35699,17 @@ const useTrajectAvailability = () => {
                 });
                 const configuredCodes = new Set(configuredResults.map((x) => x.code));
                 const destinationResults = areaResults.filter((x) => !configuredCodes.has(x.code));
+                if (bookedMode) {
+                    const results = [...configuredResults, ...destinationResults];
+                    let booked = results.find((x) => matchesCode(x, item.node.code ?? '')) ?? null;
+                    // Not searchable any more (sold out, delisted) — drawn from the line instead.
+                    if (!booked) {
+                        booked = buildBookedNodeResult(item.node, item.lines);
+                        results.unshift(booked);
+                    }
+                    dispatch(setTrajectNodeAvailability({ lineGuid, results, selectedCode: booked.code, preferredUnavailable: false }));
+                    return [];
+                }
                 const preferredCandidate = candidates.find((x) => x.isPreferred) ?? candidates[0];
                 const preferredUnavailable = configuredResults.length
                     ? !!preferredCandidate && !configuredResults.some((x) => matchesCode(x, preferredCandidate.code))
@@ -34712,6 +35732,11 @@ const useTrajectAvailability = () => {
                 if (controller.signal.aborted)
                     return [];
                 console.error('Failed to resolve traject node availability', item.node.name, error);
+                if (bookedMode) {
+                    const booked = buildBookedNodeResult(item.node, item.lines);
+                    dispatch(setTrajectNodeAvailability({ lineGuid, results: [booked], selectedCode: booked.code, preferredUnavailable: false }));
+                    return [];
+                }
                 dispatch(setTrajectNodeAvailability({ lineGuid, results: [], selectedCode: null, preferredUnavailable: false }));
                 return item.lines.map((x) => x.guid);
             }
@@ -34719,6 +35744,11 @@ const useTrajectAvailability = () => {
         const resolveFlightNode = async (item) => {
             const lineGuid = item.line.guid;
             if (!item.node.departureAirportCode || !item.node.arrivalAirportCode) {
+                if (bookedMode) {
+                    const booked = buildBookedFlightResult(item.line);
+                    dispatch(setTrajectFlightAvailability({ lineGuid, results: [booked], selectedGuid: booked.outwardGuid }));
+                    return [];
+                }
                 dispatch(setTrajectFlightAvailability({ lineGuid, results: [], selectedGuid: null }));
                 return item.lines.map((x) => x.guid);
             }
@@ -34727,6 +35757,11 @@ const useTrajectAvailability = () => {
                 const flights = (await build.searchPackagingFlights(config, buildTrajectFlightRequest(item, searchContext, flightPax), controller.signal)) ?? [];
                 if (controller.signal.aborted)
                     return [];
+                if (bookedMode) {
+                    const booked = buildBookedFlightResult(item.line);
+                    dispatch(setTrajectFlightAvailability({ lineGuid, results: [booked, ...flights], selectedGuid: booked.outwardGuid }));
+                    return [];
+                }
                 const picked = pickCheapestFlight(flights);
                 dispatch(setTrajectFlightAvailability({ lineGuid, results: flights, selectedGuid: picked?.outwardGuid ?? null }));
                 if (!picked)
@@ -34738,6 +35773,11 @@ const useTrajectAvailability = () => {
                 if (controller.signal.aborted)
                     return [];
                 console.error('Failed to resolve traject flight', item.node.name, error);
+                if (bookedMode) {
+                    const booked = buildBookedFlightResult(item.line);
+                    dispatch(setTrajectFlightAvailability({ lineGuid, results: [booked], selectedGuid: booked.outwardGuid }));
+                    return [];
+                }
                 dispatch(setTrajectFlightAvailability({ lineGuid, results: [], selectedGuid: null }));
                 return item.lines.map((x) => x.guid);
             }
@@ -34775,6 +35815,7 @@ const SearchResultsContainer = ({ onBookingStarted }) => {
     const [detailsIsLoading, setDetailsIsLoading] = useState(false);
     const [pricesAreLoading, setPricesAreLoading] = useState(false);
     const [itineraryIsLoading, setItineraryIsLoading] = useState(false);
+    const [entrySaving, setEntrySaving] = useState(false);
     const [itineraryOpen, setItineraryOpen] = useState(false);
     const [isBookingConfirmation, setIsBookingConfirmation] = useState(false);
     const [selectedAccommodationSeed, setSelectedAccommodationSeed] = useState(null);
@@ -35531,6 +36572,31 @@ const SearchResultsContainer = ({ onBookingStarted }) => {
     useEffect(() => {
         setInitialFiltersSet(false);
     }, [activeSearchSeed]);
+    const handleSaveEntry = async () => {
+        if (!context || !bookableEntry || entrySaving)
+            return;
+        setEntrySaving(true);
+        try {
+            const config = {
+                host: context.tideConnection.host,
+                apiKey: context.tideConnection.apiKey
+            };
+            const request = {
+                language: context.languageCode ?? 'en-GB',
+                officeId: context.tideConnection.officeId,
+                catalogueId: context.searchConfiguration.defaultCatalogueId ?? first(context?.tideConnection?.catalogueIds) ?? 1,
+                agentId: context.agentId,
+                payload: bookableEntry
+            };
+            await build.savePackagingEntry(config, request);
+            if (typeof window !== 'undefined')
+                window.location.reload();
+        }
+        catch (err) {
+            console.error('Failed to save the entry', err);
+            setEntrySaving(false);
+        }
+    };
     useEffect(() => {
         const fetchPriceDetails = async () => {
             if (!context || !editablePackagingEntry || isEmpty$1(editablePackagingEntry.lines))
@@ -35915,11 +36981,18 @@ const SearchResultsContainer = ({ onBookingStarted }) => {
                 const id = paxId++;
                 pax.push({
                     id,
+                    guid: '',
                     firstName: _.firstName || '',
                     lastName: _.lastName || '',
-                    dateOfBirth: _.dateOfBirth || null,
-                    age: _.age || null,
-                    isMainBooker: roomIndex === 0 && paxIndex === 0
+                    dateOfBirth: _.dateOfBirth || undefined,
+                    age: _.age || undefined,
+                    isMainBooker: roomIndex === 0 && paxIndex === 0,
+                    email: '',
+                    weight: null,
+                    weightType: build.WeightType.kilograms,
+                    height: null,
+                    heightType: build.HeightType.centimeters,
+                    customFields: []
                 });
                 return id;
             });
@@ -35939,6 +37012,7 @@ const SearchResultsContainer = ({ onBookingStarted }) => {
             depositAmount: 0,
             pax,
             rooms,
+            paxFields: [],
             lines: [],
             address: {}
         };
@@ -35958,7 +37032,7 @@ const SearchResultsContainer = ({ onBookingStarted }) => {
             context.searchConfiguration.qsmType != build.PortalQsmType.AccommodationAndFlight && context.showFilters && (React__default.createElement(Filters, { initialFilters: initialFilters, filters: filters, isOpen: filtersOpen, handleSetIsOpen: () => setFiltersOpen(!filtersOpen), 
                 // handleApplyFilters={() => setSearchTrigger((prev) => prev + 1)}
                 isLoading: isLoading, setFilters: (filters) => dispatch(setFilters(filters)), resetFilters: (filters) => dispatch(resetFilters(filters)) })),
-            context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight && (React__default.createElement(Itinerary, { isOpen: itineraryOpen, handleSetIsOpen: () => setItineraryOpen(!itineraryOpen), isLoading: isLoading || pricesAreLoading || flightsLoading || itineraryIsLoading || trajectResolving, onEditAccommodation: handleEditAccommodation })),
+            context.searchConfiguration.qsmType === build.PortalQsmType.AccommodationAndFlight && (React__default.createElement(Itinerary, { isOpen: itineraryOpen, handleSetIsOpen: () => setItineraryOpen(!itineraryOpen), isLoading: isLoading || pricesAreLoading || flightsLoading || itineraryIsLoading || trajectResolving || entrySaving, onEditAccommodation: handleEditAccommodation, onSaveEntry: handleSaveEntry })),
             React__default.createElement("div", { className: "search__results" },
                 isMobile && (React__default.createElement("div", { className: "search__result-row" },
                     React__default.createElement("div", { className: "search__results__actions" },
@@ -36046,8 +37120,15 @@ const createSearchResultsStore = () => configureStore({
 
 const SearchResults = ({ configuration, onBookingStarted }) => {
     const store = React__default.useMemo(() => createSearchResultsStore(), []);
+    // A booked entry opened through its magic link gets the traject services screen by carrying a
+    // traject rebuilt from its own lines. The magic link on the entry is what marks the mode.
+    const effectiveConfiguration = React__default.useMemo(() => {
+        if (!configuration.allowBookedEntryChanges || configuration.trajectEntry || !configuration.packagingEntry?.magicLink)
+            return configuration;
+        return { ...configuration, trajectEntry: buildBookedTrajectEntry(configuration.packagingEntry) };
+    }, [configuration]);
     return (React__default.createElement(Provider, { store: store },
-        React__default.createElement(SearchResultsConfigurationContext.Provider, { value: configuration },
+        React__default.createElement(SearchResultsConfigurationContext.Provider, { value: effectiveConfiguration },
             React__default.createElement(SearchResultsContainer, { onBookingStarted: onBookingStarted }))));
 };
 
@@ -38942,20 +40023,20 @@ function ItineraryMapView({ destinations: propDestinations, adults = 2, dateFrom
             const isStartEnd = dest.isStart || dest.isEnd;
             let iconHtml;
             if (isStartEnd) {
-                iconHtml = `
-          <div class="map-view__marker map-view__marker--plane">
-            <svg viewBox="0 0 576 512" fill="currentColor" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
-              <path d="M482.3 192c34.2 0 93.7 29 93.7 64c0 36-59.5 64-93.7 64l-116.6 0L265.2 495.9c-5.7 10.1-16.3 16.1-27.8 16.1l-56.2 0c-10.6 0-18.3-10.3-15.8-20.6l49-196.3L112 288 68.8 377.6c-3 6.1-9.2 10.4-16 10.4l-2.8 0c-9.2 0-16-8.8-13.3-17.6L80 256L36.7 141.6C34 132.8 40.8 124 50 124l2.8 0c6.8 0 13 4.3 16 10.4L112 224l102.9 0-49-196.3C163.5 17.3 171.2 7 181.8 7l56.2 0c11.5 0 22.1 6 27.8 16.1L365.7 192l116.6 0z"/>
-            </svg>
+                iconHtml = `
+          <div class="map-view__marker map-view__marker--plane">
+            <svg viewBox="0 0 576 512" fill="currentColor" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
+              <path d="M482.3 192c34.2 0 93.7 29 93.7 64c0 36-59.5 64-93.7 64l-116.6 0L265.2 495.9c-5.7 10.1-16.3 16.1-27.8 16.1l-56.2 0c-10.6 0-18.3-10.3-15.8-20.6l49-196.3L112 288 68.8 377.6c-3 6.1-9.2 10.4-16 10.4l-2.8 0c-9.2 0-16-8.8-13.3-17.6L80 256L36.7 141.6C34 132.8 40.8 124 50 124l2.8 0c6.8 0 13 4.3 16 10.4L112 224l102.9 0-49-196.3C163.5 17.3 171.2 7 181.8 7l56.2 0c11.5 0 22.1 6 27.8 16.1L365.7 192l116.6 0z"/>
+            </svg>
           </div>`;
             }
             else {
                 stopIndex++;
                 const imgStyle = dest.imageUrl ? `style="background-image:url('${dest.imageUrl}')"` : '';
-                iconHtml = `
-          <div class="map-view__marker map-view__marker--stop" ${imgStyle}>
-            ${!dest.imageUrl ? `<span class="map-view__marker-number">${stopIndex}</span>` : ''}
-            <span class="map-view__marker-badge">${stopIndex}</span>
+                iconHtml = `
+          <div class="map-view__marker map-view__marker--stop" ${imgStyle}>
+            ${!dest.imageUrl ? `<span class="map-view__marker-number">${stopIndex}</span>` : ''}
+            <span class="map-view__marker-badge">${stopIndex}</span>
           </div>`;
             }
             const icon = L.divIcon({